常规优化

url优化

  1. 固定链接
  2. 简化链接，减少网站层级
  • 安装插件
1
npm install hexo-abbrlink --save
  • 配置_config.yml
1
2
3
4
5
#permalink: :year/:month/:day/:title/
permalink: article/:abbrlink.html
abbrlink:
  alg: crc32  # 算法：crc16(default) and crc32
  rep: hex    # 进制：dec(default) and hex

启用https

看你网站部署在什么平台，如果自建的服务器，那就自己配置了，我这里直接托管cloudflare，自动转https

sitemap

  • 安装插件
1
npm install hexo-generator-sitemap --save

后续hexo g会自动生成sitemap文件

robots.txt

细节优化

后续补充

Missing alt text

原主题top_img代码：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
if !theme.disable_top_img && page.top_img !== false
  if is_post()
    - var top_img = page.top_img || page.cover || page.randomcover
  else if is_page()
    - var top_img = page.top_img || theme.default_top_img
  else if is_home()
    - var top_img = theme.index_img !== false ? theme.index_img || theme.default_top_img : false
    - var home_index_img = theme.index_img !== false ? theme.index_img || theme.default_top_img : false
  else
    - var top_img = page.top_img || theme.default_top_img

  if top_img !== false
    - var imgSource = top_img && top_img.indexOf('/') !== -1 ? url_for(top_img) : top_img
    - var bg_img = top_img ? imgSource : ''
    - var home_index_img_bg = home_index_img ? home_index_img : ''
    - var site_title = page.title || page.tag || page.category || config.title
    - var isHomeClass = is_home() ? 'full_page' : 'not-home-page'
    - is_post() ? isHomeClass = 'post-bg' : isHomeClass
  else
    - var isHomeClass = 'not-top-img'
else
  - var top_img = false
  - var isHomeClass = 'not-top-img'
header#page-header(class=`${isHomeClass}` style=home_index_img_bg)
  !=partial('includes/header/nav', {}, {cache: true})
  if top_img !== false
    if is_post()
      if page.bilibili_bg
        !=partial('includes/bili-banner/index')
      else
        include ./post-info.pug
        if theme.dynamicEffect && theme.dynamicEffect.postTopWave
          section.main-hero-waves-area.waves-area
            svg.waves-svg(xmlns='http://www.w3.org/2000/svg ', xlink='http://www.w3.org/1999/xlink ', viewBox='0 24 150 28', preserveAspectRatio='none', shape-rendering='auto')
              defs
                path#gentle-wave(d='M -160 44 c 30 0 58 -18 88 -18 s 58 18 88 18 s 58 -18 88 -18 s 58 18 88 18 v 44 h -352 Z')
              g.parallax
                use(href='#gentle-wave', x='48', y='0')
                use(href='#gentle-wave', x='48', y='3')
                use(href='#gentle-wave', x='48', y='5')
                use(href='#gentle-wave', x='48', y='7')
        #post-top-cover
          img#post-top-bg(class='nolazyload' src=bg_img)

    else if is_home() 
      #site-info
        h1#site-title=site_title
        if theme.subtitle.enable
          - var loadSubJs = true
          #site-subtitle
            span#subtitle
        if(theme.social)
          #site_social_icons
            !=fragment_cache('social', function(){return partial('includes/header/social')})
      #scroll-down
        i.anzhiyufont.anzhiyu-icon-angle-down.scroll-down-effects
    else
      #page-site-info
        h1#site-title=site_title

仔细观察图片相关属性，可以发现没有alt text属性：

1
2
#post-top-cover
          img#post-top-bg(class='nolazyload' src=bg_img)

追加alt优化：

1
2
#post-top-cover
          img#post-top-bg(class='nolazyload' src=bg_img alt=`${page.title || 'Default Alt Text'}`)

Multiple H1 tags

h1 tag一般一个页面只建议有一个，但是很多主题都不会注意这个问题，查了全网，只有这里谈了这个问题：

多个 h1 tag · next-theme/hexo-theme-next · Discussion #390

问题排查，在源码：

1
2
3
4
5
6
7
<div class="site-meta">
        <a href="/" class="brand" rel="start">
        <i class="logo-line"></i>
        <h1 class="site-title">site name</h1>
        <i class="logo-line"></i>
    </a>
</div>

中已拥有一个h1标签，而文章的标题又使用了一个h1标签：

1
2
3
<h1 class="post-title" itemprop="name headline">
                XXX
</h1>

帖子博主给了修复，见链接：Fix multiple h1 tag by stevenjoezhang · Pull Request #416 · next-theme/hexo-theme-next

当然，我目前使用的模板是安知鱼，是butterfly魔改的，理论上都有这个问题，随便打开页面，然后审计页面源码，可以发现多出的h1标签在card_author和post处：

1
2
3
4
if(theme.social)
        .author-info__bottom-group
          a.author-info__bottom-group-left(href=url_for(theme.aside.card_author.name_link))
            h1.author-info__name=config.author
1
2
3
4
if (theme.post_meta.page.tags)
          each item, index in page.tags.data
            a(href=url_for(item.path) tabindex="-1" itemprop="url")=item.name
        h1#CrawlerTitle(itemprop="name headline")= page.title || _p('no_title')

作者信息用h1没必要，可以替换为h2，第二个h1标签是为了优化爬虫的，但是我们页面已经有h1了，爬虫也能识别的，这里就没必要了，可以这样改：

1
2
3
4
if(theme.social)
        .author-info__bottom-group
          a.author-info__bottom-group-left(href=url_for(theme.aside.card_author.name_link))
            h2.author-info__name=config.author

这样改会有一些问题，但是问题不大，读者可以自己去找，嘿嘿

1
2
3
4
if (theme.post_meta.page.tags)
          each item, index in page.tags.data
            a(href=url_for(item.path) tabindex="-1" itemprop="url")=item.name
        //- h1#CrawlerTitle(itemprop="name headline")= page.title || _p('no_title') 修复多出的h1

直接注销

3XX redirect

3XX redirect in sitemap

Canonical points to redirect