当前位置:文档之家› 网页布局与构成PPT精选文档

网页布局与构成PPT精选文档


.
28
网页中的线
点的运动轨迹就形成了线,线强调方向与形状,具有 很强的表现力。
直线象征平实、挺拔、力量、速度和稳定。 曲线给人一种平滑、柔软、优雅和委婉的感觉,使人
联想到流畅、秩序、自由。
.
29
网页中的直线
定、把由均水水衡平平的选线线感择和和觉适垂垂。当直直的线线线改构宽为成或斜的色线边彩,框,将区常给域会人使出带人现来产独速生特度一的和种视运庄觉动重感的、受感平。觉稳。、安
1002像素×600像素
浏览器界面中的标题栏、菜单栏、功能按钮、状态栏、 滚动条等要占用一定的显示空间。
.
10
网页基本要素
从信息组织角度分类
水果 水果
蔬菜
内容
桔子 芹菜 菠萝 蔬菜 土豆水桔果子香蕉 菠菜 辣椒 苹果 苹果
结构
香蕉 菠萝
行为 表现
表现
蔬菜 芹菜
Hale Waihona Puke 结构 内容菠菜行为
辣椒 土豆
.
13
网页LOGO
LOLGLOOOG居GOO居中居右左
网站特色和内涵的集中体现
具有唯一性 设计灵活性较大、样式多样
网页标志
注意突出LOGO,使其醒目、明显。
.
14
横贯页面的通栏
通栏
.
15
横不灵贯横活页贯多面页样的面的通的通栏通栏栏
通栏
.
16
文字导航 按钮导航 图片导航 隐藏导航
.
21
区块结构
栏式结构基础上的横向划分,这种结构的设计较为自由,变化多样。
.
22
其它结构
国字型布拐局角:结信构息常内见容于的网边站线次不级是页浏面览,器页边面线结,构而清被晰包、围主在次一分个明线,框但区形域式内。 单调乏味,过于呆板。
.
23
其它结构
框架的使用是一种标全复题图杂正像的文类形类式型型,往结往一构只般简在出单某现,些在适大网用型站范网的围站首有的页限社。。区论坛中较为常见。
.
3
案例分析
根据本章知识点把提 供的网页效果图进行 规划、布局。
涉及知识点
❖ 布局分析规划 ❖ Photoshop操作
.
案例
素材
完成效果
4
网页概述
首页
访问者见到的第 一个页面
展示网站形象
.
5
次级页面
传达信息 展示网站内容
网页概述
.
6
形象页
文字信息较少 仅作为网站入口 关注访问者对网站的整体印象
四个基本要素存在层次关系,内容是核心、基础。
.
11
网页基本要素
从制作角度分类 内容 设计 技术
决定网页的价值
技对术于主网要页是设网计页师及来图说形,图设像计制工作作软占件有的重运要用比以重及。程序员的 程序开发实现。
.
12
重要的网页元素
网页元素就像棋子,网页布局的过程就是棋盘上“排兵 布阵”的过程,合理的安排它们的位置,就会达到意想不到 的效果。
网页概述
.
7
网页概述
门户网站更注重信息的传播和网站的访问量,因此 网站的形象处于次要的位置,通常首页直接设置内容。
.
8
网站LOGO 网站通栏 导航按钮
图片
页面主要元素
导航条
按钮 广告条
文字
.
9
页面尺寸
常用的显示器分辨率 800像素×600像素 1024像素×768像素
第一眼看到的最大化显 示的页面大小相应为 778像素×420像素
第3章 网页布局与版式构成
.
1
上章回顾
设计网页时,比较常用的颜色模式有RGB和Indexed两种颜色模 式。
网页安全色是指以256色模式运行时,在不同硬件环境、不同 操作系统、不同浏览器中都能够正常显示的颜色集合,其中有 216种常见颜色被称为网页安全色。
网页配色时可以遵循鲜明性、独特性、协调性、联想性、艺术 性等五大原则。
网页色彩按表现功能划分为主色调、辅色调、点睛色和背景色。 其中页面中的主色调起到主导作用,辅色主用于烘托和支持主 色调,之后再用点眼色突出主题。
在对网页进行配色时,可以采用色相配色、标准色配色、渐变 色配色等方法。
.
2
本章进阶
了解网页的基本元素 理解网页重要元素的表现形式 掌握网页的布局结构 掌握网页的构成要素
.
19
页面布局结构
网页布局——确定网站首页和其它页的结构形式
栏式结构 将页面信息划分为若干列 ❖ 一分栏(通栏) ❖ 二分栏 ❖ 三分栏 ❖ 四分栏
…… 区块结构 利用辅助线、图形、色块等把页面划分为若干区块 其它结构
❖ 国字型 ❖ 拐角型 ❖ 标题正文类型 ❖ 框架类型
.
20
栏式结构
三二分分栏栏结结构构三简部练分大的方宽、度个可性以鲜任明意,调页整面,区对域于划信分息清量晰大便、于内查容阅繁。多分的栏 网的四站宽分非度栏常可结适以构用均适。等合,信也息可标以题左短宽小右精窄炼或的是网左站窄,右分宽栏。宽度可以灵活调整。
.
26
网页中的点
性在,空如那当白果么点区视大的域量觉数中的的量,焦点很点点中多是有将时视个会,觉集别浏的点中览焦于具者点这备的,了些注给颜点意人。色力的、就视大会觉小被感、分受变散尤化。为等强差烈异。
.
27
网页中的点
聚集点形成的连点续阵点、本阵规身的律与疏排周密列围能的背产点景生可环强以境烈产疏的生密空节的间奏强感感烈。和反韵差律,感更。容易吸引视线。
.
24
网页布局
掌握已有结构模式的规律和特点,使用时灵 活组合,便会产生无尽的变化。
布局是设计思想的具体体现,是一种“活” 的灵魂,设计中要注意不囿于固有模式。
.
25
网页构成
点、线、面是平面构成的主要组成元素,也 是构成网页的基本视觉元素。 网页中的点 造型的基本要素 连续的点可以产生线的感觉 临近点的集合给人一种虚面的感受 大小排列分布的点形成空间感
.
网站导航
17
按钮导航条
绘制底色 绘制单个按钮
绘制颜色块
输入文字并保存文件
.
演示
18
网页文字
文字是传达数据和信息的重要载体,是网页 中的重要组成元素。 文字字体选用不宜过多 字体风格与网站整体风格一致 特效字体应遵循美观、醒目、易于识别的原则
文字成为构成文页本面标的题主与体正,文同应时有兼字具体导与航字的号作的用变,化风格十分独特。
.
30
网页中的曲线
的特曲点封线,闭其变的化转线形折条变式形化多成样还一,具个有细面视线,线精此导致时向、的的锐线作利具用,有。粗突线出则、更美具化浑形实的、效敦果厚。
.
31
网页中的面
平面构成中最大的元素 注重形状和面积的对比 大量密集的点和封闭的线都可以形成面
.
32
网页中的面
不圆规形则面形的状视可觉以效衍果生鲜出明千、变强万烈化,的可图以案看和做创是意一,个这点给放页大面后的设形计 态 带,来很了容 广易阔吸的多引创边视作形线空面。 间使。页面显得简洁明快、干净利落。
相关主题