ＺＥＲＯで作ったホームページを携帯で見ると崩れる

質問

教えて下さい。ホームページＺＥＲＯでホームページを作製してアップ致しました。パソコンで閲覧するのには問題ないのですが携帯で見ると文字が重なったりしてレイアウトが崩れてしまっています。ソースネクストの製品サポートで調べたら「元々挿入されていた画像や表などのオブジェクトがページやレイアウトパーツの幅よりも大きい場合があります。画像や表のサイズを変更したり、レイアウトパーツの幅を広げて調整してください。」そこで質問ですが具体的にレイアウトパーツの幅をどれだけ大きくしたら良いのか？　又は　コンテンツをどのくらい縮小したら良いのか？数値等で分る方法が御座いましたらお教え下さい。携帯で見たときに普通に見られる様にしたいのです。よろしくお願い致します。

回答No.2

ORUKA1951 · ベストアンサー

＞私にはハードルが高いようです。
　いえ、単に慣れの問題です。
　HTMLの仕様書なんて、ZEROのマニュアルより圧倒的に少量ですし、たぐなんてせいぜい数十個しか使いません。中学校で習う英単語は2,000語ですよ。
　スタイルシートはさすがに長いですが、それでも、どこに何が書いてあるかを覚えることを兼ねて目を通しておけば良い。
★HTML 4.01 Specification (ja) ( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/cover.html )
★REC-CSS2 邦訳 ( http://www.swlab.it.okayama-u.ac.jp/man/rec-css2/cover.html )

　私は、オーサリングツールなんてない時代(Netscape Goldしかなかった)に始めましたから、苦になりませんが、それでも何度かオーサリングツールに手を出しましたが、結局、テキストエディタのほうが、ずっと楽だと思っています。

　どんな優れたオーサリングツールを使おうと、HTMLやCSSの知識がないと作れるはずがありません。
　こちらも・・
おすすめの無料のホームページ作成ソフト - ホームページ作成ソフト - 教えて！goo ( http://okwave.jp/qa/q7530323.html#a2 )

回答No.1

ORUKA1951

無理です。ごめんなさい・・
携帯電話--膨大な種類があります。--、スマートフォン、パソコン用のブラウザ、(さらに点字端末や読み上げソフト、そして検索エンジン)に対応するページは、オーサリングツールだけではできません。というか、オーサリングツールを使用して作成すると、テキストエディタで促成する労力の何十倍も必要です。
　もちろん、HTMLやCSSの知識があれば、簡単ですが、それならツールを使う必要がない。マニュアルを読んで理解することと、それぞれのツールの癖やできないことを学ばなければならない。
　どんな優れたツールを使おうと、HTMLやCSSの知識が絶対必要です。それなしで、ウェブページができるはずがありません。
　サンプルどおりのウェブページを、画像のサイズやデザインを変えずにそのまま書き換えることくらいしかできません。ちょっと何かを変えようと思ったら地獄です。

　実際に携帯電話にも対応するページを作成するためには
1) スタイルシートを解釈しないユーザーエージェント向きに、HTMLの要素と属性を使って、文書構造をマークアップしたHTMLを作成します。
　せいぜい、個人のサイトで使用するタグなんて数十個でしょう。(中学校で学ぶ2,000語の単語と比べたら微々たる物です)
2) HTML内のスタイルシートで、外部スタイルシートを読まないユーザーエージェント向けのスタイルシートを書きます。
3) 外部スタイルシートで、高度なデザインを記述します。

　たとえば、古い携帯電話では、ディスプレイ幅が120px程度しかないものがあります。それに合わせてHTMLを書きます。ついで、スタイルシートで画像を大きなものに置き換えるスタイルを書きます。そのときディスプレイは、640px～以上に対応するリキッドデザインにしておけばスマートフォンを含めて対応させられるでしょう。
　画像サイズを含め、サイズは決めないことがポイントです。ディスプレイ幅に対する％で指定します。

お礼

ご回答ありがとう御座います。率直な感想で申し訳有りませんが私にはハードルが高いようです。スタイルシートとＨＴＭＬの基礎を勉強しようと思います。ありがとう御座いました。