Web制作(フリーランスWebデザイナー)

日にち2017/1/18
SEO対策

最低限コーディングでやっとくSEO対策

この記事は書いてから 約 10か月 経過しています。

最低限コーディングでやっとくSEO対策

最低限SEO対策について実施している事を書いていこうと思います。とりあうえずこれをやれば、狙ったキーワードがある程度最初の方のページにいきます。あとは、どんだけサイトがクリックされるか、サイトを常に更新できるのかで変わってきます。ただキーワードを考えずに闇雲に更新しても意味は無いとだけお伝えしときます。

最初のキーワード選びが大切

サイトを制作する前にどのページにどのキーワードを入れるかを決める=キーワードマッピングを考えていきます。
下層に行くにつれてキーワードを絞り、特定キーワード(ECサイトなら商品名)にします。
キーワード選びはサイト制作するのには絶対にかかせません。まずは、キーワードを決めてからサイト構成やテキスト内容を考えていきます。

サイトタイトルタグ

タイトルの最初にキーワードがあるほうが良いです。Googleがキーワードを認識しやすくなります。
以前と比べると、重要度は落ちましたがタイトルのどの位置にキーワードを入れるかによって順位が変化すると考えていいかと思います。また、Googleでは、検索結果上で勝手にタイトルを変えられてしまう場合があるので、ページ毎に関連したタイトルをいれていきます。

魅力的なタイトルにしよう

検索エンジンの画面で他のサイトと差別化させます。他のサイトでは無い特別感を出す事でクリックされやすくなります。更にクリックされることにより順位が上がってきます。
ターゲットキーワードをうまく組み合わせて魅力的でわかりやすい文言にしつつ、タイトルを考えます。しかし、キーワードを入れすぎて変なタイトルにならないように気をつけます。

タイトルの文字数は?

検索結果画面に表示される文字数は、30文字前後となっています。それ以降は「…」になるので、出来る限り30文字以内で収めるようにします。

他のページと同じタイトルはしない

各ページオリジナルの文言にしながら、タイトルを作ります。 重複によりGoogleに評価されにくくなってしまいます。いくらSEO対策しても上昇しない可能性が出てくるので、面倒くさがらずに1つ1つ丁寧にタイトルを決めていきます。

ディスクリプションタグとは

検索結果のタイトル下に表示するサイトページの説明文です。キーワードを入れつつ60〜80文字以内に収める様にしています。ちょっと前までは120文字前後でしたが、スマホが普及してスマホで表示する文字数が減ったので80文字以内に収めます。また、検索結果に表示されるので、タイトル関連付けしつつ魅力的な文言を入れていきます。さらにユーザーが見てもわかりやすく説明する事によってクリック率が上がります。

現在のキーワードタグ

現在は、キーワードタグを入れても検索結果には無意味です。なので、他のサイトのソースを見てみると入れてないサイトがちらほら見つかるかと思います。しかし、今後使う可能性が出てくるかもしれません。怠らず入れといた方が無難だと思います。

怠ってはいけないhタグ

hタグは見出しを入れるときに使うタグです。出来るだけh1は1ページに1つにしましょう。しかし、HTML5からは1ページにいくついれても良いとされています。時には1ページに2つ使う時もありますが、基本は1ページに1つです。

h1とtitleは基本的には同じテキスト内容を入れましょう。よくヘッダー内やロゴの横にありますアレです!タイトルと同じにすると言う事は短く簡潔な文言を入れるというのを意識します。

また、hタグはh1からh6まであります。数字順に書いていくことが大切になります。

リンクについて

普通にハイパーリンクを置けばいいわけでは無いです。よく「詳しくはこちら」とだけ書いてあるサイトがあります。ただこれはユーザビリティからするとあまり良く無いです。デザイン上文字数が長くなるからダサいとかあるかもしれません。しかし、「○○○○の詳細を知りたい方はこちら」などとリンク先に何が書いてあるのかがはっきりわかる様にするのが良いです。

被リンクとは

外部のサイトからリンクがはられることです。
被リンクを増やすことによってGoogleに評価されやすくなり、検索順位があがります。
さまざまなドメインからの被リンク(被リンクドメイン数)は、サイトの質を上げるために重要です。。

内部リンクとは

上で説明した通り、リンク先が明確にわかる内容でリンクにします。また、当たり前の事ですが、リンクエラーは絶対に避けましょう。重要なページは各ページから内部リンクを集中させます。テキスト内やメニューなどでリンクを集中させリンク先のページの評価をあげていきます。

alt属性について

画像(imgタグ)に入れる属性です。

alt属性とは、画像表示に必要なHTMLタグのimg要素プロパティ(属性)の一つです。
alt属性には、画像の説明を記述します。
alt属性は、代替テキストであり、画像が表示されない場合、alt属性の記述内容が表示されます。
さらに、画像検索でも使用されるため、alt属性に画像説明を適切に記述しておくことが大切になる。
SEOスパム判定されることもあるので注意
NG → img src=”単語 スペース 区切り 絶対 駄目”

文字を強調させるstrong・emタグとは

strong・emタグはテキストを太くする際に使います。また、その箇所が重要であるという事を検索エンジンに伝えるタグでもあります。

strongとemのSEOに対する影響はあまり無いと言われているが、まだまだ効果はあると思います。
storngタグは「強い強調」、emタグは「強調」を意味します。1ページに5つくらいに抑えてタグを使います。

マークアップは怠らずに!

SEOで重要です。検索順位には直接は関係ありません。ただ、クリック率が上がり検索順位が上がるという考えになります。なので、しっかりマークアップをしていきます。特にパンくずはユーザビリティの向上はもちろんです。Googleのクローラーにも適切かつスムーズにこの手順を踏んでもらいサイトやページの価値を把握してもらいましょう。その結果、Googleの検索結果のタイトル下に表示します。経験上パンくずは3階層目から表示するかと思います。2階層目まではURLのみでした。←ここはもうちょっと調査していきたいです。

今回はパンくずのみコードを載せておきます。他にもheaderやfooterやナビゲーション部分などにもマークアップします。

マークアップを確認したい場合は、Googleの構造化データ テストツールを使うといいです。

<ul id="breadcrumbs" itemscope itemtype="http://schema.org/BreadcrumbList">
    <li class="item" itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem"><a href="/" itemprop="item"><span itemprop="name">HOME</span></a><meta itemprop="position" content="1" />&nbsp;>&nbsp; </li>
    <li class="item" itemprop="itemListElement" itemscope itemtype="http://schema.org/ListItem"><a href="/" itemprop="item"><span itemprop="name">パンくず</span></a><meta itemprop="position" content="2" /></li>
</ul>
facebook twitter

© 2013-2017 visual hallucination.