浅析网页设计中的文字编排与版式设计发布者：本站     时间：2020-05-02 14:05:20

本文主要围绕网页设计中的视觉设计谈对网页设计的设计理念和方法。通过对网页设计的中的视听元素和版式设计的分析，找到网页设计的特点、布局的设计理念和设计风格。

网页设计，以图形用户界面设计和交互设计为特点的设计系统，网页的输出端主要是电脑端和移动终端。网页的艺术设计内容，可以划分为两大类：多媒体设计元素及版式设计。在分析研究这两向内容的基础上探索网页设计的方法和规律。网页设计中的多媒体设计元素主要包括：图标、图像、表格、色彩、导航、音乐、视频影像、背景、交互按钮、文本信息、链接等。所谓网页的版式设计，是在有限的屏幕空间上将视听多媒体元素进行有机的排列组合，它在传达信息的同时，也产生感官上的美感和精神上的享受。

一、网页设计中的文字编排

(一)文字段落编排——网页中的字体

网页中行距、字距的合理安排可以使用户在浏览时更为清晰迅速的查找信息，文字字体、字号所形成的节奏和美感也是设计时要考虑的因素。因为屏幕浏览的特性，正文的中文字体一般最常选用宋体和黑体，也可选用等线体、细圆体等清秀端庄的字体。选择有衬线体要比较慎重，字号较小的情况下会产生视觉错视，就好像字体周围有模糊的像素点，影响用户阅读。衬线字体因为在笔画的起落处具有装饰线脚，在屏幕端显示效果不是那么的好。在网页界面设计中，衬线字体可以适当的应用在标题字的设计中，让标题更具有美感。

(二)文字段落编排——CSS样式设计

篇、章页字体注意变化，按照章节层次字号大小按一定的顺序选定。使读者阅读起来感到结构分明、条理清楚。每个层次不同的字体在统一中不乏变化，丰富视觉意味。在网页制作时采用CSS技术，可以有效地对页面的布局、字体、颜色、背景和其它效果实现更加精确的控制。

二、网页中的版式设计

(一)版式设计综述

第一页(首页)的版式以及下级页面的安排上基本上是从一而终，统一在一种格调中，这样才能构成阅读时的顺畅，形成界面整体的风格。层级页面，统一并不代表一成不变，统一中寻求变化，如果一个网站有较为复杂的层级页面，怎样拓展设计是关键。还要注意的是要根据站点地图规划好不同内容页面的区分。(比如用颜色区分，用文字版面的不同区分，用动静区分等等)。 

(二)网页色彩的搭配

色彩代表了不同的情感，有着不同的象征含义。网页配色中，忌讳的是：(1)一个网站中的色彩不要过于混乱，根据网站的主题内容定义色彩体系，在统一中找对比。(体系化)。(2)背景和文本信息的对比尽量要大，不要用繁复的图案图形作背景，以免影响到文字的识别性。

(三)网页中的布局理念——功能优先原则

网页布局大致可分为国字型、左右布局及上下布局型、大背景封面型等。国字型是一些门户类网站常见的布局方式，上面是网站的主导航及搜索区块，通栏的滚动广告栏，中部是网站当前页面的主要内容，左侧通常会放置二级导航栏，右侧会放一些超链接或者其他功能模块，最下面是网站的一些基本信息、联系方式、版权声明等，这种结构是我们在网上见到的差不多最多的一种结构类型。左右布局及上下布局：左右布局是以左右为分别两页的框架结构，一般左面是导航链接，右面是当前页面内容区。有一些企业网站喜欢用这种布局设计，我们见到的大部分的大型论坛都是这种结构的。这种类型结构非常清晰，检索方便，层级结构清晰有条理。上下布局是以左右为分别两页的框架结构，一般上面是导航链接，下面是当前页面内容区。大背景封面型：这种类型基本上是出现在一些网站的首页，大背景能够更好地渲染饿网站的气氛，具有很好地沉浸感，这种类型的首页使用的比较多，适合首页内容容量较少的页面。那么什么样的布局是最好的，要具体情况具体分析：(1)国字型适合网站信息比较多，页面容量较大的门户类网站。(2)左右布局及上下布局型是比较常见的网站布局模式，但容量相对于国字形要少一些，但布局合理便于浏览。(3)大背景封面型比较适合展示企业形象或这信息较少的极具个性化的个人主页。在这种类型中合理的加入交互动态型可以达到很好的用户体验，好的交互大大丰富了网页，但是它不能表达过多的文字信息。但动态及视频较多的网站也有更新比较麻烦，加载比较慢也的缺点，我觉得可以在页面中局部使用交互动画增加界面的沉浸感。

对用户来说，网页设计的目标是带来“成功且令人满意的体验”，成功就是指用户能高效的完成任务，令人满意是指这一过程是愉快的，而不仅仅是满足功能性需求，这种愉快可以表现为视觉上的愉悦，审美的享受。