网页美化与布局教程（网页设计过程中如何做好网站布局）

本文目录

• 网页设计过程中如何做好网站布局
• 网站建设怎么布局怎么设计
• 用FrontPage建个小窝-网页的美化
• 网页设计应该如何布局

网页设计过程中如何做好网站布局

随着科技的发展以及互联网在人们生活中得普及，我们可以在网络上浏览到各种各样的网站。因此，对于很多公司的推广来说，越来越多的公司都选择线上推广的模式。所以很多有实力的公司都选择制作自己公司的网站，那么在制作网站的过程中如何做好网页布局呢？下面我们就来介绍一些技巧。

一、选择一个比较容易被大家接受的分辨率

很多人浏览网站时间比较长就会感觉到眼睛疲劳，当然，这不仅仅是时间的问题，有的时候还可能是因为我们没有选择到一个比较好的分辨率。目前网络上的网站很多使用的都是778个宽度的像素，但是事实上像素低于800就已经让人感觉到非常的压抑了。所以说我们在做网站的时候一定要选择一个比较舒适的分辨率，这样人们在浏览网站的时候才不会带来眼睛的负担，从而能够在网站上面停留的时间更长。

二、合理的插入广告

现在互联网在人们生活中普及，所以网络上也有各种各样的铺天盖地的广告，但是很多广告却骑到了负面作用，让人们看着感觉特别的烦恼。所以在插入广告的时候一定要合理的设计，当然，重要的就是广告的画面一定不要影响人们对网站的阅读，很多广告都是浮窗式的，但是一定要保证这些广告不会覆盖出网络上面的文字。而且广告的数量一定不要太多，这样也就不会使人们感到反感。

三、做好文字的编排

文字的编排方面，重要的就是字体的颜色以及字体的大小，通常情况下，在一些比较正规的网站上面，字体的颜色都是黑色的，而且字体的大小基本上都选择四号。所以在编排自己的时候一定要保证整个网站的干净整洁，不要是网站看起来花花绿绿的。

当然，除了上面介绍的这些内容之外，在网站设计的过程中，网页布局一直都是非常重要的，所以一定要做好市场调研，能够满足更多人的要求，也让更多人在使用网站的时候能够流连忘返。

网站建设怎么布局怎么设计

网站设计就是对网页进行美化，科学合理的网页布局非常重要。因为，它不仅要展示网站的内容，更要让它给浏览者留下良好的体验、印象。那么网站建设怎么布局?

1、勾勒网页外观轮外观轮

勾勒网页外观轮外观轮是第一步，你可以用笔在白纸上简单描绘，对各种要素粗略布局。在操作中，需要考虑网站整体的完整性，重点突出和整体协调平衡等要素。另外，需要将logo、导航等放置在重要的突出位置，然后再细化各方面的布局。

2、调整疏密度、适当留白

调整疏密度、适当留白在网页设计中十分重要。我们不提倡100%黄金分割，但设计的比例必须协调。在追求创意布局时，就要将这些设计原则活用到网站网页的布局里面去。

网站建设怎么设计才能提高网站的可读性?

1、排版合理

网站设计的关键一环是网页排版，不但要大气，还要美观。网站设计师应学会并熟练地掌握首字、字间距调整、亮度动态控制、截线、无截线、线高等基本排版知识。

2、突出重点

网站应该在浏览中准确的能够确定出重点。因此，在设计网站时，切记面面俱到，必须围绕一个重点主题展开网站设计，才能将“亮点”点亮。

3、对齐格手段

调查显示，客户对网站设计的干净整齐度要求非常高，要达到这个要求不难，网站设计者只需要通过使用对齐格手段就可以啦，这将使网站设计页面更为整洁，重点突出。

4、调整空白区

空白区是指版面中的空闲空间，它们可保证网站设计当中的文字、副本、列表、图标、超链接以及其他网站设计元素都拥有属自身独立空间，成功的网站建设在布局上一般都比较巧妙，毕竟，布局规划精巧，说不定会轻松成为顾客最青睐的网站设计的闪光点哦。

5、色彩对比搭配

色彩的对比搭配，主要以文字与背景颜色的对比协调，主区域与次区域的色彩对比协调来帮助浏览者直观、便捷地了解网站内容，可极大提高客户使用体验，无形中增强了对网站的依赖性，提高交易的可能性。

网站内容如果有很强的可读性，那么自然会留住用户，所以，在对网站进行设计的时候，要注意以上这些可以提高网站可读性的方面，这样才能让网站设计更吸引人。

用FrontPage建个小窝-网页的美化

页面的美化

通过模板建立的网页，常常预先置放了些标题栏、目录栏(一般叫导航栏)，导航栏都是用很多元素组成的，结构上稍稍复杂一些。一般情况下我们不必要对这些东西进行低层次的修改，FrontPage也不允许操作者修改，但在某些项目上，我们还是可以根据自己页面的要求来修改。

操作修改页面的主标题:在主页(index.htm)的页面上部，模板预置了一个名为“主页”的横幅标题，这个横幅标题和整个主页格格不入。点击横幅，按“Del”键删除，然后在同样位置插入一个事先准备好的横幅图片为主页标题。

操作修改导航条的链接:在主页的左边，有一个导航条(目录栏)，在建立站点的时候，导航条就建立了几个网站的链接。这些链接不能在网页窗口中修改，只能在站点管理的“导航”视图窗口中修改。但可以在网页视图窗口中给导航条添加链接。在导航条中点击鼠标，然后选择输入文字“给我写信”，设置文字的超链接，这里的链接地址设置的是我的邮箱地址“mailto:豆豆@yesky.com”。

操作删除页面元素:在主页的右下，程序放置了一个LOG图片，这个图片和我的主页不符，选择该图片，按“Del”删除。

操作给页面添加水平线:水平线对于规划页面有很大的作用，可以让页面清楚，简洁。在要插入水平线的位置点击鼠标，选择“插入/水平线”，水平线就出现了。注意，一般模板网页的水平线由程序自动设置外观属性。而其他情况下，将由操作者自己设置水平线的颜色，粗细等。

进一步学习的建议:页面长期后，可能会留下垃圾(无效代码)，如果想做得更专业一点，可以在HTML标签窗口修改源代码，或者使用其他网页制作工具休整

表格的美化

表格实际和文字、图片一样，是一个网页的基本元素，但表格在网页中，更大的用途是来规划页面。实际上，在网页中，通过空格、段落、缩进等是很不容易规划好一个有很多元素的页面的，特别是图文混排的页面。

在FrontPage中添加常用的数据表格，和在word中添加表格一样的方便，直接使用插入表格命令，然后填写数据就可以了。甚至还可以将word文件中的? 粘贴进来。

操作添加一个简单表格:在要插入表格的位置点击鼠标，选择“表格/插入/表格”，在弹出的对话框中设置表格的属性，然后选择表格的行数——2，选择表格的列数——1，然后指定表格的宽度，可以设置表格的宽度占网页宽度的百分比，或者直接设置表格的绝对宽度——像素。其他设置表格边框线的宽度为1，设置单元格间距为2。确定即可。

操作在表格中添入文字:在表格中输入文字和在普通页面中输入文字没有什么区别，另外，在生成主页模板的时候，程序在网页中添加了一个高级控件，可以自动显示网页的更新时间。将这个控件拖入到表格中。这样，一个显示网页制作者的表格就制作好了。

操作设置表格的属性:表格的属性比较复杂，分成单元格属性和表格属性。选择表格，然后选择菜单“表格/属性/表格”，在弹出的窗口中可以设置表格的边框、背景、颜色等等。特别要说明的是表格的浮动，表格的浮动是设置整个表格的对齐方式，而一般的对齐方式是设置表格内的元素的对齐。

操作图文混排:在需要的位置加入一个只有一个单元格的表格，并设置好其他属性。在表格中添加图片，并设置好表格的大校再设置表格为“左浮动”，调整文字，让文字在表格的右边。这样，图文相配的混排就得到了。

进一步学习的建议:表格的操作比较复杂，需要反复的练习，学习如何用表格构造特殊页面，如何实现复杂的图文混排等等。

主题的设置

经过以上过程，我主页制作也基本完成了。但页面的背景图、导航栏、颜色选择，边框等都不太令我满意，而这些都是模板自动设计的，而且不能修改。这个时候，就要使用主题了。

主题，就是FrontPage针对页面中的背景、导航栏、横幅、按钮、各种边框自动进行设置，主题的内容有几十种，操作者可以根据自己的喜好选择，这样，就可以省去自己分别对这些页面元素的设置。

操作为网页指定主题:打开主页，选择“格式/主题”，弹出主题窗口。在主题窗口的左边，列出了可以选择的主题，默认的是“直边”，点击这些主题，可以在右面窗口查看该主体的风格，如横幅是什么样、是什么样的颜色、标题的样式、超链接的显示样式，导航条的样式等等。另外，还可以设置是否需要背景图片，是否使用鲜艳的颜色等。选择“渐蓝”主题，单击确定，即可在网页窗口看到效果了。

主题都是事先设计好的，如果你有什么特殊要求，而FrontPage又不允许你在网页时修改，这个时候，可以自定义主题。

操作测试网页和网站:现在，我的主页基本完成了，要实地测验一下主页和整个网站的情况，看页面显示是否正常，各个超链接是否正确，设计上还有什么缺陷。打开要预览的主页，然后选择“文件/在浏览器中预览主页”，这样，我就看到了我精心设计的主页的真正模样了。测试的时候，要仔细看页面的各种元素，看是不是有不正确的地方。多改变一下浏览器的一些相关设置，如字体大孝全屏、缩放窗口。点击页面上的超链接，看是否能跳转到正确的页面。另外，最好将整个网站文件夹复制到其他机器上，看是否正确，特别是字体显示是否正确。

操作查看网站报表情况:在视图窗口选择“报表”图标，打开报表窗口，在这个窗口，可以看到整个网站的一些统计数据。仔细查看这些数据，看看有没有什么问题，如无效的超链接等。如果一切没有问题，就可以发布了。

进一步学习的建议:网页的美化是一个经验和修养的问题，一方面多实践，另一方面多看优秀的网页。另外，网站的测试很重要，要摸索和掌握这方面的经验和技巧.

网页设计应该如何布局

网站结构与优化很重要，页面布局也是非常重要的，让客户第一眼看到网站的感觉是怎么样，如果第一感觉不好，相信下一次就不一定来了，所以网页的内容除了用户的需求之外，还要注重用户体验。下面的内容，就以两个方面来讲，一个是搜索引擎的识别，一个是用户体验：

工具：电脑、网站

步骤：

根据网站的导航去制定需求。一个清晰明了的用户导航可以让游客在网站中自由的访问，并且根据需要选择合适的内容，而网站导航的加入也可以加大网友的访问深度。

之前看过一个做服装的网站，一进入这个网站就感觉到了皇宫一样，很华丽也很唯美，但是就找不到一点文字介绍，全部都是图片，操作起来很不方便，由于偶然进入了一个较深的页面(该网站没有面包屑导航)，找不到回去的路就只好关掉了页面，无形中就会这个网站的跳出率做出了贡献。

不可否认的是，现在很多网站都过于独立，和用户之间的互动性不够，其实网站互动性的上升能大大提升网站自身的可信程度，尤其对于一个新站来说，知名度不够，号召力不强，用户是无法相信的。而这时用户的参与无疑就让网站自身的可信力大大上升，而且一个网站最成功莫过于有众多用户的参与，而评论无疑会让网站生命力更强。

什么叫做页面元素的丰富性呢，就是网站有图片、有视频、有评论、有加粗、有分段这样可以说是一个优质的页面。当然要在适当的情况下出现图片、视频、或者其它的元素。这样也会增加页面的价值。

不要太大，也不要太小，一般13号的字体就可以了。字体的颜色，也要和网页的风格协调，一般都是黑色或者深灰色。文章排版要鲜明，段落得当，这样更容易让客户阅读。还有文章内尽量少用锚文本，文章内的锚文本一般都是以用户的需求性和相关性来增加锚文本。尽量不要影响用户阅读。

过多或者过大，图片过多或者过大，很直接的就影响了网页的加载速度，导致用户长时间打不开网页，那就悲剧了，所以，网页的大小和尽量少用图片围标，如果不可避免，那就把图片压缩到最小再上传吧。

总结：其实网页的布局，重要的就是细心，包括各个方面都要细心对待，页面上存在的每一个东西，都要有实际意义。