文章插图
●②网站结构
放置在线框中的元素由您决定 。您可以考虑添加导航栏 ， 页眉 ， 博客文章和页脚 。您可能不需要所有的这些内容 ， 可以将其保留为基本内容 ， 以后再添加 。确定要包括的内容并将这些部分合并到线框中 。如果你在布局这块遇到问题 ， 可以查看一个类似的网站 ， 模仿网站内容的结构 ， 然后对其进行修改以适合你的需求 。
文章插图
线框不一定是完美的 。在拥有合适位置的网站结构之后 ， 就可以转向视觉设计 。
●③应用视觉设计
要将低保真线框转换为设计 ， 可以使用免费的设计工具 ， 例如 Figma（下一代的设计神器） 。如果你从未使用过设计程序 ， 你也可以用ps来实现 ， 不过会有点慢 ， 但在国内我还没有找到类似 Figma 这么好用的工具 。
文章插图
●④实施布局
首先 ， 创建一个空白画布以代表空白浏览器页面 。通过为内容创建容器 ， 在设计工具中实现线框 。我建议先从黑白开始 ， 以便你可以专注于布局 。
优化您的布局 ， 以使元素大小适当 ， 对齐并在它们之间留出空间 。
文章插图
●⑤添加部分和占位符内容
在看起来像一个网站之后 ， 使其看起来更漂亮 。通过弄清楚是什么使布局看起来有吸引力 ， 可以模仿其他网站的逼格样式来添加到自己的网站 。
在此阶段 ， 请考虑形状 ， 大小 ， 边界和阴影 。用你喜欢的样式逐渐升级基本矩形 。
文章插图
●⑥更新版式
字体和间距的设计对美观大有帮助 。如果排版得当 ， 即使是简单的设计也可以是高质量的 。同样 ， 你可以模仿另一个网站或搜索字体和字体资源 ， 以将其纳入你的设计中 。但是一定要注意版权 。
记得有家企业 ， 不管字体版权问题 ， 在自家网站使用方正字体 ， 被告侵权 ， 这是需要赔偿的 。
文章插图
●⑦给它上色
接下来 ， 为站点添加颜色 。通过建立品牌来赋予网站特色 。考虑一下你希望网站如何吸引读者 。如果你希望它看起来干净且极少 ， 请选择不太亮的颜色 ， 渐变保持微妙 ， 并选择易于阅读的字体 。如果你希望它看起来有趣 ， 请选择明亮的颜色 ， 使用鲜艳的渐变 ， 应用背景纹理 ， 使用圆形元素 ， 然后选择醒目的字体 。
文章插图
添加颜色似乎令人生畏 ， 但你无需了解颜色原理即可 。如果您的设计是从黑白开始的 ， 则可以选择一种单色来强调元素 ， 以赋予设计生命 。如果你想超越此范围 ， 建议您选择一种或两种您喜欢的颜色 ， 然后使用该颜色的不同亮度变化 。这有助于创建一个具有凝聚力的主题 ， 而不必成为色彩专家 。选择背景色和前景色时 ， 请通过检查颜色对比来牢记可读性 。
例如 ， 将深蓝色设置为背景 ， 然后将较浅的蓝色设置为文本 。对于白色背景色 ， 可以将蓝色的中等亮度用作标题 。
文章插图
文章插图
将颜色合并到设计中后 ， 请继续检查总体设计感并进行调整 。
●⑧注意细节
在设计时 ， 你应该退后一步来查看整个设计并进行完善 。通过用简单的语言描述您所看到的内容来批判你的设计 ， 然后将该陈述转换为需要解决的技术问题 。
