UI Web 应用程序设计
UI Design for web application
我打算创建一个基于 java、jsp 和 struts 的 Web 应用程序。我已经勾勒出需求、功能应该如何工作以及目标用户是谁。尽管我对该应用程序感到非常兴奋,但我不确定我应该如何为它创建一个好的 UI 设计。
我应该选择 css 作为设计 UI 的常用方法吗?将 css 映射到所有 elements/tags 将是一项乏味的任务。还有其他方法吗?我是新手,这将是我计划很久的第一个项目。
在设计方面我应该使用哪些技术来实现这一目标?
注意:我还想保持我的应用程序轻量级而不是使用 Flash 内容和其他类型
我建议使用类似 Bootstrap 的东西:http://getbootstrap.com/
该库将允许您构建一些漂亮的用户界面,而不必自己处理太多 CSS 或 HTML。
尝试自己滚动 CSS 和 HTML 只是自找痛苦。使用像这样的框架,跨浏览器支持之类的事情会简单得多(几乎免费)。
Bootstrap 可以轻松地与 JSP 配对,因为您只需将网页输出设为 bootstrap 格式即可。基本上使用它定义的 CSS 类 。例如:
<!-- Indicates a successful or positive action -->
<button type="button" class="btn btn-success">Success</button>
<!-- Contextual button for informational alert messages -->
<button type="button" class="btn btn-info">Info</button>
<!-- Indicates caution should be taken with this action -->
<button type="button" class="btn btn-warning">Warning</button>
<!-- Indicates a dangerous or potentially negative action -->
<button type="button" class="btn btn-danger">Danger</button>
它们在布局和各种其他小部件方面具有相似的类。
我会采用 Jon 的方法。当您选择 CSS 框架时,请考虑平台(桌面、选项卡和移动)并选择合适的平台。
http://webdesignlike.com/2015/best-free-responsive-html5-frameworks/
http://www.cssnewbie.com/best-free-css3-frameworks-2015/#.VVooCfxVhBc
http://devzum.com/2014/11/20/best-html-css-frameworks/
通过这些链接,它会给你一个更好的主意。
我打算创建一个基于 java、jsp 和 struts 的 Web 应用程序。我已经勾勒出需求、功能应该如何工作以及目标用户是谁。尽管我对该应用程序感到非常兴奋,但我不确定我应该如何为它创建一个好的 UI 设计。
我应该选择 css 作为设计 UI 的常用方法吗?将 css 映射到所有 elements/tags 将是一项乏味的任务。还有其他方法吗?我是新手,这将是我计划很久的第一个项目。
在设计方面我应该使用哪些技术来实现这一目标?
注意:我还想保持我的应用程序轻量级而不是使用 Flash 内容和其他类型
我建议使用类似 Bootstrap 的东西:http://getbootstrap.com/
该库将允许您构建一些漂亮的用户界面,而不必自己处理太多 CSS 或 HTML。
尝试自己滚动 CSS 和 HTML 只是自找痛苦。使用像这样的框架,跨浏览器支持之类的事情会简单得多(几乎免费)。
Bootstrap 可以轻松地与 JSP 配对,因为您只需将网页输出设为 bootstrap 格式即可。基本上使用它定义的 CSS 类 。例如:
<!-- Indicates a successful or positive action -->
<button type="button" class="btn btn-success">Success</button>
<!-- Contextual button for informational alert messages -->
<button type="button" class="btn btn-info">Info</button>
<!-- Indicates caution should be taken with this action -->
<button type="button" class="btn btn-warning">Warning</button>
<!-- Indicates a dangerous or potentially negative action -->
<button type="button" class="btn btn-danger">Danger</button>
它们在布局和各种其他小部件方面具有相似的类。
我会采用 Jon 的方法。当您选择 CSS 框架时,请考虑平台(桌面、选项卡和移动)并选择合适的平台。
http://webdesignlike.com/2015/best-free-responsive-html5-frameworks/
http://www.cssnewbie.com/best-free-css3-frameworks-2015/#.VVooCfxVhBc
http://devzum.com/2014/11/20/best-html-css-frameworks/
通过这些链接,它会给你一个更好的主意。