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. Linux中哪些工具堪称神器?

    作者:int32bit www.zhihu.com/question/59227720 ag:比grep.ack更快的递归搜索文件内容. Github地址: https://github.com/gg ...

  2. VS2010到VS2019各个版本的密钥

    VS2019专业版和企业版的密钥 Visual Studio 2019 EnterpriseBF8Y8-GN2QH-T84XB-QVY3B-RC4DF Visual Studio 2019 Profe ...

  3. 松软科技web课堂:JavaScript 数据类型

    字符串值,数值,布尔值,数组,对象. JavaScript 数据类型 JavaScript 变量能够保存多种数据类型:数值.字符串值.数组.对象等等: var length = 7; // 数字 va ...

  4. 25个JavaScript数组方法代码示例

    摘要: 通过代码掌握数组方法. 原文:通过实现25个数组方法来理解及高效使用数组方法(长文,建议收藏) 译者:前端小智 Fundebug经授权转载,版权归原作者所有. 要在给定数组上使用方法,只需要通 ...

  5. MySql 字段分组拼接

    drop table if exists T_Test; create table T_Test select 'A' parent, 'A1' child union all select 'A', ...

  6. C++ class外的 >> 重载,输入流,重载示例。不应该定义类内的>>重载

    #include <iostream> // overloading "operator >> " outside class // >> 应该 ...

  7. TensorFlow中实现RNN,彻底弄懂time_step

    这篇博客不是一篇讲解原理的博客,这篇博客主要讲解tnesorlfow的RNN代码结构,通过代码来学习RNN,以及讲解time_steps,如果这篇博客没有让你明白time_steps,欢迎博客下面评论 ...

  8. linux--新装机图形化界面遇到的问题

    1 许可证信息 q 退出 c 继续 r 刷新 按以下顺序正确输入即可: 1  ------  2 -----  q  -----  yes

  9. Java连载53-单例模式初步、final关键字补充、回顾知识点

    一.回顾 1.类和对象的区别 2.UML(uniform makeup language) 3.方法区存储静态变量.常量(static final修饰) 4.堆内存中存储对象 5.栈存储变量 6.th ...

  10. Android常用adb命令总结(一)

    ADB是android sdk里的一个工具,用这个工具可以直接操作管理android模拟器或者真实的andriod设备. ADB是一个客户端-服务器端程序,其中客户端是你用来操作的电脑,服务器端是an ...