codetc - 网站开发技术 首页 前端 查看内容

网页前端最容易犯的HTML标签错误

2014-11-15 01:18| 发布者: CODETC| 查看: 1910| 评论: 0

保持良好的代码风格是每个Coder必学的课程,同样在HTML设计的时候也要特别注意代码的规范性,虽然说不规范的代码不会直接造成严重的后果,但很有可能对用户体验造成一定的干扰,同时也会降低搜索引擎对网站的好感度。这里列举了一些最容易犯的HTML标签错误,记下他们,能够让我们避免犯此常见错误,让我们的HTML标签符合语义,和标准的要求。

1:把块级元素放入了行内元素内

HTML 元素的表现方式不外乎就两种:块级和行内。每一个标签都有默认的表现方式;像div和p 就是块级元素,他们用来形成文档结构,行内元素应该位于块级元素内。


2:img 标签没有包含alt属性

alt属性是所有显示在网页中图片的必须属性,它能够帮助人们知道这是什么图片。或者在网速比较慢的时候,图片加载失败时可以显示图片的含义是什么。它的主要目的是,说明图片的含义,像这样的说明 alt=”image”是很糟糕的。如果说有些图片的确只是装饰作用而已,那么建议你写成 alt="",alt的说明信息也在搜索引擎收录图片的时候起到很重要的作用。


3:在必要的时候不使用list

在合适的时候使用list不但能使页面结构更清晰明了,而且也能使搜索引擎更容易收录页面;尤其是当CSS加载失败时,list结构在保持页面可读性上起到至关重要的作用


4:使用<b>和<i>显示黑体字和斜体

可以用css样式定义 font-weight 和 font-style。如果必须在页面中写标签的话,用 <strong> 或 <em>标签来替换。<b><i>没有任何语义可言, 但是,为了更简洁的页面,还是选择 css定义样式吧


5:使用太多<br/>


<br />换行标记只应该用于插入是在第一个文本流换行符敲到一个新行一个特别字了。它不应该被用来制造元素之间的差距,而是分裂成不同的段落,或调整的幅度CSS样式的文本。过多的<br/>元素会造成页面雍肿,易读性差。


6:使用错误的 Strikethrough 标签

在昔日,<S>和<strike>允许用来定义网站文字。不过,现在他们被定义为不推荐使用的标签,当然他们仍然可以有效果,现在用新的标记集- <del>和<ins>来替换<s><strike>


7:使用内联样式

css最重要的目的只是为了区分文档和样式,如果你把style写到页面里面,那么完全没有css的作用可言,而且,使用内联样式还要影响页面的渲染效率,加长页面的加载时间,所以,记住把你的样式放在它该放的位置。


8:把border添加到HTML中

这种做法其实跟上面使用内联样式差不多


9:没有使用header标签<h1>-<h6>

使用header标签可以让页面结构更清晰,同时也有利于引导搜索引擎的收录


10:没有语义的 <blink> 或<marquee>

不被w3推荐,<blink>和<marquee> (闪动,滚动)标签是纯粹的丑陋。

不要使用这个标签,如果一定要用这样的效果,相信,你会有其他更好的效果,比如用javascript

文章来源 CODETC,欢迎分享,转载请注明地址: http://www.codetc.com/article-54-1.html

最新评论

 作为游客发表评论,请输入您的昵称

返回顶部