HTML知识扩展

一.字符实体


🤬思考:我们编写的HTML会被浏览器所解析,为什么我们的HTML在浏览器中会展示为相应的页面?

  1. 如果你使用<浏览器会将其后的文本解析成一个tag
  2. 但是在某个情况下,我们确实需要编写一个小于<
  3. 这个时候我们就可以使用字符实体;

😳HTML实体是一段连字号&开头以;结尾的文本(字符串);

  1. 实体常常用于显示保留字符(这些字符会被解析成HTML代码)和不可见字符(如:不换行空格);
  2. 你也可以用实体来代替其他难以用标准键盘键入的字符。

🐸常见的字符实体

二.URL地址


🐲URL代表着统一资源定位符(Uniform Resource Locator)

🐻‍❄️通俗点讲:URL无非就是一个给定的独特资源在Web上的地址;

  1. 理论上说,每个有效的URL都指向一个唯一的资源;
  2. 这个资源可以是一个HTML页面,一个CSS文档,一幅画像,等等;

😈URL格式:URL的标准格式如下:

🐳URL和URI的区别:

  1. URI:统一资源标识符,用来标识Web技术使用的逻辑和物理资源;
  2. URL:统一资源定位符,俗称网络,相当于网络中的门牌号;

😬URI在某一个规则下能把一个资源独一无二的识别出来。

  1. URL作为一个网络Web资源的地址,可以唯一将一个资源识别出来,所以URL是一个URI;
  2. 所以URL是一个URI的一个子集;
  3. 但是URI并不一定是URL;

三.元素语义化(理解)


🐻‍❄️元素语义化:用正确的元素做正确的事情。

🤬理论上来说,所有的HTML元素,我们都可以实现同样的事情:

🙈标签语义化的好处:

  1. 方便代码维护;
  2. 减少让开发者之间的沟通成本;
  3. 能让语音合成工具正确的识别网页元素的用途,以便做出正确的反应;
  4. 有利于SEO;

四.SEO优化


🐻‍❄️搜索引擎优化(缩写为SEO)是通过了解搜索引擎的运作规则来调整网站,以及提高网站在有关搜索引擎排名的方式。

🙈蛋糕网站为例:假如你是一个卖蛋糕的网站,用户通过网站搜索蛋糕可以购买你们家的蛋糕,所以作为商家你肯定是更加希望自己的蛋糕排名更加的靠前,这样相关的效益就会更加的好,所谓SEO优化就是利用相关方案来提升自己网站的搜索排名。

👽爬虫的原理:什么是爬虫?想象一下假如你想要一些网站的数据,来放在自己的网站上面,但是自己做数据太差强人意了,所以就会使用代码来爬取其他网页中的数据,这个操作就是爬虫。

🐸SEO优化相关的元素:h1~h6一般来讲是比较重要的特别是h1中的数据,这样有可能提高搜索的权重,以提高网站的排名,这就是元素语义化和SEO的关系;


🐸百度-谷歌爬虫原理:

  1. 首先进行互联网上的各种各样的网站进行数据的抓取;
  2. 然后将爬取到的数据存储在临时库中;
  3. 在索引库中将不需要的数据进行相关的清理;
  4. 在索引区进行分类,归档,排序,然后将结果返回给用户;
  5. 用户在查询页面进行查询,然后索引区将对应的数据进行返回;
  6. 我们看到的网站就在网页中有相应的排名了;

五.字符编码


🐲字符编码本质上是计算机底层只能识别二进制,假如现在有一个场景,你需要通过微信给小伙伴发送一段节日快乐的祝福,其实在计算机或者手机中的操作如下。

  1. 你编辑的文字通过微信等应用程序按照某种(规则)转变为二进制,以一种计算机能够理解的方式;
  2. 二进制的数据通过网络的方式进行传递到你的小伙伴的手机上去;
  3. 你的小伙伴的电脑微信或者手机微信会接受这些数据,然后按照(规则)转变为相应的文字显示在眼前;
  4. 上述的这种规则本质上就是我们所说的字符编码,当编解码的方式不同的情况下就会出现乱码;

相关推荐
M_emory_18 分钟前
解决 git clone 出现:Failed to connect to 127.0.0.1 port 1080: Connection refused 错误
前端·vue.js·git
Ciito22 分钟前
vue项目使用eslint+prettier管理项目格式化
前端·javascript·vue.js
成都被卷死的程序员1 小时前
响应式网页设计--html
前端·html
mon_star°1 小时前
将答题成绩排行榜数据通过前端生成excel的方式实现导出下载功能
前端·excel
Zrf21913184551 小时前
前端笔试中oj算法题的解法模版
前端·readline·oj算法
文军的烹饪实验室2 小时前
ValueError: Circular reference detected
开发语言·前端·javascript
Martin -Tang3 小时前
vite和webpack的区别
前端·webpack·node.js·vite
迷途小码农零零发3 小时前
解锁微前端的优秀库
前端
王解4 小时前
webpack loader全解析,从入门到精通(10)
前端·webpack·node.js
我不当帕鲁谁当帕鲁4 小时前
arcgis for js实现FeatureLayer图层弹窗展示所有field字段
前端·javascript·arcgis