网站配色与布局

上传人:suns****4568 文档编号:60939457 上传时间:2018-11-21 格式:PPT 页数:27 大小:30.72MB
返回 下载 相关 举报
网站配色与布局_第1页
第1页 / 共27页
网站配色与布局_第2页
第2页 / 共27页
网站配色与布局_第3页
第3页 / 共27页
网站配色与布局_第4页
第4页 / 共27页
网站配色与布局_第5页
第5页 / 共27页
点击查看更多>>
资源描述

《网站配色与布局》由会员分享,可在线阅读,更多相关《网站配色与布局(27页珍藏版)》请在金锄头文库上搜索。

1、网站配色与布局, 理论部分,课程回顾,使用list-style-type属性设置列表符号时,其常用属性值none、disc、circle、square、decimal分别代表什么样式? 清除属性的含义是什么? 定位属性的含义,及其显示效果如何? z-index属性的含义是什么?,技能展示,了解常见的网页布局形式 了解网页设计配色原则,色彩的属性3-1,色相 色彩的相貌,用以区别色彩类别名称 色相是色彩的首要特征,红橙黄绿青蓝紫七色,页面从红色到黄色推移,画面整体色调统一和谐,色彩的属性3-2,纯度 色彩的纯净程度,加入白色后纯度的变化,高纯度的色彩给人以欢快、充满朝气的感觉 低纯度的色彩给人以

2、雅致、沉稳的感觉,色彩的属性3-3,明度 色彩的明亮程度,体现了颜色的明暗强弱,色彩的基本知识,三原色:红、绿、蓝 非彩色和彩色 非彩色是指黑色、白色、灰系统色 彩色是指除了非彩色以外的所有色彩,色彩的感觉2-1,冷暖感觉 轻重感觉 进退感觉 兴奋、沉静感觉,红色、黄色、橙色等颜色给人温暖的感觉 蓝色、青色、绿色等颜色给人寒冷的感觉,浅色感觉轻,深色感觉重 明度高的色彩感觉轻,明度低的色彩感觉重,暖色具有前进感,冷色具有后退感 明度高的色具有前进感,明度低的色具有后退感,色相方面 红、橙、黄等暖色,是令人兴奋的色彩 蓝、蓝紫、蓝绿给人的感觉沉静 明度方面 明度高的色使人兴奋,明度低的色使人沉静

3、 非彩色系中的白和黑有兴奋感,灰色有沉静感 纯度方面 高纯度色使人兴奋,低纯度色有沉静感,色彩的感觉2-2,各种色彩的心理感觉 红色:视觉冲击力强,是热烈冲动的色彩 橙色:具有轻快、热烈、温馨、时尚的效果 黄色:明亮度最高的颜色,灿烂、辉煌 绿色:温和,给人宁静的感觉 青色:基本与绿色相同,只是比绿色显得冷静 蓝色:最凉爽、清新、专业的色彩 紫色:给人神秘、高贵的感觉 白色:洁白、明快、纯真、清洁的感觉 黑色:深沉、神秘、寂静、悲哀、压抑的感觉 灰色:柔和、高雅的感觉,常用的色调4-1,色调 准确地表示一幅作品的画面综合观感效果 包括构图、形象、色彩、明暗等因素造成的综合效果,常用的色调4-2

4、,根据色彩的冷暖感觉分类 暖色调:红、橙、黄等颜色使人想到阳光、烈火 冷色调:绿、青、蓝等颜色称为“冷色” 中性色调:以黑、白、灰三种颜色组成,常用的色调4-3,页面中色彩所占比重分为 主色调 页面色彩的主要色调、总趋势 辅色调 仅次于主色调的视觉面积辅助色 点睛色 在小范围内加上强烈的颜色来突出主题,使页面更加生动 背景色 衬托环抱整体的色调,起协调、支持整体的作用,常用的色调4-4,画面中色阶的跨度大小分类 高调:颜色跨度大,色彩明确, 给人干脆、明快的感觉 低调:对比效果弱,它阴暗、低沉、有分量 中调:不强或者不弱中调对比,有丰富饱满的感觉,色彩的对比,色相对比 明度对比 纯度对比 冷暖

5、对比 面积对比,因色相之间的差异所形成的对比,色彩之间明暗程度的差异所形成的对比,不同色彩之间纯度的差异所形成的对比,不同色彩之间的冷暖差异所形成的对比,面积越大,明度、纯度的感觉越强 面积越小,明度、纯度的感觉越低,网页设计中色彩运用的基本原则3-1,整体性,网页设计中色彩运用的基本原则3-2,适用性 根据网站类型选择合适的色彩,使内容与形式相统一,网页设计中色彩运用的基本原则3-3,独特性 网页设计要有独特的个性,大胆突破,出奇制胜,小结,网页配色原则 鲜明性 网页的色彩要鲜艳,容易引人注目 独特性 要有与众不同的色彩,使得浏览者对网站印象强烈 合适性 色彩和表达的内容气氛相适应 联想性

6、不同的色彩会产生不同的联想,页面布局概述2-1,组成页面的各种元素 框架:框架指页面中区分不同内容的边距或区块 顶部:在网站顶部放置一个通栏,宣传、展示产品等 Logo:几乎所有的网站都会有自己的Logo 导航栏:显示网站的各种分支页面的分类 内容:网站的正文部分 页脚:在页面底部主要包括:版权、联系方式等 空白区:各元素之间的间距、页面和浏览器边缘的间距,页面布局概述2-2,页面布局 条理清晰 主次分明 色彩对比度适当 布局疏密适当,常见页面结构的分析7-1,上下结构式 通常上方为导航条,常见页面结构的分析7-2,左右结构式 又称二分栏式,清晰地分列两旁的框架结构,常见页面结构的分析7-3,上左右结构式 通常上方多数为菜单导航条 下方多数为栏目及广告等,右侧为内容区域,常见页面结构的分析7-4,上左中右结构式 又称三分栏式,常见页面结构的分析7-5,不规则结构式 一般为封面式或Flash式,使用图片或动画作为网站首页,常见页面结构的分析7-6,少见结构式 为了放置更多的信息栏目和内容 追求个性,常见页面结构的分析7-7,结构式的综合应用 几种布局结构的综合,

展开阅读全文
相关资源
相关搜索

当前位置:首页 > 大杂烩/其它

电脑版 |金锄头文库版权所有
经营许可证:蜀ICP备13022795号 | 川公网安备 51140202000112号