h5 也就是 HTML5，它是超文本标记语言的第五个大版本，是现在网页制作最基础的核心语言，主要用来搭建网页的页面结构，配合 CSS 负责样式美化，JavaScript 负责交互动作，三者合起来就是前端网页开发最基础三件套，平时我们刷到的移动端活动页面宣传页小游戏，很多都是用 h5 技术制作的，不需要单独安装 APP，打开浏览器或者微信内置浏览器就可以直接访问运行。很多人会把 h5 理解成一种独立软件，其实它本质是标记语言，不是编程语言，它本身不能写复杂逻辑运算，核心作用就是定义网页里面文字图片按钮视频音频这些元素，让浏览器可以识别并且渲染出页面，新版 h5 相比旧版本增加了很多原生能力，比如原生播放音视频画布绘图地理位置获取本地存储，不再依赖 Flash 这类第三方插件，跨平台兼容性更好，手机平板电脑都可以正常打开，这也是现在移动端 h5 页面大量普及的根本原因。
h5 核心基础概念
HTML 全称是超文本标记语言，h5 就是它的第五代标准，由万维网联盟制定规范，所有主流浏览器都支持这套标准。标记语言的特点是使用标签来描述内容，每一个标签都有对应的语义，比如标题标签段落标签图片标签视频标签，浏览器读取这些标签之后，按照规范把内容展示成可视化页面。
h5 和传统网页最大升级点，就是原生支持多媒体，新增语义化标签，增加画布绘图接口，支持离线缓存，还可以调用设备部分硬件能力，同时适配移动端不同屏幕尺寸，实现响应式页面，同一套页面可以自动适配手机竖屏和平板电脑。
h5 三大配套技术分工
| 技术名称 | 主要作用 | 通俗理解 |
|---|---|---|
| HTML5 | 搭建页面结构，定义内容元素 | 相当于房子的框架墙体 |
| CSS | 设置颜色大小位置动画样式 | 相当于装修涂料家具外观 |
| JavaScript | 实现点击滑动动态交互逻辑 | 相当于电路开关实现动态功能 |
单独 h5 只能做出静态页面，如果想要点击按钮切换页面，滑动翻页动画，表单校验，就必须搭配 JavaScript，想要页面好看，调整字体颜色边距，就需要 CSS。
h5 常见应用场景
1 营销活动页，企业宣传邀请函年会页面，微信里面传播最多的就是这类 h5
2 轻量小游戏，不需要下载客户端，浏览器直接打开游玩
3 产品介绍页，企业官网移动端页面
4 在线表单问卷，报名收集信息页面
5 电子书幻灯片翻页类展示页面
h5 基础特点
1 跨平台，只要有浏览器就可以运行，安卓苹果电脑 Windows 系统都支持
2 免安装，不需要下载安装包，分享链接就能打开
3 语义化标签，代码可读性更好，利于搜索引擎抓取
4 原生多媒体，不需要 Flash 插件，直接嵌入视频音频
5 响应式适配，可以根据屏幕宽度自动调整布局
6 开源标准，免费使用，不需要授权费用
h5 基础开发流程
1 新建后缀为 html 的文本文件，编写 h5 基础骨架代码
2 使用 h5 标签添加文字图片按钮视频等页面元素
3 编写 CSS 代码，调整页面样式，适配移动端屏幕
4 编写 JavaScript 代码，增加交互效果
5 保存文件之后，直接双击就可以在浏览器预览效果
6 如果需要对外分享，可以把文件上传到服务器，生成访问链接
h5 局限性
h5 虽然应用广泛，但是也存在短板，相比原生 APP，它调用手机底层硬件能力有限，复杂大型游戏性能不如原生应用，长时间运行容易耗电，部分浏览器对新接口支持程度不一样，会出现兼容性问题，不同手机浏览器打开页面效果可能存在差异，需要做兼容调试。
h5 作为前端基础标准，入门门槛低，适合新手学习网页开发，现在很多可视化 h5 制作平台，不需要手写代码，拖拽组件就能生成 h5 页面，进一步降低使用难度，不管是代码开发还是可视化制作，底层核心都是 h5 这套网页标准，学会 h5 之后再继续学习 CSS 和 JS，就可以完整掌握前端网页开发。
【常见问题】
问题 1 h5 是编程语言吗
回答 1 h5 不是编程语言，h5 也就是 HTML5 属于标记语言，它只负责定义页面结构，不能独立编写运算逻辑，复杂交互需要搭配 JavaScript 才能实现。
问题 2 h5 页面可以在微信里面直接打开吗
回答 2 h5 页面可以在微信内置浏览器直接打开，不需要安装软件，只需要获取对应的 h5 访问链接，点击链接就可以加载页面，这也是 h5 在社交传播场景大量使用的原因。
问题 3 h5 和 APP 有什么区别
回答 3 h5 是网页形式，免安装跨平台，通过浏览器运行，APP 是独立安装包，需要下载安装，h5 调用硬件能力和性能上限低于原生 APP，但是传播制作成本比 APP 更低。
问题 4 零基础可以学习 h5 吗
回答 4 零基础可以学习 h5，h5 入门难度很低，先熟悉基础标签结构，再搭配 CSS 和 JavaScript 逐步练习，也可以先用可视化 h5 制作工具上手，理解页面原理之后再学习手写代码。
【免责申明】
本内容为 h5 技术基础科普介绍，相关标准会持续更新，不同浏览器版本对 h5 新特性支持存在差异，本文仅做基础知识讲解，不涉及商业授权相关承诺，实际开发请以官方最新规范为准。