在确认过网站的架构及主要视觉风格之后,接下来就是要开始思考
网页设计的版面配置。
网页设计的版面配置 (也可以说版型规划) 有几项重点如下:
1. 运用视觉,强调重点每一个网站,最重要的都是首页;每一个首页,最重要的就是最上方的部分,我们称之为"Header" ,因为这个地方是每一位浏览者打开网页后,第一眼所看到的画面,所以它的设计及规划自然是整个网站的首要重点。
Header 中通常会有大篇幅的横幅,有的是图片,有的是动画,我们称之为 "Banner" ,也就是俗称的『网站主视觉』。随着 HTML5 及 CSS3 的日益普及,传统的 Flash 动画已经渐渐被取代,愈来愈多的网站使用大篇幅精致图片来强调企业或品牌的重点。因为图片并不像 Flash 动画那样需要较长的等待读取时间。例如 Apple 的首页,一打开就立刻看到非常大面积的横幅,图片宽度达到 980px ,让浏览者一看就知道这是目前 Apple 正在主打的热门商品。
所以,把整个企业或品牌的重点,运用大篇幅的精美图片呈现在 Header 或 Banner 中,就是
网页设计版型配置的第一个重点。
2. 掌握架构,落实配置每个网站都会有不同的需求,有些公司需要线上购物来贩售商品,有些公司则需要电子相簿来呈现大量的商品照片,这就是为什么在网站开始设计之前,都要先做好网站架构规划。
因此,在开始进行版面配置之前,设计师一定要全盘掌握网站的基本架构,了解这个网站会有哪些功能项目,如此一来,才能知道主选单 (Menu) 该放哪些项目?网页主体 (Content) 该有左栏 (Left) 还是右栏 (Right) ?网页底部 (Footer) 要不要有版权宣告或联络资讯?最新消息要显示 5 则还是 10 则?首页要有主打商品还是人气商品?要放几笔?广告连结要放在左边还是下面?要放几则广告?
掌握这些版面配置的重点后,设计师可以先在草稿上勾勒出版型的初稿,以方便接下来的其他版型设计处理。
3. 统一色彩,营造整体一家公司的形象,最重要的就是 企业识别系统 (CIS) ,一个网站也是,最重要的就是色彩是否达到协调性与一致性。
选择色彩,首要考量当然就是公司或品牌的主要颜色,例如 Facebook 的蓝色,法拉利的红色。除了主色系之外,也要谨慎选择配色,决定色彩之后,不论浏览者切换到哪一个页面,整个网站的风格都具有一致性,如此一来,网站除了能清楚的表达企业或品牌的精神之外,也能展现其独特性,提高企业的识别度。
4. 主次分明,简洁有力同样是标题,重要性不同,文字大小就必须不同;同样是图片,重要性不同,图片尺寸也就不同。
例如本周主打商品,就要用比较多的篇幅来介绍,文字大一些,图片更精??美一些,其他的次要商品,就使用较小的文字及图片,干净整齐的排列即可。较重要的讯息,除了文字图片大小有差异之外,也可以使用颜色来区别,例如在十笔文章标题中,可以把较重要的标题用红色来表示,并且放在第一笔。除此之外,所有的文字及图片,都要有适当的间距及留白,才能使画面阅读起来轻松不费力。
把最重要的 (也是您最优先想让客户知道的) 讯息凸显出来,主次分明,排版整齐,就能达到成功的
网页设计版型规划。
5. 善用图片,吸引目光一般人阅读网页的习惯,通常是由上到下,由左到右,但是当遇到图片时,就会呈现跳跃式的阅读,也就是说,人们会先看图片,看到有兴趣的,才会继续看文字。所以,适当的在必要的地方放置图片,才能更吸引住阅读者的目光。
一张网页中,如果都是文字,那阅读起来肯定枯燥无味,但如果都是图片,那内容又太过空洞,因此在产品列表中,最好有至少一张的图片,搭配产品简介文字,让阅读者可以迅速的浏览图片,看到有兴趣的产品时,就能再看看它的文字介绍,进而点进去查看产品的详细内容。
因此,一个成功的
网页设计版型规划,就是能够达到图文并茂、相互呼应的境界。
网站栏目:网页设计的版面配置重点
URL标题:/news24/150474.html
成都网站建设公司_创新互联,为您提供外贸建站、服务器托管、电子商务、企业建站、品牌网站制作、小程序开发
广告
声明:本网站发布的内容(图片、视频和文字)以用户投稿、用户转载内容为主,如果涉及侵权请尽快告知,我们将会在第一时间删除。文章观点不代表本网站立场,如需处理请联系客服。电话:028-86922220;邮箱:631063699@qq.com。内容未经允许不得转载,或转载时需注明来源:
创新互联