【前端总结】

1.前端要注意哪些SEO?

  • 合理的title、description、keywords:搜索对这三项的权重逐个减小,title值强调重点即可,重要关键词不要超过两次,而且要靠前,不同页面的title要有所不同;description要把页面内容高度概括,长度合适,不可过分堆砌关键字,不同页面description有所不同;keywords列举出重要的关键词即可。
  • 语义化的HTML代码,符合W3C规范:语义化代码让搜索引擎容易理解网页。
  • 重要内容HTML代码放在最前:搜索引擎抓取HTML顺序是从上到下,有的搜索引擎对抓取长度有限制,保证内容一定会被抓取。
  • 重要内容不要用js输出,爬虫不会执行js获取内容。
  • 少用iframe,搜索引擎不会抓取iframe中的内容。
  • 非装饰性图片必须加alt。
  • 提高网站速度:网站速度是搜索引擎排序的一个重要指标。

2.Position的属性值有哪些?

3.Web开发中会话跟踪的方法有哪些?

  • cookie
  • session
  • url重写
  • 隐藏input
  • ip地址

4.<img>的title和alt有什么差别?

  • title是全局属性,当鼠标滑动到元素上显示。
  • alt是<img>特有属性,是图片内容的等价描述,用于 图片无法加载时显示。可提高图片可访问性,除了纯装饰图片外都需设置有意义的值,搜索引擎会重点分析。

5.Doctype及其特点

  • <!doctype>声明必须处于HTML文档的头部,在<html>标签之前,HTML5中不区分大小写。
  • <!doctype>声明不是一个HTML标签,它是指示web浏览器关于页面使用哪个HTML版本进行编写的指令。
  • 现代浏览器的html布局引擎通过检查doctype决定使用兼容模式还是标准模式对文档进行渲染,一些浏览器有一个接近标注模型。
  • 在HTML4.0.1中,<!doctype>声明指向一个DTD,由于HTML4.0.1基于SGML,所以DTD指定了标记规则以及保证浏览器正确渲染内容。
  • HTML5不基于SGML,所以不用指定DTD。

常见的doctype:

  • HTML5---<!DOCTYPE html>
  • HTML4.0.1 Strict---<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">该DTD包含所以HTML元素和属性,但不包括展示性和弃用的元素。不允许框架集(Framesets)。
  • HTML4.0.1Transtional---<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">该DTD包含所有HTML元素和属性,包括展示性和弃用的元素。不允许框架集(Framesets)。
  • HTML4.0.1Frameset---<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">该 DTD 等同于 HTML 4.01 Transitional,但允许框架集内容。
  • XHTML1.0 Strict---<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
  • "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">该 DTD 包含所有 HTML 元素和属性,但不包括展示性的和弃用的元素(比如 font)。不允许框架集(Framesets)。必须以格式正确的 XML 来编写标记。
  • XHTML 1.0 Transitional---<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "
  • http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">该 DTD 包含所有 HTML 元素和属性,包括展示性的和弃用的元素(比如 font)。不允许框架集(Framesets)。必须以格式正确的 XML 来编写标记。
  • XHTML 1.0 Frameset---<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" 
  • "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">该 DTD 等同于 XHTML 1.0 Transitional,但允许框架集内容。
  • XHTML 1.1---<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">该 DTD 等同于 XHTML 1.0 Strict,但允许添加模型(例如提供对东亚语系的 ruby 支持)。

6.HTML全局属性有哪些?

  • accesskey:设置快捷键,提供快速访问元素。
  • class:设置类标识,多个类名用空格分开。
  • contenteditable:指定元素内容是否可编辑
  • contextmenu“自定义鼠标右键弹出菜单内容
  • data-*:为元素添加自定义属性
  • dir:设置元素文本方向
  • draggable:设置元素是否可拖拽
  • dropzone:设置元素拖放类型
  • hidden:标识一个元素是否显示。
  • id:元素id,文档内唯一
  • lang:元素内容的语言
  • spellcheck:是否启动拼写和语法检查
  • style:行内css样式
  • tabindex:设置元素可以获得焦点,通过tab可以导航
  • title:元素相关的建议信息
  • translate:元素和子孙节点内容是否需要本地化

7.web语义化

  • web语义化是指通过HTML标记来表示页面包含的信息,包含了HTML标签的语义化和css命名的语义化。HTML标签的语义化是指:通过使用包含语义的标签(如h1-h6)恰当地表示文档结构。css命名的语义化是指:为html标签添加有意义的class、id补充未表达的语义。

    好处:

  • 去掉样式后页面呈现清晰的结构
  • 盲人使用读屏器更好地阅读
  • 搜素引擎更好地理解页面,有利于收录
  • 方便团队项目的可持续运作及维护

8.

7.XML和JSON的区别?

1)数据体积方面:JSON相对于XML来讲,数据的体积小,传递速度更快些。

2)数据交互方面:JSON与JavaScript的交互更加方便,更容易解析处理,更好的数据交互。

3)数据描述方面:JSON对数据的描述比XML较差。

4)传输速度方面:JSON的速度要远远快于XML.

后续更新。。。。

原文地址:https://www.cnblogs.com/wjlog/p/5399273.html