网页美工基础
- 格式:doc
- 大小:535.00 KB
- 文档页数:11
网页美工设计知识点在当今数字化时代,网页设计是最为重要的一项技术。
随着互联网的不断发展,人们对于网页的需求也越来越高。
而在网页设计中,美工设计是必不可少的一个环节。
本文将为您介绍一些关于网页美工设计的知识点。
一、色彩搭配在网页设计中,色彩是非常重要的因素之一。
色彩可以为网页赋予不同的情绪和氛围,能够吸引用户的眼球并传达信息。
在进行色彩搭配时,需要考虑到网页的整体风格、内容以及目标受众。
同时,要注意色彩的对比度和饱和度,以确保文字和背景的清晰可辨。
二、排版设计网页的排版设计对于用户的阅读体验至关重要。
合适的字体、字号和行距能够使文字更加易读,而适当的段落划分和标题设置则能够提高内容的结构性。
此外,网页的布局也需要考虑到响应式设计,以适应不同屏幕大小的设备。
合理的排版设计可以使用户更轻松地获取信息,提升用户体验。
三、图像处理在网页设计中,图像是必不可少的元素之一。
优秀的美工设计需要注意对图像的处理和选取。
合适的图片可以很好地展示网页的主题和内容,增强用户的视觉感受。
在处理图像时,需要关注其质量、尺寸和格式,以兼顾图片的清晰度和加载速度。
四、响应式设计如今,移动设备的使用越来越普及,因此响应式设计也成为了网页设计的一个重要环节。
响应式设计能够使网页在不同的设备上都能够呈现出最佳的效果,并且能够自适应不同屏幕尺寸。
通过使用媒体查询、流式布局等技术手段,可以让网页在不同设备上都能够提供良好的用户体验。
五、用户体验设计优秀的网页美工设计不仅仅注重于视觉效果,还需要关注用户体验。
用户体验设计包括网页的导航设计、交互设计等,旨在提升用户在网页上的操作体验,使其更加便捷和舒适。
通过合理的导航设计和页面交互,可以使用户更加容易地找到所需信息,并提高用户的满意度。
六、品牌识别在进行网页美工设计时,需要考虑到品牌的识别和体现。
合适的Logo设计、颜色搭配和风格元素能够使网页与品牌保持一致,并且能够传达品牌形象和价值观。
网站美工设计基础教程第四部分课程实训本课程的实训目标是要求学生通过大量的实例赏析、上机操作与训练,能依据专业的审美观来自行设计各种网页,熟练掌握其基本方法与技巧,并能最终设计出各类综合性的网页。
本课程共14个实训案例,实训总计39学时。
实训案例1:实训:对21世纪网页设计的审美传播的认识。
要求:完成文字稿2000字左右,谈对21世纪网页设计的审美转达的认识。
教师指导1学时,学生课后8学时或以上。
实训目的:提高学生对网页设计的认识,加深理解网站在当今社会的重要地位。
实训案例2:(必做)实训:网页与平面构成、色彩、版面设计的关系。
要求:完成文字稿2000字左右,谈网页与平面构成、色彩、版面设计关系理解和认识。
教师指导1学时,学生课后8学时或以上。
实训目的:提高学生对色彩的认识。
加深对色彩在现实生活中重要性的理解。
实训案例3:(必做)实训:掌握重复、渐变、发射的构成练习。
要求:分别作三个构成的练习,手绘(30CM×30CM)在白卡纸上(黑白稿)作涂色练习。
教师指导3学时或以上。
学生课后练习40以上学时。
实训目的:反复调整三个基本构成的骨架结构和设计效果,通过动手实践,体会手绘的感觉。
实训案例4:实训:学会作特异、肌理、图与底、对比、韵律等平面构成的练习。
要求:任选一幅手绘在白卡纸(30CM×30CM)上(黑白稿)作设计练习。
教师指导3学时,学生课后8学时或以上。
实训目的:通过动手实践,体会手绘的感觉及学习手绘的技法。
实训案例5:(必做)实训:设计三幅平面构成设计。
要求:有条件的地方可上机操作。
教师指导3学时,学生课后练习40学时以上。
实训目的:通过动手实践,体会手绘的感觉和学习手绘的方法。
实训案例6:(必做)实训:通过学习,学会色彩调配知识、掌握涂色以及调色方法。
完成1幅在白卡纸上(30CM×30CM)的手绘作业涂色(用水粉色)练习。
要求:绘制明度渐变卡,教师指导1学时,学生课后8学时或以上。
第一章21世纪网页设计的审美传播学习目标:本章侧重介绍网站美工的基本理论、基础知识、基本技能和方法,了解网站和网页的基本设计思想,使学习者掌握色彩基础知识、平面构成、版式及创意等相关的内容。
学习重点:网页与平面构成、网页与色彩之间的相互关系网页的平面设计构成需要注意几点:1、布局要新颖:新颖的形式感觉非常重要,要根据不同内容的特点来决定版面的最终形式。
2、对比要强烈:对比要大小参差变化、疏密衬托有致、轻重感觉均衡、明暗对比适度。
3、变化又统一:万变不离其宗色彩运用的越简洁、完整,对人们的吸引力就越强1、对比与和谐:①以色彩三要素对比为主的色彩构成。
②统一和类似调和构成③色彩的调和与面积形状的关系。
④色彩的调和与视觉生理平衡。
2、色彩的肌理:一般来说,反光能力强的物体表面都很光滑,反映的色彩不够稳定,但明度有提高;粗糙的表面反光能力很弱,色彩较稳定,明度和纯度会有一定的降低。
因此,同一种颜色在不同的材料上会产生不同的颜色效果,这就是肌理对色彩的影响。
3、无色彩与有色彩的相互作用4、绘画色彩与设计色彩的关系网页设计时页面的整体风格要协调统一,网页中的内容应当清晰且适宜浏览,所以不要使用太耀眼的颜色或太朦胧的效果,除非有特殊的需要。
色彩的物质性心理错觉1、颜色的物质印象,大致分为冷暖两个色系。
冷暖色系是人们根据心理错觉对色彩的物理性分类。
2、一般来说红,橙,黄,有温暖的感觉,照射到物体上都会增加暖和感。
相反,紫,蓝,绿,照射到物体上则有冷的感觉。
3、冷暖色系除了温度上的差别外,还有重量感,温度感、味觉感、季节感等。
如暖色偏重,冷色偏轻;暖色有高密度感,冷色则有疏散的感觉‘冷色有较强的透明感;暖色显得干燥,冷色显得湿润。
灰暗的色彩个人沉重的感觉,明亮的色彩给人轻松的感觉;淡色是人感到柔软,暗的纯色则有坚硬的感觉。
红色1、红色能刺激荷尔蒙的变化,能引起人兴奋的感觉。
是热烈、冲动的色彩。
2、在深红色的底子上,红色平静下来,热度熄灭着;在蓝绿色的底子上,红色就像炙热燃烧的火焰;在黄绿底子上,红色又变成一种冒失鲁莽的闯入者,激烈而又寻常;在橙色的底子上,红色似乎忧郁着,暗淡而无生命,好像焦干了似的。
2013年上学期《网页设计美工基础》期末考核试题考核方式:开卷适用班级:计网1231、1232、1233班考核截止时间:本学期第17周最后一次课作品提交:请用自己的“学号”+“姓名”命名自己要提交的考核作品文件夹(注:特别提示2位数的学号在前,姓名在后),在考核作品文件夹中分别创建名称为“1”和“2”的两个文件夹,用以放置考题1和考题2的文件。
一、设计长沙民政职业技术学院软件学院2013年新版网站首页效果图(70分)●具体要求:1、尺寸:宽度1000像素,高度不限;2、分辨率:72像素/英寸;3、颜色模式:RGB 8位;4、提交作品的格式:.JPG和.PSD格式,一共须提交2个文件,按原始尺寸提交;5、在首页中必须包含“长沙民政职业技术学院”字样和民政学院logo;6、网页的banner中须突出“软件学院”字样,软件学院的院训“德智并重,软硬求精”应有所体现;7、首页中必须包含的栏目版块有:新闻版块、通知版块、学院图片展示版块、友情链接版块;8、在页面下方的版权信息中必须含有作者本人的真实姓名;9、原官方网站中的图片,仅软件学院的师生人物或场景照片允许使用,其他图片不得使用;10、栏目导航项目与原官方网站一致。
●评分标准:1、不符合题目规定的要求,每一项扣5分计;2、设计创意20%3、制作精细度20%4、软件的使用技术与技巧运用20%5、整体的美感20%6、工作量(按标准工作量10小时计算)20%7、抄袭计0分,部分抄袭视情况按比例扣分。
二、模仿(图1)中的网页,使用DIV+CSS进行网页设计(30分)●具体要求:1、使用DIV+CSS进行网页布局,布局结构与下图一致,网页在浏览器中居中显示,背景颜色、宽度、边框尺寸颜色不限;2、最上方两个DIV(红色数字1、2标示的)须设置背景图片,导航条中须加入导航链接(红色数字2处);3、其他DIV须设置边框线,并在DIV容器中加入合适的文本或图片;4、提交方式:提交站点文件夹(可将站点文件夹打包成.rar或.zip文件)。
网店美工基础试题及答案一、选择题(每题2分,共10分)1. 以下哪项不是网店美工的主要职责?A. 产品图片处理B. 店铺页面设计C. 客户服务D. 产品详情页设计答案:C2. 在网店美工中,以下哪种色彩模式最适合网页设计?A. CMYKB. RGBC. LABD. HSB答案:B3. 网店美工在设计产品详情页时,以下哪个元素不是必须包含的?A. 产品图片B. 产品描述C. 客户评价D. 产品价格答案:C4. 以下哪个软件不是网店美工常用的设计软件?A. PhotoshopB. IllustratorC. PremiereD. CorelDRAW答案:C5. 在网店美工设计中,以下哪项不是提升用户体验的要素?A. 清晰的导航B. 快速的加载速度C. 复杂的动画效果D. 易读的字体答案:C二、判断题(每题2分,共10分)1. 网店美工设计时,图片分辨率越高越好。
()答案:错误2. 网店美工在设计时,应该忽略移动端的适配。
()答案:错误3. 网店美工设计时,使用过多的颜色可以增加页面的吸引力。
()答案:错误4. 网店美工在设计产品详情页时,应该包含详细的产品信息和清晰的图片。
()答案:正确5. 网店美工设计时,不需要考虑搜索引擎优化(SEO)。
()答案:错误三、简答题(每题5分,共20分)1. 简述网店美工在设计产品详情页时应注意哪些要点?答案:在设计产品详情页时,网店美工应注意以下要点:确保图片清晰且具有吸引力;提供详细的产品描述和规格;包含客户评价和问答;设计易于导航的页面布局;确保页面加载速度快;使用合适的颜色和字体以提高可读性。
2. 网店美工如何通过设计提升用户体验?答案:网店美工可以通过以下方式提升用户体验:设计简洁明了的页面布局;使用高分辨率且优化的图片;确保页面在不同设备上的适配性;提供清晰的导航和搜索功能;使用直观的按钮和链接;确保页面加载速度快;使用易读的字体和颜色。
3. 网店美工在设计时,如何考虑搜索引擎优化(SEO)?答案:网店美工在设计时,可以通过以下方式考虑搜索引擎优化:使用关键词优化的标题和描述;确保图片有适当的文件名和ALT标签;使用结构化的HTML和CSS;避免使用过多的Flash和JavaScript;确保页面有清晰的URL结构;使用内部链接提高页面间的连接。
网店美工面试基本知识导言在互联网时代,网店成为了创业者们展示产品、销售商品的重要渠道。
而作为网店的美工,除了需要具备一定的美术功底外,还要了解网店的特点和面试中可能会涉及到的基本知识。
本文将介绍一些网店美工面试的基本知识,帮助应聘者更好地准备面试。
1. 网店设计和布局在网店中,布局和设计是非常重要的。
一个好的网店设计可以吸引顾客的注意力,提高购买率。
在面试中,应聘者可能会被要求展示自己对网店设计和布局的理解和能力。
可以从以下几个方面进行准备:•网店首页设计:首页是网店的门面,应聘者可以考虑如何设计出一个吸引人的首页,包括颜色搭配、排版、图片选择等。
•商品列表页设计:商品列表页是用户选择商品的重要界面,应聘者可以思考如何设计出一个清晰、易于搜索和选择的商品列表页。
•商品详情页设计:商品详情页需要清晰地展示商品的图片、价格、描述等信息,应聘者可以展示自己对商品详情页设计的理解和能力。
2. 图片处理和优化在网店中,产品图片的质量和美观度对于吸引顾客起着至关重要的作用。
在面试中,应聘者可能会被要求展示自己对图片处理和优化的能力。
可以从以下几个方面进行准备:•图片的尺寸和比例:应聘者需要了解不同平台的图片要求,并能够根据要求进行尺寸和比例的调整。
•图片的背景处理:应聘者需要了解如何去除或更换图片的背景,以及如何优化图片的色彩和亮度。
•图片的压缩和格式转换:应聘者需要了解如何压缩图片的大小,以及不同格式图片的优缺点。
3. 前端基础知识除了设计和图片处理外,应聘者还需要了解一些前端基础知识,以便能够更好地与开发人员进行沟通和协作。
在面试中,可能会涉及到以下基础知识:•HTML和CSS:应聘者需要了解HTML和CSS的基本语法和常用标签,以便能够进行网页布局和样式调整。
•响应式设计:应聘者需要了解响应式设计的原理和实现方式,以便能够适应不同设备的屏幕尺寸。
•JavaScript:应聘者需要了解JavaScript的基本语法和常用函数,以便能够进行一些简单的交互效果和动画效果的实现。
网站美工设计基础一、单选:1.下列对平面构成的表述错误的是(C主要以具象形态为切人点)2.下列属于机能设计的是(D.家具设计)3.下列不属于概念元素的是(B重心)4.下列不属于组形的是(D.平衡)5.对肌理的描述正确的是(A.物体表面的结构特征)6.下列对特异的描述正确的是(B打破规律性)7.下列有关构成物体色彩固有特征的描述锖误的是(A.物体的形状)8.下列对群化构成的表述管误的是(B不可以单独构成图样) 9.线的表现力非常丰富.能表现出宁静、豁达感的线的形象是(C.水平线)10.我们对日常所见到的不发光物体所呈现出的不同色彩称为(物体色)11.下面选项中不属于版式设计造型要素的是(一段音乐)12.下列哪一项是光谱学说中的七种色彩?(C红、橙、黄、绿、青、蓝、紫)13.图与底足在平面构成形象之同的相互参照,下列表述错误的是(D.面积大小的比较中,大面积的有图感)14.下列有关使用元素的描述错误的是(D.设计所表达的形象的大小、形状,色彩,肌理等)15.下列属于偶然形的是【C风化的岩石)16.下列对点的形象的表述错误的是(A.从几何学的角度去审视点的形象.它有面积也有位置)17.在CorelDRAW软件中,提供了色彩填充功能.下列哪一项是错误的?(D图像复制)18.设计中应用较广的一种比例关系叫黄金比,它的长与宽的比值为(1:1.618)19.在版面设计中.不断重复使用基本形或线.是经常采用的形式.为了避免呆板稍做一些变化,使版面变得灵活.这种形式原理属于(C.重复与交错)20.CorelDRAW格式文件的后缀是(B.CDR)。
21.下面不属于版式设计造型要素的是(体)22.在CorelDRAW软件中,要编排大量的文字,应选择哪一项?(段落文本)23.在发射构成中,发射点根据图形的需要,按照一定的动势,有秩序地渐次移动位置,形成有规律的变化,表现出较强的空间感并具有曲面舶效果。
这种发射形式属于(移心式发射)24.下列有关使用元素的描述错误的是(设计所表达的色彩造型) 25.下列有关群化构成的描述错误的是(群化构成要求基本形外形松散)26.在诸多相同性质的形象中做个别异质性的形象来打破原有的单调格局,使版面更活跃、更丰富、更有情趣,而异质形象往往就是整个版面最具动感、最引人关注的焦点心这种形式原理属于(变异与秩序)27.由一个基本形渐变到另一个基本形,基本形可以由完整渐变到相对残缺,也可以由简单到复杂,由具象渐变到抽象。
网页美工基础【教学内容】∙网页配色∙素材获取∙网页布局【教学目的】掌握网页配色和布局的常用方法。
【教学重、难点】∙重点:网页配色原则、网页布局的类型∙难点:实际的运用【教学方式】采取讲授和演示相结合的方式。
一、网页配色1.色彩基础在任何设计中,色彩对视觉的刺激起到第一信息传达的作用。
因此,在网页设计中,色彩的合理运用,能直接影响整个网页的风格,下面我们来了解色彩的基础知识:1)色彩的三要素自然界的色彩虽然各不相同,但任何色彩都具有色相、明度、饱和度这三个基本属性。
色相:色相是指色彩的相貌,是指各种颜色之间的区别,是色彩最显著的特征,是不同波长的色光被感觉的结果。
光谱中有红、橙、黄、绿、蓝、紫六种基本色光,人的眼睛可以分辨出约180种不同色相的颜色。
如图3-1-1就是一个色相环。
图3-1-1 色环饱和度:饱和度是指色彩的鲜艳程度,也称色彩的纯度。
饱和度取决于该色中含色成分和消色成分(灰色)的比例。
含色成分越大,饱和度越大;消色成分越大,饱和度越小。
明度:明度是指色彩的深浅、明暗,它决定于反射光的强度,任何色彩都存在明暗变化。
其中黄色明度最高,紫色明度最低,绿、红、蓝、橙的明度相近,为中间明度。
另外在同一色相的明度中还存在深浅的变化。
如绿色中由浅到深有粉绿、淡绿、翠绿等明度变化。
2)色彩模式RGB:人们把红(Red)、绿(Green)、蓝(Blue)这三种色光称之为“三原色光”,RGB色彩体系就是以这三种颜色为基本色的一种体系。
目前这种体系普遍应用于数码影像中,如:电视、计算机屏幕、数码相机、扫描仪等。
RGB值是从0至255之间的一个整数,不同数值叠加会产生不同的色彩。
对于单独的R或G或B而言,当数值为0时,代表这种颜色不发光;如果为255,则该颜色为最高亮度。
因此当RGB三种色光都发到最强的亮度,纯白的RGB值就为255,255,255。
屏幕上黑的RGB值是0,0,0。
R,意味着只有红色存在,且亮度最强,G和B都不发光。
因此最红色的数值是255,0,0。
同理,最绿色就是0,255,0;而最蓝色就是0,0,255。
黄色较特殊,是由红色加绿色而得就是255,255,0。
RGB模式是显示器的物理色彩模式。
当然,在设计网页的时候用到的素材图片也一般都是RGB模式。
CMYK:CMYK分别代表青(Cyan)、品红(Magenta)、黄(Yellow)、黑(Black),这是一种基于反光的色彩体系,常用于彩色印刷中。
CMYK值是以浓度0-100%来表示,不同浓度叠加会产生不同的色彩。
理论上相同浓度的CMY叠加,则会变成黑色,但实际混合色料后并不会呈现黑色而是暗灰色,所以将黑色独立出来,增加印刷时颜色的范围。
HSB:HSB是颜色分为色相、饱和度、明度三个因素,英文为H(Hue)、S (Saturation)B(Brightnes。
饱和度高色彩较艳丽,饱和度低色彩就接近灰色。
亮度高色彩明亮,亮度低色彩暗淡,亮度最高得到纯白,最低得到纯黑。
一般浅色的饱和度较低,亮度较高,而深色的饱和度高而亮度低。
2.网页色彩1)色彩的心里感觉红色的色感温暖,性格刚烈而外向,是一种对人刺激性很强的色。
红色容易引起人的注意,也容易使人兴奋、激动、紧张、冲动、还是一种容易造成人视觉疲劳的色。
在红色中加入少量的黄,会使其热力强盛,趋于躁动、不安。
∙在红色中加入少量的蓝,会使其热性减弱,趋于文雅、柔和。
∙在红色中加入少量的黑,会使其性格变的沉稳,趋于厚重、朴实。
在红中加入少量的白,会使其性格变的温柔,趋于含蓄、羞涩、娇嫩。
黄色的性格冷漠、高傲、敏感、具有扩张和不安宁的视觉印象。
黄色是各种色彩中,最为娇气的一种色。
只要在纯黄色中混入少量的其它色,其色相感和色性格均会发生较大程度的变化。
∙在黄色中加入少量的蓝,会使其转化为一种鲜嫩的绿色。
其高傲的性格也随之消失,趋于一种平和、潮润的感觉。
∙在黄色中加入少量的红,则具有明显的橙色感觉,其性格也会从冷漠、高傲转化为一种有分寸感的热情、温暖∙在黄色中加入少量的黑,其色感和色性变化最大,成为一种具有明显橄榄绿的复色印象。
其色性也变的成熟、随和。
∙在黄色中加入少量的白,其色感变的柔和,其性格中的冷漠、高傲被淡化,趋于含蓄,易于接近。
蓝色的色感冷嘲热讽,性格朴实而内向,是一种有助于人头脑冷嘲热讽静的色。
蓝色的朴实、内向性格,常为那些性格活跃、具有较强扩张力的色彩,提供一个深远、广埔、平静的空间,成为衬托活跃色彩的友善而谦虚的朋友。
蓝色还是一种在淡化后仍然似能保持较强个性的色。
如果在蓝色中分别加入少量的红、黄、黑、橙、白等色,均不会对蓝色的性格构成较明显的影响力。
橙色是一种激奋的色彩,具有轻快,欢欣,热烈,温馨,时尚的效果。
∙如果在橙色中黄的成份较多,其性格趋于甜美、亮丽、芳香。
∙在橙色中混入小量的白,可使橙色的知觉趋于焦躁、无力。
绿色是具有黄色和蓝色两种成份的色。
在绿色中,将黄色的扩张感和蓝色的收缩感相中庸,将黄色的温暖感与蓝色的寒冷感相抵消。
这样使得绿色的性格最为平和、安稳。
是一种柔顺、恬静、潢足、优美的色。
∙在绿色中黄的成份较多时,其性格就趋于活泼、友善,具有幼稚性。
∙在绿色中加入少量的黑,其性格就趋于庄重、老练、成熟。
∙在绿色中加入少量的白,其性格就趋于洁净、清爽、鲜嫩。
紫色的明度在有彩色的色料中是最低的。
紫色的低明度给人一种沉闷、神秘的感觉。
∙在紫色中红的成份较多时,其知觉具有压抑感、威胁感。
∙在紫色中加入少量的黑,其感觉就趋于沉闷、伤感、恐怖。
∙在紫色中加入白,可使紫色沉闷的性格消失,变得优雅、娇气,并充满女性的魅力。
白色的色感光明,性格朴实、纯洁、快乐。
白色具有圣洁的不容侵犯性。
如果在白色中加入其它任何色,都会影响其纯洁性,使其性格变的含蓄。
∙在白色中混入少量的红,就成为淡淡的粉色,鲜嫩而充满诱惑。
∙在白色中混入少量的黄,则成为一种乳黄色,给人一种香腻的印象。
∙在白色中混入少量的蓝,给人感觉清冷、洁净。
∙在白色中混入少量的橙,有一种干燥的气氛。
∙在白色中混入少量的绿,给人一种稚嫩、柔和的感觉。
∙在白色中混入少量的紫,可诱导人联想到淡淡的芳香。
黑色具有深沉,神秘,寂静,悲哀,压抑的感受。
灰色具有中庸,平凡,温和,谦让,中立和高雅的感觉。
2)网页色彩搭配的原理色彩的鲜明性:网页的色彩要鲜艳,容易引人注目。
色彩的独特性:要有与众不同的色彩,使得大家对你的印象强烈。
色彩的合适性:就是说色彩和你表达的内容气氛相适合。
如用粉色体现女性站点的柔性。
色彩的联想性:不同色彩会产生不同的联想,蓝色想到天空,黑色想到黑夜,红色想到喜事等,选择色彩要和你网页的内涵相关联。
3)网页色彩搭配的技巧用一种色彩:这里是指先选定一种色彩,然后调整透明度或者饱和度,(说得通俗些就是将色彩变淡或则加深),产生新的色彩,用于网页。
这样的页面看起来色彩统一,有层次感。
用两种色彩:先选定一种色彩,然后选择它的对比色。
用一个色系:简单的说就是用一个感觉的色彩,例如淡蓝,淡黄,淡绿;或者土黄,土灰,土蓝。
用黑色和一种彩色:比如大红的字体配黑色的边框感觉很"跳"。
图3-1-2一般情况下网站色调选择要注意以下几点:∙忌讳使用强烈对比的颜色搭配做主色;∙配色简洁,主色要尽量控制在三种以内;∙背景和内容的对比要明显,少用花纹复杂的背景图片,以便突出显示文字内容。
如果你对颜色的搭配没有经验,可以使用Dreamweaver的配色方案来学习简单的配色,开启Dreamweaver,执行“命令→设定配色方案”进入配色选择窗口,这里提供了多种背景、文本和链接的颜色,可以根据你的需要来选择搭配。
当然,你也可以使用一些专门的网页配色软件如“ColorImpact”、“三生有幸”等来辅助你搭配好网站的色彩。
3.实例分析1)这是个大型的NBA网站。
通常我们经常看到的此类网站以白色为背景,但是这个网站却用灰黑色RGB为(48,48,48/#333333)(以下颜色都用RGB表示),文章标题用色为RGB为(203,201,153/#CCCC99),菜单使用的RGB为(112,119,112/#707770)。
这样的配色可以显示独特的个性,又不失大型网站的风采。
如图3-1-3。
图3-1-32)下面是一个娱乐类的综合性网站UGO,他的配色方案是背景色为黑色RGB 为(0,0,0)中嵌套RGB(0,0,82),字体白色RGB(255,255,255),菜单为RGB(77,114,159)。
这样的虽以黑蓝为主色调,但是配以漂亮的图片,给人的感觉是生机盎然,充满了互动色彩和青春气息。
如图3-1-4。
图3-1-43)下面的这个网站是大名鼎鼎的微软公司网站,微软不仅软件做的好,连网页制作也是世界一流。
他的每一个网页都是制作的样板。
从网页我们就可以看出微软公司的风格、作风,以及雄厚的实力。
背景颜色使用蓝色RGB为(0,151,254),菜单为黑色RGB(0,0,11),菜单为灰色RGB(200,200,200),字体为黑色RGB(0,0,0),如图3-1-5。
图3-1-54)现在介绍的网站相对简单,但是她的用色也别具匠心,现在我们来看一看,整体上使用的是白色RGB(255,255,255),辅助色为RGB(79,88,95),菜单色为RGB(48,64,64)和RGB(0,81,111)字体使用的是RGB(83,86,91)。
虽然简单,但颜色搭配非常的科学合理。
如图3-1-6。
图3-1-65)下面的网站采用黄色调为主,很体现公司的个性,现在我们就来看一看她的颜色搭配。
主色调为黄色RGB为(255,199,48/#FFC730),辅助色调为RGB (49,102,46)字体为棕色RGB(153,103,0),中间再配以抽象的图片,显得个性十足但又不单调。
如图3-1-7。
图3-1-76)橘红色如果运用得当的话是一种非常使用于网页上的颜色。
下面的这个网站就是一个非常著名的例子。
他的主色调为RGB(255,151,0)辅助色调为RGB(255,103,4),菜单RGB为(252,200,0)。
字体使用黑色RGB为(0,0,0)。
此种配色显得主人较为前卫,色彩热烈,给人的震慑力较强。
如图3-1-8。
图3-1-87)鲜红色也是一种震撼感很强的颜色,如果搭配不当,也可能使网站没有风格和特点。
下面的这个网站就是使用红色比较好的网站。
我们来看看他的颜色搭配。
他使用的主色调是RGB(200,9,0),配以抽象的图形,文字使用的是RGB (213,229,167)显得美观而不失独特,大气而不逼人。
如图3-1-9。
图3-1-98)下面介绍的这种色调是我们制作网页的时候不会经常用到的颜色,如果使用到你的网页中,肯定会给人耳目一新的感觉。