ポートフォリオサイトのSEO対策としてやったこと

福岡出身で、現在は東京でWebデザインやアプリ開発に関わっています。このサイトでは、制作実績だけでなく、勉強会やハッカソン、発表の記録、iPhoneアクセサリーのレビューなども公開しています。

以前は、作品を掲載しておけば自然に見つけてもらえると思っていました。しかし、検索エンジンから訪れる人にとっては、どんなサイトなのか、何を得られるのかが短時間で分かる構成のほうが重要です。

そこで、ポートフォリオの見せ方を見直しながら、検索キーワード、ページ構成、表示速度、内部リンク、更新方法を少しずつ整えました。大規模な施策ではなく、個人サイトでも続けやすい改善が中心です。

SEOは検索順位だけを見るのではなく、初めて訪れた人が活動内容を理解し、別のページも読んでくれる状態を作ることだと考えています。制作記録を資産として残す意味でも、取り組む価値がありました。

サイトの目的と検索意図を整理する

最初に、サイトへ来てほしい人を考えました。Webデザイナーを探している人、UIデザインの制作過程を知りたい人、アプリ開発や勉強会の活動に興味がある人など、複数の読者像があります。

読者ごとに関心のある言葉も異なるため、「Webデザイナーポートフォリオ」「iPhoneアプリ開発」「Figma チーム制作」など、実際に検索されそうな組み合わせを洗い出しました。検索ボリュームだけでなく、自分の経験と結びつくかも重視しています。

実績ページでは完成画像だけを並べず、担当範囲、使用ツール、制作期間、工夫した点を説明するようにしました。具体的な情報が増えると、仕事の進め方や得意分野も伝わりやすくなります。

トップページには、職種と活動内容がすぐ分かる短い説明を置きました。プロフィール、制作実績、開発メモ、イベント記録、レビューという分類も明確にし、訪問者が目的の情報へ移動しやすい導線を作っています。

タイトルや見出しには、ページの内容を正確に表す言葉を使いました。曖昧な「Works」だけではなく、「Webサイト制作実績」や「アプリ開発の記録」のように、検索語と意味がつながる表現を選んでいます。

ブログ記事では、制作中に迷ったことや試した方法も残しています。たとえば、スマートフォンだけで更新する流れをまとめた iPhoneからの更新方法のように、同じ悩みを持つ人が具体的に使える内容を意識しました。

検索エンジンがページの内容を読み取りやすくするため、見出しの階層、ページタイトル、ディスクリプション、画像の代替テキストを確認しました。装飾目的の要素と、情報を伝える要素を分けることも意識しています。

スマートフォンで見たときの余白や文字サイズも調整しました。ポートフォリオを見る人は、移動中やSNSのリンクからアクセスすることも多いため、画面幅が変わっても作品の概要を追えることが大切です。

特に確認した項目は次のとおりです。

記事を公開しただけでは、読者が次に読むページへ移動できないことがあります。そこで、本文中に関連する制作記録や技術メモへのリンクを自然に追加しました。リンク先の内容が分かるアンカーテキストにすることも意識しています。

JavaScriptの学習記事では、用語を調べながら書いたJavaScriptの基礎メモへつなげています。記事間の関係が見えると、検索から来た人がサイト内を回遊しやすくなり、自分の学習の積み重ねも伝わります。

カテゴリーやタグは増やしすぎず、内容が近い記事をまとめるために使いました。リンクを置くこと自体を目的にせず、そのページを読むと理解が深まる場面に絞るのがポイントです。

作品を見せるサイトでは画像の印象が大きい一方で、高解像度の画像をそのまま掲載すると読み込みが遅くなります。書き出しサイズを用途に合わせ、必要以上に大きな画像を置かないようにしました。

Figmaで作った画面やUIの説明では、画像だけで終わらせず、設計意図や検討したことを文章でも補足しています。チーム制作での共有方法を振り返った Figmaのライブラリ共有の記事にも、制作環境を説明する手がかりがあります。

更新時には、見た目と速度を次の項目で確認しています。

Search Consoleやアクセス解析では、表示回数、クリック数、検索キーワード、ページごとの流入を確認しています。すぐに順位が上がるかだけで判断せず、どの記事が検索の入口になっているかを見るようにしました。

思っていなかった記事が読まれている場合は、関連する記事へのリンクを追加します。反対に、タイトルだけでは内容が伝わりにくいページは、見出しや冒頭の説明を書き直します。

ポートフォリオサイトのSEO対策としてやったことは、特別な施策を一度に実施することではありません。自分の活動を分かりやすく整理し、読者が迷わず内容へたどり着ける状態を少しずつ作ることでした。

これからも、Webデザインやアプリ開発、勉強会で得た知識を制作記録として公開していきます。活動内容や制作の進め方に興味がある方は、ポートフォリオと各記事を通して、現在の取り組みをご覧ください。