2017-02-10
FE
语义化和文章排版
语义化的目的是提高机器对文章的阅读能力,排版是为了更好地供人阅读,两者都跟阅读产生了或虚或实的关系,语义化标准看到了这点,并给出了较好的方案,现代的语义化主要构造在文章排版之上。
最近在为这个破站做 SEO,而SEO首先要做的事情就是在开发的时候要注意 html语义化,即用语义化标签来写html,我曾提到过:
网页即组件树,是一类带权html树
eczn’s blog -《网页即组件树》
语义化标签其实就是上面提到的带权结点,而这里的权并不是指 CSS 纬度上的,而是对于爬虫的内容优先权。
如果页面都是嵌套的 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
而这些问题主要是:
  • 语义化标签的选择
  • 居中 对齐
  • 对图片的处理
  • 内外边距 块级行级的选择
  • 字体选择 (大小颜色类型字体库)
  • 响应式
这些问题解决了,一个较完整的排版方案就出来了。




回到顶部