HTML相关知识点

本文将从前端面试题目出发,总结 HTML 必须掌握的知识点.

SEO(Search Engine Optimization) 搜索引擎优化，是一种利用搜索引擎的搜索规则来提高目前网站在有关搜索引擎内的自然排名的方式。

合理设置 title，discripition，keywords：搜索对着三项的权重逐个减小。
- title 强调重点即可，重要关键词不要超过 2 个，不同页面 title 要有所不同
- descripition 把页面内容高度概括，长度适合，不同页面 descripition 不同
- keywords 列出关键词即可
语义化的 HTML 代码
重要的内容放在 HTML 前面
重要内容不要使用 JS 输出
提高网站访问速度
非装饰性图片增加 alt

HTML5 不再是 SGML 的子集，而是根据现代 WEB 应用的需求发展出了关于图像、多媒体、位置、存储、多任务处理等功能。其主要有以下新特性

####元素

新增了一些媒体控制元素 video 和 audio
新增了绘画 canvas
增加了一些语义化更好的标签 article footer header nav section
新增了一些表单控件：canlendar date time email url search
移除了一些元素 - 纯表现的元素 big center font 。。。 - 可用性具有负面影响的元素 frame frameset noframes ####数据保存
新增 localstorage 长期保存数据
新增 sessionStorage 浏览器关闭后自动删除 ####离线 WEB 应用页面缓存指的还是有网络状态下，而离线 web 应用指的是在没有网络状态可以运行应用。manifest 文件是核心，记录着哪些资源文件需要离线应用缓存，要使用 manifest，只需要在 html 标签中添加属性

<html manifest="cache.manifest"></html>

cache.manifest 的文件格式如下

    CACHE MANIFEST
    #缓存的文件
    index.html
    test.js
    #不做缓存
    NETWORK
    /images/
    FALLBACK
    offline.html index.html

缓存的文件下面是当网络不可用时，文件直接从本地缓存读取， NETWORK 下面的文件无论是否已经缓存，都要从网络中下载。 FALLBACK 后面，当无法获取到 offline.html，则转到 index.html。

####地理定位 h5 提供了 Geolocation API 访问地理位置，即通过 window.navigator.geolocation 来实现访问。这个对象有三个方法：

getCurrentPosition();
watchPosition();
clearWatch();

页面第一次使用这个 api 需要获得用户许可, watchPosition 可以对位置变化事件进行监听。

重要程度：★★★

1.利于用户阅读，样式丢失时仍然能让页面呈现清晰的结构。 2.利于 SEO，搜索引擎是根据标签来确定上下文和关键字的权重 3.便于其他设备解析，如盲人阅读器根据语义渲染网页 4.利于开发和维护，语义化代码更佳具有可读性，与 CSS3 关系更和谐

Related Posts