ブログ
依存の中の依存
脆弱性の警告が29件。数字だけ見ると手のつけようがないが、分類すると実質3つの問題だった。自動で出てくる更新PRの危険度の見分け方と、直接の依存を上げたのに警告が消えなかった理由。
追従する目次と、画面の取り合い
PCで右側に追従させていた目次を、スマホでは上部に貼り付けた。ところが貼り付くものは画面を占め続けるため、本文を読む場所が足りなくなる。情報を消さずに縦を横へ並べ替えた話と、「飛んだ先がバーの裏に隠れる」という副作用への対処。
推測させるのをやめる
sitemap.xml・robots.txt・構造化データ。バラバラの施策に見えて、やっていることは同じだった。これまで相手に推測させていたことを、こちらから明示的に伝える。そして実装中に見つけた、一覧用のクエリを流用すると21本目から静かに漏れ始めるという落とし穴。
wwwのあるなしで、別のサイトになる
kisaku.site と www.kisaku.site はどちらを開いても同じ画面が出る。しかし機械から見ると別のサイトになる。apexドメインにCNAMEを置けない理由と、Search Console・GA4・OGPの3か所すべてで同じホスト名に揃えなければならなかった話。
「読み終えた」をどう数えるか
GA4にはスクロール距離の計測が最初からある。それでも使わなかった。スクロール率が測っているのは「画面が下まで移動したか」であって、「読み終えたか」ではないから。サイトにすでにある読了状態を使って、未読から読了に変わった瞬間だけを送るまでの記録。
「来なかった人」を見るために
アクセス解析は来た人しか教えてくれない。検索結果に出たのに押されなかった、そもそも出ていない——それを見るのがSearch Console。プロパティ種別と所有権の確認方法を、5つの選択肢から選ぶまでの判断。
ページを10枚見ても「1」と数えられる問題
Next.jsはページを読み込み直さない。表示は速いが、計測から見ると「ずっと同じページを見ている」ようにしか映らない。Googleタグマネージャーを挟んでページ内遷移を拾い、さらに初回だけ二重に数えられる問題を止めるまで。
GA4を入れる前に決めたこと
サイトを公開してから一度も、誰が何を見ているかを確認していなかった。Googleアナリティクス4を導入するにあたって、手順よりも先に決めたことがある。何を見るか、そして何を追わないか。プロパティ設計と測定IDまでの記録。
速くしたら、壊れた — 表示1.7秒を0.03秒にするまでと、その代償
サイトの表示が遅い、という話から始まった作業です。結果として最初の1バイトが返るまでの時間は約1.7秒から0.03秒になりました。50倍以上です。 ただしこの記事の本題は、その数字ではありません。速くしたことで、別の場所 […]
読む体験をつくる — 目次の自動生成から読了状態の保存まで
記事を5本公開したあと、読む側の体験を作り込みました。目次の自動生成、追従する目次、読了状況の表示と保存、スマートフォンのメニュー、読了目安の時間。あわせて、トップページの見た目も見直しています。 この記事は、その実装記 […]
本番公開でつまずいた11のこと — 仕組みから解説
前回、ローカルで作ったサイトを本番公開するまでの記録を書きました。今回はその中で出てきた仕組みを、初めて触る人向けに整理して解説します。 作業記録だけだと「こう直した」で終わってしまい、次に似た場面で応用が効きません。な […]
なぜこの構成にしたのか — ヘッドレスWordPress + Next.js の技術選定
ポートフォリオサイトを、素のHTMLで書かれた静的サイトから「ヘッドレスWordPress + Next.js」という構成に作り直しました。前回までの記事では、実際にやった作業と、そこでつまずいた内容を書いてきました。 […]