植樹会の案内を読みやすくする、自然保全サイトの表示速度改善
植樹会の集合場所を確かめようとスマートフォンを開いたのに、地図がいつまでも表示されない。参加者が困るのは、ページ全体の読み込みが遅いことより、今必要な情報を読めないことです。表示速度を見直すなら、画像の容量に加えて、文字がいつ現れるか、読み込み中にボタンの位置がずれないかも確かめたいところです。
「速い」を、参加者の行動に置き換える
自然保全サイトを訪れる目的は、記事を読む、開催日時を確かめる、申込みへ進むなど、ページによって異なります。まず主要なページごとに、訪問者が最初に必要とする情報を決めましょう。参加案内なら日時・場所・参加条件、活動報告なら本文の冒頭が目安です。大きな写真が表示されるまで案内を読めない構成では、写真が美しくても参加者には不便です。
確認は、運営者の高速な通信環境だけで済ませないこと。スマートフォンのモバイル回線を想定し、トップページから参加案内を開く場合と、検索結果から案内ページへ直接入る場合を試します。検索からの初回訪問では、画像などの保存済みデータがなく、遅さが表れやすくなります。
測定値と実際の画面を一緒に見る
速度測定ツールでは、主要な内容が表示されるまでの時間、操作への反応、読み込み中のレイアウトのずれを確認できます。ただ、点数だけで修正の順番を決めないほうがよいでしょう。「集合場所は読めるが、写真が現れると申込みボタンが下へずれる」など、画面で起きたことを記録すると、直す箇所が見えてきます。通信状態や端末で結果は変わるので、同じ条件で複数回測り、変更前後を比べます。
最初に表示するものを絞る
大きな画像は表示を遅くしがちです。植樹地の様子を伝える写真は残し、掲載サイズに合った寸法で書き出します。スマートフォンの小さな表示枠に、印刷用の高解像度データをそのまま送る必要はありません。対応できる環境ならWebPなどの軽い形式も検討し、圧縮後も樹種の識別や現場の説明に必要な細部が見えるか確かめます。
画面の下の方にある写真は、スクロールして近づいたときに読み込む設定にすれば、冒頭の表示を優先できます。ただし、最初に見える重要な画像まで遅らせると、かえって空白が長く残ることも。画像の幅と高さを指定して表示領域を確保すれば、後から写真が現れて文章やボタンが動くのも防ぎやすくなります。写真の選び方や説明の付け方は、森林保全の記事に写真・図解を添えるときの確認点も参考になります。
写真を減らす前に、役割を確かめる
集合場所の目印や作業時の服装を示す写真は、参加者の不安を減らす情報です。枚数だけを減らすのではなく、内容が重複する装飾画像や、自動再生される大きな動画から見直しましょう。現地へのアクセス図を画像で載せる場合も、住所や最寄りの交通手段を文字で添えれば、図の読み込みを待たずに確認できます。
見えない読み込みを整理する
ページでは写真のほかに、フォント、装飾用のプログラム、埋め込み地図、アクセス解析なども読み込まれます。機能を追加したら、初回表示から必要かを確認します。開催場所の地図なら、先に住所と交通案内を文字で示し、操作できる地図は必要になったときに表示する方法もあります。
- 使っていない機能を止める：以前の催しで使った申込み部品や装飾が残っていないか確認する。
- 文字を優先する：案内本文が装飾用の処理を待たずに表示されるようにする。
- 同じデータの再取得を減らす：更新頻度に応じて画像や共通ファイルの保存設定を確認する。ただし、変更される開催日時が古いまま残らないよう注意する。
- 外部の埋め込みを見直す：地図や動画が遅い場合は、文字による案内を先に置く。
サイト管理者が設定を変更できないなら、制作担当者に「どのページの、どの要素が表示を妨げているか」を伝えます。プラグインや保存設定を一度に変えると原因を追いにくくなるため、一項目ずつ変更し、公開前の画面で確かめるのが安全です。
速さのために、使いやすさを削らない
本文をすべて画像にしたり、必要な説明を折りたたみの中に隠したりすると、参加するかどうか判断しづらくなります。低速回線でも、日時、費用の有無、持ち物、雨天時の対応、問い合わせ先は文字で読める状態にしておきましょう。申込みボタンも、目立たせるために動きを加えると、読み込みや誤操作につながることがあります。
速度と情報の探しやすさは、別々に点検します。ページがすぐ開いても、参加条件が見つからなければ用を足せません。項目の並べ方に迷ったら、自然保全サイトのメニューをわかりやすくする方法で扱う行き先の名称や分類も確認してみてください。
小さな変更を、同じ手順で確かめる
改善前に、対象ページのURL、確認した端末、通信条件、操作手順を控えます。変更は、影響の大きい画像を一枚適正なサイズにするなど、一つずつ。公開後は速さだけでなく、写真の説明が読めるか、申込みボタンがずれないか、地図を使わずに集合場所を確認できるかも試します。
次の植樹会の案内を更新するときは、まずスマートフォンでページを開き、日時と集合場所が読めるようになった時点を記録してみてください。冒頭の写真を掲載幅に合わせて書き出したら、同じ条件でもう一度開く。表示の変化と、写真に必要な細部が残っているかを一緒に確かめられます。
