首页分享网页版式设计与色彩搭配（101页）

网页版式设计与色彩搭配（101页）

来源：花匠小妙招时间：2024-09-13 18:55

第2章网页版式设计与色彩搭配《网页设计与制作案例教程》（第3版）网页界面设计包括网页版式设计和网页色彩搭配。网页版式设计是各种网页元素进行合理组织而呈现的排列效果，从平面设计的角度来看，点、线、面有秩序的组合构成网页版式；网页的色彩搭配指各种网页元素的配色方案。色彩是最容易引人注目的视觉要素，然而对于初学者来说，网页配色难以很好的把握。如何设计出赏心悦目的网页作品，网页版式设计与配色显得尤为重要。《网页设计与制作案例教程》（第3版）本章主要内容  网页版式设计； 色彩基本理论； 色彩的视觉效果；  网页色彩及配色技巧。《网页设计与制作案例教程》（第3版） 2.1 案例分析：不同风格网页作品欣赏与解析 Internet上的网页不计其数，风格各异，有的网页看起来热情奔放，让人心潮澎湃；有的网页高雅华贵；有的网页沉稳庄重；有的网页轻松活泼。网页给浏览者带来的视觉感受，是由页面版式、色彩决定的。下面给出几个比较有代表性的网页，我们可以通过对它们的赏析，分析不同风格网页的特点。《网页设计与制作案例教程》（第3版） 2.1 案例分析：不同风格网页作品欣赏与解析网页作品欣赏之一：可口可乐公司网页《网页设计与制作案例教程》（第3版） 2.1 案例分析：不同风格网页作品欣赏与解析该网页版面设计采用四角对称型，主色调采用红色。四角对称的版式设计稳重、大方，网页四周及底部用很多看似零散，但是它们是有序的点来点缀网页，淡化了对称的相对呆板，使网页更有活力。整体配色为红色，是可口可乐公司VI的主色调，具有热情澎湃、青春活力的特点。网页无论版式还是色彩搭配都符合公司的形象，彰显消费群体的个性。《网页设计与制作案例教程》（第3版） 2.1 案例分析：不同风格网页作品欣赏与解析网页作品欣赏之二：养乐多面食类食品网站《网页设计与制作案例教程》（第3版） 2.1 案例分析：不同风格网页作品欣赏与解析该网页采用曲线型版式设计，主色调采用橙色。这是一个商务营销类网站，销售的主要产品是时尚饰品。网站的主要浏览者是年轻人。为此，采用曲线型版式设计，主要内容、图片和导航都依照曲线进行排列，设计简洁，过渡自然，美观大方，符合所销售商品的特点，同时给浏览者美妙的视觉享受。橙色作为一种暖色调，特别适合商务类网站使用。暖色能够拉近网页内容和浏览者之间的距离，橙色给消费者温馨浪漫的氛围，也符合所售商品的特质。因此，采用曲线型版式和橙色作为主色调，达到很好的效果。《网页设计与制作案例教程》（第3版） 2.1 案例分析：不同风格网页作品欣赏与解析网页作品欣赏之三：某房地产公司售楼主页《网页设计与制作案例教程》（第3版） 2.1 案例分析：不同风格网页作品欣赏与解析该楼盘属于高端小区。从整体上看，网页很好的体现了其所宣传产品（楼盘）高贵典雅、气质非凡并略显神秘气息的特质，也迎合客户的尊贵及大隐于市的心理预期。设计师是如何做到这一点的呢？首先，页面整体采用中轴对称式布局，给人以稳定、古典、严肃的感觉；其次，整体采用黑色调，配以金黄色元素作为点缀，给人安静、庄重、神秘的视觉效果。《网页设计与制作案例教程》（第3版） 2.1 案例分析：不同风格网页作品欣赏与解析网页作品欣赏之四：苹果公司网站首页《网页设计与制作案例教程》（第3版） 2.1 案例分析：不同风格网页作品欣赏与解析网页采用四横的骨骼式设计，整体色彩采用黑白灰色调。从色彩及版式看，网站秉承了苹果创始人乔布斯的极简风格，苹果在网页设计上并没有花费太大笔墨。骨骼式架构是公司网站通用的架构，容易被浏览者接受，黑白灰是永恒的时尚色。中间大块区域被主打商品占据，