您好,欢迎访问三七文档
当前位置:首页 > 机械/制造/汽车 > 制造加工工艺 > 颜色设计PPT2.3
六、网页的色彩搭配色彩的基本知识:颜色是因为光的折射而产生的红、黄、蓝是三原色,其它色彩都可以用这三种颜色调和而成。网页中色彩表达除了用颜色名称表达外,就是用这三种颜色的数值表示:红色color(255,0,0)、十六进制表示为(ff0000)如:“bgcolor=#ffffff”表示背景色为白色网页的色彩搭配颜色分非彩色与彩色两类:非彩色指黑、白、灰,其它为彩色。网页制作用彩色还是非彩色好呢?根据专业的研究机构研究表明:彩色的记忆效果是黑白的3.5倍。也就是说,在一般情况下,彩色页面较完全黑白页面更加吸引人。我们通常的做法是:主要内容文字用非彩色(黑色),边框,背景,图片用彩色。这样页面整体不单调,看主要内容也不会眼花。任何色彩都有饱和度和透明度的属性,属性的变化产生不同的色相,所以至少可以制作几百万种色彩。网页的色彩搭配非彩色的搭配黑白是最基本和最简单的搭配,白字黑底,黑底白字都非常清晰明了。灰色是万能色,可以和任何彩色搭配,也可以帮助两种对立的色彩和谐过渡。如果你实在找不出合适的色彩,那么用灰色试试,效果绝对不会太差。网页的色彩搭配彩色的搭配颜色分:暖色系、中性系、寒色系不同的颜色会给浏览者不同的心理感受,如:绿色---介于冷暖两中色彩的中间,显得和睦,宁静,健康,安全的感觉。它和金黄,淡白搭配,可以产生优雅,舒适的气氛。每种色彩在饱和度,透明度上略微变化就会产生不同的感觉。以绿色为例,黄绿色有青春,旺盛的视觉意境,而蓝绿色则显得幽宁,阴深。网页色彩的搭配原理1.色彩的鲜明性。网页的色彩要鲜艳,容易引人注目。2.色彩的独特性。要有与众不同的色彩,使得大家对你的印象强烈。3.色彩的合适性。就是说色彩和你表达的内容气氛相适合。如用粉色体现女性站点的柔性。4.色彩的联想性。不同色彩会产生不同的联想,蓝色想到天空,黑色想到黑夜,红色想到喜事等,选择色彩要和你网页的内涵相关联。网页色彩的搭配技巧1.用一种色彩。这里是指先选定一种色彩,然后调整透明度或者饱和度,(说得通俗些就是将色彩变淡或则加深),产生新的色彩,用于网页。这样的页面看起来色彩统一,有层次感。2.用两种色彩。先选定一种色彩,然后选择它的对比色(在photoshop里按ctrl+shift+I)。如用蓝色和黄色,,整个页面色彩丰富但不花稍。3.用一个色系。简单的说就是用一个感觉的色彩,例如淡蓝,淡黄,淡绿;或者土黄,土灰,土蓝。4.用黑色和一种彩色。比如大红的字体配黑色的边框感觉很跳。网页色彩的搭配忌讳不要将所有颜色都用到,尽量控制在三种色彩以内。背景和前文的对比尽量要大,(绝对不要用花纹繁复的图案作背景),以便突出主要文字内容。七、网页中的图像使用图像在网页中具有画龙点睛的作用,它能装饰网页,表达个人的情调和风格。但在网页上加入的图片越多,浏览的速度就会受到影响导致用户失去耐心而离开页面。网页中使用的图像可以是GIF、JPEG、BMP、TIFF、PNG等格式的图像文件,其中使用最广泛主要是GIF和JPEG两种格式,最有发展优势的是PNG格式。网页中的图像使用GIF(GraphicalInterchageFormat):图像交换格式,最多可以支持256种颜色,可以使得图像变得相当小。GIF图像可以在网页中以透明方式显示,可以使用动态GIF图像包含动态信息。GIF在网页中大量应用在站点图标Logo、广告条Banner及背景图像。但由于GIF的颜色数目限制,不适合用作照片级的网页图像。网页中的图像使用JPEG(JointPhotographExpertGroup),联合照片专家组,简称JPG,可支持多达16M颜色。可以高效地压缩,但压缩方式是以损失图像质量为代价,压缩比越高图像质量损失越大,图像文件也就越小。通常在网页中用来显示照片等颜色丰富的精美图像。网页中的图像使用规则:控制图片的尺寸:最直接的办法是尽量避免大尺寸的图片,而多采用轻薄短小的导航按钮、装饰图形、Logo。控制图片的用色数量:图片内色彩数量愈多,文件尺寸就愈大,所以尽可能多用平板(非渐层)的色彩,以利于压缩,尽可能少用显示得过分精细的图形。细腻的光影、渐层、肌理纹路的显示,均会耗用大量的色彩,使得GIF尺寸增大。而如果你选用JPEG格式,就得考虑加上解压所需时间,这是否反而使得图片显示得更慢。网页中的图像使用在原始文件里标注图片的长度与宽度:在原始文件里标注图片的长度与宽度,可以帮助浏览器迅速、准确地对网页的版面进行安排,避免浏览器在显示图片的过程中重新调整、配置网页的版面。图片长宽度的标注方法为:imgsrc=″url″width=″x″height=″y″,其中的″x″,″y″表示图像的长宽各为多少像素(pixels)。网页中的图像使用为较大的图片暂时提供一个略小或粗糙的低解像度的lowsource图片:如果你打算将一个较大的图片放上网页的话,不妨先提供一个解像度略差或长宽度略小的图片当做lowsource,使得浏览器可以先快速地展现出这个lowsource图片,然后再渐渐地以高画质或较大图片取代之。在原始文件时标注lowsource的方法为:imgsrc=″url″lowsrc=″url″width=″x″height=″y″特值得注意的是:其中的width=″x″height=″y″是指imgsrc的长宽度,并非lowsrc的长宽度。网页中的图像使用当网页中需要载入一个较大的GIF或JPEG图像文件时,装载速度会很慢。为改善网页的视觉效果,可在载入时设置为隔行GIF或逐级JPEG方式,即隔行扫描。隔行扫描在显示图像开始看起来非常模糊,接着细节逐渐添加上去直到图像完全显示出来。(可以在Photoshop中设置。)也可以将其分割成间距为0的小图。(可以用Fireworks处理)网页中的图像使用在制作图片时,单张图片不要超过30KB,每个页面的图片总量不超过60KB(一般情况下)。所有图片都必须减肥为小图片(100*40),一般可以控制在6KB以内,动画控制在15KB以下。静态网页最初的都是用超文本标记语言HTML来实现的。一般后缀为.htm或.html制作工具可以是记事本、EditPlus等纯文本编写工具,也可以是FrontPage、DreamWeaver等所见即所得的工具。静态网页的缺点是:如果要修改网页,必须修改源代码,并重新上传。八、网页执行原理静态网页的工作原理接受请求找到静态网页发送网页服务器端动态网页所谓动态网页,就是服务器端可以根据客户端的不同请求动态产生网页内容。两个显著特点:可以动态产生页面支持客户端和服务器端的交互功能动态网页示例BBS论坛留言板聊天室动态网页的工作原理接受请求找到动态网页发送网页服务器端运行动态网页,生成静态网页常用的动态网页技术CGIASPPHPJSPASP.NETJ2EE九、网页运行的软件支撑环境Client(客户端)Browser(浏览器)例如:IE等。这是浏览器的最基本的功能。Server(服务器端)Win98下需要PWS(personalwebserver)WindowsNT、2000、XP、2003下需要IIS(InternetInformationServer)其使用方法在实践环境中演示。1、解释网站、网页的概念。2、网站的组成要素有那些?3、网站编译工具有哪几种?各有什么特点?4、网站的一般流程有哪些?5、网站设计的色彩搭配要注意什么?6、主页面设计有哪些要求|?思考题
本文标题:颜色设计PPT2.3
链接地址:https://www.777doc.com/doc-3436533 .html