山本和美さんのホームページを制作しました。
音楽・教員・IT支援の歩みを、AIライティングへつなぎました。
読みやすさと、旧ブログの文章・写真の保存にもこだわりました。
新しい仕事を伝えたい。でも、大切な歩みも残したい
山本さんは、長くピアノを教え、45歳で初めて小学校の先生になった方です。 教員としての仕事を経て独立し、PC・Webやオンライン講座づくりを支えてきました。 今は、人の思いを聴き、文章にするAIライティングにも取り組まれています。
今回のサイトづくりには、二つの大切なことがありました。 これから届けたい仕事を分かりやすく紹介することと、時間をかけてまとめた経歴や写真、これまでの記録を残すことです。
僕は、新しいサービスだけを前に出すと、山本さんがなぜその仕事をするのかが伝わりにくくなると考えました。 一方で、経歴を最初からすべて並べると、相談に来た方が今のサービスを探すのに時間がかかります。 そこで、今のお困りごとから入れる案内と、じっくり歩みを読めるページを用意しました。
「話すところから」が、人柄と仕事をつなぐ
トップで伝えたのは、「自分の良さをどう書けば?」「話すところから始めましょう」という言葉です。
文章の専門用語よりも先に、自己紹介や仕事紹介を書こうとして手が止まる場面に寄り添いました。 山本さんの顔が見える写真と、やさしく話しかける言葉を合わせています。
音楽のレッスンや学校で、人の思いを聴いてきた経験。 パソコンの前で困る方と、一つずつ進めてきた経験。 それらが、思いを言葉にし、Webで届ける今の仕事へつながる順番に整理しました。
プロフィールだけを読んで終わらず、今の支援内容にも目が向く流れを大切にしています。
落ち着いた緑と丸い形で、話しかけやすい雰囲気へ
デザインは、山本さんが好まれるグリーンと丸みのある形を中心にしました。 大きな曲線、白い余白、植物の小さなあしらいで、ゆっくり読み進められる雰囲気を整えています。 ページを送るときの激しい動きは入れていません。
ご自身で作られたロゴも、ヘッダーとフッターに配置しました。 新しいサイトの中にも、ご本人が大切にしてきた目印を残しています。

60代の方が、スマートフォンでも読み進められるように
見に来られる方には60代の方が多いと伺い、見た目と読みやすさを一緒に調整しました。
見出しと本文はゴシック体にし、通常の本文はPC・スマートフォンとも18pxを基本にしています。 長い文章は白い面に濃い文字を置き、緑は周囲の背景やボタンに使いました。 読みたい文章と、その背景を見分けやすくするためです。
長い段落は左寄せにし、行間と読む幅を整えました。 画面が狭いときは段組みを縦に切り替え、番号・見出し・説明の並びも確認しています。 やわらかな雰囲気を保ちながら、読んで相談できることを確かめられる形を目指しました。
旧ブログは、文章も写真も新しい場所へ
これまでの記録も、山本さんの仕事や人柄を知る材料です。 旧ブログから、活動や経験を伝える79記事を選び、公開日と本文を保って移しました。
写真は、旧サイトのURLを貼るだけでは、元のサイトがなくなったときに見られなくなります。 そこで、405点の画像ファイルを新サイトへ保存し、保存したファイルが元画像と一致することも照合しました。
ブログ一覧は、パソコンでは4列、スマートフォンでは2列です。 移した記事にも共通のメニューやデザインを使い、同じサイトの中で読めるようにしています。
相談したいことから、次のページを選べる案内に
上部のメニューから、サポート内容、山本さんについて、お客様の声、ブログへ進めます。 サポート内容にはプルダウンを用意し、AIライティング、PC・Webサポート、オンライン講座づくりを選べるようにしました。
お客様の声は、支援の内容と、その方が形にしたかったことを一緒に読める構成です。 何を手伝ってもらえるのかを、ご本人の歩みや実際の支援例から確かめられるようにしています。
公開したサイトでは、今のサービス、これまでの歩み、日々の記録が一つにつながりました。 ご自身の経験を知ってもらいながら、相談したいことに近いページへ進めます。
積み重ねてきたことを、これからの仕事にも
今回のサイトで大切にしたのは、これまでの経験が、今の仕事を伝える材料になることでした。 音楽、教えること、パソコンの支援という歩みがあるからこそ、山本さんが「聴くこと」を大切にする理由が伝わります。
新しいサービスを始めた方や、複数の活動を一つのサイトで紹介したい方にも、参考にしていただける事例です。 サービスだけを短く案内したい場合と、歩みや記録まで読んでもらいたい場合では、必要なページも変わります。 誰に、何を知ってもらいたいかを伺いながら、残すことと伝える順番を一緒に考えます。
