divタグを使ったレイアウト(4)

今回でdivタグを使ったレイアウトに関するCSS解説も最終回となります。できれば今までのhtmlとCSSを実際にファイル保存して、そのファイルをブラウザで表示させてみて下さいね。また各属性の値を変更して、どのように表示されるかも試して下さい。

それでは、本題に入る前にまずは人気ブログランキングをご覧下さい。

続きを読む
posted by ひっそり | Comment(0) | TrackBack(0) | div

divタグを使ったレイアウト(3)

前回まではdivタグを使って段落を作り、CSSを使って左右に配置できることをご紹介しましたが、今回はCSSでどのような設定をすることにより、そのようなレイアウトが実現されるのかを説明したいと思います。

その前に人気ブログランキングをご覧下さい。

続きを読む
posted by ひっそり | Comment(0) | TrackBack(0) | div

divタグを使ったレイアウト(2)

今回は前回例として挙げたhtmlのタグをご覧いただきながら、CSSでどのような設定を施していたのかを解説していきます。

その前に人気ブログランキングをご覧下さい。

続きを読む
posted by ひっそり | Comment(0) | TrackBack(0) | div

divタグを使ったレイアウト(1)

まず、こちらをご覧下さい。

ヘッダ
左側
右側
フッタ

単に文字だけを見るなら何の変哲もなく上から下に向けて書かれている文字群ですね。しかし単語の意味に照らし合わせてレイアウトを考えてみると、単語の意味とレイアウトが一致していません。

では、ここで言うレイアウトとは誰の視点で見たものでしょうか? 当然人間の目で見たものですね。人間はレイアウトや配色などに気をかけながら全体を見ようとするのです。つまり上記の文字群は人間が見るのには、ふさわしくないレイアウトと言える状態です。

しかしSEO対策を考える場合、上記の文字群を見るのは検索ロボットです。検索ロボットは人間のような美的感覚を持ち合わせていませんから、単純に文章のみを読みに来ます。ごちゃごちゃしたレイアウトの文章を読むより単純に上から下に読み進めていけば良い構造になっている文章の方が、検索ロボットにとっては読みやすいわけなのです。つまり上記の状態は検索ロボットに都合の良い構造になっているわけです。

ウェブページを作る場合に気を付けなければならないのは、見に来る人間と検索ロボットの双方が共に満足する構造にすることです。では、上記の文字群をどうすれば良いのでしょうか?

続きを読む
posted by ひっそり | Comment(0) | TrackBack(0) | div
×

この広告は1年以上新しい記事の投稿がないブログに表示されております。