当前位置:首页 >> 其它课程 >>

图文混排(3)


图文混排

WEB版式设计的视觉要素
主讲:赵娅琼

版式设计的视觉要素
●文字 ●图形 ●色彩

版式设计 版式设计的视觉要素 版式设计的构成要素

文字
? 文字编排的基本参数
? ? A:字体、字号、字距 B:标题与正文

? 文字编排的基本形式
? ? ? ? 左右均齐 齐中 齐左或齐右 文字绕图排列

? 文字编排的创意表达
? 文字的局部强调 ? 文字的整体编排 ? 文字的图形编排

文字编排的基本参数
? ? ? ? ? ? ? ? ? 字体:同一个版式中字体使用越多,整体性越差 字号:表述有号数制、级数制、点数制;字越小整体 性强,但太小会影响阅读。 标题:14点以上;正文:9~12点;文字多的 版面一般为7~8点; 字距、行距:字10点~行12点~字距1/10; 标题与正文: 让标题醒目:a:放大标题字体和字号;b:加粗字 体笔画,c:对标题进行创意设计; 正文:分栏3~4栏

无饰线的字体

分栏

分栏

文字编排的基本形式
? 左右均齐 ? 齐中 ? 齐左或齐右
? 左右均齐:严谨、美观 ? 齐中:视线更集中、中心更突出, 有随意轻松之感;

? 文字绕图排列

? 齐左:符合人们阅读习惯;齐右:
比较新颖。 ? 文字绕图排列:亲切、自然、生动 之感

齐中

齐中与左右均齐

齐中

齐左

齐左

文字绕图编排

左齐

文字编排的创意表达
? 文字的局部强调
? 首字放大 ? 加线 ? 衬色

? 文字的整体编排
? 矩形 ? 圆形 ? 几何形

? 文字的图形编排
? 形象文字的创意表达 ? 图文透叠与叠印 ? 文字图形化组合编排

文字局部强调——首字放大

文字局部强调——衬色

文字局部强调——加线

文字局部强调——衬色

文字局部强调——衬色

文字的整体编排——圆形

文字的图形编排——形象创意

文字的图形编排——图文透叠与叠印

图形
? 图形的裁切方式 ? 图形的面积 ? 图形的位置

? 方形图 ? 退底图 ? 出血图

? ?

大图:注目、感染力强、给人舒服、 愉悦;引导版面中心,视觉焦点 小图:简洁、精致、拘谨、静止、趣 味弱

? 中:视觉冲击力强 ? 下:下坠、压仰 ? 四角:平衡、稳定版面

图形的裁切方式——方形图

图形的裁切方式——方形图

图形的裁切方式——退底图

图形的裁切方式——退底图

图形的裁切方式——出血图

图形的裁切方式——出血图

大图

大小图

大小图编排

中图

图置下

置四角

色彩
? 色彩的感知对版面的影响 ? 色彩的版面的易读性 ? 文字、图形、色彩的综合构成

文字色彩与背景色彩
? 两者色彩尽量不要选择一致,调整 明度; ? 突出文字可以使用对比、或互补色 调整纯度、明度; ? 相同的背景加大正文与背景的对比

色彩的感知对版面的影响——优雅、都市

色彩的感知对版面的影响——清新

色彩的感知对版面的影响——古朴

色彩的感知对版面的影响——稳重、和谐

色彩的感知对版面的影响——热烈

色彩的感知对版面的影响——阳光、温暖

色彩的感知对版面的影响——饱满

色彩的感知对版面的影响——女性柔美

色彩的感知对版面的影响——理智、冷静、商务

色彩的感知对版面的影响——清爽、舒适

色彩的感知对版面的影响——梦幻、神秘

色彩的感知对版面的影响——活泼、自由

色彩的版面的易读性——明度对比

色彩的版面的易读性——明度对比

色彩的版面的易读性——明度对比

色彩的版面的易读性——明度对比

色彩的版面的易读性——纯度对比

色彩的版面的易读性——色相对比

色彩的版面的易读性——色相对比

色彩的版面的易读性

色彩的版面的易读性——白底黑字

色彩的版面的易读性——黑白 对比

增强对比度提高文字易读性

文字描边提高易读性

文字描边提高易读性

文字、图形、色彩的综合构成


相关文章:
3-1-2图文混排
3-1-2图文混排_电脑基础知识_IT/计算机_专业资料。课题 图文混排 1、编辑图片和绘制图形 2、插入剪贴画、图片和艺术字 3、文本框的使用 4、插入公式 课时 2...
实验三 图形和图文混排[1]
实验 图形和图文混排[1]_计算机软件及应用_IT/计算机_专业资料。图形和图文混排 实验步骤提示实验内容: 1. 首先请下载试验素材 word-3 原始文件 后再开始做题...
上机练习3(图文混排)
上机练习3(图文混排)_电脑基础知识_IT/计算机_专业资料 暂无评价|0人阅读|0次下载|举报文档上机练习3(图文混排)_电脑基础知识_IT/计算机_专业资料。平面设计 ...
word上机练习3===04-3图文混排和综合排版10.docx
2015-10-316:40:33 PM 第课, :图文混排和综 合排版一,图文混排 1,图形的位置 题目:对以下的图形改变位置:改为顶端靠右,四周型文字 环绕 提示:单击图形...
Word练习3-图文混排
Word练习3-图文混排_IT认证_资格考试/认证_教育专区。Word 练习 3-图文混排以下练习的文件均要保存到你的试卷文件夹中。 任务四 制作“班级板报” 打开“班报...
2-3图文混排(1)
《图文混排》教学课件 15页 5财富值如要投诉违规内容,请到百度文库投诉中心;如要提出功能问题或意见建议,请点击此处进行反馈。 2-3图文混排(1) 隐藏>> 学校 ...
第三章3节WORD图文混排
2-Word案例二:图文混排 2页 免费如要投诉违规内容,请到百度文库投诉中心;如要提出功能问题或意见建议,请点击此处进行反馈。 第3节WORD图文混排 隐藏>> WORD...
作业3图文混排
2-Word案例二:图文混排 2页 免费 图文混排练习题 3页 1财富值如要投诉违规内容,请到百度文库投诉中心;如要提出功能问题或意见建议,请点击此处进行反馈。 ...
word3图文混排和排版实验
word3图文混排和排版实验 隐藏>> 课堂练习:制作杂志封面 分享到: X 分享到: 使用一键分享,轻松赚取财富值, 了解详情 嵌入播放器: 普通尺寸(450*500pix)...
实验3-图文混排 2
2. 掌握基本标签的使用,能够图文混排页面。 编号: 班级 姓名 实验场所 学号 信息工程 图文混排 实验所用设备: 计算机 实验(训)过程或步骤:创建一个自己的文件...
更多相关标签: