你如何理解HTML结构的语义化?
去掉或样式丢失的时候能让页面呈现清晰的结构:
html本身是没有表现的,我们看到例如<h1>是粗体,字体大小2em,加粗;<strong>是加粗的,不要认为这是html的表现,这些其实html默认的css样式在起作用,所以去掉或样式丢失的时候能让页面呈现清晰的结构不是语义化的HTML结构的优点,但是浏览器都有有默认样式,默认样式的目的也是为了更好的表达html的语义,可以说浏览器的默认样式和语义化的HTML结构是不可 分割的。
屏幕阅读器(如果访客有视障)会完全根据你的标记来“读”你的网页.
例如,如果你使用的含语义的标记,屏幕阅读器就会“逐个拼出”你的单词,而不是试着去对它完整发音.
PDA、手机等设备可能无法像普通电脑的浏览器一样来渲染网页(通常是因为这些设备对CSS的支持较弱)
使用语义标记可以确保这些设备以一种有意义的方式来渲染网页.理想情况下,观看设备的任务是符合设备本身的条件来渲染网页.
语义标记为设备提供了所需的相关信息,就省去了你自己去考虑所有可能的显示情况(包括现有的或者将来新的设备).例如,一部手机可以选择使一段标记了标题的文字以粗体显示.而掌上电脑可能会以比较大的字体来显示.无论哪种方式一旦你对文本标记为标题,您就可以确信读取设备将根据其自身的条件来合适地显示页面.
搜索引擎的爬虫也依赖于标记来确定上下文和各个关键字的权重
过去你可能还没有考虑搜索引擎的爬虫也是网站的“访客”,但现在它们他们实际上是极其宝贵的用户.没有他们的话,搜索引擎将无法索引你的网站,然后一般用户将很难过来访问.
你的页面是否对爬虫容易理解非常重要,因为爬虫很大程度上会忽略用于表现的标记,而只注重语义标记.
因此,如果页面文件的标题被标记,而不是,那么这个页面在搜索结果的位置可能会比较靠后.除了提升易用性外,语义标记有利于正确使用CSS和JavaScript,因为其本身提供了许多“钩钩”来应用页面的样式与行为.
SEO主要还是靠你网站的内容和外部链接的。
便于团队开发和维护
W3C给我们定了一个很好的标准,在团队中大家都遵循这个标准,可以减少很多差异化的东西,方便开发和维护,提高开发效率,甚至实现模块化开发。
你如何理解HTML结构的语义化?的更多相关文章
- [html] HTML结构的语义化
原文链接:http://www.cnblogs.com/freeyiyi1993/p/3615179.html 1.什么是html语义化 选择合适的html标签,便于开发者阅读和写出更优雅的代码的同时 ...
- 语义化的html结构的好处
HTML是提供网页文档内容的上下文结构和含义:html本身是没有表现的,我们看到例如<h1>是粗体,字体大小2em,加粗:<strong>是加粗的,不要认为这是html的表现, ...
- 【重构前端知识体系之HTML】讲讲对HTML5的一大特性——语义化的理解
[重构前端知识体系之HTML]讲讲对HTML5的一大特性--语义化的理解 引言 在讲什么是语义化之前,先看看语义化的背景. 在之前的文章中提到HTML最重要的特性,那就是标签.但是项目一大,标签多的看 ...
- 说一说你对HTML5语义化的理解
本题地址:https://github.com/YvetteLau/Step-By-Step/issues/8 语义化意味着顾名思义,HTML5的语义化指的是合理使用语义化的标签来创建页面结构,如he ...
- 如何让你的JavaScript代码更加语义化
语义化这个词在 HTML 中用的比较多,即根据内容的结构化选择合适的标签.其作用不容小觑: 赋予标签含义,让代码结构更加清晰,虽然我们可以在标签上添加 class 来标识,但这种通过属性来表示本体的形 ...
- HTML语义化是什么?为什么要语义化?
HTML语义化HTML的语义化总结为: 用最恰当的标签来标记内容. 该如何理解呢?比如需要加入一个标题,这个标题的字体比正文的要大写,还要加粗.能够实现这种效果的方法有很多,比如用CSS样式进行渲染. ...
- HTML5语义化标签
在HTML5中最基础也是比较好理解的也就是语义化标签了,,顾名思义语义化也就是可以直接读懂的标签~,这样我们在项目开发过程中不但自己不会因为5花8门的标签命名而伤脑筋,跟同事对接项目也会节约很多时间~ ...
- HTML 3-列表、表单、语义化
有序列表.无序列表.自定义列表在语义上的区别 1.有序列表ol>li:列表有顺序编号(默认列表前加1.,2.,3.,...编号),适用于有逻辑顺序的排列项目,而且次序不能乱.2.无序列表ul&g ...
- 关于HTML语义化的一些理解
语义化这个词我想大家都看到了无数次,特别是在一些招聘广告上. 其实我自己也是,不过每次看到都觉得是那些招聘公司复制的,其实他们根本说不清语义化是什么,而且也根本不看重. 所以我一直也没把这东西当回事过 ...
随机推荐
- fastreport for .net 数据邦定
C# Code: private void button4_Click(object sender, EventArgs e){ //打印主从表数据 string file = Applic ...
- text输入框中按下enter键时阻止刷新页面
1.在js中加入一个方法: function judge_enter(){ if(window.event.keyCode==13){ return false;//阻止页面刷新的作用 } } 2.然 ...
- OSX apache vhost 配置多站点时403错误解决方法
到 /etc/apache2/httpd.conf 这个文件修改下面的路径就好了 DocumentRoot "/Users/wujinhang/workspace/"<Dir ...
- JSP页面上用横线代替文本框
<tr> <td class="content" colspan = 4> <input type="hidden" name=& ...
- Eclipse设置选中高亮显示(包含debug)
如果不高亮显示了:工具栏里有个黄色小笔的图标,点一下就可以了,或者alt+shift+O 设置高亮显示:
- C#操作Word生成目录
OperateWord ow = new OperateWord(); Microsoft.Office.Interop.Word.ApplicationClass ss = ow.WordAppli ...
- Android游戏框架之基础之AA碰撞系统
AA 碰撞体 就是将所有的物体设置为矩形框进行碰撞计算.下面是代码 /* * Copyright (C) 2010 The Android Open Source Project * * Licens ...
- jquery validate 小demo
方便学习: 直接上代码: ceshi.html: <!DOCTYPE html> <html> <head> <meta http-equiv="C ...
- iOS开发——实用OC篇&多种定时器详细介绍
多种定时器详细介绍 在软件开发过程中,我们常常需要在某个时间后执行某个方法,或者是按照某个周期一直执行某个方法.在这个时候,我们就需要用到定时器. 然而,在iOS中有很多方法完成以上的任务,到底有 ...
- Java Web目录
1. Spring持久化 2. Spring核心之IoC——依赖注入 3. Hibernate查询语言 4. Hibernate 实体关联关系映射(转载) 5. 用MyEclipse自动生成hiber ...