语义化的目的是提高机器对文章的阅读能力,排版是为了更好地供人阅读,两者都跟阅读产生了或虚或实的关系,语义化标准看到了这点,并给出了较好的方案,现代的语义化主要构造在文章排版之上。
最近在为这个破站做 SEO,而SEO首先要做的事情就是在开发的时候要注意 html语义化,即用语义化标签来写html,我曾提到过:
网页即组件树,是一类带权html树
eczn’s blog -《网页即组件树》
语义化标签其实就是上面提到的带权结点,而这里的权并不是指
CSS
纬度上的,而是对于爬虫的内容优先权。如果页面都是嵌套的
毫无疑问,搜索引擎会更喜欢有意义的 summary 和 article 而不是一堆 div 和 span
div
,这对开发来说也不会怎样,但是对于爬虫来说就麻烦了,它不知道这些div的权重,但是如果使用了语义化标签,比如 <summary>
<article>
,爬虫肯定能知道 article 是正文,而 summary 是摘要,显然,摘要是浓缩后的文段,或者具有启发性的,所以它可能会认为,摘要的权更高,搜索的时候应该优先在摘要里面找。毫无疑问,搜索引擎会更喜欢有意义的 summary 和 article 而不是一堆 div 和 span
等等,summary,article?还有
header
footer
? 这不是排版的操作对象么?这可不是巧合,因为爬虫的阅读过程其实跟人类类似,因此语义化就像是给html排版一样,因此排版的问题在html上大概就变成了处理以下这些标签的问题:
-
article
aside
details
figcaption
-
figure
footer
header
main
mark
-
nav
section
summary
time
而这些问题主要是:
- 语义化标签的选择
- 居中 对齐
- 对图片的处理
- 内外边距 块级行级的选择
- 字体选择 (大小颜色类型字体库)
- 响应式
这些问题解决了,一个较完整的排版方案就出来了。