苏鹏HTML5视频教程-365资源论坛提供

这套苏鹏的 HTML5 视频教程，从资料包的痕迹看，主题落点比标题窄，也比很多同类课实在：它没有铺开讲 CSS3 动画、Canvas 游戏或移动端适配那一整套，而是把火力集中在「语义化标记」这一块——也就是 header、nav、article、section、aside、footer 这批用来定位网页内容的新标签，以及它们如何组合出一份结构清晰的文档。对已经会写 div 布局、但对标签语义一直含糊的人来说，这个切口值得留意。

课纲含金量在哪

HTML5 的语义标签本身不难，难的是判断「什么时候该用 section、什么时候该用 article、aside 到底能不能嵌套」。这套教程的价值不在标签清单，而在它把每个标记放回具体文档结构里讲：一个页面里导航区、正文主体、侧边栏、页脚各自对应哪个元素，嵌套层级怎么安排才合理。这类判断在查文档时通常得不到直接答案，只能靠看别人怎么组织页面来积累。课程简介里那句「说明如何使用这些新标记来组织你自己的文档结构」，基本点明了它的重心。

哪些章节值得精看

• 讲新标记逐个登场、并演示如何用它们搭出一份完整文档骨架的部分，是整门课的主干，建议逐段跟做，不要只扫一遍。
• 涉及 article 与 section 区分的段落值得反复看，这两个标签的边界最容易被写混，也是面试和代码评审里最常被追问的点。
• 结构组织示例的部分，重点不在代码本身，而在作者怎么拆一个页面——把这块的拆解思路记下来，比记住标签名字有用得多。
• 如果资料包里带有章节笔记，优先对照笔记里的结构示意，而不是只看视频里敲出的代码。

资料包怎么拆开用

这类视频课的资料通常分三层：视频本体、章节笔记、配套代码或素材。合理的拆法是——第一遍跟着视频走，只求理解每个标记出现的语境；第二遍脱离视频，只看笔记里的结构示意，自己默写一份页面骨架；第三遍再回头对照代码，看自己漏了哪层嵌套。笔记不要当讲义收藏，要当检查清单用：每学完一节，拿它逼自己复述一遍「这个标签解决的是什么组织问题」。至于论坛提供的压缩包，先只解出当节需要的部分，全部铺开反而会让人在文件名里迷路，忘了真正要学的是结构判断。

适合谁，不适合谁

它适合两类人：一类是写过一段时间 div 布局、想把自己代码的语义层级理顺的前端新手；另一类是准备面试、需要把「语义化」这个词从口号落到具体例子上的人。它不适合冲着整站项目实战来的人——这门课的产出是一份结构干净的文档骨架，而不是一个完整可上线的页面。把它当作语义化这一个知识点的专项补课，预期会更准。