• ベストアンサー
  • 困ってます

webサイトの表示に違いがでるのはなぜ?

このたびWEBサイトを作成しました。 フリーソフトを使用して、初心者が作りました。 自宅PCはvista、会社PCはXP環境です。 自宅から自分の作ったページを見る分にはなんら異常はありませんが 会社のXPより閲覧すると、表示にずれがあったり、 画像だけが表示されないページがあったり、 はたまた、知人のPCから見てもらうと 700pixel×2,000pixelぐらいの幅で作成したページが 横長?横方向にずれて?ともかく 作成したサイズとは全く違った表示となっている模様です。 このような原因が理解出来ないほどの初心者です。 どなたかご教授頂けませんでしょうか? どうかよろしくお願い致します。 使用したフリーソフトは「alphaEDIT」です。 言語知識はありません。^^;

共感・応援の気持ちを伝えよう!

  • 回答数3
  • 閲覧数127
  • ありがとう数4

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

  • ベストアンサー
  • 回答No.3
noname#83877

崩れ方がひどいようなのでおそらくcssでIEで確認しながら作られたのだと思います。 まずはFirefoxで表示できるようにしてみてください。 最初の関門はhtmlの書き方だと思います。 tableやdivは使い方をわきまえてください。 目的に合ったタグを使うように少し気を使えば大丈夫だと思います。 完成したらhttp://openlab.ring.gr.jp/k16/htmllint/htmllint.htmlでチェックしてください。 ここがしっかりしていれば後で崩れる原因になりにくいです。 cssではレイアウトにもよりますが、配置に使うのはpositionではなくfloatでやる方が良いです。 width、float、clear、margin、padding これだけあればある程度はサイトの形を崩さずにレイアウトできます。 その際、これをhead内にコピー&ペーストしてください。 <!--[if IE]><style type="text/css">*{zoom:1;}ul,ol,li,acronym,abbr {zoom:normal;}</style><![endif]--> 魔法の呪文です。 作る前に、下記サイトの バグや挙動の違いを確認 も一読されると良いと思います。 http://adp.daa.jp/web.html 後はfirefoxで完成したらIEに持っていき、確認と修正の繰り返しです。 この方法で作れば、自然とIE6と7(xpとvista)の表示も同じになります。

共感・感謝の気持ちを伝えよう!

質問者からのお礼

metametamu様 ご回答ありがとうございました。 ご指摘の通り、「IEで確認しながら」作成しました。 ご回答頂いたサイトを利用してチェックをしてみます。 ド素人には問題山積でして、まずその問題が理解できるか 甚だ疑問ではありますが、少しでも理解できるよう努力したいと思います。あまりに安易に考えていたようです(;一_一) 魔法の呪文が理解できるようになるまでは、果てしなく険しい山。。 しかしながら、とても親切な解説をして頂き、 誠にありがとうございました。

関連するQ&A

  • 写真が表示されません

    HP初心者です。 alphaEDIT(フリーソフト)で作成して、サーバーはFC2を使用してアップしましたが、FC2上で写真が表示されません。 alphaEDITのプレビューや、自分のPC上で****.htmlをクリックすると 写真は表示されます。 写真の格納場所は、作成したhtmlと同じ場所にファイルしているのですが・・・ 素人の質問で申し訳有りませんが宜しくお願いします。

  • 画像が表示されない

    パソコン初心者です。 苦心しようやくホームページを作ったのですが、画像が表示されません。調べてみると同じような質問がいくつもあったのですが、初心者には全く理解できず、困っております。 alphaEDITというソフトで作りました。 どうしたらいいか、ご教授願います。

  • Webサイトで文字化けするのですが、、

    Webサイトを作成している初心者です。 metaタグの「Charset」の属性について質問します。 参考書では、<meta charset="UTF-8">でうまくいくように例示されているのですが、 私のPCで同様に入力するとページ全体が文字化けします。 <meta charset="Shift-JIS">とすると日本語を正しく表示します。 原因はどこにあるのでしょうか? よろしくお願いします。

その他の回答 (2)

  • 回答No.2
  • taloo
  • ベストアンサー率44% (1016/2281)

EmEditorや秀丸を使えば優れたページが作れるわけではありません。 おそらくHTMLの書き方、CSSの書き方に原因があるでしょうが、 どんなHTMLを書いてどんなCSSを書いたかがわかりませんので、どのように修正すればよいかのアドバイスはできません。 EmEditorを使ったからといって、HTMLやCSSが勝手に書き換わることもありません。 AlphaEditを使われている環境でIE6しか入っていなければ、 IE7をインストールしてからAlphaEditを使ってみてはいかがでしょうか。 たぶん、 > 700pixel×2,000pixelぐらいの幅で作成したページが > 横長?横方向にずれて?ともかく こういう状態で表示されると思いますので、それで調整してみてください。

共感・感謝の気持ちを伝えよう!

質問者からのお礼

taloo様 ご回答ありがとうございました。 IE7の環境の下、ソフトを使用して作成しましたのですが、 「CSSが勝手に書き換わるもの」だと思っていました(^^ゞ 無知にもほどがあるのは承知しているのですが、、 あまりに常識がなかったようです。 回答を付けて頂き、誠にありがとうございました。

  • 回答No.1

最も必要な知識が・・  HTMLとは、その目的は、あらゆる端末(解像度の異なるディスプレイ、異なるOSなどのプラットホームの違い、読み上げソフト、点字端末、PDAや携帯端末、サーチエンジンのようなプログラム)・・このどれであっても利用可能な情報提供の手段であって、ワープロやDTP(組版ソフト)のように、印刷結果を作成する言語ではないということです。 【引用】____________ここから 2.2.1 HTMLの略歴 HTMLは初め、 Tim Berners-Lee がCERN【ヨーロッパ素粒子物理学研究所】在籍時代に開発し、NCSA【全米スーパーコンピュータ応用研究所】が開発したMosaicブラウザによって一般化した。 ・・・【中略】・・・ 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 )]より ☆ワープロとは違う!!!  デザインするのではなく、何が見出しか、何が引用か、何が重要かを示すもの。  そのためには、メモ帳などのテキストエディタで書いてみること。 【参考サイト】 はじめてのWebドキュメントづくり   http://www.asahi-net.or.jp/%7Esd5a-ucd/www/  優れたテキストエディタもあります。  EmEditor( http://www.vector.co.jp/soft/winnt/writing/se047993.html )  秀丸エディタ ( http://www.vector.co.jp/vpack/filearea/win/writing/edit/hm/ ) もあります。

共感・感謝の気持ちを伝えよう!

質問者からのお礼

ORUKA1951様 ご回答ありがとうございました。 ドキュメント作りなど全部ソフトが勝手にやってくれるもんだと思ってました。。ご指摘いただいたサイトを参照し 最低限知っておかなければならない事を少しづつ勉強します。 ありがとうございました!

関連するQ&A

  • 現在表示されているWEBサイトの画面サイズを知りたい!

    ホームページ作成初心者です。 画面サイズを参考にしたいのですが、 現在表示されているサイトの画面サイズ(横幅)を調べたいのですが、 その方法はどのようなものがありますでしょうか?

  • ホームページのレイアウトで文字をたたむ方法。

    分かりにくいかもしれませんが・・・ ホームページで文字をたたむような方法を 探しているのですが分かりません・・ 私は「alphaEDIT」というフリーソフトを使用して、 ホームページを作っています。 そこで 最初にリストがあり、 矢印のようなものをクリックしたら そのリストの内容を見ることができるような 物を作りたいと思っているのですが その方法が分かりません・・・ そのような構成のサイトを見てみたのですが 「javascript(void」のように表示されていて全く分かりませんでした。 PCにはある程度詳しいと思いますが ホームページ作成技術としてはまだ初心者です・・・ 分かりにくいですがどなたかよろしくお願いします。 参考になればいいのですが・・画像も参考にしてください。

  • 特定のページからの誘導のみWebサイトを表示

    Webサイトを作成しているのですが、特定のページからの誘導のみ特定のWebサイトを表示する方法はありますでしょうか? WebサイトAからリンク ⇒ WebサイトBを表示 上記のような流れを現在作成しております。 WebサイトBのURLを直接タイプして表示させない方法、 WebサイトBのURLを知られない方法などでも問題ございません。 Web初心者で、html以外はあまり詳しくないのですが、お知らせいただけますと幸いです。

    • ベストアンサー
    • HTML
  • メールの添付が表示されません。

    メールの添付が表示されません。 自宅では、Vistaを、会社ではXPを使用しています。 自宅でワードを使用して資料を作成し会社にメールで送信したのですが、 添付した資料を開く事が出来ません。「指定されたファイルに対してこの操作を行うプログラムが関連付けられていません。[フォルダオプション]コントロールパネルでプログラムを関連付けて下さい。」というメッセージが表示されました。どこでその操作をすればいいのか分かりません。それと、<拡張子>って何ですか?初心者にでも分かるように教えて頂ければと思います。

  • XPでは表示される画像が98では表示されません。

    ホームページをホームページビルダー9で作成しています。転送も問題なくできてXPのIEでは思い通りのものになりました。ところが私の98、と友人宅のMEのIEではリンクを設定したボタンと壁紙が表示されません。同じページのリンクを張っていないボタンは表示されています。XPでは表示されるのものが98とMEでは表示できない、ということはどこに起因するでしょうか。 初心者ですのでよろしくご教授ください。

  • 使いやすいHP作成ソフトを教えてください!

    HP作成初心者です。 今、alphaEDITを使ってHPを作成しているのですがソースを直接打つとナゼか勝手に違う表記になっています。 これって私のミスなんでしょうか? もともとFrontPageExpressを使っていたのですが、もう配布していないみたいで パソコンを買い換えると同時に使えなくなりました。 alphaEDITは使いやすいのですがソースが違う表記になってしまうのは困っています。 alphaEDITのようにシンプルで使いやすく、ソースの表記を勝手に変えないものはありませんでしょうか? よろしくお願いします。

  • IEで表示できない?

    いままでしらなかったんだけど、IEで表示できていないことが判明しました。 わたしは通常はファイアーフォックスを使用しております。 ファイアーフォックスでは正常に表示されていたので大丈夫だといままで数ヶ月思っていました。 しかし、IEではひょうじされないで真っ白ページに?が一文字・・・ 調べていくと、METAコードを入れるとうことはわかったのですが あれこれ、やっているうちにHTML書式がめちゃくちゃに崩れてしまいました>< わたしは、HTMLエディタはalphaEDITを使っています。 これが原因なのか?わからないのだけど・・・ 以前にetscape 7.1 に付随するHTMLエディタもつかっていました。 それと混在して編集でもしたのかな?とさえ思えてきます。 どうして、IEでは読めないようなページが作成されてしまうのでしょうか? IEで表示できるページもあるんです。 alphaEDITのどこかを設定したらいいのでしょうか?(間違って私が設定変更してしまったのかな?) それとも、混在して編集でもしてしまったのかな? まったくわからないのです。 お知恵を貸してください><

  • linuxのwebサイトのつくり方

    linuxで仮想webサイトを作成したいのですが、 初心者でもわかりやすい作り方を教えてください。 サイトのページのリンクでもいいです。

  • 画像が表示されない

    ホームページ作成をしている初心者です。 初心者ながらもなんとか、ホームページが出来たのでFFFTPでアップデートしたところ、ページ毎に画像が表示されたりされなかったりになってしまってます。 すべての画像が表示されなかったり、同じ画像だけが表示かれなかったりではなくまちまちです。 例えば、Aのページでは表示されている画像がBのページでは表示されないなど… いろいろ原因を探してはいるのですが、なかなか原因が見つからず困っています。 何とか今週中(出来れば&#65374;11/20まで)には完成させたいのですが… どなたか原因が分かられる方いらっしゃいましたらご伝授お願いいたします。 ※ちなみに表示されない時に出てくるのが「×」ではなく下記のような画像です。。

  • ウインドウズ7 16;9 画面いっぱい表示

    PC初心者ですみません。 お願いします。 東芝ノートPCdynabook Qosmio T560/T4AB、 ウインドウズ7を買ったんですがインターネット画面表示が4;3表示でしか表示されないんですが、どうにかならないでしょうか? 引き延ばして無理やり広げると文字が潰れた感じになりとても荒く表示されます。 横長タイプの16;9できれいに表示はできないんでしょうか? お願いします。 目がとても疲れて困っています。