公開してから気づいたこと

サイトは公開する前にも何度も見ているのですが、公開したあとに見ると、また違うところが気になります。

CMS で記事を更新するときに、この入力欄でいいのか。
Hiking のタグやカテゴリ名は、これからも使いやすそうか。
関連記事や近くのキャンプ場への導線は、記事の流れとして自然か。
スマートフォンで地図やスライドショーを触ったときに、変に引っかからないか。
ダークモードで地図が見づらくなっていないか。

どれもリニューアルの本筋ではないのですが、実際に自分で使い始めると気になるところです。
今回は、そのあたりを細かく直しつつ、Hiking の記録をもう少し別の形でも見返せるようにしました。

CMS と記事データの手入れ

まずは Pages CMS まわりを少し直しました。

リニューアル時点で、Markdown と frontmatter を Git 管理しつつ、CMS から編集できる状態にはしていました。
ただ、実際に記事を触ってみると、フィールドの型やラベル、選択肢の持ち方はもう少し詰めたくなります。

Hiking のタグを選びやすくしたり、Campground の都道府県・評価・座標情報を扱いやすくしたり。
また、山行の日数のように、本文に手書きするよりもデータとして持っておいた方がよさそうな項目も見えてきました。

CMS は入れたら終わりではなくて、実際に更新してみてから直す部分がけっこうあります。
このへんは派手ではないですが、後から記事を増やすことを考えると早めに直しておきたいところでした。

Hiking と Campground のつながり

Hiking 記事は、単体で読めるだけでもいいのですが、自分のサイトではもう少し周辺情報とつなげておきたいと思っています。

近くの Campground、関連する Hiking 記事、GPX ルート、写真、タグ。
こうした情報が記事の近くにあると、あとから見返すときに便利です。

Campground 側も、ただの記事ではなく、場所や座標、評価を持ったデータとして扱うようにしました。
座標があると、Hiking 記事から近くのキャンプ場を出すような見せ方にも使えます。

それから、山歩き系のカテゴリ名は Trail から Hiking に変更しました。
以前の Trail という名前は、道やルートそのもののニュアンスが強く、記事カテゴリとして見ると少し狭い感じがありました。山行記録、写真、GPX、キャンプ場とのつながりまで含めて扱うなら、Hiking の方が今のサイトには合っています。

カテゴリ名を変えるだけなら簡単そうに見えますが、実際には URL、CMS の設定、タグ、ナビゲーション、関連記事の出し方にも関わります。
後から変えるほど面倒になるところなので、リニューアル直後のうちに Hiking へそろえました。

歩いたルートを地図で見返すコンテンツを作った

今回いちばん大きかったのは、歩いたルートをまとめて地図で見返す Footprints コンテンツを新しく追加したことです。

もともと Hiking 記事には GPX ファイルを持たせていて、記事ごとのルート表示には使っていました。
ただ、せっかく GPX があるのに、それをまとめて見返せる場所がありませんでした。

YAMAP はもちろん便利です。活動履歴も見られますし、ダッシュボード的な使い方もできます。
ただ、自分のサイトの記事と一緒に、歩いたルートをまとめて眺める場所としては少し違う。記事、写真、ルート、距離、日数を、自分のサイトの中でつなげて見たい気持ちがありました。

そこで、Codex の力を借りながら、この Footprints コンテンツを作りました。
やったこととしては、GPX を読み込んで地図上に重ね、ルート一覧から選択できるようにし、記事へのリンクも付ける、というものです。

途中で、ルート選択と記事リンクは分けた方がよさそうだと感じました。
ルート名を押すと地図上のルートを選択する。記事アイコンを押すと記事へ移動する。こう分けたことで、操作の意味が少し分かりやすくなりました。

距離と日数の見せ方も直しています。
距離は記録としての数値、日数はルートの規模感として見えるようにしたかったので、表示の強弱を少し変えました。

さらに、選択したルートに合わせて地図をズームし、エレベーショングラフも出すようにしました。
ルート選択時には、地図上のポイントとグラフのカーソルがスタートからゴールへ進むようにもしています。必須機能ではないですが、線だけで見るより、歩いた記録として見返しやすくなったと思います。

スマートフォンでは、地図を見やすくするためにルート一覧をボトムシートのようにしました。
畳んだ状態でも、選択中のルート名、距離、日数、記事リンクは残しています。小さい画面では、一覧をずっと大きく出すより、このくらいの方が使いやすそうでした。

見た目と操作感の調整

あわせて、細かな見た目も直しています。

ダークモードでは、Mapbox の地図を単純に暗くすればよいわけではありませんでした。
記事内の地図はルート確認として見やすい方がよく、歩いたルートをまとめて見る Footprints コンテンツの地図はページ全体の雰囲気にも合わせたい。結果として、ページごとに少し違う調整にしています。

RELATED、ROUTE、FOOTPRINTS、ACCESS、NEARBY のような英字見出しやボタンのイタリックも外しました。
装飾として目立たせるより、日本語見出しを支えるラベルくらいの見え方の方が合っている気がしました。

Hiking トップの Open Footprints Map ボタンも、フォント、ウェイト、サイズ、アイコンを調整しました。
歩いたルートの地図コンテンツへの入口なので目には入ってほしいですが、記事一覧の中で浮きすぎるのも違う。そのあたりを少しずつ寄せています。

ヘッダの最大幅や、Footprints コンテンツ内のルート一覧パネルの位置も見直しました。
広い画面では中央に置くだけだと少しバランスが悪かったので、地図との関係を見ながら調整しています。

まだ直後なので

リニューアルしてからまだ日が浅いので、今回の話は大きな振り返りというより、公開直後に触って直したメモに近いです。

ただ、Footprints コンテンツは単なる微調整ではなく、GPX ファイルがあったから作れた新しいコンテンツです。
記事ごとのルート表示だけではなく、歩いた場所をまとめて見返せるページができたことで、Hiking コンテンツの見え方は少し変わったと思います。

今後も、記事を追加しながら気になったところは直していくつもりです。
大きく作り直すというより、使いながら必要なところをちゃんと直す。リニューアル直後は、まずそれくらいの距離感で見ていこうと思います。