热门标签 | HotTags
当前位置:  开发笔记 > 前端 > 正文

开发者需要知道的11条HTML5小常识

本文为图灵公司质量(QA)部主任李松峰在翻译《HTML5:TheMissingManual》一书时摘录的关于HTML5的有价值的知识点。最早在@李松峰(新浪)微博上分享,后经过整理

本文为图灵公司质量(QA)部主任李松峰在翻译《HTML5:The Missing Manual》一书时摘录的关于HTML5的有价值的知识点。最早在@李松峰 (新浪)微博上分享,后经过整理原发在图灵社区,在获得李老师授权后,WebAppTrend转载了此文,以供有意者学习参考。

  • #HTML5: The Missing Manual# 如果说HTML是一部电影,那HTML5就是一次大转折。HTML本来是不会活过21世纪的。官方Web标准组织W3C在1998年对HTML就已经撒手不管了。W3C把未来都寄托在XHTML,这个更具现代特色的后续标准身上。 是一群被剥夺了话语权的人,让HTML起死回生并为本书将要探讨的功能奠定了基础。
  • #HTML5:The Missing Manual#由于HTML5标准描述的都是事实,而不是抛出一堆理想的规则了事,因此它有望成为有史以来受支持程度最高的Web标准。
  • 今天,当你听到别人提及HTML5,可能有三层意思:(1)HTML5核心,即W3C官方规范,涉及新语义元素、新表单控件、音频和视频、画布;(2)曾经属于HTML5的功能,源自WHATWG最初制定的规范,但逐步被剥离出来,包括本地数据存储、离线应用、消息传递等;(3)有时候会被称为HTML5的功能,包括CSS3、地理定位等。
  • HTML5有两个版本:开发人员版(http://t.cn/Scs9Dj)要求摒弃过去的那些坏习惯和被废弃的元素。通过使用HTML5验证器可以确保遵循HTML5标准的这一部分。浏览器开发商版(http://t.cn/7vZ3v)包含从头实现一个兼容过去和未来的浏览器所需要的全部信息。前者是后者的子集。
  • HTML5删除了框架,但得以保留,因为Web应用经常要利用实现一些集成任务,比如在网页中包含视频窗口、广告单元和谷歌搜索框等。
  • HTML5中改变了一些元素的含义。如元素(被删了),原来是表现性的元素,用于缩小文本,现在它的含义是“small print”,即附属细则,用于页面底部的法律条款。再如
    元素,前者插入水平线,后者加删除线,但在HTML5中它们的含义变成了“主题转换”和“不准确、不相关的内容”。
  • HTML5保留的HTML元素有100+,新增的元素30个左右,改变含义的元素大约10个。看这里一目了然:http://t.cn/GLE0G
  • HTML5的“自由散漫”表现在:(1)不要求网页中必须包含、和元素;(2)标记和属性均不区分大小写;(3)允许省略关闭空元素(void elment)的斜杠;(4)属性值中只要不包含受限的字符(比如>、=或空格),就可以不加引号;(5)只有属性名没有属性值也可以。
  • 严肃的Web开发人员编写HTML5页面还是要遵循XHTML语法:(1)包含可选的、和元素;(2)标签和属性全部小写;(3)标签不要错误嵌套;(3)属性值要加引号。想验证自己的HTML5页面是否符合XHTML语法?使用这个验证器http://t.cn/ScF199,在Prese中选XHTML5。
  • XHTML5(Polyglot Markup:http://t.cn/SV7jJt)是HTML5与XML的交集,是兼顾二者的方案,可由XML或HTML解析器解析,解析后都生成相同的DOM。服务器端配置的MIME类型决定使用的解析器:application/xhtml+xml 或 text/html。注意:IE9之前的IE不支持XML解析器。另可参考:http://t.cn/SV7jJc
  • XHTML 1.0为替代引入是想引入重要和强调的语义。HTML5为这4个标签赋予了新的含义:表示要突出显示的“重要内容”、仅表示“粗体”但不是更重要(关键字、产品名)、表示要大声朗读的“重读内容”、仅表示“斜体文本”但不是更重要(外文单词、技术术语)。

原文出处:图灵社区


译文来源:http://www.webapptrend.com/ WebAppTrend是一个独立的技术博客,关注Web App前瞻和实践,以及智能浏览器发展 
请大家在关注CSDN的同时,关注我们的新浪微博 @WebAppTrend,欢迎加入我们的QQ群:193775364


推荐阅读
  • Cocos2d-HTML5初学者指南:第一部分基础知识
    本文旨在为初学者提供Cocos2d-HTML5的基础知识入门指南。虽然作者在交大期间学习了基础的Web技术和AS3游戏开发,但感觉这些知识与实际应用仍有差距。几年前曾接触过Android开发,但由于缺乏C++和Objective-C的背景,未能深入。本篇将详细介绍Cocos2d-HTML5的核心概念和技术要点,帮助读者快速上手并掌握游戏开发的基本技能。 ... [详细]
  • 使用JS、HTML5和C3创建自定义弹出窗口
    本文介绍如何结合JavaScript、HTML5和C3.js来实现一个功能丰富的自定义弹出窗口。通过具体的代码示例,详细讲解了实现过程中的关键步骤和技术要点。 ... [详细]
  • 本文总结了在使用HTML5 Canvas进行开发时常见的错误及其解决方案,帮助开发者避免常见的陷阱,提高开发效率。 ... [详细]
  • 利用HTML5 Canvas构建商场监控系统的实践案例
    本文详细探讨了如何运用HTML5的Canvas技术来构建商场监控系统,旨在为相关领域的开发者提供实用的技术指导和灵感。文章不仅提供了具体的代码示例,还深入分析了实现过程中可能遇到的问题及解决方案。 ... [详细]
  • 前端技术分享——利用Canvas绘制鼠标轨迹
    作为一名前端开发者,我已经积累了Vue、React、正则表达式、算法以及小程序等方面的技能,但Canvas一直是我的盲区。因此,我在2018年为自己设定了一个新的学习目标:掌握Canvas,特别是如何使用它来创建CSS3难以实现的动态效果。 ... [详细]
  • H5技术实现经典游戏《贪吃蛇》
    本文将分享一个使用HTML5技术实现的经典小游戏——《贪吃蛇》。通过H5技术,我们将探讨如何构建这款游戏的两种主要玩法:积分闯关和无尽模式。 ... [详细]
  • HTML5大文件传输技术深度解析与实践分享
    本文深入探讨了HTML5在Web前端开发中实现大文件上传的技术细节与实践方法。通过实例分析,详细讲解了如何利用HTML5的相关特性高效、稳定地处理大文件传输问题,并提供了可供参考的代码示例和解决方案。此外,文章还讨论了常见的技术挑战及优化策略,旨在帮助开发者更好地理解和应用HTML5大文件上传技术。 ... [详细]
  • 本文介绍了如何利用摄像头捕捉图像,并将捕获的图像数据保存为文件。通过详细的代码示例,展示了摄像头调用的具体实现方法,适用于多种应用场景,如安全监控、图像处理等。 ... [详细]
  • HTML5 sever-sent onmessage方法不执行,怎么回事,求大神指点!做服务器广播,页面接收!
    我想实现HTML5sever-sent实现服务器发送消息,然后页面来获取消息,网上找了好多方法,最终找到了一个能用的,但是消息获取页面不执行onmessage方法,求大神指点!本人用.net写的,代 ... [详细]
  • 绑定完成的汗青绑定的基础是propertyChange事宜。怎样得知viewModel成员值的转变一直是开辟MVVM框架的主要题目。主流框架的处置惩罚有一下三大类:别的开辟一套AP ... [详细]
  • 一、HTML5新增属性1.1、contextmenucontextmenu的作用是指定右键菜单。<!DOCTYPEhtml><html><head> ... [详细]
  • 媒介这里大部份是本身碰到过的状况,另有一部份自创了偕行的文章,假如人人有碰到别的坑,迎接提出来一同研讨。学问要点1.Meta标签1.制止用户缩放页面,页面强迫让文档的宽度与装备的宽 ... [详细]
  • Html5-Canvas实现简易的抽奖转盘效果
    本文介绍了如何使用Html5和Canvas标签来实现简易的抽奖转盘效果,同时使用了jQueryRotate.js旋转插件。文章中给出了主要的html和css代码,并展示了实现的基本效果。 ... [详细]
  • WebSocket与Socket.io的理解
    WebSocketprotocol是HTML5一种新的协议。它的最大特点就是,服务器可以主动向客户端推送信息,客户端也可以主动向服务器发送信息,是真正的双向平等对话,属于服务器推送 ... [详细]
  • 本文介绍了前端人员必须知道的三个问题,即前端都做哪些事、前端都需要哪些技术,以及前端的发展阶段。初级阶段包括HTML、CSS、JavaScript和jQuery的基础知识。进阶阶段涵盖了面向对象编程、响应式设计、Ajax、HTML5等新兴技术。高级阶段包括架构基础、模块化开发、预编译和前沿规范等内容。此外,还介绍了一些后端服务,如Node.js。 ... [详细]
author-avatar
deniz2502915157
这个家伙很懒,什么也没留下!
RankList | 热门文章