百度前端学院_小薇课堂_task_1

来源：互联网发布：淘宝ccc证书编号编辑：程序博客网时间：2024/04/28 15:13

任务一目的

了解HTML的定义，概念、发展简史
掌握常用html标签的含义、用法
能够基于设计稿来合理规划html文档结构
理解语义化，合理地使用html标签来构建页面

任务注意事项

参考示例图
只需要完成HTML代码编写，不需要写CSS
示例图仅为参考，不需要完全实现一致，其中的图片、文案均可自行设定
尽可能多地尝试更多的HTML标签

在线学习参考资料

Web相关名词通俗解释
MDN HTML入门
慕课HTML+CSS基础教程视频

效果图

点击查看

ps:这里演示效果中出了点小bug，链接的那个样式前面的小黑点没有显示，把源码下载下来，在浏览器中查看能正常显示，与设计稿无异，我感觉应该是设置github演示的时候的问题，调了好久没调好，希望大神指教。

源码

点击查看

总结

主要是对HTML标签的理解
- 这个任务总体来说没什么难度，学完教程中的内容，完全可以根据设计稿实现HTML文档结构。

`HTML`定义、概念、发展简史

定义

HTML 是用来描述网页的一种语言。
HTML 指的是超文本标记语言 (Hyper Text Markup Language)
HTML 不是一种编程语言，而是一种标记语言 (markup language)
标记语言是一套标记标签 (markup tag)
HTML 使用标记标签来描述网页

概念

`HTML` 标签

HTML 标记标签通常被称为 HTML 标签 (HTML tag)。
HTML 标签是由尖括号包围的关键词，比如
HTML 标签通常是成对出现的，比如和
标签对中的第一个标签是开始标签，第二个标签是结束标签
开始和结束标签也被称为开放标签和闭合标签

`HTML` 文档 = 网页

HTML 文档描述网页
HTML 文档包含 HTML 标签和纯文本
HTML 文档也被称为网页
Web 浏览器的作用是读取 HTML 文档，并以网页的形式显示出它们。浏览器不会显示 HTML 标签，而是使用标签来解释页面的内容：

<html><body><h1>My First Heading</h1><p>My first paragraph.</p></body></html>

发展简史

现在我们常常习惯于用数字来描述
HTML的版本（如：HTML5），但是最
初的时候我们并没有HTML1，而是
1993年IETF团队的一个草案，并不是成型的标准。
两年之后，在1995年HTML有了第二版，即HTML2.0，当时是作为RFC1866发布的。
有了以上的两个历史版本，HTML的发展可谓突飞猛进。1996年HTML3.2成为W3C推荐标准。之后在1997年和1999年，作为升级版本的4.0和4.01也相继成为W3C的推荐标准。
在2000年基于HTML4.01的ISO HTML成为了国际标准化组织和国际电工委员会的标准。于是被沿用至今，这期间虽然有点小的改动但大方向上终归没有什么变化。
从1993-2000之间短短的7年时间，HTML语言有着很大的发展，基于诸多人的努力，终于产生了我们现在用的HTML语言。

`html`语义化

根据内容的结构化（内容语义化），选择合适的标签（代码语义化）便于开发者阅读和写出更优雅的代码的同时让浏览器的爬虫和机器很好地解析。

为什么要语义化？

为了在没有CSS的情况下，页面也能呈现出很好地内容结构、代码结构:为了裸奔时好看；
用户体验：例如title、alt用于解释名词或解释图片信息、label标签的活用；
有利于SEO：和搜索引擎建立良好沟通，有助于爬虫抓取更多的有效信息：爬虫依赖于标签来确定上下文和各个关键字的权重；
方便其他设备解析（如屏幕阅读器、盲人阅读器、移动设备）以意义的方式来渲染网页；
便于团队开发和维护，语义化更具可读性，是下一步吧网页的重要动向，遵循W3C标准的团队都遵循这个标准，可以减少差异化。

原文地址：简书地址
原创文章，未经作者允许不得转载，违者必究，转载请注明出处。

阅读全文

0 0

百度前端学院_小薇课堂_task_1

任务一目的

任务注意事项

在线学习参考资料

效果图

源码

总结

HTML定义、概念、发展简史

定义

概念

HTML 标签

HTML 文档 = 网页

发展简史

html语义化

为什么要语义化？

`HTML`定义、概念、发展简史

`HTML` 标签

`HTML` 文档 = 网页

`html`语义化