HTML-day6

解释下什么是ISO8859-2字符集？

ISO8859-2 字符集，也称为 Latin-2，收集了东欧字符。

HTML中用到的ISO-8859码对照表2

 

webSocket怎么做兼容处理？

WebSocket是一种在服务器与客户端双向通讯的技术，使用原生的WebSocket可以最小化 服务器资源的使用并且为两者提供了一种统一的通信方式。随着HTML5的普及，现代浏览器（IE10+）基本上都已经原生支持WebSocket了，下面是支持WebSocket协议的浏览器：

• Internet Explorer 10
• Firefox 6
• Chrome 14
• Safari 6.0
• Opera 12.1
• iOS Safari 6.0
• Chrome for Android 27.0

WebSocket类似HTTP 协议，是为了弥补HTTP 协议的缺陷：通信只能由客户端发起，HTTP 协议做不到服务器主动向客户端推送信息。

WebSocket 协议在2008年诞生，2011年成为国际标准。所有浏览器都已经支持了。

它的最大特点就是，服务器可以主动向客户端推送信息，客户端也可以主动向服务器发送信息，是真正的双向平等对话，属于服务器推送技术的一种。

                                         

其他特点包括：
（1）建立在 TCP 协议之上，服务器端的实现比较容易。
（2）与 HTTP 协议有着良好的兼容性。默认端口也是80和443，并且握手阶段采用 HTTP 协议，因此握手时不容易屏蔽，能通过各种 HTTP 代理服务器。
（3）数据格式比较轻量，性能开销小，通信高效。
（4）可以发送文本，也可以发送二进制数据。
（5）没有同源限制，客户端可以与任意服务器通信。
（6）协议标识符是ws（如果加密，则为wss），服务器网址就是 URL。

ws://example.com:80/some/path

使用方法（客户端，服务器端）：http://www.ruanyifeng.com/blog/2017/05/websocket.html

 

对于低端不支持websocket的浏览器，一般有几个解决方案

1. 使用轮询或长连接的方式实现伪websocket的通信

2. 使用flash或其他方法实现一个websocket客户端 ：https://segmentfault.com/q/1010000005000671/a-1020000005003936

3. https://blog.csdn.net/u011925826/article/details/17532465

如何解决WebSocket的兼容性

WebSocket ：用WebSocket实现推送你必须考虑的几个问题

 

html5都有哪些新的特性？移除了哪些元素？

Html5新增了 27 个元素，废弃了 16 个元素，根据现有的标准规范，把 HTML5 的元素按优先级定义为

结构性属性、级块性元素、行内语义性元素和交互性元素 4 大类  

新增的元素：

(1) 结构性元素主要负责web上下文结构的定义

section：在 web 页面应用中，该元素也可以用于区域的章节描述。

header：页面主体上的头部， header 元素往往在一对 body 元素中。

footer：页面的底部（页脚），通常会标出网站的相关信息。

nav：专门用于菜单导航、链接导航的元素，是 navigator 的缩写。

article：用于表现一篇文章的主体内容，一般为文字集中显示的区域。

 

(2) 级块性元素主要完成web页面区域的划分，确保内容的有效分割。

aside：用于表达注记、贴士、侧栏、摘要、插入的引用等作为补充主体的内容。

figure：是对多个元素进行组合并展示的元素，通常与 ficaption 联合使用。

code：表示一段代码块。

dialog：用于表达人与人之间的对话，该元素包含 dt 和 dd 这两个组合元素， dt 用于表示说话者，而 dd 用来表示说话内容。

 

(3) 行内语义性元素主要完成web页面具体内容的引用和描述，是丰富内容展示的基础。

meter：表示特定范围内的数值，可用于工资、数量、百分比等。

time：表示时间值。

progress：用来表示进度条，可通过对其 max 、 min 、 step 等属性进行控制，完成对进度的表示和监事。

video：视频元素，用于支持和实现视频文件的直接播放，支持缓冲预载和多种视频媒体格式。

audio：音频元素，用于支持和实现音频文件的直接播放，支持缓冲预载和多种音频媒体格式。

 

(4) 交互性元素主要用于功能性的内容表达，会有一定的内容和数据的关联，是各种事件的基础。

details：用来表示一段具体的内容，但是内容默认可能不显示，通过某种手段（如单击）与 legend 交互才会显示出来。

datagrid：用来控制客户端数据与显示，可以由动态脚本及时更新。

menu：主要用于交互菜单（曾被废弃又被重新启用的元素）。

command：用来处理命令按钮。

 

移除的元素：

• 纯表现的元素u、big、center、strike、tt、font、basefont
• 框架集frame、frameset、noframes

 

title与h1、b与strong、i与em的区别分别是什么？

title与h1的区别

　　定义：

　　　　title是网站标题，

　　　　h1是文章主题

　　作用：

　　　　title概括网站信息，可以直接告诉搜索引擎和用户这 个网站是关于什么主题和内容的，是显示在网页Tab栏里的；

　　　　h1突出文章主题，面对用户，更突出其视觉效果，指向 页面主体信息，是显示在网页中的。

b与strong的区别

　　定义：

　　　　b(bold)是实体标签，用来给文字加粗，

　　　　strong是逻辑标签，作用是加强字符语气。

　　区别：

　　　　b标签只是加粗的样式，没有实际含义，常用来表达无强调或着重意味的粗体文字，比如文章摘要中的关键词、 评测文章中的产品名称、文章的导言；

　　　　strong表示标签内字符重要，用以强调，其默认格式是加粗，但是可以通 过CSS添加样式，使用别的样式强调。

　　建议：为了符合CSS3的规范，b应尽量少用而改用strong

i与em的区别

　　定义：

　　　　i(italic)是实体标签，用来使字符倾斜，

　　　　em(emphasis)是逻辑标签，作用是强调文本内容

　　区别：

　　　　i标签只是斜体的样式，没有实际含义，常用来表达无强调或着重意味的斜体，比如生物学名、术语、外来语；

　　　　em表示标签内字符重要，用以强调，其默认格式是斜体，但是可以通过CSS添加样式。

　　建议：为了符合CSS3的规 范，i应尽量少用而改用em

 

说说你对cookie和session的理解

什么是Cookie

cookie是一些key-value的集合。

用户通过HTTP第一次访问一个服务器的时候，服务器就会把一个cookie返回给客户端，保存在客户端的内存或者硬盘中，同一个用户下次再访问服务器时，就把cookie带上，这样服务器就认出这个用户了。

cookie被加在http头中，作为其中的一个字段，其实就是一串字符串的形式。像这样：

Set-Cookie: userName=”wdx”; Domain=”abc123.net”;

一个cookie有多个属性，除了第一个Name之外，其他的属性名都是固定的，是关于cookie的过期时间、生成域名、路径之类的属性。下面是cookie 1.0 版本的属性介绍：

属性项	属性项介绍
NAME=VALUE	可以设置保存的key-value，NAME不能和下面的属性重名
Version	默认是0，如果设置为1，那么cookie就要符合RFC2109规范
Comment	注释，用户说明该cookie的用途
CommentURL	服务器为此cookie提供的URL注释
Discard	是否在会话结束后丢弃该cookie项，默认是false
Domain	生成该cookie的域名
Max-Age	最大失效时间，1.0版本是设置为多少秒后失效
Port	该cookie在什么端口下可以回传服务器，多个端口用逗号隔开
Secure	若设置此属性，则cookie只在SSH连接时回传

所以我们如果要保存多个key-value，就需要创建多个cookie。而用户每次访问服务器都会带着它们，这就造成传输数据量的增加，所以每个浏览器都会限制cookie的数量和大小。

什么是Session

由于cookie有数量和大小的限制，为了解决这个问题，session出现了。

有了session之后，用户只需要携带一个默认名为 JSEESIONID 的cookie去访问服务器，它的 value 是每个用户的唯一ID。

用户第一次访问服务器，会生成这个cookie，并且在服务器端实例化一个 HttpSession 对象，这个对象其实就是个Map，可以用来保存用户的信息。下一次用户再访问服务器，就可以根据ID找到这个session，并读取其中保存的用户信息。

两者的安全性

cookie因为是保存在客户端，所以可以在本地查看，甚至修改，因此安全性不高。

相对来说session就更安全，因为用户信息是保存在服务器端的，发给客户端的只是一个用户ID。
 

html5哪些标签可以优化SEO?

SEO：搜索引擎优化，可以分解为搜索引擎，优化，搜索和引擎;即搜索优化，引擎优化，SEO优化，重心是优化，搜索引擎只是工具，前面字都是来修饰优化的。

1.Title 标签

Title 标签能够告诉用户和搜索引擎网页页面的主题思想是什么，一直是搜索引擎的抓取重点。通常，搜索引擎抓取Title标签出于两个目的：作为影响网页排名的重要因素和作为搜索结果页面的显示信息。不管是哪一个目的，对我们做SEO来说都非常重要。
一般来说，Title标签中的单词最好保持在3~6个左右，最好包含关键字。但Title标签中的单词不要全部都是关键字，因为这样可能会造成页面关键字堆砌，导致过度优化。所选单词应简洁明了、具有描述性，要与网页内容具有很大的相关性，并且每个不同的页面都应该包含Title标签。

2.Meta Description标签

对Title标签优化之后，接下来就是对Meta Description标签的优化。Meta Description标签可以说是对Title标签的进一步解释，可以是一句话或者是包含十几个单词的短语。每个页面都该有其自己的Meta Description标签，并且Meta Description标签还可包含一些与网站内容相关但Title标签中未提及的信息。与Title标签要求相似，该部分内容也应具有描述性，与网页内容具有相关性，可包含关键字，但不可过多。

3.Heading标签

Heading标签包含了H1、H2、H3等等，是搜索引擎识别页面信息的重要标记。合理使用H1、H2、H3等不同级别的标签能够使得页面结构更加清晰，有利于搜索引擎的抓取。H1、H2、H3等标签是按照重要程度来排名的。一般一个页面按照需求程度来适当添加该标签：从H1开始，依次往下添加。但不可添加太多Heading标签，否则会适得其反。

4.Strong和B标签

相信大多数朋友都知道Strong和B标签都有加粗的意思，但是很多人并不清楚两者具体有什么区别。其实B标签就是单纯地将文字加粗，而Strong标签不仅是对文字加粗，并且这种形式的加粗会告诉搜索引擎该部分文字比较重要。所以两者从搜索引擎优化的角度来看，是有很大的区别的。
上文中所提到的Heading标签页具有加粗效果，那么这三种标签到底该怎么用？其实，Heading标签一般用于文章大标题以及每段的小标题，而Strong标签一般用于文章段落中的重点词汇，而B标签一般只是强调一种视觉效果。

5.ALT标签

ALT标签是一种图片标签，它将图片的信息以文本的形式展现。对ALT标签的使用没有太多要求，只要在网页中出现图片的部分添加上该属性即可，但其标签内容应与相应页面内容具有相关性，长度不得过长，一般1~5个单词即可

HTML与XHTML二者有不同?

HTML与XHTML之间的差别，主要分为功能上的差别和书写习惯的差别两方面。

     关于功能上的差别，主要是XHTML可兼容各大浏览器、手机以及PDA，并且浏览器也能快速正确地编译网页。 

     由于XHTML的语法较为严谨，所以如果你是习惯松散结构的HTML编写者，那需要注意XHTML的规则。

      下面列出了几条容易犯的错误，供理解。  

1. 所有标签都必须小写

   在XHTML中，所有的标签都必须小写，不能大小写穿插其中，也不能全部都是大写。

2.  标签必须成双成对

   像是<p>...</p>、<a>...</a>、<div>...</div>标签等，当出现一个标签时，必须要有对应的结束标签，缺一不可，就像在任何程序语言中的括号一样

3. 标签顺序必须正确

   标签由外到内，一层层包覆着，所以假设你先写div后写h1，结尾就要先写h1后写div。只要记住一个原则“先进后出”，先弹出的标签要后结尾。

4. 所有属性都必须使用双引号

   在XHTML 1.0中规定连单引号也不能使用，所以全程都得用双引号。

5. 不允许使用target="_blank"

   从XHTML 1.1开始全面禁止target属性，如果想要有开新窗口的功能，就必须改写为rel="external"，并搭配JavaScript实现此效果。