前端seo

蔚落 2022-07-13 14:38 402阅读 0赞

今天和大家分享一个小编在日常工作中前端优化知识，如有不足，望指正。

# 前端SEO #

## 网站结构布局优化(扁平化结构) ##

*  控制首页链接数量  
    
    
     *  网站首页权重最高，要好好利用它
     *  链接数量要适中，数量太多，分散网站主页权重，对于中小型企业，网站首页的链接数量为100个以内。链接的性质可以包括页面导航、底部导航、锚文字链接等。有价值的链接
 *  扁平化的目录层次(链接3级以内)，一般用户点击3次链接，如果没有找到目标页面就走了
 *  导航SEO 优化  
    
    
     *  面包屑导航(每个网页加上)  
        
        
         *  让用户了解当前所处位置
         *  使用户可以了解网组织形式
         *  放在正文标题部分的左上角，告知用户现在所在的网页
     *  细节问题  
        
        
         *  内容分页，比较多，一般一页在20-50条  
            
            
             *  首页-上页-下页-尾页
             *  首页1 2 3 4 5 6 7 8 9 10 下一页,更利于爬虫抓取页面
             *  首页 1 2 3 4 5 6 7 8 9 10 下拉框 ，终极选择，更加利于爬虫爬取页面，利于搜索引擎搜索到
 *  控制页面的大小，一个页面大小不要超过100K,这样加载速度就快

## 代码优化 ##

### 某些标签优化 ###

- title 标签，重要关键词，不要过分堆砌
    - meta keywords 关键词，不要过分堆砌
    - meta description 网页描述

### 网页语义化 ###

*  h1~h6标签多用于标题
 *  ul有序列表
 *  ol无序列表
 *  正文标题 h1 ，副标题 h2 ，其余h就不用了
 *  table 表格最好加上caption
 *  img 使用alt说明
 *  strong em 与 b i ,如果是仅仅是为了加粗文字，使用strong 或者 em ,如果是为了文字斜体，使用b i
 *  重要内容的html代码放在最前面
 *  重要内容不要用js输出，爬虫爬不到js
 *  尽量少用iframe框架，因为爬虫不会爬取iframe中内容
 *  谨慎使用display:none;建议使用z-index 或者设置到浏览器显示范围外。爬虫会过滤到display:none的内容
 *  不断精简代码。能用一个标签的实现的不要用2个标签

## seo实战 ##

*  title 和网页主题一致
 *  面包屑导航
 *  使用h1描述标题 ，若太大，可以使用css调整
 *  标签内不要使用 使用padding等来处理