工作之余帮老板的另一家公司做了一个简单的网站，虽说只是个小网站，但也是花了我不少时间滴……

下面我就来说一下一个网站从设计到实现的流程。

（先说明一下，本人是设计师一枚，虽说前端也有所涉猎，但终究不是咱的主攻方向不是。所以，本文的重点会放在设计而非代码实现上面……so,攻城狮们请绕道……）

接到这个项目之前，我正在如火如荼的进行着本公司的app项目。该项目一来，立马变陀螺，两项目不停的来回切。当然啦，还是以本公司的项目为主，此项目为辅，来来回回，修修改改，外加利用部分私人时间，终于大功告成。

由于本人是第一次独立完成整个网站从设计到实现的完整步骤，所以这中间走了不少弯路也存在大量返工，这叫一个苦，一个累呦... 给两张图你就明白了！

看到没，基本已经面目全非了！造成这种现象和大量返工的原因时什么？那就是需求不明确！

我刚拿到项目的时候，只给了我一个基本的网站架构。在我做项目期间光架构文件就改了三四次，进度缓慢，还一直催着我问什么时候可以完成，实在是叔能忍婶不能忍！后来跟我们老大提了好几次，才终于能够与该公司的工作人员当面沟通（之前都是QQ交流的，有些东西根本说不清楚）。

沟通交流完毕之后，我们才能最终确立下来具体的网站框架。根据讨论结果，我自己把逻辑理了一遍。

接下来就要设计网站的风格和布局，先把整个网站内容在脑子里过一遍，把逻辑梳理清楚，首页上该放什么，子页面上该放什么，怎么排版，怎么展示。我建议还是画画草图，能够让你的思维能够很好的延展开来，也就是传说中的头脑风暴！

• 不仅能够让你在设计的时候有据可循，
• 还可以提醒你设计时容易忘记的小细节，
• 更能节省你设计时思考的时间。

总之好处多多哇……（画不画随你咯）

理顺了网站的逻辑与布局，接下来就是网站风格的确立了。如果你还没有任何idea的话你可以搜索同类型的网站寻找灵感，确立网站的主色调。切忌凭空想象！你要明确所做网站的主题是什么类型的，商务类，科技类，社交类，母婴类，新闻类……考虑适用人群，选择主题色，我所做的网站主题是赴美生子，那么就属于母婴系列的。因此，颜色要比较鲜艳抢眼，吸引眼球。最终却定了网站的主色调。（当然，我也是浏览了大量的网站和搜索了大量的素材才最终确定网站的风格。）

需求明确，网站布局已定，设计风格明确，接下来就到了我们设计师最熟悉的部分了，那就是设计效果图了。既然大家都那么熟了，我就不赘述了。直接上一波效果图。

首页

子页面（其它的都差不多，文字居多）

banner之一

banner之二

banner之三

banner之四

好啦~接下来就是把切图啦。这个网站全部都是展示性的东西，所以，实现起来还是比较容易滴。在引用了bootstrap的前提下，css还是比较多。只能手写啦。

下图是整个网站要用到的文件，是不是很少？就这么回事嘛。

再后来，网站就做好啦，现在正在申请域名，不久的将来就可以上线咯......

最后再来强调一下一个网站的制作步骤（很重要！非常重要！！）

第一步至关重要，起到全局性作用哦！

谢谢欣赏！

动动你修长的食指给我点个赞吧！