デザイナーが知っておきたいSEO対策

記事公開日:2016.06.01

最終更新日:2017.08.29

118 PV

CSS85_mbakubiwokashige20131019_TP_V

最近いろいろな場面でSEOという言葉を耳にしますね。主婦の方でもアフィリエイトをされている方は知っているのではないでしょうか?WEBサイトを制作していく上でデザイナーも意識しなくてはいけないものなのですが、実際SEOが何で制作する時に何に気をつけたほうがいいのか不透明だったので調べてみました。

そもそもSEOとは「検索エンジン最適化(Search Engine Optimization)」のことなのですが、聞いたことはあるけどなんだっけ?と私自身思っているので書いて残しておきたいと思います笑 検索エンジン最適化とは、私たちがGoogleYahooの検索エンジンで、特定のキーワードを検索した時に、ページの上の方に表示されるようにする対策のことです。ただ何も考えずサイトを作っているのでは、検索エンジンにひっかかりません。

デザイナーがコーディングする上で気をつけなければならないものがいくつかあります。

titleタグの中身が大事なのは基礎中の基礎!

titleタグというのをページの頭ら辺に記述するのですが、titleタグはいわばページの題名です。検索結果のページにも出ます。めちゃくちゃ重要です!が、たくさん詰め込もうとすると逆効果になってしまいます。自然な文章で、できれば34文字以内でつけるのがベストだと思います。(34文字を超えると省略されます。)

文字数の制限もあるので、キーワードはよく考えてつけなきゃだめですね!

meta description

サイトを制作する時に結構悩むのがdescriptiondescription<head>内に記述するタグです。これも検索結果のページに出ます!titleタグとの違いはというと、titleタグは検索ページのリストにページタイトルとして表示されます。一方、descriptionはサイトの説明文として検索結果のページに表示されます。順位向上そのものにはあまり影響しないそうです!

じゃあ、記述するかというと、「オーガニック検索」のためです!私もオーガニッック検索というんだと衝撃を受けています。検索エンジンで検索した際、最初の方に広告が出てきます。その後に並んでいるのがオーガニック検索です。

そこでdescriptionで記述した単語が検索に引っかかるかもしれないという可能性があります。description35120文字以内なので省略されないよう文字数を考えて書きましょう!

alt属性の記述

画像挿入の時などに多く使われるalt属性に記述した文言は、ネット回線が混雑していて画像の読み込みが遅い時に画像の替わりにaltの文言が表示されます。本来の用途としては、様々なユーザーの環境に配慮したものです。先輩に言われるまで私はalt属性を書いていませんでした

検索エンジンでは文字列は認識されるものの、順位向上には影響しないので、descriptionと同等の扱いなので、記述したほうがいいと思います!

見出しタグ<h1>

たまにh1がないサイトを見かけます。かくいう私もwebデザイナーの勉強をしていた時に、h1がないサイトを作ったことがあります。無知って怖いですね見出しがなくてもGoogleはサイトのテーマを把握するみたいですが、サイトの内容を認知してもらうためにもh1を記述することは大事です。

まとめ

今までSEOという言葉を多く耳にしていたにも関わらず、デザイナーにはあまり関係ないだろうと思っていましたが、SEOはむしろデザイナーが注意しなければならないものだと今回調べてわかりました。コーディングでは検索エンジンの認知しやすさ、構成のわかりやすさを意識して制作していきたいです!

このエントリーをはてなブックマークに追加

筆者

Y.Urushizaki

1日を100%全力で生きるをモットーに毎日すごしています。幸せだなと思う瞬間は仕事終わりに「今日も頑張った」と思いながら駐車場まで歩く時と、近所の野良猫と遊んでいる時です。最近自覚したことは周囲も驚くほどの雨女だったことで、過去に行ったテーマパーク(ディズニー・ユニバ・富士急・ナガスパ)はほとんど雨の思い出がしかありません。たまにテーマパークで晴れると自分より強い晴れ男・晴れ女が存在する事実に少しテンションがあがります。

筆者が最近執筆した記事