网页制作需要注意事项

文件注释必不可少，但是要适可而止。注释太多回增大文件的大小，受带宽影响，用户在浏览网页时增加了等待时间，造成不好的用户体验。下面介绍网页制作需要注意事项，希望这些内容对您有所帮助。

1、XHTML和CSS文件注释

文件注释必不可少，但是要适可而止。注释太多回增大文件的大小，受带宽影响，用户在浏览网页时增加了等待时间，造成不好的用户体验。网站在上线前先要在测试服务器上进行测试，测试好没问题后，将相关的CSS文件、JavaScript文件先删除注释，然后进行压缩。这些文件的压缩可以利用下载相关工具实现，也可以使用在线压缩工具实现。

2、清除浮动的方法

1)在结尾出加空div标签clear:both

2)在父级div顶一overflow：hidden

3)在父级div顶一味蕾：after和zoom

3、CSS文档流

网页元素按照XHTML结构自上而下，从左向右一行一行得布局，叫做CSS文档流。

4、label标签中得for属性

当用户选择label标签时，浏览器回自动将焦点转到和标签相关的表单元素上。

5、zoom:1的作用

一般是为了解决IE6下样式不兼容的问题。

HasLayout是IE渲染引擎的一个内部组成部分。在IE中，一个元素要么自己对自身的内容进行计算大小和组织，要么依赖于父元素来计算尺寸和组织内容。为了调节这两个不同的概念，渲染引擎采用了HasLayout的属性，属性值可以为true或false。当一个元素的HasLayout属性值为true时，我们说这个元素有一个布局(layout)。

大部分的IE显示错误，都可以通过激发元素的HasLayout属性来修正。可以通过设置一些CSS属性来激发元素的HasLayout属性，使其“拥有布局”。在IE 6中就可以通过zoom：1来激发元素的HasLayout。

6、CSS Sprites技术利弊

利：减少对服务器的请求数量，进而加快页面加载速度。

弊：1)测算每个背景单元的精确位置，很繁琐。

2)如果页面背景有少许改动，一般就要改合并的图片。

7、marquee标签

标签里面是滚动文字的内容

8、word-spacing

修改字间距。简单地说，课室是任何非空白字符组成地串，并由某种空白符包围。所以象形文字是无法指定字间隔地。除非字之间有空格。因此，这个属性主要是针对英文单词地，要使其对中文起作用，需要在中文之间加空格。肯恩那个设计者认为两词之间没空格就是一个词。

9、display:inline-block;的使用方法

在桌导航条的时候，一般会用到ul-li结构，大多数时候我们是把li设置为浮动，让其并排显示在同一行。但是如果当行中li的数目不确定，并且又需要导航中的文字在页面中居中显示时，用这种方法就不太方便了，因为每次修改当行中li的数目量或文字时都需要调整ul或者第一个li标签的padding或者margin属性值。

还有一种方法就是设置li为“display：inline-block;”这样就可以达到同样的效果，而且无论有几个li标签或者li中的文字如何变化，只要设置ul中的text-align属性的值为center就可以实现ul中的所有文字水平居中显示。

IE6、IE7块级元素不识别inline-block，对于行内元素不存在兼容问题。可以用*display：inline;*zoom：1来代替。

现在也越来越多人选择免费网页制作，但是却不知道该注意哪些事项，导致做出来的网页达不到要求，下面小编来给大家讲讲免费网页制作的四大注意事项。

1、网站布局

网站布局是用户体验标准之一。当你设计网站的布局时，遵循用户体验是一个准则，这样建站可以确保用户能顺利浏览网页。网站不是寻宝，你要确保网站的导航清晰直观，所有可点击的项目都是简单易懂的，这样才能够吸引更多用户。

2、网站配色

很多人觉得在自己制作网页时配色是不需要重视的，因为在免费网站模板中都帮你配好了。模板的配色固然科学又美观，但是你需要根据你的网站内容来修改网站配色，以保证两者相协调。一个好的网站配色可以增强你的内容和品牌。

3、图像质量

这里的图像质量不止是针对网站banner，更是针对网站中的每一张图片。一定要使用高质量的图片，并为你的网站优化它们。

4、文字内容

免费网页制作有一个通病，即站长们不会去修改网站模板中的文字，导致问题百出。这里小编的建议是一定要根据需要修改网站模板中的文字。尽可能完善你的文本，以达到一个清晰而有力的信息，与你的目标市场产生共鸣。

以上就是四个免费网页制作的注意事项，细节决定成败，一定要做好细节工作。

1、将网页修改为百分比布局

当某个浏览窗口处于媒体查询固定的范围之外，网页就需要水平滚动才能完整浏览，而通过百分比布局可以页面元素根据窗口大小在一个又一个媒体查询之间灵活修正样式，具体来讲，就是css代码不会指定具体像素宽度：width:xxx px;而是会指定一个百分比宽度：width:xx%;或者直接就是width:auto;这里大家可以根据一个简易的公式将固定像素宽度转换成对应的百分比宽度：目标元素宽度÷ 上下文元素宽度 = 百分比宽度。

2、要阻止移动浏览器自动调整页面大小

iOS和Android浏览器都基于webkit核心，这两种浏览器以及其他的很多浏览器都支持viewport meta元素覆盖默认的画布缩放设置，只需在HTML的标签中插入一个

3、用CSS如何控制网页中图片自适应大小

在设计自适应网站页面时图片自动适应大小是一个非常常用的功能，在进行制作的时候为了防止图片撑开容器而对图片的尺寸进行必要的控制，我们可不可以用CSS控制图片使它自适应大小呢?

4、用em替换px

目标元素宽度 ÷ 上下文元素宽度 = 百分比宽度这个公式也适用于将文字的像素单位转换为相对单位，值得注意的是，现代浏览器的默认文字都是16像素，因此一开始给body标签应用下列任何一条规则所产生的效果都一样:

5、要主要流动布局(fluid grid)的使用

“流动布局”指的是各个区块的位置都浮动，不是固定不变的。

.main {float: right;width: 70%;}

.leftBar {float: left;width: 25%;}

这么做的好处是，如果宽度太小，放不下两个元素，后面的元素会自动滚动到前面元素的下方，不会在水平方向溢出，避免了水平滚动条的出现，大大提升了用户的阅读体验。另外，绝对定位(position:absolute)的使用，也要非常小心。

如果说到网页设计与制作的话，学的东西很多，一般学习都是先学习制作基本的page(网页)，也就是学习用html语言，制作简单的网页，在这个过程中，所需要的素材你可以选择自己去设计，也可以在网上去找素材，当然，这个网页是你自己设计还是模仿，你自己选择，接着就进入动态交互的网站了，语言有什么asp、php、jsp、.net……还有既然是动态还要学习数据库access、MySQL……。没有什么最好的，asp+access是最简单的，一般以前的一些网站公司都喜欢用asp或.net建站，不过我跟人认为php应该是最实用的，对浏览器的兼容性也较好，现在用的比较普遍的就是php吧!所要用的工具：DW、flash、ps、fw。

第一、学习的是简单的html语言，找一本书去看去学习，学习制作静态的网页。

第二、数据库的学习，这个是有一定讲究的，学数据库和对应的语言是有一定关系的，像如果学access,我估计学的应该只有asp了，除非你把数据库都学了。

第二、学习动态交互网页的制作，就是上面所提到的一些语言，自己选择一个去好好学，还是书本去学习吧!

第三、应该是接触到用层替代表格之类的，也就是div+css，很多公司都会要求这个，具体我就不详说。

大致就这么多，设计跟制作是联系在一起的，你要是觉得你更喜欢设计，那可以选择做前台的，如果喜欢编程，那就后台程序了。