INDEX    RSS    ADMIN

スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

<div> VS <table>タグ

<div> VS <table>

という事で、一部のブロガーさまやテンプレート製作者さまにはお恥ずかしい記事になりますけど、このブログテンプレートは、私(初心者)が手を加えていたので、そのほとんどを<table>タグで構成されていました。

異様に表示の速いブログってありますよね?
表示が遅いと、ちょっとイラッと来る事があって(このブログもそうなってきていました…。)何故こんなに差があるんだろう…とずっと不思議に思っていたんですよね~。

ようやく理解できました!
<div>~</div>=ブロック(ひとつのまとまり)で指定するための要素。
スタイルシートを使用する事でデザイン的な構成が出来るそうです。

を、テンプレートを構成する段落ごとに割り当てているみたいです!


<table>タグは、このブログでも扱った経験があったので理解はできていたんですけど、<div>の意味は、今回はじめて知りました。(汗)

なので、未だに理解できていない部分があるんですけど、
とりあえず縦を構成する部分は、<table>から<div>に切り替えました。
<table><tr><td>~~</td></tr></table>

テンプレート全体で、<td>で、横に並べていないもの(縦並びのもの)だけを<table>タグから変更しました。
そして、これまでの表示速度と比較検証をしてみました。

結果は…
 
 ↓

 ↓

 ↓

 ↓

…圧倒的じゃないか!我が軍は!(だれ?)

<table>タグは全体を読み込んでから表示するのに対して、<div>タグではブロックごとの表示になるようです。

だから表示が速く感じるみたいですね~。(ノ∀`*)
テンプレート選びも、このあたりを考慮に入れて選択してみるのも良さそうだと実感した出来事でした。

この記事に関して間違い・ご指摘などがございましたら、ツッコミを入れてやって下さい。

スポンサーサイト

コメント

管理人のみ閲覧できます

このコメントは管理人のみ閲覧できます

タグですねぇ~♪タグの勉強は少しはやったほうがいいですよね(^^)

応援p

おはようございます。まるこです♪
かなりのお久しぶりですね。
実はちはるさんのブログにはまだまだ及ばないけど
サイト新しくなりました。
それに時間がかかりご無沙汰しちゃった・・・
また、よろしく願します。

~~(*/>ω<)o ハーイ!!

タグ難しいです(*´・ω・)(・ω・`*)ネェー

<div>~</div>の意味しりませんでしたぁヒーノ)゚Д゚(ヽヒー

わかってよかったぁ~☆

応援(*・ω・)づ∩ぽんぽん

コメありがとですーwww励ましになりましたぁー力が抜けたように元気です!!

こんばんは

週末にやっと訪問御礼周りをしているappiyです。

おお、すごい。勉強になりました。
表示にそんなに差があったとは。
流石、ちはるさん。
ギレンの台詞もまたよしですね。

また来ます。応援P!

こんばんは~やっぴぃです♪
かなり勉強になりますね!
相変わらず、ちはるさんは勉強熱心で知識豊富で素晴らしいですね^^
その知識を分けてほしい・・・
尊敬とともに
応援P♪
非公開コメント

プロフィール

nano

Author : nano
ホームページ作成からウェブニュースまでインターネットに関連した記事を不定期で更新中。IT技術の進化とともに便利になるサービスやシェア・フリーソフト、アフィリエイトサービス、ホームページ作成ツールなどについて書いてます。情報は遅れています(笑)

はてなブクマの人気エントリ

最近のトラックバック

最近のコメント一覧

タグクラウド

Archive Calendar

Sun Mon Tue Wed Thu Fri Sat
- - - - - 1 2
3 4 5 6 7 8 9
10 11 12 13 14 15 16
17 18 19 20 21 22 23
24 25 26 27 28 29 30

バックナンバー

モバイル

携帯電話でQRコードを解析すると外出先からも簡単にブログを見ることが出来ます。

上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。