IEF零基础学习日志—第一天

虽然标明是第一天,但自己其实在几天前就开始自学html和css了
不过差别也不是很大就是了
主要是因为,前几天都是啃w3school的基础教程,除了网页端自带的编辑系统和实验操作以外,根本找不到像样的项目来驱动自己学习,因此才会参考IEF的课程来进行系统性学习
然后就是WDN上的内容,无论是详细程度还是知识结构框架都比w3school好不少,因此以后主要的阅读教材还是以WDN上的内容为主,w3仅作为快速补充和参考迅速过一遍就行了
至于书单以及后面的安排,就到时候再说吧,桥到船头自然直不是吗?

闲话扯太多了,开始进入正题吧


首先是IEF第二天作业留下来的几个问题,用自己的理解来回答一下

一.html是什么?HTML5是什么?

html是用来描述网页的一种语言
1.html是一种标记语言,而不是程序语言
2.标记语言是一套标记标签,表现为<...>
3.html采用标记标签来描述网页


image.png

这里贴一张来自MDN的图,很直观的展示了标记标签如果构成元素,html、或者说网页本身就是由很多这样的元素构成的

至于HTML5,是html的最新版本,相比于自己的老祖宗,html5添加了一些新的东西,也舍弃了一些很老旧的内容
因为进度原因,关于html5的详细内容尚未接触太多,以后可能会补充
现目前只知道这玩意儿就是个更牛逼更完善的html规则就行...

二.HTML元素标签、属性都是什么概念?

就是问的html标签:
1.表现形式为带尖括号的关键词,如

、等等
2.这玩意通常是成对出现的,比如开头的为开始标签,结尾的为结束标签。当然不排除个例,比如:



等等,实际使用时他们都只有一个标签
3.网页就是由这些标签+纯文本组成

至于属性,可以为html元素提供附加信息,且这些信息不会出现在实际显示的内容中
基本的表现形式为:
1.只能在开始标签中规定
2.属性值采用小写,并且始终都要加上双引号


image.png

还是扒的WDN的图,感觉很直观

三.文档类型是什么概念,起什么作用?

应该就是这个....
这个声明必须在html文档的第一行,也就是在标签之前
其规定了html页面所必须遵守的良好规则,能自动检错或检测其它有用的东西

在 HTML中,文档类型 doctype 的声明是必要的。在所有文档的头部,你都将会看到"" 的身影。这个声明的目的是防止浏览器在渲染文档时,切换到我们称为“[怪异模式(兼容模式)”的渲染模式。“" 确保浏览器按照最佳的相关规范进行渲染,而不是使用一个不符合规范的渲染模式。

这是引用WDN的原文描述,个人对这个声明理解比较模糊,以后如果有深入理解再来补充
总之现在只需要知道这玩意很重要,第一段必写就行了...

四.meta标签都用来做什么的?

在标签里声明的,元素又称为元数据,即:描述数据的数据,一般有以下几个用途:
1.指定文档中的字符编码,eg:
算是很标准的字符声明了,一般也只会用这个
2.添加作者和描述,以及在搜索引擎中description的使用,感觉是涉及到web语义化的一些内容,eg:


或者


作用就是更方便被搜索引擎识别
需要注意的是标签的里的两个属性name和content,前者指定meta元素的类型,即该元素包含了什么样的信息;后者则是指定了详细内容
3.在网站上增加自定义图标
感觉没什么用...

五.web语义化是什么,为了解决什么样的问题?

就是在正确的地方用正确的标签,使得人和机器都方便理解内容,即使是没有CSS样式,也可以正常阅读和理解

语义化的web页面一方面可以让机器在更少的人类干预情况下收集并研究网页的信息,从而可以读懂网页的内容,然后将收集汇总的信息进行分析,结果为人类所用;另一方面它可以让开发人员读懂结构和用户以及屏幕阅读器(如果访客有视障)能够读懂内容。简单来说就是利于 SEO,便于阅读维护理解

总之,HTML语义化是反对大篇幅使用无语义化的div+span+class,而鼓励使用HTML定义好的语义化标签

六.链接是什么概念,对应什么标签?

就是网页通往各处的传送门,以便于获得互联网上各种各样的资源
也就是你们喜闻乐见的蓝色神秘代码

对应的标签是,在这里需要提到两个常用的属性:href和name

前者可以用来连接到网站,如:

Visit W3School!

这里的target属性是对链接后进行的操作,赋值为"_blank"就是在新标签页打开
也可以用来发邮件,比如:

向 nowhere 发邮件

这里就不在赘述了

后者name属性可以用来规定锚点,制作html页面中的书签:
首先,在html文档中对锚点进行命名(创建书签):

书签名

然后,我们在同一个文档中创建指向该锚的链接:

点此跳转

七.常用标签都有哪些,都适合用在什么场景?

结合web语义化的内容就很好回答了,WDN上的标签描述指定能用在哪些地方,就用在哪些地方
不过为了方便总结还是搬一些下来吧...

~

:就是标题,也只能用在标题

:就是段落,一般用于正文

:页眉,也就是网页抬头,一般会包含标题元素,logo或者搜索框一类的东西