こんにちは！新人デザイナーのkayoです。寒くなってきて服装に悩む季節になりましたね。
今回はデザインにとって重要なSEOについて、私の学びを皆さんに共有したいと思います。

ちなみにSEO対策について以前yossyさんが書いた記事もありますので合わせてご覧ください。

SEOって何？

SEO(Search Engine Optimization)とは、検索エンジン最適化を意味します。

簡単に言えば、検索エンジン（GoogleやYahoo!など）の検索結果でサイトを上位に表示させるためのテクニックや工夫のことです。たとえば「美味しいカフェ　関西」と検索して表示されるサイトの上位に、自分がデザインしたカフェのサイトが表示されたら多くの人に見てもらえるチャンスが増えますね。SEO対策をすることは、広告に頼らずにサイトの訪問者を増やす上でとても重要となってきます。

日本における検索エンジンのトップシェアはGoogleです。
Googleの自動ランキングシステムは、ユーザーにメリットをもたらすことを主な目的として作成されており、有用で信頼できる情報を検索結果の上位に掲載できるように設計されています。

検索順位の決まりかた

検索結果で上位に表示させるために何が必要なのかを知る前に、まずは検索順位（検索して表示される順番）はどのように決まるのかをGoogle検索の３つのステージをもとに説明します。

情報収集（クロール）

クローラーと呼ばれる自動プログラム（検索エンジンのロボット）がネット上のWebサイトを巡回してテキストや画像、動画を収集します。

情報の整理とサーバーでの保管（インデックス登録）

クロールで収集された情報は、ページ内容に関連したキーワードで検索された時に表示されるようにGoogleのデータベースに保管されます。

検索結果の表示（サーチャー）

ユーザーが探している情報に関連性が最も高い情報をランキングにしてユーザーに表示します。

クロールに問題があればインデックスされずランキングにも表示されませんし、クロールしたものもインデックスされなければランキングされることもありません。つまり検索結果の上位表示させるためにはユーザーから求められるページやサイトであることと同時に検索エンジン（ロボット）から理解されることが重要となります。
またランキングはユーザーの反応や検索エンジンのアップデート等により日々変動するので、公開後も改善し続ける必要があります。

WebデザイナーとSEOの関係

「デザインとSEOって関係あるの？」と疑問に思う方もいるかもしれません。でも実はWebデザインがSEOに与える影響はとても大きいものです。ここではWeb制作する上で関わってくる項目をいくつか紹介します。

ページの読み込み速度

ページがすぐに表示されるかどうかは、SEOにも影響を与える大事な要素です。画像が大きすぎると読み込みが遅くなり、結果としてユーザーがサイトを離れてしまうかもしれません。
また読み込み速度が速くなることで検索エンジンが効率よくクロール（情報収集）できるようになります。読み込み速度を速くするために、画像の圧縮や不要なコードの削除を行うのもデザイナーの大事な仕事となります。

モバイル対応（レスポンシブデザイン）

スマホで見ても見やすいデザインは、SEOでも高評価を受けます。Googleは「モバイルフレンドリーなサイト」を重視するようになっているため、スマホやタブレットでも快適に見られるように設計することが、検索順位を上げるポイントになります。

ユーザー体験（UX）

ユーザーが迷わず目的の情報にたどり着けるサイトは、SEOにもプラスに働きます。ナビゲーションが分かりやすく、探している情報を見つけやすいレイアウトを作ることで、ユーザーも満足し、結果的に検索エンジンの評価も高くなります。

テキストと画像のバランス

サイトに適切なテキスト量があることも大切です。デザインが美しいだけでなく、適切なキーワードが含まれたテキストがあると、検索エンジンに「このサイトには役立つ情報がある」と認識されやすくなります。また、画像には「alt属性」（画像の説明）を設定することで、検索エンジンが画像の内容を理解しやすくなります。

具体的に心がけたいこと

正しいマークアップ

見出しタグ（h1, h2など）を適切に使用することでページの主題や各セクションのサブトピックなどを明確に伝えることができます。そうすることで検索エンジンはページ内容を正確に認識し、検索意図に沿った表示ができるようになります。

またアクセシビリティの面でマークアップが適切であると、スクリーンリーダーなどを使用する方にもページ内容がわかりやすくなります。検索エンジンもこういったUXの向上を評価するので、結果的にSEO対策にもなります。

そして私が特に改善しないといけないと感じているのは、不要なタグや複雑なマークアップを避けることです。不必要に囲んでしまいがちですが、ページの読み込みが速いほど検索エンジンはそのページを好み、ユーザーの離脱率も低くなります。ページ速度はSEOに直接的な影響を与える要素であるためシンプルかつ最適、つまり無駄のないマークアップが必要となります。

画像の最適化

画像を使う際もSEOに配慮することが大切です。検索エンジンは画像自体を理解することはできないため以下の要素で内容を補足する必要があります。

ファイル名

画像ファイル名に画像の内容を簡潔に表す名前をつけることで、どんな画像なのかを検索エンジンに教えます。
今まではデータを管理する上で分かりやすい名称をつけていましたが、検索エンジンのことも考慮する必要があると思いました。

alt属性

画像の内容を説明するための代替テキストはたびたび省略することもありましたが、視覚障害を持つ方への配慮や、画像検索での流入に役立つためきちんと取り扱わないといけません。

ただ、装飾のために使用している画像はページのコンテンツに情報を追加するものではなく、既に隣にテキストがあったり、視覚的に装飾するだけの画像に代替テキストを付けてしまうとスクリーンリーダーがすべて読み上げてしまい、かえって視覚障害を持つ方を混乱させてしまう結果になります。こういった場合はalt属性を空欄にすることでスクリーンリーダーや検索エンジンが読み飛ばしてくれます。
参照：W3C(Decorative Images)

ファイルサイズの軽量化

画像は軽量化しページ読み込み速度を高めることが大事です。私も実際に、必要以上に高画質なものを使用していたりサイズが大きすぎていたりする画像を使用してしまったことがありました。素材をそのまま使用するのではなく、ページに適切なものに調整することを心がけて制作したいですね。

レスポンシブデザイン

モバイル端末からのアクセスが増えている現代では、レスポンシブデザインを取り入れることが必須です。先述しましたがGoogleはモバイルフレンドリーなサイトを好みます。

デバイスの幅に応じて柔軟にデザインが変化するよう、フォントサイズを適切に調整することや、ボタンを押しやすい大きさで配置することが重要です。

まとめ

今回SEOについて調べたことで、Web制作におけるレスポンシブデザインや画像調整、マークアップなどひとつひとつが結果的にSEO対策につながり大きな意味があることが分かりました。ユーザーにとって見やすく分かりやすいサイトを作ることが大切、というのは間違いではありませんが、ユーザーに見つけてもらえるためにもSEO対策をしっかりと心がけたいと感じました。

日の出医療福祉グループ クリエイティブ室では医療・介護・保育を始めとする医療福祉業界の様々な制作を行っています。Webサイト制作や運営、集客に関するお悩みから、パンフレットやチラシなどDTP制作まで、制作に関することはひととおり対応可能ですので、お気軽にご相談ください！