网页风格设计及色彩搭配技巧
网页设计中的色彩与排版原则

网页设计中的色彩与排版原则色彩和排版是网页设计中至关重要的要素,它们能够直接影响用户在网站上的使用体验。
合理运用色彩与排版原则,可以提升网页的视觉效果,增强用户对页面内容的理解和记忆。
本文将探讨网页设计中的色彩与排版原则,以及如何运用它们来设计优秀的网页。
一、色彩原则1. 色彩搭配在网页设计中,色彩搭配是关键。
选择一组和谐的色彩可以给用户带来舒适的视觉感受。
通常可以通过色轮来确定色彩的搭配方式,常见的搭配方式有:- 互补色搭配:选择色轮上互为对称的两种颜色,搭配出鲜明的对比效果,提升网页的视觉效果。
- 类似色搭配:选择色轮上相邻的颜色进行搭配,使整体色彩过渡更加柔和,适用于展示一种温暖和谐的感觉。
- 单一色搭配:在网页中选用单一颜色,并在不同明度和饱和度上进行变化,营造简洁大气的设计风格。
2. 色彩运用除了色彩的搭配,合理运用色彩也是非常重要的。
以下是几种常见的色彩运用原则:- 引导用户注意力:通过使用鲜明的对比色,可以引导用户关注重要的内容或操作按钮,提高网页的用户体验。
- 表达情感和品牌形象:不同的色彩有着不同的情感联想,因此可以根据页面内容和品牌形象来选择合适的色彩。
- 色彩的识别度:使用亮度和饱和度不同的颜色可以帮助用户更快地辨认信息,提高信息传递的效率。
二、排版原则1. 字体选择在网页设计中,选择合适的字体可以增强页面的可读性和整体美感。
以下是一些字体选择的原则:- 简洁易读:选择简单的字体,如Arial、Helvetica等,保证文字的清晰可读。
- 避免使用过多字体:在一个页面内使用过多不同的字体会让页面看起来混乱,选择一种或者少量字体进行搭配。
- 缩放和行距:为了让文字更易读,可以根据不同浏览器和设备的显示效果,设置合适的字体大小和行距。
2. 排版布局网页排版布局的合理性直接影响用户的阅读体验和页面的整体美感。
以下是一些排版原则:- 对齐方式:选择合适的对齐方式,如居中、左对齐、右对齐等,让页面内容看起来整齐统一。
网页设计传统配色方案2024

引言概述:网页设计中的色彩选择对于页面的整体效果和用户体验至关重要。
传统的配色方案是指那些经典、常用且在设计中广泛应用的色彩组合。
本文将继续探讨网页设计传统配色方案,旨在为设计师提供更多灵感和选择。
正文内容:一、深色系传统配色方案1.黑白经典:黑色与白色的组合是一种经典的、简洁大气的传统配色方案。
黑白搭配可以营造出高对比的视觉效果,适用于多种类型的网页设计。
2.深蓝与白色:深蓝色是传统配色方案中常见的选择之一。
与纯白色的搭配能够给人带来舒适和专业感,适用于金融、科技等领域的网页设计。
二、明亮色系传统配色方案1.红与白色:红色是一个有活力和吸引力的颜色,与白色搭配可以营造出醒目而清晰的页面效果。
适用于餐饮、旅游等类型的网页设计。
2.黄绿与白色:黄绿色是一种鲜明且积极向上的颜色,与白色的搭配可以给人带来清新和亲和感,适合教育、环保等领域的网页设计。
三、自然色系传统配色方案1.蓝绿色与棕色:蓝绿色与棕色的搭配可以给人带来舒适和和谐的感觉,适用于自然和健康相关的网页设计。
2.红褐与绿色:红褐色是一种富有质感的颜色,与绿色的搭配可以打造出生动而富有活力的页面效果,适合农业、生态等领域的网页设计。
四、经典配色方案的运用技巧1.对比与平衡:在选择传统配色方案时,需要注意对比和平衡。
例如,在使用深色系传统配色方案时,可以在黑色背景上使用白色文字来实现对比,同时保持页面的平衡。
2.强调重点:传统配色方案的优势之一是可以帮助设计师达到强调重点的效果。
通过合理的运用色彩,可以将关键信息或功能突出展示,提升用户体验。
五、适用场景和注意事项1.适用场景:传统配色方案适用于各行各业的网页设计,特别适合于需要表达传统、专业、稳定等特点的项目。
2.注意事项:在使用传统配色方案时,需要注意与品牌形象的一致性、用户体验的友好性,并对不同屏幕设备做好颜色适配等。
总结:通过分析深色系、明亮色系和自然色系等传统配色方案的特点和运用技巧,我们可以在网页设计中更加灵活地运用这些经典色彩组合。
网站色彩配色方法

网站色彩配色方法一个人拥有自己的风格,称为个性。
一个网站有独特的色彩风格,可以吸引浏览者的注意,从而细细品味该站的内容。
所以,网页配色是非常重要的。
网页色彩是树立网站形象的关键之一。
网页颜色搭配的是否合理,直接影响到访问者的情绪。
好的色彩搭配,会给访问者带来强烈的视觉冲击力。
那么,具体到网页的背景、文字、图标、边框、超链接等,应该采用什么样的颜色,应该搭配什么颜色,才能最好地表达出网站的内涵呢?一、网页色彩基础知识首先,需要弄清楚什么是三元素,即:什么是同类色?什么是临近色?什么是对比色?什么是补色?这些都是色彩的基本概念,也是必须掌握的内容。
众所周知,Photoshop有一种HSB色彩模式,就是用色彩的三要素进行定义的。
色相是Hue,纯度是Saturation,明度是Brightness。
三元素指的是色相、纯度、和明度。
色相,指颜色的品相,如红色、绿色、蓝色。
纯度,指颜色的饱和度、鲜艳度;纯度越高,颜色就越鲜艳,否则颜色就越黯淡。
明度,指颜色的明亮程度。
亮度越高,就越接近白色;亮度越低,就越接近黑色。
其中,白色最亮,黑色最暗。
按照色彩在色轮上的位置不同,又可将色彩定义为同类色、邻近色、对比色、补色。
同类色是指两种颜色在色轮上位置的角度相差不超过15°;邻近色是指两种颜色在色轮上位置的角度相差不超过30°;对比色指两种颜色在色轮上位置的角度相差不超过120°;补色是指两种颜色在色轮上位置的角度相差为180°。
二、网络色彩的基本类型每个颜色都代表了一个概念,以及该色彩所表达的情感,如红色、黄色、蓝色、绿色、粉色、紫色等。
1.红色常见的红色有纯红、朱红、粉红、深红、浅红等。
红色是一种喜庆的颜色,是中国最传统的色彩。
例如,过年时的年画是红色的;古时状元及第的服饰也是红色。
红色象征着吉祥,代表着祝福。
但是,红色也代表着危险。
例如,医院的标识很多都是红色的,红绿灯的红灯就表示危险的信号。
网页设计中色彩搭配的原则与技巧

网页设计中色彩搭配的原则与技巧网页设计中色彩搭配的原则与技巧色彩是艺术表现的要素之一。
在网页设计中,我们的设计师根据和谐、均衡和重点突出的原则,将不同的色彩进行组合.搭配来构成美丽的页面。
下面就是店铺介绍网页设计中色彩搭配的原则与技巧,欢迎大家借鉴!色彩能够建立起我们对品牌的直观感知。
在谈论网页设计中色彩搭配原则之前,我们需要先来看看不同主色调的象征意义。
这个主色调的选择,需要依据我们对所要设计网站的定位来确定。
灰色:象征冷静、中立;(苹果、维基百科、纽约时报……)绿色:象征健康、生命;(BP石油、食品超市whole foods、星巴克……)蓝色:象征可靠、力量;(戴尔、大众汽车、IBM……)紫色:象征智慧、想象;(雅虎、T-Mobile、科幻主题电视台Syfy……)红色:象征血气、年轻;(可口可乐、乐高、肯德基……)橙色:象征欢乐、信任;(芬达、亚马逊、火狐……)黄色:象征温暖、透明;(百思买、法拉利、麦当劳……)网页中色彩搭配的原则在网页美工设计中,最常用的.几个颜色为蓝色、绿色、橙色,以及暗红色。
如:蓝为主调时,多与白、橙搭配。
白底,蓝标题栏,橙色按钮或图标做点缀;蓝天白云,沉静整洁的感觉。
绿为主调时,多与白、蓝两色搭配。
白底,绿标题栏,蓝色或橙色按钮或图标做点缀,绿白相间,雅致而有生气。
橙为主调时,多与白、红搭配。
白底,橙标题栏,暗红或桔红色按钮或图标做点缀,橙色活泼热情,标准的商业色调,因此多用于商业网站的网页设计。
暗红为主调时,显得宁重、严肃、高贵,需要配黑和灰来压制刺激的红色。
黑或灰底,暗红标题栏,文字内容背景为浅灰色。
网页设计时注意的几点问题尽管三原色的相互搭配创造出了无数颜色,不是所有的颜色都适用于网页设计,不同的颜色在搭配上也有着其中的学问。
在网页设计中对于色彩的使用特别忌讳脏、纯、跳、花、粉这几种情形。
忌脏是指背景与文字内容对比不强烈,灰暗的背景令人沮丧。
忌纯是指艳丽的纯色对人的刺激太强烈抗议,缺乏内涵。
网页设计中的色彩搭配技巧

网页设计中的色彩搭配技巧在网页设计中,色彩搭配是非常重要的一环。
正确的色彩搭配可以影响用户的审美感受,提升用户体验,甚至影响用户的情绪和行为。
因此,设计师在进行网页设计时必须要懂得如何运用色彩。
首先,要注意色彩的选择和搭配。
色彩搭配要考虑到网页的整体风格和定位,以及目标用户的喜好和心理需求。
通常情况下,可以选择主色、辅助色和弱化色进行搭配。
主色用于突出页面的重点内容,辅助色用于强调次要内容,弱化色用于起到衬托作用。
搭配时要注意色彩的对比度和饱和度,避免颜色过于刺眼或过于单调。
其次,要了解色彩的搭配原则。
常见的色彩搭配原则包括对比色、类比色、同色异调、冷暖色对比等。
对比色是指位于色轮相对位置的两种颜色,相互之间产生强烈的对比效果,让页面内容更加突出。
类比色是指位于色轮相邻位置的两种颜色,色彩过渡比较自然,适合用于柔和的页面风格。
同色异调是指使用同一种颜色的不同明度和饱和度来搭配,能够产生统一而有层次感的视觉效果。
冷暖色对比是指利用色彩的温度差异来达到吸引眼球的效果,例如蓝色和橙色的搭配会让页面更加生动。
另外,要考虑色彩的心理效应。
不同的颜色会影响人的情绪和感知。
比如,红色代表热情和活力,适合用于醒目内容的突出;蓝色代表安静和冷静,适合用于轻松的页面设计;绿色代表健康和环保,适合用于有关自然和生态的主题等。
设计师在选择色彩时,要考虑到目标用户的感受和需求,以达到更好的传达效果。
最后,要注意色彩在不同设备上的呈现效果。
在进行网页设计时,要考虑到不同设备和屏幕的色彩显示效果可能存在差异。
因此,在选择色彩时,要尽量避免使用亮度过高或过低的颜色,以确保在不同设备上都能够呈现出良好的效果。
此外,还可以使用响应式设计和矢量图形等技术来优化色彩的显示效果,提升用户的体验。
总的来说,色彩搭配是网页设计中的重要一环,设计师需要综合考虑页面风格、用户需求和色彩心理效应等因素,才能够创建出符合预期效果的网页设计。
希望以上关于色彩搭配技巧的介绍能够对网页设计师有所帮助,提升其设计水平和用户体验。
网页设计中的色彩搭配

网页设计中的色彩搭配色彩是网页设计中至关重要的因素之一,因为合理的色彩搭配可以吸引用户的眼球并提升用户体验。
本文将探讨网页设计中的色彩搭配原则及如何选择适合的色彩配色方案。
一、色彩搭配原则1. 色彩搭配要符合网页主题:网页设计的首要目标是传达特定的信息或表达特定的情感,因此色彩搭配需要与网页的主题一致。
例如,如果设计一份以自然为主题的旅游网站,可以选择绿色调的配色方案来呈现大自然的感觉。
2. 使用品牌色彩:如果网页是为一个品牌或企业设计,应该考虑使用品牌色彩。
品牌色彩在用户心中留下深刻的印象,并且能帮助用户快速识别品牌。
比如,Facebook的品牌色彩是蓝色,用户一看到蓝色就能立即联想到Facebook。
3. 色彩搭配要符合情感表达:不同的色彩会引发不同的情感反应,如红色代表激情和活力,蓝色代表冷静和信任。
设计师可以根据需要选择适合的颜色来传达特定的情感。
4. 使用对比色彩:色彩对比可以提高网页的可读性和视觉吸引力。
对比色彩之间的明暗、冷暖、亮度等要有明确的差异,以便突出重要信息。
二、选择适合的色彩配色方案1. 单色调配色方案:单色调即使用单一颜色的不同变化来构建整个网页的配色方案。
这种方案适合传递简洁、清新、现代的感觉,且无论颜色如何变化,都能保持整体统一。
2. 互补色配色方案:互补色即在色彩光谱中相互对立的颜色。
使用互补色可以增加对比度,使网页更加鲜明。
例如,红色与绿色、蓝色与橙色。
3. 类似色配色方案:类似色即在色彩光谱中相邻的颜色。
这种配色方案能够产生柔和、和谐的效果。
例如,紫色和蓝色、蓝色和绿色。
4. 渐变色配色方案:渐变色可以给网页增加层次和变化,使网页具有流动感。
设计师可以选择线性渐变或径向渐变,根据网页布局及主题进行选择。
总结:色彩搭配在网页设计中起到关键的作用,可以吸引用户、传达信息和表达情感。
设计师应根据网页主题和所要表达的情感来选择合适的色彩配色方案。
同时,在色彩搭配中要注意对比度,以提高可读性和视觉效果。
网站设计中的色彩搭配技巧

网站设计中的色彩搭配技巧在网站设计中,色彩的选择和搭配是至关重要的,它能够直接影响用户的视觉体验和情感感受。
正确地运用色彩搭配技巧可以使网站的设计更加吸引人,提高用户对网站的满意度,下面将介绍一些常用的网站设计中的色彩搭配技巧。
1. 理解色彩的基本原理色彩的基本原理包括色相、明度和饱和度。
色相指的是颜色的名称,如红色、蓝色等;明度指的是颜色的明亮程度;饱和度指的是颜色的纯度。
在网站设计中,应该选择与主题相符合的色相,通过调整明度和饱和度来获得丰富的变化。
2. 使用色彩搭配工具为了帮助设计师选择合适的色彩搭配方案,可以使用一些色彩搭配工具。
例如,Adobe Color可以根据输入的色彩进行搭配,提供多种配色方案供选择。
调色板和配色工具可以帮助设计师更好地理解和使用色彩。
3. 选择主色调和辅助色彩在网站设计中,通常需要选择一个主色调和一些辅助色彩。
主色调是网站设计的核心颜色,可以根据品牌风格、网站定位等因素来确定。
辅助色彩可以用来强调重点内容或创造层次感。
主色调和辅助色彩之间应该保持协调和平衡,避免过多的色彩冲突。
4. 运用色彩心理学色彩心理学指的是通过色彩对人的情绪和意识产生的影响进行研究。
在网站设计中,可以根据色彩心理学的原理,选择合适的色彩表达网站的品牌特点或传达特定的信息。
例如,红色可以引起人的注意,蓝色可以传达冷静和信任的感觉。
5. 使用高对比度色彩在网站设计中,高对比度色彩可以提高页面的可读性和辨识度。
通过在背景和前景之间选择对比鲜明的色彩,可以使文字更加清晰,突出重点信息。
然而,过高的对比度也可能导致视觉疲劳,因此需要适度平衡。
6. 避免过多的色彩和花哨效果在网站设计中,过多的色彩和花哨的效果可能会让用户感到混乱和困扰,降低用户体验。
因此,在设计过程中应该避免使用过多的色彩和繁琐的特效,保持简洁和清晰。
7. 考虑不同设备和平台的色彩显示由于不同设备和平台对色彩的显示存在差异,设计师需要在网站设计中考虑到这些差异。
网页布局结构与色彩搭配解析

二、色彩搭配的基本原理和常见搭配方式
3、对比度:对比度是衡量两种颜色在视觉上的差异程度。高对比度的颜色搭 配可以增强网页的视觉效果,但过多使用可能会使网页显得过于刺眼。
三、不同应用场景和需求下的色 彩搭配分析
三、不同应用场景和需求下的色彩搭配分析
1、新闻类网站:新闻类网站以传递信息为主要目的,要求色彩搭配简洁明了。 使用对比度较高的色彩搭配可以突出标题和重点段落,提高阅读体验。例如,黑 色和白色的对比搭配可以很好地突面内容。
四、总结
四、总结
网页布局结构与色彩搭配是网页设计的重要组成部分,对于提高用户体验和 提升网站质量具有关键作用。通过选择合适的布局结构和色彩搭配,能够使用户 更加愉悦地使用网站,同时也能更好地传递网站的信息和价值。
四、总结
希望本次演示的解析能对相关从业人员有所帮助,在未来的工作中注重布局 结构和色彩搭配的运用,为打造更加优秀、实用的网页提供支持。
四、实际操作案例
1、确定主题:该电商网站主要销售环保产品,主题为“绿色生活”。 2、确定色彩搭配方案:以绿色为主色调,搭配灰色和白色。绿色代表环保, 灰色和白色则可以营造出简洁、干净的视觉效果。
四、实际操作案例
3、应用色彩搭配方案:首页的背景色为淡绿色,产品图片使用深绿色,与背 景形成对比度,突出产品。标题文字使用白色,与背景色形成强烈对比,引导用 户视线。副标题和正文使用灰色,保持视觉上的平衡。
3、品牌官网:品牌官网是展示品牌形象的重要平台,色彩搭配要与品牌形象 保持一致。例如,对于科技品牌,通常使用蓝色、灰色等冷色调来营造一种专业、 可靠的形象;而对于儿童品牌,则可以使用较为鲜艳的色彩来传达一种活泼、有 趣的氛围。
四、实际操作案例
四、实际操作案例
- 1、下载文档前请自行甄别文档内容的完整性,平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益,请联系客服反馈,我们会尽快为您处理(人工客服工作时间:9:00-18:30)。
网页风格设计及色彩搭配技巧一、网站设计风格一个人拥有自己独特的风格,是一般人所没有的,就会让人注意到那个人的特别,若那个人的风格是正面的,甚至就会引起别人的羡慕与注意,或是赞赏。
就如同一个网站,拥有别的网站所没有的风格,就会让浏览者愿意多停留些时间,细细品尝该站的内容,甚至该站会得到多人的鼓励与注目,粗略的说,网站风格可以从以下几个方向来探讨,而每一项都是有关联性的:1. 色系:网页的底色、文字字型、图片的色系、颜色等等。
2. 排版:表格、框架的应用、文字缩排、段落等等。
3. 窗口:窗口效果,例如:全屏幕窗口、特效窗口等。
4. 程序:网页互动程序,例如:ASP . PHP . XML . CGI等等。
5. 特效:让网页看起来生动活泼的各种应用,如:Flash . Java script . Java applets . DHTML等等。
6. 架构:目录规划、层次浅显易懂、选单应用等等。
7. 内容:网站主题、整体实用性、文件关联性、内容切合度、是否有不必要的档案等等。
8. 走向:对于网站的未来规划、网站整体内容走向等。
以上这些项目都与网页风格有密切的关系,网页的风格不是某一项相同,网站就是有整体感,而是要各项目的配合应用,才能达到完美的网站风格设计。
接下来的段落,将会为每个项目做简单的介绍。
(一)色系网站的色系是浏览者整体的视觉观感,若一个网站色系能有一致性,不仅会使网站看起来美观,更能让浏览者对内容不易混淆,增加了浏览的简洁与方便。
而网站的色系更能衬托出网站的主题,若色系能与主题合理搭配,将会增加浏览者的易读性。
网站的色系包含了网页的底色、文字字型、图片的色系、颜色等等,这不单只是将颜色搭配得当就算完美,还要配合每个内容,及网站主题。
对于网站的色系,应该要在网站开始制作前,做好规划及设计,才不会到着手制作网站时,难以搭配,甚至造成混乱的设计。
网页的底色是整个网站风格的重要指针。
举例来说,以黑色作为背景颜色的网页,因黑色本对人的视觉上会造成黯淡的感觉,若是拿来用作活泼的儿童网站,就是不适合了。
因为小孩子是天真无邪的、活泼的、有朝气的,与黑色的沉稳、黯淡,很难联想在一起。
再举个例子,若是写一个有关于环保的网站,若用暗红色作为网页底色,决计不会有人联想到网页的内容是与环保有关。
当然,每个人的审美观不同,可能也会对颜色的代表性看法不同,但既然网站不是只写给自己看的,就应该要注意到大部分人可能会有的观点,然后以众人居多的观点出发,来设计网页。
文字字型上的设计,最好的网站是以所有浏览者都能看到的字型为主。
常会看到有需多网站要求浏览者须自行下载某种字型,才能达到最佳浏览效果,这是种非常奇怪的行为。
毕竟浏览者只是来找资料或是来看网站的内容,不可能会因为这种「为达最佳浏览效果」,而自行下载所需要的字型。
当所要求的字型若不下载,并不会影响到网站内容上的浏览与不便,那么对浏览者的要求就微乎其微的不可能发生任何作用。
这么一来,对于网页设计者来说,无非是非常可惜的,因为当初的设计风格却未能让浏览者一窥全貌,岂不是白费心思的吗?何谓图片的色系?以色彩学简单的区分,可分为冷色系与暖色系,再详细一点的区分,又可分出各种颜色的色系,而色系的区分,就在于主观浏览意识上的差异了。
如何将图片的色系与网站整体色系相对应,就是比较困难的地方了。
对于网页初学者来说,要绘制一张图并非易事,要绘制一张符合自己网页风格的图,更是困难重重。
大部分的网页制作者,并不大可能驾轻就熟的使用影像处理软件或绘图软件,于是乎,网页素材的网站就开始盛行了。
当然,不会使用绘图软件并不代表网页就不能设计的很出色,若是能将网络上的素材资源妥善利用,网站也是可以走出自己的风格的。
而该怎么选择适合自己网站的图片,就是门很大的学问了。
选择图片该以何作为标准呢?举例来说,若网站内容为科学探讨,当然不能以卡通图片来作为插图,试想,当您正在浏览一个有关天文学的网站,却满是皮卡丘的可爱图片,不是很不协调吗?再举个例子,如果一个教学网站,里头却尽是明星图片,看上去根本就不像是教学网站,而是大杂汇的明星相片网。
很多人喜欢将自己欣赏的明星照放上自己的网页中,如果仅是个人网站倒也还好,因为个人网站本就无主题居多,也就没有所谓的符不符合主题的顾虑,但若是有主题的网站,岂不糟糕?以图片内容来说,能切合网站主题最好,若不能,也别差异太多。
以颜色来说,若一个网页是蓝色的底色,但整个网页的图档却乱七八糟,各种颜色纷纷出笼,更糟的是,蓝色是属于冷色系的颜色,若以蓝色为底的网页,却尽都是大红色、橘色的图片,那将会使整张网页看起来就像垃圾堆,杂乱无章。
所以,可以简单的归纳出,网页与图档的颜色,色系一致或是视觉效果一致,将会使网页看起来更为美观且有自己的风格。
网页的颜色,并非单一就图文件、文字颜色、或是底色为主,而是以浏览者的角度来观看,整体网页看上去是偏向哪种色系。
常常见到许多网站虽然色系搭配的很好,但却是没有自己的风格。
以目前流行的柔色系、粉色系网站来说,就是失了自己独到的风格。
因为使用粉色系的网站,不外乎都有相同的特点,文字颜色浅,底色也以浅色系为主,这样除了没有自己的风格外,看起来既不大方也难登大雅之堂。
以各大搜寻网站来说,根本不会做这样的设计,因为文字颜色淡,加上底色浅,对浏览者来说,阅读上非常吃力,所以这样的设计风格也应尽量避免。
一个有自己风格,且阅读起来舒适大方的网页,并不可能一次就写好,而是需要经过不厌其烦的修正、调色,才能达到最佳浏览效果的,所以制作网页也一定要有相当大的耐心。
(二)排版网站的排版是让网页浏览者阅读方便,且内容主题明确的重要指针,若网站的排版经过精心规划,将会使浏览者更能迅速的找到所需的资料。
就如同一本书,编排得当将会使读者一目了然,且更能了解该书所要阐述的内容。
而网站的排版,就如同书册的排版一般重要。
网站的排版包含了表格、框架的应用、文字缩排、段落等等,而排版并不是整齐就好,还要有明确的分类,以及主题的适当规划。
表格的应用是一般大型网站最常见到的编排方式,表格能使多段文字统合整理,达到清楚易懂的效果。
表格不见得是有形的表格,何位有形的表格?一般常见的有形表格,多为有框线,或是有底色。
表格可多形式的运用,如图形与文字间的排版,表格可将图形与文字做最恰当的编排,充分结合于网页上。
然而表格的底色或底图,应避免与文字起冲突。
常见表格中用的底图或底色因颜色过重,而文字不清楚,表格的重点当然仍是在于文字,不是在作为配角的底图或底色。
当底图只是衬饰的作用时,就应让其中的文字清楚明了。
而表格的整体配色更是重要,框线及底色都应与网页整体配色为主,若是以表格作为同一网页编排,应尽量使各表格间不致差异太大。
当有需要特别彰显内容的表格,才有其必要性作不同的配色。
框架的应用,对于架设于较慢的网站空间之网页,较适合框架的应用,框架可避免相同网页重复读取,拖累下载速度。
但框架因切割整个画面,造成浏览的内页空间大幅度减小,故再使用框架务必要注意到内容主页的易看性。
框架编排,最需要注意的是左右滚动条应尽量避免,若一个网页在阅读上,要不断的移动滚动条往右又往左移,将会对浏览者造成很大的不便。
另,框架也需要注意到连结的正确性,常看到以框架为主体的网页,竟然按下选单框架页中的连结,不是显示在内容框架页中,而是另开窗口,这真是脱着裤子放屁-多此一举!且框架过多的网页,会造成浏览者不知如何找寻资料的窘境。
举个最常见的例子,很多小型的个人网站,常喜欢以多框架来架构网站,数一数甚至框架页达五六个以上,有时按了左侧的选单,以为内容会出现在内容框架页,却竟然是显示在右上角的某个小角落,这不是特有风格,既不美观也不实际,更难以找到资料!框架与表格皆为网页整体编排利器,该如何运用与走出自己风格,就是需要长时间的修饰版面、观摩学习(但绝非模仿抄袭)与经验了。
(三)窗口窗口效果的妥善运用,可以使网页有特色,但过度的应用反而会使人厌恶,甚至关闭网页不再造访,若真的因窗口的不当运用,造成浏览者不便而不想再继续浏览,那就是非常可惜的事了。
全屏幕窗口,通常不为浏览者所喜爱,尤其是强制性的全屏幕浏览,一般上网者对于不同的浏览方式并非都能欣然接受。
对于图片浏览的网站,若图片很大可以采用此种方式,以方便一窥全图,但必须于连结前先注明将会开启全屏幕窗口,较不会引起浏览者的反感。
现有许多个人网站,都特别喜爱使用无工具列窗口,有的网站是将整个无工具列窗口放大至全屏幕,有的网站则是过小的超迷你窗口。
前一种会使人难以跳开网页浏览做其它动作,造成很大的不方便;后一种更是糟糕,窗口小到几乎无法浏览,字体小、图形小、内容更少,这种窗口让浏览者的第一感觉就是网站没内涵,又小家子气。
且这两种网站,几乎都有一个最大的共通点,锁鼠标右键功能。
这样的锁定,对于网站本身并无多大助益,除了让浏览者不方便外,其实浏览者根本也无意于抄袭该网站,只会让人觉得网页很没内容又要怕别人抄袭。
看到这种网站,大部分的浏览者并不会觉得有风格,若是觉得有风格,也不过是流于通俗的「小气风格」。
另外则是有些许初学者的网站,特别喜好滥用窗口特效,举凡网页震动、闪烁等等,这些对于内容及个人风格上也无实质助益,能避免应尽量避免。
毕竟有规模、有内涵的网站,根本不会有这样乱七八糟的特效。
这样的特效的确也造成了某部分的特殊效果,即是网页混乱的特别效果。
且越容易滥用窗口特效的网站,大多都无内容,想利用这些来混淆视听,试图造成浏览者的错觉,误以为内容丰富。
但实际上欲达成的效果不但没有达到,反而会使浏览者一眼就看穿该网站制作者是一名网页新手,且该站几乎毫无内容可言。
若网站本有丰富的内涵,因此而造成浏览者的错觉,岂不可惜?并非所有的窗口特效都是负面的评价,也是有某些情况时可以斟酌小心使用。
若是资料量少,或是公告等小资料量的文件,可以酌量使用小窗口的开启,这种方式反而有助于网页的整体性,及浏览易读性。
综合以上所述,一个成功的网站,若要走出自己的风格,并非单就窗口特效来加强,而应先注重内容,并依其网站内容来决定如何采用一些特殊的窗口,达到整个网站的风格一致性。
记住,花样越多并不能让网页显得技巧高明,而是在于内容与窗口效果的完美运用。
(四)程序在早期的网站中,只有让浏览者「看」的作用,伴随着多种程序语言的发展,目前常听到的网页互动程序有ASP . PHP . CGI . XML等等,上述这些网页程序,都能使网页「动」起来,而网站的功能不再只有「看」,也可以「参与」其中。
然而,大多数的网页制作者,本身并不会自行开发撰写程序,故许多已是现成的程序下载网站或是免费资源网站便应运而生。
对于不会撰写程序的网站制作者来说,无非是一大福音,但在套用现成程序或是使用免费资源时,也必须要注意整体的网页风格。