人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

ホームページ制作について質問です。
ホームページ制作後、パソコンでチェックをすると画面のサイズやエクスプローラーかサファリか等で若干違って見えるんですが、(マージンの幅等)WindorsかMacかでも違ってみええうのでしょうか?


●質問者: kasai-de_eb
●カテゴリ:インターネット ウェブ制作
✍キーワード:エクスプローラー サイズ サファリ パソコン ホームページ制作
○ 状態 :終了
└ 回答数 : 5/5件

▽最新の回答へ

1 ● masaboz
●27ポイント

インターネットエクスプローラ、サファリ、またはFireFoxのブラウザに搭載されているレンダリングエンジンが異なっているため、画面のサイズやマージンの幅等が異なってレイアウトが崩れてしまいます。


レンダリングエンジンとはブラウザに搭載されるレイアウトを描くプログラムコードのことだと考えても良いでしょう。インターネットエクスプローラはトライデントというレンダリングエンジンを採用し、FireFoxはGeckoのレンダリングエンジンを採用しているため、両者の基準が必然的に違ってくるため、ホームページレイアウトが崩れてしまいます。Macでもインターネットエクスプローラを使えば正常に表示されますし、WindowsでもFireFOXを使えば崩れて表示されるので、これはブラウザの問題であって、WindowsやMacの問題ではありません。


なぜ、それが起きているのかといえば、インターネットエクスプローラを開発するマイクロソフト社とサファリを開発しているアップル社とFireFoxを開発しているモジラ社がブラウザのシェアを奪うために企業競争を行っているからです。ホームページ製作する開発者にとっては大変迷惑なことです。


本来はそれぞれのブラウザに合わせてレイアウトを構築するのですが、開発する手間がかかると思えば、最もシェア率の高いインターネットエクスプローラだけ合わせれば良いことでしょう。実際にそうしているホームページも数多くあります。


レンダリングエンジンについて

http://ja.wikipedia.org/wiki/HTML%E3%83%AC%E3%83%B3%E3%83%80%E3%...


2 ● wizemperor
●27ポイント

画面の幅やマージンは通常は変わりません。

ただし、WinとMacでフォントが異なるので、

フォントサイズを基準にした単位(em,ex等)ではマージンも変わります。

IEはバグ・不具合だらけなので、他のブラウザとは違って見えることはよくあります。


http://q.hatena.ne.jp/answer


3 ● pahoo
●26ポイント

見え方は――

  1. ブラウザによって変わります。
  2. 同じブラウザでも、バージョンによって変わります(特にInternetExplorer)
  3. OSによって変わります。Mac, Windows, Linux では標準フォントが異なる影響が大きいです。

同じように見せるためには、下記が参考になるでしょう。

必携 HTML/CSS/JavaScript Webブラウザー互換性辞典 (インプレスの辞典)

必携 HTML/CSS/JavaScript Webブラウザー互換性辞典 (インプレスの辞典)

  • 作者: 佐藤 和人
  • 出版社/メーカー: インプレス
  • メディア: 単行本


4 ● hirotow
●10ポイント

たとえばIEとそれ以外だとmarginやpaddingの解釈が違うのは有名な話ですし、

それ以外でもIEは重要な機能がいくつも欠落しているのでまともなデザインにするのはけっこう苦労します。


ホームページ初心者が目を通しておくべきサイト

http://www.tohoho-web.com/www.htm

http://www.marguerite.jp/Nihongo/WWW/index.html


5 ● よたか
●10ポイント

もっとも違いを感じるのは、

floatさせた時のmarginがwinIE6が他のブラウザより倍くらい広く感じます。

基本フォントのサイズもIE6までと、他のブラウザでは倍くらい違います。

その為か、フォントもPXで指定している方が多いようですね。

モジラ系は、文字が小さいですし。

あとは、罫線ののつき方とか、パディングの扱い方も違うようです。

macとwinでいうと、色目の違いが大きいのですが、

フォントの指定をptでやると解像度の違いも気になる時がありますね。

とまあいろいろあるので、

私は、一行づつ書いては、その度にたくさんのブラウザで確認しております。

urlはダミーで私のブログです。

http://blog.hanamarl.com/

関連質問


●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ