PCで右側に追従させていた目次を、スマホでは上部に貼り付けた。ところが貼り付くものは画面を占め続けるため、本文を読む場所が足りなくなる。情報を消さずに縦を横へ並べ替えた話と、「飛んだ先がバーの裏に隠れる」という副作用への対処。

Next.jsはページを読み込み直さない。表示は速いが、計測から見ると「ずっと同じページを見ている」ようにしか映らない。Googleタグマネージャーを挟んでページ内遷移を拾い、さらに初回だけ二重に数えられる問題を止めるまで。

記事を5本公開したあと、読む側の体験を作り込みました。目次の自動生成、追従する目次、読了状況の表示と保存、スマートフォンのメニュー、読了目安の時間。あわせて、トップページの見た目も見直しています。 この記事は、その実装記 […]