语义化的主要目的:用正确的标签做正确的事情。

语义化验证方法:css裸奔--去掉css样式,然后看页面是否还具有很好的可读性。

语义化意义 / 优点:
1.让页面的内容结构化
2.利于浏览器解析和SEO搜索引擎优化。
3.提高代码的可维护和可重用性。

语义化内容:
1.标题语义化
2.图片语义化
3.表单语义化
4.表格语义化

图片语义化:
1.figcaption:图注文字
2.alt:给搜索引擎看
3.title:给用户看

        <figure>
<img src="./01.jpg" alt="给搜索引擎用" title="给用户看">
<figcaption>741852963</figcaption>
</figure>

表单语义化:
1.label-for:增强鼠标的可用性
2.legend:表单组标题
3.fieldset:给表单分组

             <form>
<fieldset>
<legend>表单组标题</legend>
<p>
<label for="name">名字:</label>
<input type="text" name="">
</p> </fieldset>
</form>

图片显示的方式:
1.使用img标签:HTML---> 搜索引擎优化
2.作为背景图:css --> 修饰页面

H5舍弃的标签:s、 u、 big、 center、 frame。

HTML语义化的理解的更多相关文章

  1. 对 HTML 语义化的理解

    简述一下你对 HTML 语义化的理解? 用正确的标签做正确的事情. html 语义化让页面的内容结构化,结构更清晰,便于对浏览器.搜索引擎解析; 即使在没有样式 CSS 情况下也以一种文档格式显示,并 ...

  2. 【重构前端知识体系之HTML】讲讲对HTML5的一大特性——语义化的理解

    [重构前端知识体系之HTML]讲讲对HTML5的一大特性--语义化的理解 引言 在讲什么是语义化之前,先看看语义化的背景. 在之前的文章中提到HTML最重要的特性,那就是标签.但是项目一大,标签多的看 ...

  3. 谈谈对HTML语义化的理解

    什么是HTML语义化? HTML标签可以分为有语义的标签,和无语义的标签.比如table表示表格,form表示表单,a标签表示超链接,strong标签表强调.无语义标签典型的有<div>, ...

  4. 谈谈你对HTML语义化的理解。

    1.什么是HTML语义化? 基本上都是围绕着几个主要的标签,像标题(h1-h6),列表(li),强调(strong em)等. 根据内容的语义化(内容结构化),选择合适的标签(代码语义化),便于开发者 ...

  5. web标签语义化的理解_web语义化是什么意思

    web语义化是什么? Web语义化,使用语义恰当的标签,可以让页面具有良好的结构,页面元素具有良好的含义,从而让人和机器都能快速理解.语义化的web页面一方面可以让机器在更少的人类干预情况下收集并研究 ...

  6. 对html语义化的理解

    所有人都知道html即超文本标记语言或超文本链接标示语言,是目前网络上应用最为广泛的语言,也是构成网页文档的主要语言. html标签中的大部分都是由"语义化"标签所担任 那么,它有 ...

  7. 说一说你对HTML5语义化的理解

    本题地址:https://github.com/YvetteLau/Step-By-Step/issues/8 语义化意味着顾名思义,HTML5的语义化指的是合理使用语义化的标签来创建页面结构,如he ...

  8. 面试--html语义化的理解和作用

    什么是HTML语义化 1.让开发者阅读和写出更优雅的代码2.让浏览器的爬虫和机器很好的解析 为什么要语义化 有利于seo方便其他设备监听 屏幕阅读设备 盲人阅读器方便团队协作开发 语义化元素 head ...

  9. 对HTML语义化的一些理解和记录

    什么是HTML语义化 说HTML语义化就要先说说HTML到底负责的什么?下面摘自维基百科: 超文本标记语言(英语:HyperText Markup Language,简称:HTML)是一种用于创建网页 ...

随机推荐

  1. C#字符串的一些常用方法

    字符串常用方法 string str =""; string[] strArray = str.Split('截取字符'); //按字符将字符串拆分为数组 str = str.Re ...

  2. 设计模式之面向切面编程AOP

    动态的将代码切入到指定的方法.指定位置上的编程思想就是面向切面的编程. 代码只有两种,一种是逻辑代码.另一种是非逻辑代码.逻辑代码就是实现功能的核心代码,非逻辑代码就是处理琐碎事务的代码,比如说获取连 ...

  3. The specified type member 'Date' is not supported in LINQ to Entities. Only initializers, entity members, and entity navigation properties are supported.

    使用EF时,在Limda表达式中( query.Where(x => x.CheckInDate >= bd.Date);)查询的时候抛出了这个异常,网上查到的发现,并不能解决问题. 后来 ...

  4. 在离线环境中安装Visual Stuido 2017

    在离线环境中安装Visual Stuido 2017 0x00 写在前面的废话 因为工作上大多数都是在离线环境中进行的,进出离线环境很麻烦,所以之前很长一段时间都在使用VS2010.后来尝试换了VS2 ...

  5. ReactiveSwift源码解析(二) Bag容器的代码实现

    今天博客我接着上篇博客的内容来,上篇博客我们详细的看了ReactiveSwift中的Observer已经Event的代码实现.接下来我们来看一下ReactiveSwift中的结构体Bag的实现.Bag ...

  6. wtf!rds数据同步居然出问题了--菜鸟db的数据修复历程

    由于一次上线操作的数据变更太多,导致执行时间很长! 由于做手动主从关系,所以操作落在了主库上. 由于主从关系不是对整个库的操作,所以在有表新增的地方,添加了dts新的同步关系. db变更完成后,就发布 ...

  7. 编辑器开发之 Selection 对象的学习

    上一篇,介绍了 range 对象的一些属性和方法,了解了一些基本操作,现在来介绍另外一个重要的对象:selection 对象: MDN 的解释是:Selection 对象表示用户选择的文本范围或插入符 ...

  8. 10个小技巧助您写出高性能的ASP.NET Core代码

    今天这篇文章我们来聊一聊如何提升并优化ASP.NET Core应用程序的性能,本文的大部分内容来自翻译,当然中间穿插着自己的理解,希望对大家有所帮助!话不多说开始今天的主题吧! 我们都知道性能是公共网 ...

  9. okhttputils【 Android 一个改善的okHttp封装库】使用(一)

    版权声明:本文为HaiyuKing原创文章,转载请注明出处! 前言 本文使用的OKHttp封装库是张鸿洋(鸿神)写的,因为在项目中一直使用这个库,所以对于一些常用的请求方式都验证过,所以特此整理下. ...

  10. Jenkins~配合Docker及dotnetCore进行生产和测试环境的灵活部署

    回到目录 首先要清楚本文是讲dotnetcore项目在生产和测试环境部署的,这在过去的frameworks项目里,我们可以通过设置web.config的环境变量,然后再发布时指定具体的变量,去实现生产 ...