Main menu |Mobile |あすなろ電器 |工夫と製作 |素人農業 |修理技術 |生活情報 |健康情報 |名所旧跡 |ネット環境 |写真集 |植物の生態 |動物の生態 |電気柵 |English |Sitemap |お問合せ

HP作成 Menu |迷惑書込対策 |迷惑メール対策 |メール送信規制 |BBSログ変換 |メールCGI改造 |テキストメニュー |HTML一括変更 |外部Menu file |外部CSS |段組レイアウト |表示の速いHP |HPの横幅 |HPの背景 |HPの文字 |HPの見出し |HPのタイトル |htaccess機能 |Adsenseクリック規制 |HPビルダー起動時間 |複数パソコンでHP更新 |文字の大きさ変更 |ページ内検索

表示の速いホームページの作り方

 ネットサーフィンをしていると時々とても表示の遅い(重い)ホームページがあります。もちろん画像を多用して表示が遅くなっている場合もありますが、なかなか表示されないで待っていると最後に急に表示されることがあります。これはひとつの表(TABLE)の中に全ての画像や文字を入れている場合があります。
 私は表示の遅いページは大嫌いです。数秒間で表示されなければさっさとページを閉じてしまいます。だから私が作るページは内容と表示の速さを最優先にしています。表示の速いホームページを作るにはどうしたら良いのか考えてみました。



スポンサード リンク

画像の使用は必要最小限にする

 文字だけのファイル(テキストファイル)はファイルのディスク上のサイズは約数キロバイト(kB)程度で小さいものです。それに比べて画像のファイルは通常その10倍〜100倍以上もの大きさがあります。
 これをそのまま表示させるとページが非常に重い(表示が遅い)ものになってしまいます。画像は画素を縮小してその使用は必要最小限にしましょう。
 また画像の代わりにテキスト(文字)を使えるものはテキストで表示するようにしましょう。

画像のファイルサイズは適度に縮小して使う

 最近はブロードバンドが流行っていてダイヤルアップからフレッツISDNに、フレッツADSLから光ファイバーへと移行しています。通信のスピードが速いので、知らず知らずの間に表示の遅い(重い)ページを作ってしまいがちです。
 画像のファイルサイズはせいぜい50kB以下に縮小して使うのがホームページ作成のマナーというものです。ダイヤルアップの人の為にできれば20kB以下にしたいものです。
 どうしても綺麗な画像を載せたい場合は、サムネイル画像をホームページに表示して必要な人だけにダウンロードさせるようにするべきでしょう。私はホームページで使う画像のサイズは約240X320ピクセルに統一しています。
 ここで言うファイルサイズとは、ディスク上のファイルの大きさであり、表示された画像の縦と横の幅ではありません。時々1MBもある画像の縦横サイズだけを小さく表示するように指定していて、画像の表示が非常に遅いものがあります。注意してください。

表(テーブル)はできるだけ使わない

 凝ったデザインやしゃれたレイアウトのページを実現する為には表(TABLE)を使うのが手軽でよく使われています。表というものは表の中身が全て読み込まれてからでないと表示されません。
 通常、ホームページは読み込まれた順番に表示されます。しかし、表の場合は、中身を全部読み込んでからでないとレイアウトを決定できないので、読み込み中は表示できないのです。
 表を全く使わなくてもホームページを作ることができます。まずは表を使わないページを作ってみましょう。レイアウトだけの為に表を使うのはやめたいものです。



スポンサード リンク



特にページ全体を表で囲まない

 ページ全体を表で囲むと全ての内容を読み込んでからでないとページを表示しません。何秒間も待たせて突然ページ全体が表示されるのを見たことはありませんか。
 ひどいのは文字しか無いのに表で全体をくくったページがあります。ページのレイアウトの為に安直に表を使ったものと思われますが、テキストのレイアウトにはスタイルシートを使うのが基本です。

ひとつの表は大きくしないで区切って使う

 表を使う場合、次のように途中で区切ってやると表は上から順番に表示されるので、上の表が読み込まれたら下の表を読み込み中でも表示されます。

 この上の表と下の表は別々です。
 上の表と下の表はくっついていますが、別の表です
 この程度の表の大きさなら途中で区切る必要はありませんが、大きな表の場合は適当に区切って使いましょう。

JavascriptよりHTMLを使用する

 Javascript(ジャバスクリプト)は便利でHTMLではできない事が簡単にできる場合があることから、よく使われるようになってきました。しかし、JavascriptではどうしてもHTMLよりファイルが大きくなり、表示速度が遅くなります。HTMLで実現できることはできるだけHTMLを使うことで少しでもページの表示を速くするようにしましょう。

ページのサイズは適度な大きさにする

 時々、テキストだけのページでも非常に大きなページを見ることがあります。どこに何が書いてあるのかを探すだけでも大変です。ひとつのページの大きさは10〜30kB以下になるようにしましょう。
 ホームページは見てもらわなければ存在する意味がありません。適度なファイルサイズで、表示が速く、読みやすいページを作るように心がけましょう。ちなみにこのページのサイズはインクルード前で約7kBです。

PDFファイルはできるだけ使わない

 PDFという拡張子のファイルはAdobe Systems社によって開発された電子文書で印刷に適した規格です。Adobe Acrobatが生成したファイルで、画像や表や文字列が一つのファイルとなっています。
 この文書を読む為のAcrobat Readerは起動時に大量のプラグイン(組み込みソフト)を読み込んでいる為に、非常に動作が遅くていらいらさせられます。文書をファイルにするのにはPDFは手軽なのでよく使われていますが、同じ内容でHTMLかテキスト(文字)でもページを作成してほしいものです。
 PDFファイルはファイル内の文字列の検索ができないので閲覧に手間がかかります。印刷に適したファイルの為か拡大すると横スクロールが必要な事が多く操作が不便です。

Main menu |Mobile |あすなろ電器 |工夫と製作 |素人農業 |修理技術 |生活情報 |健康情報 |名所旧跡 |ネット環境 |写真集 |植物の生態 |動物の生態 |電気柵 |English |Sitemap |お問合せ

HP作成 Menu |迷惑書込対策 |迷惑メール対策 |メール送信規制 |BBSログ変換 |メールCGI改造 |テキストメニュー |HTML一括変更 |外部Menu file |外部CSS |段組レイアウト |表示の速いHP |HPの横幅 |HPの背景 |HPの文字 |HPの見出し |HPのタイトル |htaccess機能 |Adsenseクリック規制 |HPビルダー起動時間 |複数パソコンでHP更新 |文字の大きさ変更 |ページ内検索


Car Evolution |Tomy's HP |このページの先頭

振幅変調波形
as76.netはインターネットの利用者へ有益な情報を提供することで世の中に貢献するように努力しています。


スポンサード リンク