浅谈网页设计中的布局工具.docVIP

浅谈网页设计中的布局工具 　　摘要:网页设计是网站建设的重点,用户不仅需要一个拥有丰富信息的网络环境,更需要一个让人赏心悦目的网络环境。如何将纷繁复杂的网络信息合理、恰当的放入网页中是网页设计者需要精通的一门技巧,也是众多网页设计爱好者们必须要思考的一个问题。该文从网页设计中有哪些布局工具,它们具有什么样的功能,在什么情况情况下使用等几个方面为读者进行了阐述。 　　关键词:布局;表格;层;页面元素;Dreamweaver 　　中图分类号:TP393文献标识码:A 文章编号:1009-3044(2009)24-6699-02 　　 　　Brief Discussion on Layout Yools in Web Page Design 　　ZHANG Jing-bo 　　(Sichuan Chemical Technical College, Luzhou 646005, China) 　　Abstract: Web page design plays an important role in website construction .Both abundant information and beautiful appearance are essential for a network environment. Web page designer should be skillful for arranging numerous information on the page reasonably and properly. It is also a question that is worth thinking about by all web page amateurs. In this paper, the author tries to introduce the webpage layout tools and their functions. It also illustrates under which conditions the tools will be used. 　　Key words: layout; table; layer page; elements; dreamweaver 　　 　　随着网络的发展,网站已经成为了日常生活中常常关注的媒体平台,在网站里,浏览者可以浏览新闻,观看电影,下载音乐,欣赏图片。而且所有通过网站浏览的信息资源,都是通过将其放置于网页中得以呈现的。如何才能让如此纷繁复杂的信息分门别类的出现在网页中呢?这就需要设计者灵活的运用网页布局工具了。清晰网页的布局可以让浏览者认清网站的结构,不至于在繁杂的信息中迷失方向,精美的网页布局可以给浏览者带来美的享受,在浏览信息的同时得到身心的愉悦。那么,在制作网页的过程中,有哪些布局的工具可以使用?它们又分别适合于什么情况下使用呢? 　　 　　1 网页布局和传统文档布局的区别 　　 　　在这里笔者用著名的网页制作软件Dreamweaver来举例。Dreamweaver是一个非常成熟的网页制作软件。它可以灵活的在设计视图和代码视图之间切换,并且提供了相当多的组件方便设计者使用。在网页中出现最多的网页元素就是图片和文字,将文字和图片放置到合理的位置是布局的第一要点。 　　经常使用Word等办公自动化软件的用户都习惯性的利用回车、空格或者是单纯的对齐方式来控制文档内容的布局。这个方法运用到网页设计中就并不那么有效了。 　　首先需要了解这样一个原理:大家浏览的网页中的信息几乎都是以HTML标签存在,它们首先被下载到本地硬盘,然后再通过编译显示到用户的浏览器上。这就意味着,如果在设计过程中,频繁的使用空格来布局的话,网页中将会出现很多代表空格的HTML标签(nbsp),网页的大小就会无形中增大,网页越大,下载的时间就必然会越久。而回车在Dreamweaver中并非表示换行,它代表的是分段,它会导致2行页面元素相隔的间距被限制,同时将一个整体划分为两个部分,既不美观,也不方便操作。这显然并不符合设计的要求。那么在设计过程中,通常使用的布局工具有哪些呢? 　　 　　2 网页设计中的布局工具 　　 　　2.1 插入表格 　　最常用的就是直接插入表格。网页中的表格运用是非常重要的,只有将网页元素放置到表格中,才能更好的进行页面的布局。它的使用主要表现在以下几个方面: 　　2.1.1 网页大小的控制 　　平时大家浏览网页,都习惯的使用垂直滚动条来拖动页面浏览更多的内容。如果说一个网页既有水平滚动条,又有垂直滚动条,那肯定是非常不方面的。所以在设计的时候通常是首先在空白的网页中,插入一个限定了宽度的表格,然