HTML中html元素的lang属性的说明

我在刚开始学习HTML的时候，关于基本的HTML格式中有一点不明白的地方，基本格式如下

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title></title>

</head>

<body></body>

</html>

究竟html标签中的lang属性是干嘛的呢？为什么要指定它的值是”en”或者”zh-CN”呢？个人见解如下：

1.属性lang是英语language的缩写，意思是语言，”en”代表英语，”zh-CN”代表中文

2.在我自己的尝试下，发现，其实不写lang属性，整个HTML文档的显示是没有任何问题的

3.我们都知道，如果你在中国，本地浏览器的默认语言是中文，当我们打开一个外国网站时，浏览器会提示”是否将网页内容翻译成中文”，如下图

检查一下该网页的源代码，发现lang=”en”(我登陆的是http://www.csszengarden.com/)

4.登录几个中国的本土网站，发现源码中并没有写lang属性，也没有翻译的提示

5.搜索引擎首先自己无法判断自己抓取的页面中的内容是什么语言，因为在它看来都是二进制文件，那么这时就需要我们告诉它这个页面中的内容是什么语言，进而它才能知道下一步该干嘛，也就是说，当你把lang设置为”en”时，无论你网页中是什么语言的内容，在它看来都是英语，如果本地浏览器的默认语言不是英语，就会提示上面的选项，问您是否需要翻译。这个在浏览器的设置中可以清楚地看到：

总结：1.搜索引擎无法判断页面中的内容是什么语言，需要人们告诉它（这里也体现出语义化的特点，即机器本身什么都不懂，我们需要告诉它这是什么，并且当我们告诉它这是什么后，我们也必须按照这个规则去做，要不将lang设置为”en”，但是我们却在网页中使用中文语言内容，这很大程度上会对机器进行干扰，进而干扰到用户的正常体验，这样做就毫无意义。）
2.浏览器会将读取到的页面语言和本地语言进行比较判断，如果一致，不做处理，否则提示是否需要翻译（当然前提是用户勾选了这个功能，chrome默认勾选）

题外话：这让我想起我以前大学毕业做毕设时，疯狂的在各种网站查资料，明明所查的网站内容是中文，却还是提醒我是否要翻译，现在看来，原来是网页设计不合理，将lang设置成”en”了，虽然不影响正常使用，但是对用户来说却是莫名其妙，至少那是的我是一脸懵逼的，”什么鬼？”另外，看了几家国内的网站，并没有设置lang属性，不知是我太愚钝，还是只是认为用户就一定是中国人？百度没有，淘宝没有，CSDN也没有，好在腾讯有…

HTML中html元素的lang属性的说明的更多相关文章

  1. HTML中的元素是有属性的:标准与解释器

    元素的属性只有有标准和相应的解释器才有存在的意义. HTML中的元素是有属性的:这些额外的属性值可以配置元素或者以各种方式来调整元素的行为,进而满足用户所需的标准. https://developer ...

  2. HTML中,input元素的 Disabled属性 所产生的后端无法接收数据的问题

    背景 今天从前端提交 form表单 数据时,发现 设置 Disabled 的 input 元素的字段数据在后端无法接收到 原因 查阅资料(来自W3school): disabled 属性规定应该禁用 ...

  3. css中 Span 元素的 width 属性无效果原因及多种解决方案

    先运行下程序看下: <span style='width:300px;'>123</span> 输出:123 可以看到 span会自动根据包含的内容来变化宽度 这是因为:对于内 ...

  4. css中span元素的width属性无效果原因及多种解决方案

    先运行下程序看下: <span style='width:300px;'>123</span> 输出:123 可以看到 span会自动根据包含的内容来变化宽度 这是因为:对于内 ...

  5. CSS魔法堂：一起玩透伪元素和Content属性

    前言  继上篇<CSS魔法堂:稍稍深入伪类选择器>记录完伪类后,我自然而然要向伪元素伸出"魔掌"的啦^_^.本文讲讲述伪元素以及功能强大的Contet属性,让我们可以通 ...

  6. 【转载】C#中使用Average方法对List集合中相应元素求平均值

    在C#的List集合操作中,有时候需要对List集合元素进行汇总求平均值,如数值类型的List集合元素,有时候对象类型的List集合也需要对集合中的元素的某个对象进行汇总求平均值,此时都可以使用到Av ...

  7. DOM中元素对象的属性方法

    在 HTML DOM (文档对象模型)中,每个部分都是节点. 节点是DOM结构中最基本的组成单元,每一个HTML标签都是DOM结构的节点. 文档是一个    文档节点 . 所有的HTML元素都是    ...

  8. js基础之DOM中元素对象的属性方法

    在 HTML DOM (文档对象模型)中,每个部分都是节点. 节点是DOM结构中最基本的组成单元,每一个HTML标签都是DOM结构的节点. 文档是一个    文档节点 . 所有的HTML元素都是    ...

  9. 26 组件中style标签lang属性和scoped属性的介绍

    普通的style标签只支持普通的样式,如果想要启用scss或less,需要为style元素,设置lang属性 只要 咱们的style标签,是在 .vue 组件中定义的,那么,推荐都为style开启sc ...

随机推荐

  1. 【编译系统02】编译器 - 语义分析器(semantic)的简单设计思路(变量类与变量表)

    当我们分析到 "int n;",说明其已经定义了一个变量,之后又遇到一个 "n=3",我们从哪里去找这个n并且赋值呢? 答案是:通过我们定义的 变量表(Tabl ...

  2. （五十一）c#Winform自定义控件-文字提示-HZHControls

    官网 http://www.hzhcontrols.com 前提 入行已经7,8年了,一直想做一套漂亮点的自定义控件,于是就有了本系列文章. GitHub:https://github.com/kww ...

  3. C#函数（构造函数）的重载

    using System; namespace test { class Program { static void Main(string[] args) { Cat cat = new Cat() ...

  4. python跳出多重循环的方法

    方法1:自定义异常 # -*- coding:utf-8 -*- """ 功能:python跳出循环 """ # 方法1:自定义异常 cla ...

  5. 如何使用postman判断返回结果是否正确

    针对一个接口,我们在知道参数以及参数对应的结果时,可以通过postman进行判断,验证返回数据是否与预期数据相等.这样可以使我们的接口测试更加的方便简洁. 1.准备数据. postman可以接受的文件 ...

  6. dom0、dom2、dom3事件

    https://www.jianshu.com/p/3acdf5f71d5b addEventListener():可以为元素添加多个事件处理程序,触发时会按照添加顺序依次调用. removeEven ...

  7. 手动更新了packages.config Nuget配置文件,自动引用dll

    通过Google查询到:http://stackoverflow.com/questions/6876732/how-do-i-get-nuget-to-install-update-all-the- ...

  8. SQL查询--索引

    索引概念和作用 索引是建立在表上的可选对象,目的是为了提高查询速度. 如果要在表中查询指定的记录,在没有索引的情况下,必须遍历整个表,而有了索引之后,只需要在索引中找到符合查询条件的索引字段值,就可以 ...

  9. 【Sublime Text】sublime修改默认浏览器及使用不同浏览器打开网页的快捷键设置

    #第一步:安装SideBarEnhancements插件 下载插件,需要“翻墙”,故提供一下该插件的github地址:https://github.com/titoBouzout/SideBarEnh ...

  10. python文件操作【目录大全】

    总是记不住API.昨晚写的时候用到了这些,但是没记住,于是就索性整理一下吧: python中对文件.文件夹(文件操作函数)的操作需要涉及到os模块和shutil模块. 得到当前工作目录,即当前Pyth ...