步骤一：制定项目计划

制定项目计划，是设计网页的第一步。如果没有制定项目计划，在设计网页的过程中可能会导致你一头雾水，甚至会增加时间和金钱的成本。在制定网页设计项目计划之前，我们可以先收集一些关键信息，如下：

在设计网页之前，我们最好先与客户沟通好他们的具体需求；

沟通好需求后，我们需要仔细了解和研究客户的品牌内容；

根据品牌特征和客户对网页的需求，我们可以制定一个大概的设计方案，然后对这个方案是否符合目标受众群体对网页实际需求的问题进行社会调研。

以上信息的收集都可以帮助我们在构建网页设计时产生不必要的错误和修改。

Pixso资源社区

步骤二：研究和草图

制定好网页设计项目计划之后，我们可以通过手机其它网页设计资源，来为此次网页设计寻找案例模板。除此之外，分析竞争对手的网页设计也很重要，因为它可以帮助我们优化自己的网页设计，使我们的网页设计变得更加具有吸引力。然后使用草图来发散思维，进行天马行空的创意想象，再将表达了自己想法的草图方案展现给客户，与客户进行讨论和细节沟通。

步骤三：创建线框图

网站线框图可以为网页设计提供基础的视觉结构。网站线框图作为网站的骨架，不需要复杂的颜色和样式设计，只需要通过简单的方式呈现出来即可。通过设计网页线框图，我们可以对网页展开初步设计，例如网页中的按钮、标签栏和其它设计元素等，都可以使用线框图进行简单定位。用户星河和心理相关的用户体验设计，也可以通过线框图来进行优化调整。Pixso资源社区内置超多免费的网页线框图模板，注册Pixso账号，即可一键复制网页线框图。

设计网页线框图模板 - 免费下载

设计网页线框图模板 - 免费下载

步骤四：首页导航及排版布局

步骤四：首页导航及排版布局

网站首页是用户最先看到的地方，它决定了网站是否对用户具有吸引力，所以首页是设计网页重中之重。我们要利用首页导航，用最简单直白的方式告诉用户，这个网站是做什么的、能为用户提供什么以及怎么使用网站等等。例如，可以在页面顶部放置菜单栏，提供用户登录、公司服务等信息的主要链接。其次，我们要考虑好首页布局中每个元素的可见性，其中首屏和首屏下方的设计网页元素布局有两个注意点：

首屏：一般会把品牌标识放在首屏，让每个用户都能在第一眼看到它。并且因为该部分的信息会对所有用户可见，所以要在这里放置对客户最重要的信息，包括一些优惠和奖金一类的。

首屏下方：此处可以放置更多有关于品牌或产品的信息，可以让用户更加详细地了解网站服务。

步骤五：额外的网页元素设计

在设计网页时可以添加一些不同的小元素，使网页变得更加丰富饱满，例如动画效果、页面加载标志、横幅、提示等，这些小元素会让网页变得更有层次、更有趣。

步骤六：配色方案和排版

步骤六：配色方案和排版

在设计网页流程中，配色方案的制定是重中之重，不仅要考虑网页的背景是什么颜色，还要考虑按钮、图标等其他元素的颜色。排版应该与配色方案相一致，否则网页的文字和颜色就会变得极不和谐。此外，文字的字体应该是简洁明确、容易阅读的。坚决不能使用花哨的字体，那样会严重影响用户的阅读进程。