浅谈网页设计与布局

王冰冰 朱倩倩 河南黄淮学院 463000

【文章摘要】

随着计算机网络的发展，上网浏览信息、查询资料已经成为我们日常生活中的一个组成部分，在新媒体影响下，人们正享受着新视觉表现下对信息的浏览和获取，因而网页设计中新颖设计与布局就显得至关重要了。

【关键词】

网页; 设计; 布局

1 网页设计

日新月异的网络技术在很大程度上为网页设计的发展创造了一个更加自由的新天地和带来了前所未有的发展机遇。当我们轻点鼠标，在网络中浏览信息，查询资料时，呈现在我们面前的是一副副精彩的网页，那么，能够吸引我们停留在某个页面上浏览的，除了引人入胜的内容、赏心悦目的图片和协调的色彩搭配以外，还有一个非常重要的因素就是网页设计与布局的合理。

网站页面布局作为平面设计的一种， 对网页设计起到了规划的作用。也就是布局在先，制作其次。网页设计是以网络为载体，科学的整合各种信息，以最便捷的方式传输给大众。由于网页的接受者是可观可感的人类，所以网页的设计要力求人性化。由此网站页面的布局也应该迎合受众的需要，从受众的特点与需求入手，提高受众对信息的接受程度，在愉悦受众的同时最大限度的传达信息，

随着网页制作技术和浏览者需求的提高，访问者不再只注重内容的站点，设计者只有通过合理布局协调搭配网页内容和色彩，强化网页中具有闪光性的内容，这样既可以将设计者的思路淋漓尽致的表达出来，同时也可以留住太过挑剔的访问者。由此可见，页面的布局在网页设计中起着举足轻重的作用，那么如何才能使页面布局合理分配？这正是网页设计者感到最棘手的问题，本文对网页设计的布局进行简要分析。

2 网页布局类型

一般来说，网站页面布局通常被定义为如下5 种模板。

2.1“ 国”字型：又称“同”字信布置，也就是网站的标题以及横幅广告条在最上面，接着就是网站的主要内容，一些栏目分别列在左右两侧，主要部分在中间，网站的一些基本信息、联系方式、版权声明等放在最下面，很多大中型网站常用的这种布局类型。

2.2“厂”字型布局。也叫做拐角型，是指页面顶部为横条网站标志＋广告条，主菜单在下方左侧，内容的布局在右侧显示，因为菜单条背景较深，整体效果类似英文字母“T ”，所以又称之为“T ”形布局。

2.3“ 框架”型布局。左右框架型：这是一种左右分为两页的框架结构，一般左面是导航链接，有时最上面会有一个小的标题或标志，右面是正文。上下框架型：与上面类似，区别仅仅在于它是把页面分为上下两页的框架。综合框架型：上面两种结构的组合，相对复杂的一种框架结构，较为常见的是类似于 “拐角型”布局，只是采用了框架结构。

2.4 封面型布局。这种类型基本上是出现在一些网站的首页，大部分为一些精美的平面设计结合一些小的动画, 放上几个简单的链接或者仅是一个“ 进入”的链接。

2.5 Flash 型布局。其实这与封面型结构是类似的，只是这种类型采用了目前非常流行的 Flash，与封面型不同的是，由于Flash 强大的功能，页面所表达的信息更丰富，如果其视觉效果及听觉效果处理得当，绝不亚于传统的多媒体。

3 网页布局

网页布局的方法有两种，一种为纸上布局，另一种为软件布局。分别介绍如下：

3.1 纸上布局。准备若干张白纸和一只铅笔，在纸上画出页面的布局图，首先在创造阶段做个草案：充分发挥想象力，将想到的景象画上，不讲究细腻工整和细节功能，只以粗陋的线条勾画出创意的轮廓即可，尽可能多画几张，最后选定一个满意的作为继续创作的蓝本。

其次是遵循突出重点平衡谐调的原则，在草案的基础上粗略布局，把需要放置的功能模块安排到页面上，网站标志主菜单等重要的模块放在最显眼最突出的位置后再考虑次要模块的摆放。

最后根据智慧和经验，旁敲侧击多方联想，将粗略布局精细化、具体化，反复调整后确定最终的布局方案才能制作出具有创意的布局。

3.2 软件布局。就是利用软件Photoshop 来进行网页布局。Photoshop 所具有的对图像的编辑功能用到设计网页布局上更加得心应手。它可以方便的使用颜色及图形，并能利用层的功能设计出用纸张无法实现的布局意念。

4 网站的优化

网站的优化不只是通过seo 技术进行网站结构优化，网页标签优化，还要注意网页文案优化，因为你潜在的客户虽然通过网站推广技术已经找到了你，但他是否能够轻松阅读你网页中的信息就要看你网页中的文案是否吸引人了。这就要注意排版清晰明了，控制好字与字，行与行之间的距离及字体的颜色，该突出的词句一定要突出等；语言要有特点，能在最短的时间内告诉浏览他想要的信息；页面文章内容不要太多，要给浏览者眼睛休息的机会。同时也要注意诚信优化，能在最短的时间内获得浏览者的信任。最后还要注意站内广告优化，最容易让人接受的广告方式就是润物细无声的广告。

5 结束语

当前，网络的飞速发展给网页设计人员带来了更大的挑战，也使网页设计技术不断提高，如何把网页的内容与形式完美地结合，增强网站的吸引力，不仅要精通网页制作的技术，还需要设计者具有较高的艺术修养和审美情趣，页面布局的好坏在很大程度上取决于设计者的艺术修养水平和创新能力。

【参考文献】

[1] 刘珊珊。关于网站页面布局的最新方法研究。信息与电脑，2011.2

[2] 王君。网页设计在平面设计中的运用。包装工程，2012.8

[3] 潘强，刘志 ，郭毅军。网页设计中的层定位问题。电脑编程技巧与维护，2012.8