《HTML5和CSS3快速参考》——1.3HTML5的品牌化

简介:

本节书摘来自异步社区《HTML5和CSS3快速参考》一书中的第1章,第1.3节,作者: 【美】Sergey Mavrody 更多章节内容可以访问云栖社区“异步社区”公众号查看。

1.3HTML5的品牌化

2011年1月18日,W3C推出了HTML5视觉品牌,即它的logo以及涉及现代化网站和Web应用程序方方面面的各项技术类图标。这些logo、图标和网站都在知识共享署名协议3.0下获得了授权。

如果有相关网站或应用程序在构建过程中使用了HTML5技术,W3C鼓励视觉品牌来明示产品对这项技术的支持。


a4ab6ba6bc45b879a4143380cab761db88a1efcf

Logo
当然,有了HTML5的logo并不能保证相关代码的有效性和延续性。

技术类图标
语义元素


32e1aa5c8bb28bbb3a1d5b390cfcf8df5358d7ca

语义元素,即相关结构元素所代表的含义,是HTML5技术的前沿与核心。它包括一个较丰富的标签集、RDFa、微数据以及相关的微格式。这些技术将有利于我们为用户和相关程序开发出一个更为有用的、数据驱动的Web页面。

离线与存储


68d3b18ae57c9f8e2124a36d7240a835aabdf9fc

这项技术可以使Web应用程序在即便没有互联网连接的情况下也能快速启动并工作。这要归功于HTML5自身的App缓存、本地存储、索引数据库以及相关的文件API规则。

设备访问


f9dea06388b3e27430f1fcebe8f119ec0d7a918e

从与地理定位相关的API开始,如今的Web应用程序已经具备了非常丰富的设备感知能力,包括它的视频/音频输入接口可以直接访问麦克风和摄像头,也可以访问本地数据(例如通信录、事件、倾斜度)1。

连通性


f2d58c637d7afd5976139b7528ffc626aa36191c

更有效的连通性意味着即时通信更实时、游戏更快速、沟通更便捷。并且在客户端与服务器端之间,Web Sockets以及服务器发送事件时的数据推送(双关语2)也比之前更为有效。

多媒体


<a href=https://yqfile.alicdn.com/93321e2f983d04081a554118ef6d7e8a7ff3382e.png" >

除了相关插件和外部播放器之外,HTML5还引入了< audio >、< vidio >等内置媒体元素,这将更便于我们在HTML文档中插入媒体。

3D图形与相关效果


1d058ade4c4ec8236bb76f01e21230241028cf73

有了SVG、Canvas、WebGL以及CSS3中的3D特性,我们就肯定能在浏览器中制造出令用户眼花缭乱的、非常震撼的视觉效果。

性能与集成


<a href=https://yqfile.alicdn.com/03a89d5de4834cc2020600c87ec6f3fc16fe07f1.png" >

这使我们能利用各种技巧与技术(例如Web Workers和XMLHttpRequest 2)使相关的Web应用以及某些动态的Web内容运行得更加快速。总而言之,“不要让用户来等你的表”。
CSS3


<a href=https://yqfile.alicdn.com/d5ed5fc604f7aecc59e5b40c77fd2454a748a5e3.png" >

CSS3提供了一系列用处广泛的程式和效果,可以在不改变相关结构语义和性能的前提下增强我们的Web应用。除此之外,如今的Web在开放字体格式、布局能力以及排版控制方面也比以前增强了许多。
相关文章
|
22天前
|
人工智能 程序员 UED
【01】完成新年倒计时页面-蛇年新年快乐倒计时领取礼物放烟花html代码优雅草科技央千澈写采用html5+div+CSS+JavaScript-优雅草卓伊凡-做一条关于新年的代码分享给你们-为了C站的分拼一下子
【01】完成新年倒计时页面-蛇年新年快乐倒计时领取礼物放烟花html代码优雅草科技央千澈写采用html5+div+CSS+JavaScript-优雅草卓伊凡-做一条关于新年的代码分享给你们-为了C站的分拼一下子
103 21
【01】完成新年倒计时页面-蛇年新年快乐倒计时领取礼物放烟花html代码优雅草科技央千澈写采用html5+div+CSS+JavaScript-优雅草卓伊凡-做一条关于新年的代码分享给你们-为了C站的分拼一下子
|
20天前
|
前端开发 JavaScript
【02】v1.0.1更新增加倒计时完成后的放烟花页面-优化播放器-优化结构目录-蛇年新年快乐倒计时领取礼物放烟花html代码优雅草科技央千澈写采用html5+div+CSS+JavaScript-优雅草卓伊凡-做一条关于新年的代码分享给你们-为了C站的分拼一下子
【02】v1.0.1更新增加倒计时完成后的放烟花页面-优化播放器-优化结构目录-蛇年新年快乐倒计时领取礼物放烟花html代码优雅草科技央千澈写采用html5+div+CSS+JavaScript-优雅草卓伊凡-做一条关于新年的代码分享给你们-为了C站的分拼一下子
47 14
【02】v1.0.1更新增加倒计时完成后的放烟花页面-优化播放器-优化结构目录-蛇年新年快乐倒计时领取礼物放烟花html代码优雅草科技央千澈写采用html5+div+CSS+JavaScript-优雅草卓伊凡-做一条关于新年的代码分享给你们-为了C站的分拼一下子
|
19天前
css3 svg制作404页面动画效果HTML源码
css3 svg制作404页面动画效果HTML源码
61 34
|
23天前
html+js+css实现的建筑方块立体数字时钟源码
html+js+css实现的建筑方块立体数字时钟源码
69 33
|
2月前
一个好看的小时钟html+js+css源码
一个好看的小时钟html+js+css源码
115 24
|
3月前
|
前端开发 测试技术 定位技术
如何利用HTML和CSS构建企业级网站的全过程。从项目概述到页面结构设计,再到HTML结构搭建与CSS样式设计,最后实现具体页面并进行优化提升,全面覆盖了网站开发的关键步骤
本文深入介绍了如何利用HTML和CSS构建企业级网站的全过程。从项目概述到页面结构设计,再到HTML结构搭建与CSS样式设计,最后实现具体页面并进行优化提升,全面覆盖了网站开发的关键步骤。通过实例展示了主页、关于我们、产品展示、新闻动态及联系我们等页面的设计与实现,强调了合理布局、美观设计及用户体验的重要性。旨在为企业打造一个既专业又具吸引力的线上平台。
108 7
|
3月前
|
前端开发 JavaScript 搜索推荐
HTML与CSS在Web组件化中的核心作用及前端技术趋势
本文探讨了HTML与CSS在Web组件化中的核心作用及前端技术趋势。从结构定义、语义化到样式封装与布局控制,两者不仅提升了代码复用率和可维护性,还通过响应式设计、动态样式等技术增强了用户体验。面对兼容性、代码复杂度等挑战,文章提出了相应的解决策略,强调了持续创新的重要性,旨在构建高效、灵活的Web应用。
62 6
|
3月前
|
存储 移动开发 前端开发
高效的 HTML 与 CSS 编写技巧,涵盖语义化标签、文档结构优化、CSS 预处理、模块化设计、选择器优化、CSS 变量、媒体查询等内容
本文深入探讨了高效的 HTML 与 CSS 编写技巧,涵盖语义化标签、文档结构优化、CSS 预处理、模块化设计、选择器优化、CSS 变量、媒体查询等内容,旨在提升开发效率、网站性能和用户体验。
79 5
|
3月前
|
前端开发 JavaScript UED
在数字化时代,Web 应用性能优化尤为重要。本文探讨了CSS与HTML在提升Web性能中的关键作用及未来趋势
在数字化时代,Web 应用性能优化尤为重要。本文探讨了CSS与HTML在提升Web性能中的关键作用及未来趋势,包括样式表优化、DOM操作减少、图像优化等技术,并分析了电商网站的具体案例,强调了技术演进对Web性能的深远影响。
57 5