ブログのアップデート

[KushibikiMashu]

やることリスト

what

重要度で分類する。実装しやすいものより、重要な機能から実装する

⭐️⭐️⭐️（直帰率を下げる）

• ページの下部に、「同じカテゴリの記事」を表示する
• ページの下部に、「前後の記事」を表示する
  ~~ （SP）ページの上部に、常に「一覧に戻る」ボタンを表示する ~~
• floating action buttonとdrawerを実装。記事の一覧をいつでも見れるようにする

⭐️⭐️（ブログを読みやすくする）

• ページの下部に、常にシェアボタンを表示する
• 引用（blockquote）の背景色を変更する
• 引用の時イタリックになる挙動を変更する
• コードの背景色を変更する
• 折り返し（word-break）word単位にする
• リスト表示時、・の左右のmarginを狭める
• 目次を表示する
  • 目次の背景色を設定する

ブログの左右に背景色を設定する（没入感）（テーマ的に簡単にできない）
~~ (PC)右側に目次を表示する~~

⭐️（シェアを促す）

• post下部の自己紹介を広めにとる
• 画像、js, cssの配信にcacheを使う
• シェアボタンを真ん中に配置する
  ~~ (PC)左側にシェアボタンを表示する ~~
• シェアボタンを丸くする

SEO

プラグインの追加

• gatsby-plugin-canonical-urls
• gatsby-plugin-robots-txt
• gatsby-plugin-catch-links
• 全ての記事に「updated_at」を付与する
• 公開日と更新日を表示する
• 記事のリライト。見出しの変更や情報の追加など
• <>や→といった記号をアイコンに変更する
• 前後の記事のCSS崩れを修正。max-widthを設定する

• SSRのdocumentがundefinedになるバグを修正する（→useEffectで対処）
• copy linkのボタンのアイコンをclipからlinkに変更する

https://qiita.com/Takumon/items/da8347f81a9f021b637f

~~ フォントを変更する ~~
~~ 文字のboldを変更する~~

フォントは、noteやQiitaと同じなので問題なし。boldも同左。

why

直帰率を減らす＋回遊率をあげたい。
スマホファースト

直帰率が高い。Creepy Nutsのファンサイトは50%。

パソコンからのアクセスの方が多い

how

React書くぞ！
ライブラリ探すぞ！

tips

スマホで動作確認
gatsbyjs/gatsby#5801 (comment)

1/18

直帰率が下がって欲しい