既に作成済みのwebページを少しでも軽くしたいのですが、どのような方法がありますか?(動画は使っていません)

また、軽い、重いというのはどうやって判断すればいいのでしょうか。

回答の条件
  • 1人2回まで
  • 登録:2007/01/27 16:14:30
  • 終了:2007/02/03 16:20:20

回答(8件)

id:sadajo No.1

sadajo回答回数4919ベストアンサー獲得回数492007/01/27 16:38:10

ポイント17pt

http://oshiete1.goo.ne.jp/qa584470.html

>HPを軽くする方法を教えてください

id:petem

やはりよくある質問のようですね。

既に出来上がってしまっているページを簡単に修正、というのは難しそうですね。

2007/01/27 22:56:27
id:ajisio_taro No.2

ajisio_taro回答回数70ベストアンサー獲得回数02007/01/27 17:13:59

ポイント17pt

・重い画像を使用しない

・不必要なタグは入れない

・テーブルを多用しない

でしょう。

ページの軽い・重いは以下のページで

http://www.kaipara.net/cgi-bin/size_check.cgi

id:petem

1.チェック結果

 評価 F

 合計 586862bytes

 予想表示時間 83.84秒程度(56Kモデム単純換算。8秒が目安。)

 コメント:ファイルが重過ぎます。根本的に考え直したほうが良いかもしれません。

ひどい有様でした。

ありがとうございます。

2007/01/27 22:58:21
id:GEN111 No.3

GEN111回答回数472ベストアンサー獲得回数582007/01/27 17:41:40

ポイント16pt

 一般的にはページ本体とソコから参照される画像やスタイルシート、Flash、JavaScript などのトータルのファイルサイズが大きいほど思いと言われると思います。

 なのですこしでもファイルサイズを抑えるためには改行や空白をなくす、分けられるページは分ける、画像の圧縮設定を変えるなどしてみることです。

 また、TABLE が複雑な構成だと表示が遅かったりスクロールがスムーズに行かない場合があります。これも重いと言われる一因になります。レイアウトに TABLE を使っている場合は CSS でデザインし直すと改善される場合もあります。

id:petem

>レイアウトに TABLE を使っている場合は CSS でデザインし直すと改善される場合もあります。

もう、隅から隅までtableです。

cssでデザインしなおす方法を質問させていただくことになりそうです。。。

2007/01/27 23:00:41
id:toguo No.4

toguo回答回数72ベストアンサー獲得回数32007/01/27 18:01:32

ポイント16pt

テーブルレイアウトのサイトであればCSSデザインに移行させるだけで、ブラウザの反応が早くなると思います(もちろんきちんとHTMLとCSSを理解して各必要があると思いますが)。

後はサーバーのスペックアップや、Apacheの設定変更とかで反応を良くさせる方法もあります。

HTMLのソースを軽くするのであれば、HTMLソースをきれいに表示させるために入っているTABなどを消せば理論的にですがファイルサイズが小さくなって軽くなるのではないでしょうか。

あとは下記サイトのようなサービスを使って確認して行くのは如何でしょうか。

Web Page Analyzer - free website optimization tool website speed test check website performance report from web site optimization

以上、参考になれば幸いです。

id:petem

英語でした。。。

TOTAL_HTML - Congratulations, the total number of HTML files on this page (including the main HTML file) is 2 which most browsers can multithread. Minimizing HTTP requests is key for web site optimization.

TOTAL_OBJECTS - Warning! The total number of objects on this page is 93 - consider reducing this to a more reasonable number. Combine, refine, and optimize your external objects. Replace graphic rollovers with CSS rollovers to speed display and minimize HTTP requests.

TOTAL_IMAGES - Warning! The total number of images on this page is 79 , consider reducing this to a more reasonable number. Combine, refine, and optimize your graphics. Replace graphic rollovers with CSS rollovers to speed display and minimize HTTP requests.

TOTAL_CSS - Caution. The total number of external CSS files on this page is 4 , consider reducing this to a more reasonable number. Combine, refine, and optimize your external CSS files. Ideally you should have one (or even embed CSS for high-traffic pages) on your pages.

TOTAL_SIZE - Warning! The total size of this page is 713026 bytes, which will load in 142.41 seconds on a 56Kbps modem. Consider reducing total page size to less than 30K to achieve sub eight second response times on 56K connections. Pages over 100K exceed most attention thresholds at 56Kbps, even with feedback. Consider contacting us about our optimization services.

TOTAL_SCRIPT - Warning! The total number of external script files on this page is 8 , consider reducing this to a more reasonable number. Combine, refine, and optimize your external script files. Ideally you should have one (or even embed scripts for high-traffic pages) on your pages.

HTML_SIZE - Caution. The total size of this HTML file is 45445 bytes, which is above 20K but below 100K. With a 10K ad and a logo this means that your page will load in over 8.6 seconds. Consider optimizing your HTML and eliminating unnecessary features. To give your users feedback, consider layering your page or using positioning to display useful content within the first two seconds.

IMAGES_SIZE - Warning! The total size of your images is 550055 bytes, which is over 30K. Consider optimizing your images for size, combining them, and replacing graphic rollovers with CSS.

SCRIPT_SIZE - Warning! The total size of your external scripts is 108044 bytes, which is over 8K. Consider optimizing your scripts for size, combining them, and using compression where appropriate for any scripts placed in the HEAD of your documents.

CSS_SIZE - Caution. The total size of your external CSS is 6990 bytes, which is above 4080 bytes and less than 8K. For external files, try to keep them less than 1160 bytes to fit within one higher-speed TCP-IP packet (or an approximate multiple thereof). Consider optimizing your CSS and eliminating features to reduce this to a more reasonable size.

MULTIM_SIZE - Congratulations, the total size of all your external multimedia files is 0 bytes, which is less than 4K.

なんにせよ、ひどい有様のようです。

htmlだけで31MBあるみたいです。

2007/01/27 23:04:50
id:y-innami No.5

y-innami回答回数35ベストアンサー獲得回数22007/01/27 19:00:45

ポイント16pt

作成したツールがいろいろな独自のコードをはいていますから、それらをテキストエディタで削除することで大分軽くなります。

ツールは、ビルダーですとか、Dreamwaver、ひょっとしたらWord・・いろいろありますが、どれも余分なコードを追加してしまいます。

私はαEditというツールをお勧めします。

またフォントの指定なども削除すればもっと軽くなりますよ。

HTMLの知識を少し仕入れて、チューニングしていくことです。

id:petem

Dreamwaverを使っています。

今まで手を抜いてチューニングしていなかったのですが。。。

この重さはそういったレベルじゃない気がしてきました。

tableタグの使いすぎと画像の重すぎなところからてをつけていきたいと思います。

2007/01/27 23:09:03
id:nexttakuya No.6

nexttakuya回答回数3ベストアンサー獲得回数02007/01/28 00:30:22

ポイント16pt

もし多く画像をお使いでしたら、画質が全て最高画質で保存されてたりしないでしょうか?

重い画像はfireworksなどのツールでgifやpngに変えることで、ファイルサイズを縮小することができます。

id:petem

やはり画像の多さは大きな原因なのですね。

ありがとうございます。

2007/01/28 20:23:14
id:orya No.7

orya回答回数330ベストアンサー獲得回数122007/01/28 05:03:42

ポイント16pt

HTMLの不要な改行やコメントを削除し、見栄えそのままサイズダウン

http://www.vector.co.jp/soft/win95/net/se237741.html

HTMLのデザインを変えずにファイルサイズだけを小さくします

http://www.vector.co.jp/soft/win95/net/se158664.html

id:petem

無駄なスペースやタブを消してくれるのですね。

ありがとうございます。

2007/01/28 20:24:14
id:fcp No.8

fcp回答回数3ベストアンサー獲得回数02007/01/28 06:27:55

ポイント16pt

ウェブページが重い原因は多様なので、可能ならばウェブページのアドレスを書いた方が適切な答えが得られると思いますよ。

ajisio_taro さんの回答への返事で、「ファイルが重過ぎます」という評価を重く受け止めているようですが、今時 56kbps で 8 秒などと言っているサイトの表示する「評価」はあまり文字通りに受け取らない方がいいのではないかと思います。そのサイトで http://www.yahoo.co.jp/http://www.hatena.ne.jp/http://www.asahi.com/ を判定させると D 「ちょっと重いようです」と出ましたけど、これらのサイトって改善が必要なほど重いと思いますか?

では ajisio_taro さんの紹介しているサイトに意味がないかというとそんなことはなくて、ファイルの個数やファイルサイズといった生のデータを見るべきです。「ファイルが重過ぎます」などという主観的な表現に惑わされることなく、何を修正するかを考えるべきだと思います。

toguo さんの回答への返事を見ると画像ファイルが 79 個で合計 550 キロバイトだそうなので、画像ファイルを見せるのが目的のページでないなら、これが必要以上に多いのではないかと感じます (僕は画像を作るのが苦手で、自分のサイトで画像をほとんど使わないので、余計にそう感じるのかもしれませんが)。本当にそれだけの画像が必要かどうかは見直してみてもよいかもしれません。

ところで同じ返事の HTML_SIZE の部分の表示によれば、 HTML ファイルのサイズは 31 メガバイトではなく 45 キロバイト (45445 バイト) みたいですよ。それならたぶん HTML ファイルのサイズを気にすることはないと思います。例えば http://www.hatena.ne.jp/ を今見たら 42 キロバイトでした。もちろん「はてな」のトップページも重くて、それよりも軽くしたいのだということなら気にしなければならないかもしれませんが。

GEN111 さんの回答への返事で table 要素を多用しているとのことですが、 CSS も使っているみたいなので、そのあたりをちょっと勉強して整理した方がいいかもしれません。

あと、質問からずれるのですが、身も蓋もないことを書くと、重くて改善が必要だと思っているのはただの思い込みで、じつは別段重くもなく改善の必要はないということも、往々にしてあります。

次に挙げるのは一般的な話ではなく特定のサイト (イラスト中心のサイト、今はもう見られない) に関する話であって、しかも 2 年近く前の内容ですが、「サイトの表示の重さ」に関して的確なことが書かれていると感じるので、ぜひ参考にしてもらえればと思います。趣味の Web デザイン Advice 324 milk punch

id:petem

詳しく書いていただいてありがとうございます。

参考にさせていただきました。

非常に参考になりました。

2007/01/28 20:26:15
  • id:toku4sr4agent
    toku4sr4agent 2007/01/27 16:28:20
    2月3日に終了する質問かもしれませんのでコメント欄にて失礼します。
    (2月3日は、はてなのメンテナンスがあるため。この間の扱いがどうなるかまだはてなからのお知らせに詳しく書いていないので)


    重い、軽いについてはHTMLファイルの容量によると思います。
    但し、人によって使っている回線の速度が違うのでどの程度で重いか軽いかについてはそれぞれ感じ方は違うと思います。

    http://www.mars.dti.ne.jp/%7Efuming/check2.htm
    閲覧者にとって優しいページになっているかは、上記のサイトでチェックしてみるのがよいかと思います。

    20KB未満ならそんなにストレスも感じないでページを閲覧できるのではないでしょうか?

    そのほかに
    ・レイアウトにテーブルタグを使わない
    (テーブルを全部読み込んでからでないとその中のテキストを読んでくれないため)
    ・フレームも使わない(WEBアクセシビリティの観点から)
    ・ページの色、文字の色などは直接HTMLファイルに書き込まないで、css(スタイルシート)で指定するとファイルが重たくなくなると思います。

    画像についてもできるだけ小さい容量のものを使うとページが軽くなる(軽い=表示するまで時間がかからない)ので、よいと思いますが最近ではパソコンの性能も上がり、速い回線を使って閲覧するユーザーも増えてきているので、
    (但し私はISDNなので画像が多そうなところは避けるか、もとから画像の表示をしない設定にして閲覧しますが)
    どんなユーザーをターゲットにするかによって作り方は異なってくると思います。

    以上参考になれば幸いです。
  • id:toku4sr4agent
    toku4sr4agent 2007/01/27 16:46:41
    スミマセン、追加です。

    仮に、ホームページ作成ソフトなどをお使いの場合には、
    製品によっては余計なタグが混じっていることがありますので、
    メモ帳などを使ってHTMLファイルを編集可能なら、余計なタグをはじく。
    そうすることで少しは軽くなります。

    どの程度HTMLファイルをレンタルしているホームページの領域におけるかにもよるのですが、
    自分の場合は20MBまでしか置けないので、
    できるだけ余計なタグをなくし、1つ1つのファイルの大きさを小さくすることによって、
    できるだけ少ない容量で、少しでも多くの情報を発信できるようにこころがけています。


    それと、一般的には20kb未満ならストレスがなく見ることができるようですが(先ほどのチェックができるURLによると)

    自分の場合は、仮に携帯電話などから見られてもある程度は情報が伝わるようにとの考えから1ページあたりの容量を10kbまでにおさえています。
  • id:petem
    >レイアウトにテーブルタグを使わない
    これは恥ずかしながら完全に考えの外でした。

    >20KB未満ならそんなにストレスも感じないでページを閲覧できるのではないでしょうか?

    31メガありました。
    きっと閲覧者にはすごいストレスだったのでしょうね。。。


    ページの重さを56Kモデムで審査するサイトが多いようですが、最近の一般家庭はどのくらいの容量なんでしょうか。。。

    ※コメントにポイントをつけるにはどうしたらいいでしょう?
  • id:toku4sr4agent
    toku4sr4agent 2007/01/27 23:40:48
    返信有難うございます。
    ポイント送信機能をご存知でしたらそちらからでも宜しいですが、
    差し支えなければ同じ内容を回答に再度投稿しますが・・・。



    ・・・31MB?
    31KBの間違いじゃないですよね?

    ADSLやBフレッツを使っている家庭の場合はどうかわかりませんが、
    私のように未だにISDNという家庭も少なくないようなので
    <56kモデムで審査
    というのはおそらくそのあたりに理由があるのではないかと思います。
  • id:toku4sr4agent
    toku4sr4agent 2007/01/27 23:47:05
    それと
    「画像が重い」
    で思いついたのですが、
    もしかして画像ファイルの拡張子がbmpになっていませんか?

    その画像をペイントブラシ(Windowsの場合)で開き、jpgやgifなどの拡張子に変更して保存するだけでもずいぶん軽くなると思います。
    (少し画像の質は下がりますが)
  • id:petem
    31KBでした。
    単位を読み間違えたみたいです。

    そんなわけないですね。
    失礼しました。

この質問への反応(ブックマークコメント)

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

絞り込み :
はてなココの「ともだち」を表示します。
回答リクエストを送信したユーザーはいません