网页设计几大要素
文本是网页中的主要信息，在网页中可以通过字体、字号、颜色、底纹以及边框等来设置文本属性。下面介绍网页设计几大要素，希望可以帮助到大家。
一、框架
框架是网页的一种组织形式，将相互关联的多个网页的内容组织在一个浏览器窗口中显示。例如，我们可以在一个框架内放置导航栏，另一个框架中的内容可以随着单击导航栏中的链接而改变，这样我们只要制作一个导航栏的网页即可，而必将导航栏的内容复制到各栏目的网页中去。
二、文本
文本是网页中的主要信息。在网页中可以通过字体、字号、颜色、底纹以及边框等来设置文本属性。这里指的文字是文本文字，而并非图片中的文字。在网页制作中，文字可以方便地设置成各种字体和大小，但是这里还是建议，用于正文的文字不要太大，也不要使用太多的字体，中文文字使用宋体、9磅或者12、14像素左右即可。因为过大的字在显示器中显示时线条的显示不够平滑、颜色也不要使用得太过复杂，以免造成影响用户视觉。大段文本文字排列，建议参考一下优秀的报纸杂志等。
二、图片
今天看到的丰富多彩的网页，都是因为网页中有了图象，可见图象在网页中的重要性。用于网页上的图片一般为JPG和GIF格式的，即以.jpg和.gif为后缀的文件。
四、超链接超链接是整个网站的通道，它是把网页指向另一个目的端的链接。
例如指向另一个网页或相同网页上的不同位置。这个目的端通常是另一个网页，但也可以是图片、电子邮件地址、文件、程序，或者也可以是本阿谀的其他位置。超链接可以是文本或者图片。超链接广泛的存在于网页的图片和文字中，提供与图片和文字相关内容的链接。在超链接上单击鼠标左键，即可链接到相应地址(URL)的网页。有链接的地方，鼠标指到光标会变成小手形状。可以说超链接正是Web的主要特色。
五、表格是网页排版的灵魂。
使用表格排版是网页的主要制作形式之一。通过表格可以精确的控制各网页元素在网页中的位置。表格并非指网页中直观意义的表格，范围要更广一些，它是HTML语言中一种元素。表格主要用于网页内容的排列，组织整个网页的外观，通过在表格中放置相应的内容，即可有效的组合成符合设计效果的页面。有了表格的存在，网页中的元素得以方便的固定在设计位置上。一般表格的边线不在网页中显示。
六、表单
表单是用来收集站点访问者信息的域集。站点访问者填写表单的方式是输入文本、单击单选按钮与复选框，以及从下拉菜单中选择选项。在添写好标单之后，站点访问者便送出输入的数据库，该觳觫句哭就会根据所设置的表单处理程序，以各种不同的方式进行处理。
七、动画
动画是网页上最活跃的元素，通常制作优秀、创意思、出众的动画是吸引浏览者的最有效的方法。但太多的动画让人眼花缭乱，无心细看。这就使得对动画制作的要求越来越高。通常的制作动画的软件有flash、web animator等。Macromedia的flash虽然出现的时间不长，但已经成为了最重要的Web动画形式之一。Flash不仅比htm易学得多，而且有很多重要的动画特征，如关键桢补间、运动路径、动画蒙版、形状变形和洋葱皮效果等。利用这个多才多艺的程序，不仅可以建立Flash电影，而且可以把动画输出为QuickTime文件，GIF文件或其他许多不同的文件格式(PICT、JPEG、PNG等)。
八、其他
网页中除了这些基本元素外，还包括横幅广告、字幕、悬停按钮、日戳、计数器、音频及视频等。
网页界面的构成要素
对于网页设计来讲，其信息内容的有效传达是通过将各种构成要素的设计编排来实现的。网页的构成要素包括文字、图形、图象、标志、色彩等造型要素及标题、信息菜单、信息正文、标语、单位名称等内容要素。
1.文字的编排与设计
文字作为信息传达的主要手段目前也是网页设计的主体，文字是网页中必不可少的元素，也是网页中的主要信息描述要素，所以网页中文字将占据相当大的面积，文字表现的好与坏将影响到整个网页的质量。网页文字的主要功能是传达各种信息，而要达到这种传达的有效性，必须考虑文字编辑的整体效果，能给人以清晰的视觉印象，避免页面繁杂零乱，减去不必要的装饰变化，使人易认、易懂、易读。不能为造型而编辑，忘记了文字本身是传达内容和表达信息的主题。
网页文字编排与设计，重要的一点在于要服从信息内容的性质及特点的要求，其风格要与内容特性相吻合，而不是相脱离，更不能相互冲突。如政府网页其文字具有庄重和规范的特质，字体造型规整而有序，简洁而大方;休闲旅游类内容网页，文字编辑应具有欢快轻盈的风格，字体生动活泼，跳跃明快，有鲜明的节奏感，给人以生机盎然的感受;有关历史文化教育方面的网页，字体编辑可具有一种苍劲古朴的意蕴、端庄典雅的风范或优美清新的格调;公司网页可根据行业性质、企业理念或产品特点，追求某种富于活力的字体编排与设计;个人主页则可结合个人的性格特点及追求，别出心裁，给人一种强烈独特印象。
在网页文字的编排与设计中，由于计算机给我们提供了大量可供选择的字体，导致字体的变化趋于多样化。这既为网页编辑提供了方便，同时也对编排与设计的选择能力提出了考验。虽然可供选择的字体很多，但在同一网页上，使用几种字体尚需精心编辑和考虑。一般来讲，同一页面上使用的字体种类最多只能有三四种。由于文本字体的显示是需要本地硬盘字体文件的支持的，所以在互联网上使用过多的字体是没有意义的。文字在视觉传达中作为页面的形象要素之一，除了表意以外，还具有传达感情的功能，因而必须具有视觉上的美感，能给人以美好印象，获得良好的心理反应。
2.图片的编排与设计
图片是文字以外最早引入到网络中的多媒体对象。网络可以图文并茂地向用户提供信息，成倍地加大了它所提供的信息量。而且图片的引入也大大美化了网络页面。可以说，要使网页在纯文本基础上变得更有趣味，最为简捷省力的办法就是使用图片。对于一条信息来说，图片对受众吸引也远远超过单纯的文字。
网络图片的特点：一个特点是图片质量不需很高。因为网络图片一般只显示于计算机的显示器上，受显示器最小分辨率的限制，即使图片的分辨率很高，颜色深度很大，我们的肉眼也经常无法把它和一幅处理过的普通图片区分开来。一般来说，分辨率为72dpi(dotperinch)是大多数图片最佳选择;另一个特点是，图片要尽量小。网络页面的图片用于网络的传输，受到带宽的限制，其文件尺寸在一定范围内越小越好。这也是适应信息高速公路的要求。文件的长度越小，下载的时间就会越短。
图片的位置、面积、数量、形式、方向等直接关系到网页的视觉传达。在图片的选择和优化的同时，应考虑图片在整体编辑计划中的作用，达到和谐整齐。要达到这样的效果，在页面图片的合理选用时，一要注意统一，二要注意悦目，三要注意突出重点，特别是在处理和相关文字编排在一起的图片时。
HTML5网站制作布局基本要素
一、 HTML5网站制作布局要素之header：描述了文档的头部区域，定义内容的介绍展示区域，通常是一些引导和导航信息，它不局限于写在网页头部，也可以写在网页内容里面，该元素旨在作为网页的一个片段或者增个页面的介绍信息的“容器”。它可以包含网站的名称、标记线、广告口号或者公司的标志。所以在HTML5中，header的使用更加灵活，你可以根据你的需要来定义和组织document结构。同样，在结构页面时，header标签一般都放在页面的顶部，但是如果你想把它放在左侧，右侧甚至底部都没有关系，标签只定义了本身在页面的角色，而不是位置。当然更具搜索引擎优化原则，重要内容最后在架构页面的时候提前。最后由于在HTML5中header属于块元素，如果我们要在大多数主流浏览器使用的话最好定义CSS。
二、 HTML5网站制作布局要素之nav：这个元素很明显是应用于创建导航或者菜单栏中的，但是关键的一点是，并不是所有在web页面的链接都要必须在nav元素内，只有那些主导航栏的链接才应该包含在该元素内。 一个网页也可能含有多个nav元素，例如一个是网站内的导航列表，另一个是本页面内的导航列表。对于屏幕阅读障碍的人，可以使用这个元素来确定是否忽略初始内容。
三、HTML5网站制作布局要素之section：于section，我们可以说相对于div的无语义，section是带有语义的div。该标签一般应用于文章的章节、标签对话框中的标签页、或者论文中有编号的部分。
四、 HTML5网站制作布局要素之aside：定义页面主区域内容之外的内容，这一元素代表的是与主要内容相关的内容，但并不属于主要内容的一部分。通常应用于引用于，侧边栏相关链接，广告等等。 根据目前的规范，元素有两种使用方法：第一种被包含在中作为主要内容的附属信息部分，其中的内容可以是与当前文章有关的引用、词汇列表等。第二种在之外使用，作为页面或站点全局的附属信息部分，最典型的形式是侧边栏，其中的内容可以是友情链接、附属导航或者广告单元等。
五、 HTML5网站制作布局要素之footer：此元素的内容是包含更多关于他的父元素的内容。footer置于body之后将可以提供有关该页面的其他的信息内容。例如网站建设着的一些信息，相关文章的链接，版权信息，文档的作者，著作权信息，链接的使用条款，联系信息等等。此元素也可以被被应用于body之中不同的段中，可以给页面中不同段一些特定的其他信息。
六、 HTML5网站制作布局要素之article：这一个元素代表的内容是显而易见的，其主要应用于主内容中。它比 section 具有更明确的语义, 它代表一个独立的、完整的相关内容块。例如，一篇博客文章中，包含用户提交的评论的 article 就应该潜套在包含博客文章 article 之中。
常见的网页设计布局及其特点
一、“同”字型
人们对信息的需求量日益增大，简短的介绍已经无法充实越来越多的浏览者的思想，所以“同”字型的网页布局应运而生，在这里收纳了不同行业不同方面的大量信息，而为了方便在众多的信息中方便浏览者寻找自己需要的信息，这类网页上方也会设置分类的标题栏，其中既涵盖了自己本网站的主题设计，也有不同商家投资宣传的广告标语，而且为了进一步强调也会在下面辅助上小标题。人们习惯于浏览一个页面的中间位置，这也使得一个页面的两侧被人们所忽略，作为仅有的宣传信息的页面，网站设计人员自然不会放过这些边边角角的位置，这里多会被填充上一些不是很重要的广告或者站内的服务人员，多数为了吸引人还会以滚动、闪动的形式出现，当然，这些不重要的弹框是可以被关闭的。
二、标题正文型
和“同”字型的页面布局不同，在这里都是简单清晰的中央分布类型，去除了繁多动态的两边弹框信息，在其他方面却没有什么不一样。这种页面布局方式，将重要的事件和一些实时动态类信息放在中上的醒目位置，将一些浏览项目的分类放到中间位置，而在底部不会安排什么重要信息，有的也只是填充了一些设计者、设计事件等信息，而在一个页面的顶端多会附有实时天气，滚动的实时动态标题等。
三、综合框架型
讲述起来这种类型的设计无非就是给人以更多“规矩”的感觉，在内容方面也是将不同重点进行相应的排列，不同的上下位置分布相应的信息，唯一有区别的就是在设计页面时将原有的白纸式页面增添了边框而已。
四、封面型
从标题里就可以看出，这种设计类型就像是大家的课本页面一样，主要的信息很少，多数需要了解的信息都会以超链接的形式出现，中间配上动态图片或者变换颜色的文字，这种类型的设计多用于表现鲜明的个人特色，目的也仅仅是单纯地吸引浏览者的眼球。
