网站制作中排版的最佳做法

环顾互联网，并注意排版在各个方面如何绝对主导着网站制作。毕竟网站制作有95％的版式是有原因的。当你考虑它时，这是一个有意义的世界。互联网是关于内容的，内容是指文字和文字。这意味着排版。精明的网站制作师知道这一点，因此将投入大量的思考和思考，以便在他正在工作的任何网站上正确排版。为了使类型既实用又吸引读者，他在计划站点的信息体系结构时必须考虑很多不同的因素。哪种字体最易读？读者容易浏览哪些字体？那清晰的字体呢？ 由于所有这些问题和考虑因素，初次尝试为网站钉上字体并不容易。但是我们在网上进行了搜索，发现Smashing Magazine的这项开创性研究成为了目前的最佳排版实践，至少可以说令人大开眼界。我们已对这些数据进行了深入研究，本期高端网站制作公司Angle为大家带来网站制作中排版的最佳做法。 1、标题 网站副本中的标题可以说非常重要，因为令人沮丧的研究表明，大多数人只在Internet上阅读标题。如果用户的行为使许多读者甚至不喜欢正文，那么你就必须使标题的字体特别醒目，以吸引他们的注意力并说服他们进一步阅读。根据前面提到的Smashing Magazine从2013年开始的研究，标题几乎是无衬线字体和衬线字体之间的纽带，其中51％的标题使用无衬线字体，而超过47％的标题使用衬线字体。衬线字体在最近几年变得越来越流行，这主要是由于人们认为衬线字体在头条新闻中脱颖而出，并为站点访问者提供了可读的结构。在流行度问题上，标题的两种最受欢迎的衬线字体是Georgia和Chaparral Pro，而标题的两种最受欢迎的sans-serif字体是Arial和Freight Sans Pro。虽然你当然可以在网站上用自己的字体试验标题，但请注意，这些字体的流行是由于读者的积极反馈。 2、内容 网站的正文构成了内容的最重要部分，即使阅读内容的人少于网页上的实际标题和标题。与标题中的Sans和Sans-Serif字体之间的紧密联系不同，在正文复制方面，明显的赢家是衬线。根据同一项研究，多达61.5％的网站在正文中使用衬线字体，但仅有微不足道的网站中有36.5％的人使用无衬线字体。让我们看一下它如何进一步分解。用于主体复制的最常用的衬线字体是Georgia和Chaparral Pro，几乎可以反映标题的比例。在sans-serif前端，用于正文复制的最常用sans-serif字体是Arial和Helvetica。 3、有趣的笔记 值得注意的是，该研究还确定了当前大多数网站都没有使用任何标准字体作为其主要字体。研究中查看的网站中大约有39％的正文和标题中的66％没有使用标准字体。这一令人惊讶的发现的一个理论是，像Fontdeck和Typekit这样的服务使品牌以前所未有的独特方式与竞争对手区分开来。这是所有这些的要点，是的，你可以放心地使用它并选择一种“不威胁”的标准字体，但是许多网站都大胆地反对这样做。他们发现，只要他们的网站访问者和读者不伤及网站上的用户体验，他们就会非常喜欢非常规字体。 4、背景资料 不言而喻，网站制作中受人欢迎的背景是能使其文字形成鲜明对比的任何颜色。这自然使站点访问者更轻松地更有效地阅读副本，从而提高了可读性。Smashing Magazine的研究发现，大多数网站更喜欢采用暗光布置。这意味着在浅色背景上的深色文本。但是，当前对于印刷状态要指出的真正重要的一点是，暗光设置的苛刻程度已经降低。例如某些网站正在尝试使用深灰色的米色背景上的文字。在这种方案中，对比度不太明显，但仍为读者提供舒适的阅读体验，有助于轻松扫描每一行。毫不奇怪，当涉及到正文复制时，在白色背景上使用黑色文字的最喜欢的方式仍然是黄金标准。除了因清晰的对比而易于阅读外，黑白效果还可以追溯到报纸上的经典彩色格式，这也解释了其在互联网正文中的广泛流行。 5、标题的字体大小 至少就网络头条而言，趋势肯定越大越好。目前标题的字体大小是38像素。自Smashing Magazine于2009年进行最后一项研究以来，实际上增加了10个像素！显然，为了吸引主要阅读标题的用户，越来越多的网站不得不诉诸增加标题像素的大小。如果你感到好奇，BootstrapBay的博客在标题上使用Roboto字体，标题为28像素，标题为24像素，正文为16像素。但是应该指出的是，标题中最常用的字体大小范围是20到32像素，这使BootstrapBay的博客打点数处于流行状态的中间。 6、正文的字体大小 正文与标题是不同的野兽，因此正文的典型字体大小要小得多也就不足为奇了。但是即使对于主体复制，也有一个事实是：字体大小变大的总体趋势。在这项研究中，几乎相同数量的网站使用14和16像素进行正文复制。与Smashing Magazine于2009年进行的网络排版研究相比，这值得注意地增加了两个像素大小，因为那时大多数网站仅使用12和14像素进行正文复制。同样，BootstrapBay的博客是与时俱进的版式最佳实践的完美示例：我们在博客上使用16像素作为正文副本。标题与正文字体大小最常用的比率（如经常重复）为2.5。基本上，你需要获取标题的像素大小，然后将其除以正文副本的像素大小即可获得所有重要的比例。 7、主体复制最佳线长 一般来说，规则是，较长的线长应等于较高的线高。当你将正文副本的字体大小乘以1.46时，你将获得网站的最佳行高。然后你可以使其适应字体样式。当你使用此产品并将其乘以24.9时，你将获得网站的最佳行长。但是请不要忘记，任何有效的布局都需要考虑边距，填充和装订线，以免显得过于混乱。 8、每行多少个字符？ 重要的是，每行字符数必须达到该最佳点，以使你的网站看起来美观。研究发现，当今大多数网站在宽屏分辨率下实际上平均每行83.9个字符。为什么会这样呢？设计人员可能会寻求平衡字体大小与窄显示屏中显示的文本数量之间的平衡。如果将字符数增加到超出此平均值，则将导致阅读困难，因为字体大小必须减小以适应每行的字符数。如果将字符数增加到超出该平均值太多，则可能会导致正文副本显示得太小；减少过多的字符数，则冒着使正文复制膨胀到更接近标题和标题尺寸的风险。 9、响应式排版 以下是一些喜讯，这些喜讯会让喜欢在不同平台上浏览网站的人感到高兴：研究中42％的网站具有响应式排版。虽然理想情况下该数字应该接近100％，但是当你考虑到响应式设计只有大约四年的历史时，这的确还不错。当浏览器大小更改时，有42％的受测试网站具有某种扩展形式。其中包括次要和主要更改，范围从图像缩放以适应新的浏览器宽度，到菜单被图标替换，并且多列转换为单列。其他没有响应的网站则依赖于移动应用程序或移动网站。但是，从用户的角度来看，强迫用户首先下载应用程序或访问单独的移动网站比仅在浏览器中适当调整所有内容的位置更加不便。时间会证明用户是否会继续忍受。 好的，现在你知道当今的网站制作排版情况。当然网站制作的趋势经常且迅速地变化，但是该研究数据表明某些趋势非常一致且可靠。例如：标题和正文的字体大小不断变化。此外越来越多的网站也变得反应灵敏，你可以期望42％的网站在接下来的一两年内轻松攀升。 作为网站制作师，你知道排版对于用户友好，美观且功能全面的网站有多么重要。尽量不要被所有的图像，新的设计趋势以及诸如此类的东西所困扰。归根结底，实现用户友好的字体等基础仍然是网站制作的最重要方面。 这是阅读本指南后应该保留的版式最佳实践： 标题使用衬线字体和无衬线字体的百分比大致相等 正文使用的衬线字体比无衬线字体更多 非标准字体在网站上占主导地位 背景仍然在暗光配色方案下运行 标题和正文的字体大小不断增加 每行不超过84个字符 只有不到一半的网站具有响应式排版 我们希望我们启发你在下一次为新客户设计网站时真正考虑字体的选择。排版是不应该匆忙的事情，当你牢记这些最佳实践和用户体验时，结果可能会很出色。本期高端网站制作公司就为大家分享到这里。

转载请保留出处及原文地址:/index.php?r=article/Content/index&content_id=1831