设计、建站、维护
始于2004年
当前位置:首页 > 网站制作

加深对HTML和CSS标签语义化的理解

发表日期:2009-1-13 作者来源:派谷网络 浏览次数:9183

    前两天参加了公司组织的一个WD培训,有一节课讲了标签语义化,听了之后感觉特别有用,更正了我以前对 HTML 和 CSS 的错误看法。

    首先说明的一点是,人可以通过视觉的划分判断内容的语义,搜索引擎看到的只是代码。搜索引擎只能通过标签来判断内容的语义。 以前我真的没有怎么重视过搜索引擎,现在开始比较在意了,因为页面的很大一部分流量是来自搜索引擎的,要使页面尽可能地对搜索引擎友好,所以就要尽可能地使标签语义化。

    以前以我对web开发的粗浅理解,觉得写一个好的符合标准的页面只需要把结构和表现分离,然后不要使用table,font等标签就行了,至于通篇都是div我也不会觉得有什么问题,因为CSS很强大。但是,所有的标签都是有自己的语义的,下面给出一部分标签的语义:

    div 语义:Division(分隔)

    span 语义:Span(范围)

    ol 语义:Ordered List(排序列表)

    ul 语义:Unordered List(不排序列表)

    li 语义:List Item(列表项目)

    …………

    如果无视标签语义和默认样式,所有标签都用div,其实也是可以写出来视觉效果很好的页面,只要你灵活运用CSS。但是那样的话虽然视觉上达到了要求,但是整个页面一点语义都没有,搜索引擎还是看不懂。所以,要记住:

    结构(html)才是重点,样式(css)是用来修饰结构的。所以,要先确定html,确定标签,再来选用合适的css。

    一般来说,所有的标签都会有一个默认的样式,所以一个简单的判断网页标签语义是否良好的方法就是:去掉样式,看网页结构是否组织良好有序,是否仍然有很好的可读性。

    另外,值得重点提及的是h标签,h标签的语意是标题,搜索引擎对这个标签比较敏感,特别是h1,和h2。一个语义良好的页面,h标签应该是完整有序没有断层的。也就是说,要h1,h2,h3,h4这样推下来,不要h1,h3,h4,漏掉h2。一个结构良好的网页,h标签可以组织起一个网页的大纲。

    以上这些东西都是WD的工程师阿当讲的,我受益匪浅,加深了对html的理解。HTML 虽然很简单,但是要用好也是很不容易的。

本文章系本站编辑转载,转载目的在于传递更多信息,并不代表本网赞同其观点和对其真实性负责。如涉及作品内容、版权和其它问题,请与本站联系,我们将在第一时间删除内容!

相关网站设计案例

相关推荐新闻

移动网页设计中的注意事...

在移动网页设计中,为了给用户提供良好的体验,需要综合考虑多方...

日期:2025-3-24 浏览次数:51

建企业网站注意事项...

建设企业网站时,以下这些方面需要特别留意,以确保网站能够有效...

日期:2025-3-22 浏览次数:1111

网站制作中除了域名,还...

在网站制作里,除域名之外,还有诸多因素会对网站推广和品牌建设...

日期:2025-3-21 浏览次数:2050

响应式设计对于网站制作...

响应式设计是一种网站设计技术,可使网站在不同设备(如台式机、...

日期:2025-3-21 浏览次数:2008

网站制作需要注意有什么...

网站制作是一个综合性的工作,需要从多个方面进行考虑和规划,以...

日期:2025-3-21 浏览次数:1764

网站建设解决方案
  • 网站维护解决方案
  • 企业门户网站集约化解决方案
  • 营销型网站解决方案
  • 养老院行业网站建设解决方案
  • 医院诊所网站建设解决方案
  • 手机数码行业网站建设方案
  • 外贸公司网站建设解决方案
  • 金融网站建设解决方案
  • 行业协会类网站建设解决方案
  • 品牌官网网站建设方案