ベストアンサー

ホームページの中央揃えについて

2013/07/13 16:57

ホームページ作成についての質問です。私はホームページを作成、運営してかれこれ１０年以上が経つのですが、最初の頃は少し独学で勉強して、ホームページを作ったのですが、出来上がってから更新はたまにするものの、大きなリニューアルもほとんどせずに今に至ります。ここ何年も勉強していなかったのですが、最近私のホームページを見た方が、『今は中央揃えが主流よね』と言われました。私のサイトは左揃えで、確かに最近他のサイトさんを拝見させていただくと中央揃えのサイトばかりです。私のホームページも中央揃えにしたほうがいいのかな？と思うのですが、知りたいのはなぜ中央揃えが主流になったかということなのです。何年か前にサイト作成の本か何かを読んだ時は『左揃えでも中央揃えでもどちらでもよい』とありました。ものすごく初歩的な質問かと思いますが、なぜ今は中央揃えが主流なのかについて理由を教えていただけたらと思います。また実際に中央揃えにする際は、やはりＣＳＳでレイアウトすべきでしょうか？よろしくお願い致します。

e_t_love
お礼率64% (182/283)

CSS
回答数3
ありがとう数3

みんなの回答 （3）
専門家の回答

質問者が選んだベストアンサー

ベストアンサー

naokita
ベストアンサー率57% (1008/1745)

2013/07/14 16:33 回答No.3

どっちでもよいですよ。ワイドモニターでも、ブラウザの表示領域を1000px程度にしていれば、大した差はないです。映画やTVを見る時に、真正面が一等席なのはわかると思いますが、その程度の理由です。左側に寄ってしまうと、ワイドで表示してる場合に首や目が左に行きますから疲れるでしょう。快適に回覧して欲しいから。他の多くのサイトがセンターで、切り変えたら左に寄っていたら目線が変わるから、同じセンターで見せたい。左寄りで更にpaddingが無い場合、文章がブラウザの左端にくっ付いて読みにくい場合がある。とか、そんな程度の理由です。 ----------------- ＞また実際に中央揃えにする際は、やはりＣＳＳでレイアウトすべきでしょうか？Ａ、しょうもないサイトや放置サイトでしたら、わざわざ手間掛ける必要はないのでは？目的は何か？それを確認してからですね。左寄りのサイトだけの理由で閉じる人はいないでしょう。技術的には、 #1さんの<center>でも可能ですが、非奨励です。昔は、HTMLで何でもかんでもやっちゃいましたが、今は、デザイン部分（見た目の部分）は、CSSで設定しますので、 bodyに背景を設置し、次のdiv枠をメインと考えると、その枠を、800～960px程度の枠幅にして margin: 0 auto; width: 940px; などを設定すると良いでしょう。レスポンシブデザインが良いとは限りません。フルブラウザモードで表示させたい人も多くいますから。何をどう表示したいのか、情報を読むサイトか？魅せたいサイトか？の違いにもよります。センター配置なんてのは二の次で良いので、・HTMLは、構造化・マークアップ・CSSは、見た目・デザインと割り切って考え、リニューアルした方が良いとは思います。

質問者

お礼 2013/07/14 22:34

わかりやすいご説明をありがとうございました＾＾

その他の回答 (2)

ORUKA1951
ベストアンサー率45% (5062/11036)

2013/07/13 18:41 回答No.2

＞なぜ今は中央揃えが主流なのかについて理由を教えていただけたらと思います。　HTMLそのものの目的に反するからです。　「中央揃えが主流」というかリキッドデザインが主流になりつつあります。しかも、スマホから幅広ディスプレイに対処したmediaqueryを利用したレスポンシブデザインも導入されつつあります。　私はウェブページを作成し始めて１５年目になります。当時はHTML2.0からHTML3.2に移行している時代でした。　わたしは、当初よりセンター配置というか、幅自体を指定してきませんでした。(その当時からディスプレイ幅は640px～800px越え間でありましたから) 　現在ウェ不標準とみなされているHTML4.01の勧告が1999年(今から１４年前)ですから、私が私がウェブページを作成し始めて数年後には、HTML4.01が勧告されたことになります。　HTML4.01では、それまでのHTMLへの大きな反省から!!! 【引用】＿＿＿＿＿＿＿＿＿＿＿＿ここから HTMLは、どんな環境からもWebの情報を利用できるようにすべきだという方針の下に開発されている。例えば、様々な解像度や色深度のグラフィックディスプレイを持つPCや、携帯電話、モバイル機器、音声入出力機器、帯域が広いコンピュータや狭いコンピュータ、等の環境である。￣￣￣￣￣￣￣￣￣￣￣￣￣ここまで［Introduction to HTML 4 (ja)( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/intro/intro.html#h-2.2.1 )］より【引用】＿＿＿＿＿＿＿＿＿＿＿＿ここから HTMLの性質上、プレゼンテーションに関する要素や属性は、次々と他の機構、とりわけスタイルシートに置換えられていく。また、文書の構造をプレゼンテーションと切り離すことで広汎なプラットフォームや多様なメディアでの文書提供コストを低下でき、文書の改訂も容易になるということが、経験的に知られている。￣￣￣￣￣￣￣￣￣￣￣￣￣ここまで［Introduction to HTML 4 (ja)( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/intro/intro.html#h-2.4.1 )］より【引用】＿＿＿＿＿＿＿＿＿＿＿＿ここから HTML文書を作る場合には、この仕様における、他のDTDセットではなく strict DTD に適合する文書を作るよう推奨する。￣￣￣￣￣￣￣￣￣￣￣￣￣ここまで［Conformance: requirements and recommendations (ja)( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/conform.html#h-4.1 )］より　ととても強く、ディスプレイ幅に依存しないこと。<center>や、<strike>、<s>、のようなプレゼンテーションに関わる要素(タグ)は使うべきでない、廃止されると宣言されていました。＞また実際に中央揃えにする際は、やはりＣＳＳでレイアウトすべきでしょうか？　はい、プレゼンテーションに関わるものはすべてスタイルシートにしましょう。HTML5では、<center>、、<strike>はありません。 <s>は意味が変わって存続します。　　　　　　^^^^^^^^^^^^^^^^^ 　簡単で <html style="background-color:silver;"> <body style="width:80%;min-width:800px;max-width:900px;margin:0 auto;"> とか・・。 <body style="width:800px;margin:0 auto;"> でも・・

質問者

お礼 2013/07/13 19:30

早速ありがとうございます。勉強不足なもので、ご回答の中にわからない単語もチラホラあったのですが、 >　HTML5では、<center>、、<strike>はありません。 > <s>は意味が変わって存続します。これはとてもショッキングでした！なにせ私のサイトはこれらのタグを多用していますから・・・。ＣＳＳは少しだけ使っているのですが、もっと勉強して早くデザインはすべてＣＳＳにしなければと思いました。デザインも一昔前のテーブルレイアウトで済ませてしまっておりますので(＞＜)