当前位置:首页> 网站建设技巧> 创建网站布局设计的20个步骤

创建网站布局设计的20个步骤

发布时间:2020-10-23 11:00:00

这显然很重要,但我经常发现有些设计师跳过这一步,直接使用Photoshop CS6而不考虑他们需要解决的问题。设计的目的是解决用渐变或阴影效果无法解决的问题,而布局和清晰的结构。在开始着色之前,请考虑内容、布局和功能。

绘制基本框架将帮助您解决用户体验问题并组织布局结构

如果我想让一个项目看起来和感觉,是建立一个顶层框架来解决所有的设计问题。框架是围绕内容的UI,帮助您执行操作和导航。这包括导航和各种组件,如侧边栏和底部栏。如果从这一点进行设计,当您在主页之外进行设计时,布局将变得清晰。

这一步很简单。在你开始在Photoshop中设计任何东西之前,你需要创建一个合适的网格。这一步的逻辑是众所周知的,如果你不知道,我可以断言终的设计从来都不是的。借助网格,可以安排不同部分的布局结构,指导您根据特定的屏幕尺寸要求进行设计,并帮助您创建相应的模板,以满足间距等设计问题。

一般来说,在一个站点布局中不要使用两种以上的字体。了解不同字体和颜色的匹配是项目开发阶段的工作。我建议你不要在一个网站上使用两种以上的字体,但事实上,这取决于你可以使用的颜色。简言之,您选择的字体需要易于阅读大量文本,并且应该与标题和操作相匹配。粗体采用大字体,并在使用字体类型上保持整体的一致性和动态性。

在选择了一系列要使用的字体之后,您应该开始探索UI、背景和文本要使用的颜色。至于颜色,我建议在处理正常的用户界面时,颜色和色调应该简洁。在根据元素的功能设计UI时,保持一致是很重要的。想想像Facebook,twitter,quora和Vimeo这样的网站。除了用户界面,在插图或图形细节中使用颜色没有任何限制,只要它们不干扰组件功能。