《网页美工设计Photoshop+Flash+Dreamweaver从入门到精通》——1.5 文字与图像版式设计...

本文主要是介绍《网页美工设计Photoshop+Flash+Dreamweaver从入门到精通》——1.5 文字与图像版式设计...,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

本节书摘来自异步社区《网页美工设计Photoshop+Flash+Dreamweaver从入门到精通》一书中的第1章,第1.5节,作者: 安道通 更多章节内容可以访问云栖社区“异步社区”公众号查看。

1.5 文字与图像版式设计

网页美工设计Photoshop+Flash+Dreamweaver从入门到精通
文本是人类重要的信息载体和交流工具,网页中的信息也是以文本为主。虽然文字不如图像直观形象,但是却能准确地表达信息的内容和含义。在确定网页的版面布局后,还需要确定文本的样式,如字体、字号和颜色等,还可以将文字图形化。

1.5.1 文字的字体、字号、行距
网页中,中文默认的标准字体是“宋体”,英文是The New Roman。如果在网页中没有设置任何字体,在浏览器中将以这两种字体显示。

字号大小可以使用磅(point)或像素(pixel)来确定。一般网页常用的字号大小为12磅左右,较大的字体可用于标题或其他需要强调的地方,小一些的字体可以用于页脚和辅助信息。需要注意的是,小字号容易产生整体感和精致感,但可读性较差。

无论选择什么字体,都要依据网页的总体设想和浏览者的需要。在同一页面中,字体种类少,版面雅致,有稳重感,字体种类多,则版面活跃,丰富多彩。如何布局的关键是根据页面内容来掌握相关比例关系。

变化的行距也会对文本的可读性产生很大影响。一般情况下,接近字体尺寸的行距设置比较适合正文。行距的常规比例为10:12,即字用10点,则行距用12点,如图1-14所示,否则行距太小字体看着很不舒服,而行距适当放大后字体感觉比较合适。


92c46b3d430c570ae3fa1605d6b206602ac6098f

行距可以用行高(line-height)属性来设置,建议以磅或默认行高的百分数为单位,如20pt或150%。
**
1.5.2 文字的图形化**
所谓文字的图形化,即把文字作为图形元素来表现,能起到强化原有功能的作用。作为网页设计者,既可以按照常规的方式来设置字体,也可以对字体进行艺术化的设计。无论怎样,一切都应该围绕如何更出色地实现自己的设计目标。

将文字图形化,以更富创意的形式表达出深层的设计思想,能够避免网页的单调与平淡,从而打动人心,图1-15所示为图形化的文字。


7462b01ca30500769adbc86f9cda50802c8c0401

这篇关于《网页美工设计Photoshop+Flash+Dreamweaver从入门到精通》——1.5 文字与图像版式设计...的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/265462

相关文章

OpenCV图像形态学的实现

《OpenCV图像形态学的实现》本文主要介绍了OpenCV图像形态学的实现,包括腐蚀、膨胀、开运算、闭运算、梯度运算、顶帽运算和黑帽运算,文中通过示例代码介绍的非常详细,需要的朋友们下面随着小编来一起... 目录一、图像形态学简介二、腐蚀(Erosion)1. 原理2. OpenCV 实现三、膨胀China编程(

Spring Boot + MyBatis Plus 高效开发实战从入门到进阶优化(推荐)

《SpringBoot+MyBatisPlus高效开发实战从入门到进阶优化(推荐)》本文将详细介绍SpringBoot+MyBatisPlus的完整开发流程,并深入剖析分页查询、批量操作、动... 目录Spring Boot + MyBATis Plus 高效开发实战:从入门到进阶优化1. MyBatis

使用Python实现获取网页指定内容

《使用Python实现获取网页指定内容》在当今互联网时代,网页数据抓取是一项非常重要的技能,本文将带你从零开始学习如何使用Python获取网页中的指定内容,希望对大家有所帮助... 目录引言1. 网页抓取的基本概念2. python中的网页抓取库3. 安装必要的库4. 发送HTTP请求并获取网页内容5. 解

Python使用DrissionPage中ChromiumPage进行自动化网页操作

《Python使用DrissionPage中ChromiumPage进行自动化网页操作》DrissionPage作为一款轻量级且功能强大的浏览器自动化库,为开发者提供了丰富的功能支持,本文将使用Dri... 目录前言一、ChromiumPage基础操作1.初始化Drission 和 ChromiumPage

Python FastAPI入门安装使用

《PythonFastAPI入门安装使用》FastAPI是一个现代、快速的PythonWeb框架,用于构建API,它基于Python3.6+的类型提示特性,使得代码更加简洁且易于绶护,这篇文章主要介... 目录第一节:FastAPI入门一、FastAPI框架介绍什么是ASGI服务(WSGI)二、FastAP

使用Python开发一个图像标注与OCR识别工具

《使用Python开发一个图像标注与OCR识别工具》:本文主要介绍一个使用Python开发的工具,允许用户在图像上进行矩形标注,使用OCR对标注区域进行文本识别,并将结果保存为Excel文件,感兴... 目录项目简介1. 图像加载与显示2. 矩形标注3. OCR识别4. 标注的保存与加载5. 裁剪与重置图像

基于WinForm+Halcon实现图像缩放与交互功能

《基于WinForm+Halcon实现图像缩放与交互功能》本文主要讲述在WinForm中结合Halcon实现图像缩放、平移及实时显示灰度值等交互功能,包括初始化窗口的不同方式,以及通过特定事件添加相应... 目录前言初始化窗口添加图像缩放功能添加图像平移功能添加实时显示灰度值功能示例代码总结最后前言本文将

Python中的可视化设计与UI界面实现

《Python中的可视化设计与UI界面实现》本文介绍了如何使用Python创建用户界面(UI),包括使用Tkinter、PyQt、Kivy等库进行基本窗口、动态图表和动画效果的实现,通过示例代码,展示... 目录从像素到界面:python带你玩转UI设计示例:使用Tkinter创建一个简单的窗口绘图魔法:用

网页解析 lxml 库--实战

lxml库使用流程 lxml 是 Python 的第三方解析库,完全使用 Python 语言编写,它对 XPath表达式提供了良好的支 持,因此能够了高效地解析 HTML/XML 文档。本节讲解如何通过 lxml 库解析 HTML 文档。 pip install lxml lxm| 库提供了一个 etree 模块,该模块专门用来解析 HTML/XML 文档,下面来介绍一下 lxml 库

Spring Security 从入门到进阶系列教程

Spring Security 入门系列 《保护 Web 应用的安全》 《Spring-Security-入门(一):登录与退出》 《Spring-Security-入门(二):基于数据库验证》 《Spring-Security-入门(三):密码加密》 《Spring-Security-入门(四):自定义-Filter》 《Spring-Security-入门(五):在 Sprin