设计网页的文字应该注意什么问题
当你的网页文本内容中使用超过3种完全不同的字体的时候，会让网站显得结构紊乱和不专业。太多字体和复杂的样式都会对布局产生影响。下面介绍设计网页的文字应该注意什么问题，希望对您有帮助。
1、控制字体数量
当你的网页文本内容中使用超过3种完全不同的字体的时候，会让网站显得结构紊乱和不专业。
太多字体和复杂的样式都会对布局产生影响。
为了阻止这种情况的发生，尽量控制字体类型的数量是很有必要的。
一般说来，限制字体数量是一种非常有用的方法（最多两种字体，通常一个字体能够搞定绝大多数的排版），在整个网站设计中坚持使用一种字体能够带来足够一致的体验。如果你需要使用两种，甚至更多的字体，那么请确保这几种字体族之间能够互相补充、互相搭配。以下方四个字体为例，四个字体当中Georgia和Verdana在字体的大小、宽度上都比较接近，两者构成和谐的搭配。相比而言，右侧的两款字体Baskerville和Impact如果搭配在一起就很不合适了，Impact过于厚重，而Baskerville的衬线也过于突出。
2、尝试使用标准字体
诸如Google web Fonts和Typekit这样的在线字体服务能够为你推荐许多新鲜有趣的字体，意想不到字体设计，在很多场合能够给用户带来新鲜的体验。在使用上，也确实非常方便，比如Google Web Fonts是这么用的：
选一款你喜欢的字体，比如Open Fonts
生成代码，贴到HTML文档的标签中·完成！
这种操作其实和把大象放到冰箱里面一样简单。
那么，到底问题出在哪儿呢？
首先，你是选取的漂亮字体并不是谁的电脑里面都会有的，最前先的例子是，Windows电脑中的微软雅黑并不是Mac的标配字体，如果你的网页中使用了微软雅黑，它会在Mac电脑中以苹方来显示。你挑选的字体并非普遍存在的，最终会以另外一种样子呈现在别人的屏幕上，用户熟悉的还是那些标准的、常见的字体，最安全的英文字体始终都是Arial、Calibri、Trebuchet等字体。良好排版实际上只是基础，吸引人的始终是漂亮整齐的布局和优质的内容，而非字体本身。
3、控制每行内容的长度
每行文本的字符数，其实直接影响着内容的可读性。正如同Baymard通过研究所发现的那样：
“如果你想拥有良好的阅读体验，将每行文字控制在大概60个字符左右，这个字符数量能够让你的内容拥有恰到好处的可读性。”
如果文本太短，用户的内容扫视频率会过高，经常会打破阅读的节奏，而如果太长了，用户会很难持续的保持高专注度的阅读。
在移动端上，每行文字应该控制在30~40个字符之间，这也符合目前的用户使用习惯和阅读体验。参考下面的对比图，可以看出，40~60个字符数通常能够取得最佳的阅读体验。
在网页设计中，通常使用em和px来控制文本块的宽度，借此来控制每行的字符数量。
4、选择各种尺寸下都能良好显示的字体
用户注定是要通过不同的设备来访问你的网站的。绝大多数的用户界面需要使用到大小不一的文本元素来作为支撑，正文，标题，按钮标签，表单，等等等等。你所选择的字体，应该在不同的尺寸、不同字重的情况下，都能具备良好的可读性。
最值得参考的是目前几个主流的平台自主设计的字体族，比如Android上的Roboto，苹果全系列的通用英文字体San Francisco 。
当字体够大的时候，可识别性的问题并不明显，当它在小屏幕上呈现内容的时候，可识别度的问题就很显著了。比如下面的Vivaldi字体，虽然很漂亮，但是当尺寸小的时候，可读性就明显不足了：
5、使用易于识别的字体
由于英文字体本身的几何特征，许多字体在设计的时候，稍不注意就会让用户难以识别，尤其是字母“i”和“L”，字母“r”、“n”和“h”，在选择字体的时候，应该特别注意这方面的问题，确保不会在这些基本的问题上，给用户造成困扰。
6、避免全部大写的情况
其实在英语言国家的网站中，使用全部大写的文本，是一个特别典型的设计上的忌讳。正如同Miles Tinker所说，全部的段落都使用大写字母，和小写字母相比，可读性有着明显的降低，直接反映在用户身上，就是文本的阅读速度明显降低了。
7、注意控制行高
在排版中，Leading，也就是行高，是一个非常常见的重要概念。在排版设计当中，行高也是很值得关注。换个更容易理解的概念来阐述这件事情，行间距，正常情况下，行间距应该是文本高度的30%，这样能够确保视觉上的清晰易读。
Dmitry Fadeyev发现，段落之间的间距如果控制好了，整个阅读效率能够提升20%。这样的布局能够让文本转化为用户更容易消化的内容，剥离无关的细节。
8、确保色彩对比度合理
文本和背景应该有足够的对比度，文本越明显，用户就越能快速清晰地获取其中的信息。按照W3C的建议，文本和背景的对比是有规则的：
较小的文本应当确保至少和背景之间有4.5:1的对比度比率
较大的文本（14pt粗体，18pt常规）应当确保和背景之间的对比度超过3:1
对比度不足的时候，几乎无法进行阅读
这些符合对比度的规范，易读性不错
一旦你确定了配色，需要在尽可能多的设备上进行测试，让不同的用户来查看效果，尽量避免出现可读性的问题。
9、避免使用红色和绿色的文本
红绿色盲是最常见的视力障碍之一，通常使用彩色的文本而是用来区分重要信息的，但是红绿两色则可能会失去视觉传达的功能。即使只使用红色，有尽量搭配其他的区分方式。
10、避免使用闪烁的文本
闪烁的文本确实能够引起用户的注意力，但是它存在的最大问题是让人觉得不适，甚至会引起特定用户的癫痫类疾病。讨厌且令人分心的闪烁文本，无论从哪个角度上来看，都是得不偿失的设计失误。
UI设计和网页设计的区别是什么
UI设计师看重的是整体的造型能力，看重图形创意功底和用户交互体验设计。网页设计师看重的是版式编排能力，看重版式框架掌控和视觉流程的把控。这是两个设计岗位的核心差别。
UI设计更多的针对的是小屏用户，即手机、平板电脑等触控方面的设计。所以要求对于交互体验要有较深的了解，能揣摩用户的操作习惯，并根据这些做相相应的界面设计、流程规划等。在UI设计中除了与网页设计中相似的界面设计之外，还有很大一部分工作是对于软件的图形设计，比如说APP的LOGO，界面中的ICON等。对于这方面的设计，除了要有很强的图形创意功底之外，对于细节的把控也是重中之重。因为对于小屏设计来说，可能就是一两个像素点上来求精致，因此UI设计师对于细节的深挖能力很重要。
并且UI设计师要能紧跟设计风潮，比如说之前苹果带动的拟物化的设计，就要求UI设计师有很强的写实描画能力。而后期流行的扁平化设计风格，就要求UI设计师有较好的图形概括能力。
网页设计更多是针对于大屏用户，在电脑端来浏览网页的。所以网页设计要求要有很好的页面布局能力，也就是说版式编排能力。因为要考虑到网页的浏览规律，所以在网页设计中，对于视觉流程的掌握要求很高。
在网页设计中，不存在太多的图形创作，并且整格版式的视觉效果要超过对于细节的刻画。因此相对来说，网页设计在某些方面难度低于UI设计。
其实UI设计和网页设计的区别并不太大，很多的UI设计师就是从曾经的网页设计师转行过去的。而且相信随着移动端的用户越来越多，UI设计师的工作也会越来越被重视。
区别一，UI设计是一种全面创新的设计模式，能够让我们看到在现在的网络设计会给我们很多的创意产生，而UI设计能够从用户所使用的各个终端和APP以及网站上呈现出值得让人期待的设计成果，这些都是现如今的市场需求，能够让我们看到新的生机产生。而网页设计就只是单纯的网页方面的设计方式，让我们感觉到的也是网页方面的不同效果展现，最终体现出的也是各个网站在独立页面上的成果。
区别二，UI设计是现在新出的一种设计方式，而且也是学校里新兴的一类专业，能够让我们体会到UI设计带给自己的思路有很多，而且大家都能从这些问题里体会到设计者在其中所做出的各种努力。但是网页设计却是会从单纯的方面去了解到之前所用过的一些设计灵感，并且能够从具体的方式来呈现网站本身的一些作用和价值。
网页制作常见问题的处理分析
1、选取软件
软件多种多样，具体了解各种软件的基本性能，选择一个合适的软件这一问题便迎刃而解。诸如Microsoft Frontpage 2000或是Adobe Pagemill 3.0等软件，相对于涉网页制作不深，不必浪费巨大的精力和功夫就想完成网页制作的初学者而言就非常适合。这类软件简便易行且拥有强大的性能，虽说制作出的网页相对于熟稔者显得简单许多，但很是适合循序渐进，逐步扩深，以掌握更多的专业性知识和技能。
基于初学者之上，掌握了基本的操作技巧的制作者，就应当选择一个比较高端的软件。譬如Dream Weaver、HotDog Professional 5等，使用这类软件制作过程就加入了更深层次的技术，提供了高端的向导工具，不同于以上所提过的较简单工具，这类软件的工作界面随心选取，或简或繁，图片文本等均可自动转化为支持的格式，功能强大。
2 、凸显风格
网页风格的凸显塑造，通俗来讲，就是能够吸引浏览者眼球，使浏览者有浏览下去的欲望，通俗而言，即制作出的页面新颖有创意。整体规划时，切忌文字排版紧实，否则猛眼看去就觉得内心堵塞，试想一篇看上去就能给人添堵的文章，会给网页整体效果带来多大困扰；考虑到人物或是风景的大小，切忌过大造成删减，切忌过小造成画面不匀称不清晰，造成主次不分，更甚喧宾夺主；目的在于突出重点是，希望被关注的点可以用动态闪烁，切忌布满画面的都是星星点点，造成视觉眩晕不说，还让人摸不着方向，看不到主题，找不到所要表达内容的重点；主张“T”型布局，必须主次得当，有明显的界限，结构一目了然等。 2.3色彩协调
色彩的协调尤为重要。于日常生活里，色彩的搭配常常能够影响一个人的心境，进而影响心情。一个人对于某个色彩的偏好或憎恶也大都能反映一个人的性情。色彩不同，明显能够造成不同的心理感受。下面简析通常而言，几类色彩对人折射出的感觉：红色一般象征热情，很醒目，只是如果运用不当甚至杂乱无章，极易表现出焦躁之意，一眼看去，极易搅得心烦意乱，搅乱了原本的兴致；绿色通常亮丽鲜活，予人恬雅宁静之感，通常表现生命力；黑色表现庄重，严肃，也表现出惊悚或者让人不安的情愫；白色表现恐怖，圣洁或者纯洁，无瑕等；蓝色能显示智慧的感觉；紫色表现高贵或者忧郁等。一般颜色种类过多会显得花里胡哨，给人一种特别随意嘻哈不在乎的感觉，种类太少又会土里土气，单调没有生机。总之，慎重比对，合理协调，让颜色的搭配既不失活泼，又庄重得体。
4 、图文设计
顾名思义，图文设计就是对于图片和排版的设计。一般情况，在网页制作中，通过巧妙利用颜色和字体变化来增强网页感染力，凸显美感。关于文字设计，要注意，在一个特定版面里，字体格式不要太多样化，一般一篇文章，字体格式不要超过四种，乍眼看去极乱极杂，不大气还失庄严；标题建议使用H1或H3字号，分明表现出来；文字编排合理利用段落格式排列；切忌与背景色冲突或者接近，读者会因此反感，心生乏意等。关于图片，相关图片主题要凸显，纯粹起美化作用的图片要小而精致，同文字一样，图片主体的色彩与背景色的明度必须有所区分凸显，否则容易使得与背景色折射出几近的光，不仅对视力不好，还容易让人觉得乏力，没有浏览下去的欲望。
5 、分辨率
关于分辨率，通俗的讲，就是指在同一显示器，分辨率的大小决定了可视面积的大小和精细的程度。对于分辨率这一问题的处理，是一个相对简单的操作项目，通过属性，就能进行分辨率设置，常规情况，一般使用设置为（800*600)或是（1024*768)的清晰程度，这两个规格的缩放比例基本上是可以满足浏览者的需求的，因网页性质，慎重比对，合理选取。
6、文件命名
大部分情形，由于文件进行了重命名操作，文件因此造成格式不对，造成文件打不开或者无法正常浏览，鉴于这类问题的分析，显然是因为随意重命名造成了源文档变化，其实，改为英文名这类问题称便迎刃而解，例如，用date替代日期表，background替代背景色，容易辨认，还一目了然，格式无误。
