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. 用户APC的执行过程

    Windows内核分析索引目录:https://www.cnblogs.com/onetrainee/p/11675224.html 用户APC的执行过程 一.一个启发式问题 有一个问题,线程什么时候 ...

  2. 最小割最大流定理&残量网络的性质

    最小割最大流定理的内容: 对于一个网络流图 $G=(V,E)$,其中有源点和汇点,那么下面三个条件是等价的: 流$f$是图$G$的最大流 残量网络$G_f$不存在增广路 对于$G$的某一个割$(S,T ...

  3. Unitest自动化测试基于HTMLTestRunner报告案例

    报告效果如下: HTMLTestRunner脚本代码如下: #coding=utf-8 # URL: http://tungwaiyip.info/software/HTMLTestRunner.ht ...

  4. Linux-正则、grep、sed学习笔记

    一.正则和grep 正则表达式的实现分成了两类: 基本正则表达式(BRE)和扩展的正则表达式(ERE). BRE 和 ERE 之间有什么区别呢?这是关于元字符的问题.BRE 可以辨别以下元字符: ^ ...

  5. Android Gradle 学习笔记（三）：Gradle 日志

    在第一节,我们使用到了gradle -q hello命令行来运行Hello World,并对Hello World进行了简单的分析,了解到 gradle -q hello 的意思是要执行的build. ...

  6. 3天学会kettle -全网最全的kettle教程

    从资源库开始,详细讲解了kettle的所有控件的用法,无论你是开发人员.运维人员还是测试人员. 通过此教程都可以很快速的掌握kettle,再加上笔者的实例,3天学会kettle的实战操作. 欢迎关注公 ...

  7. 算法设计与分析 1.2 不一样的fibonacci数列

    ★题目描述 fibonacci 数列的递推公式是F(n) = F(n-1) + F(n-2)(n >= 2 且 n 为整数). 将这个递推式改为F(n) = aF(n-1) + bF(n-2)( ...

  8. TeamyinyinFish-凡事遇则立

    小组github地址: https://github.com/TeamyinyinFish 1.项目的总结反思 阿尔法迭代的时候我们只是理想的随意的选择了一个项目并且认为非常简单. 在第二轮迭代的时候 ...

  9. mock 模拟数据在框架中的简单使用

    首先在框架中需要安装mock模块 cnpm i mockjs -S 其次在src文件夹下新建mock文件夹,在mock文件夹中新建一个index.js文件 代码如下: const Mock = req ...

  10. Vue 修饰符once的方法使用

    once:只执行一次 代码: <!doctype html> <html lang="en"> <head> <meta charset= ...