タグ

ブックマーク / seopack.jp (3)

  • SEO対策にh1~6見出しタグを正しく設置!検索に好まれるページ作りとは? | SEO Packブログ by ディーボ

    ページを構成する際、見出しタグをなんとなくで設定していませんか? 見出しタグは、SEO目的に設定する訳ではありませんが、目次のように見出しタグを使い、ユーザーにもGoogleにもわかりやすくコンテンツを作ります。 中でも、h1タグは重要とされています。 見出しタグの使い方は、h1~h6まですべて使う必要もなく、h2の下にh1があったとしても評価されないわけではありませんが、正しい構造をGoogleに伝えることにより、重要とされるh1タグに入っているテキストがそのページのキーワードと認識されることから、必ずh1タグは設定しましょう。 見出しタグの基的な使い方 見出しタグは、理想的なサイト構造にも似た使い方で、コンテンツ内容を構成していきます。 そして、h1タグは1ページに1つ、html5で記述する場合は、1つのsectionにつきhタグをそれぞれネスト階層に合わせたhタグを入れること

    SEO対策にh1~6見出しタグを正しく設置!検索に好まれるページ作りとは? | SEO Packブログ by ディーボ
  • レスポンシブデザイン簡単導入法02 – よく使う項目まとめ編 | SEO Packブログ by ディーボ

    ビューポートとメディアクエリを設定した後は、スマホ用のcssを調整しながら各デバイスに対応していくわけですが、その際によく使う、cssのポイントをご紹介します。 画像を可変にする レスポンシブデザインは、ビューポートの設置によって表示されるサイトの表示領域がデバイスのサイズへと変わります。その横幅に対して画像を可変にします。 下記の設定で、最大でも実寸サイズとなり、画面サイズからはみ出すことを防ぐことができます。それ以下のサイズの場合は画面幅に合わせて縮小されます。 img {max-width:100%;} スマホを横にしても文字サイズを変えない デフォルトでは、スマホを横にすると横幅に応じて、文字サイズが大きくなります。これはこれで見やすいですが、文字数が多い時など、デザイン上フォントサイズを変えたくない場合は、スマホ用cssに下記タグを追記します。 body {-webkit-te

    レスポンシブデザイン簡単導入法02 – よく使う項目まとめ編 | SEO Packブログ by ディーボ
  • レスポンシブデザイン簡単導入法01 – ビューポート・メディアクエリ編 | SEO Packブログ by ディーボ

    運営中のサイトを自分でスマホ対応にしたいという方へ、具体的なレスポンシブデザインの導入方法を数回に分けて、まとめていきたいと思います。 レスポンシブデザインについては、2015年4月21日からスマホ対応していないサイトに対して、スマホでの検索結果が下がる、モバイルフレンドリーアルゴリズムが導入されることから、モバイルユーザーの多いサイトは必須の対応となります。 モバイルフレンドリーに対応しているかどうかは、こちらから確認できます。 https://www.google.com/webmasters/tools/mobile-friendly/?hl=ja ※モバイルフレンドリーはサイト単位ではなく、ページ単位となるので、全ページ対応しないといけない訳ではありません。 今回は、このモバイルフレンドリーに対応する方法としてGoogleが推奨しているレスポンシブデザインにするための準備とポ

    レスポンシブデザイン簡単導入法01 – ビューポート・メディアクエリ編 | SEO Packブログ by ディーボ
  • 1