質問: 教えて下さい。ホームページZEROでホームページを作製してアップ致しました。パソコンで閲覧するのには問題ないのですが携帯で見ると文字が重なったりしてレイアウトが崩れてしまっています。ソースネクストの製品サポートで調べたら「元々挿入されていた画像や表などのオブジェクトがページやレイアウトパーツの幅よりも大きい場合があります。画像や表のサイズを変更したり、レイアウトパーツの幅を広げて調整してください。」そこで質問ですが具体的にレイアウトパーツの幅をどれだけ大きくしたら良いのか? 又は コンテンツをどのくらい縮小したら良いのか?数値等で分る方法が御座いましたらお教え下さい。携帯で見たときに普通に見られる様にしたいのです。よろしくお願い致します。
回答: 無理です。ごめんなさい・・ 携帯電話--膨大な種類があります。--、スマートフォン、パソコン用のブラウザ、(さらに点字端末や読み上げソフト、そして検索エンジン)に対応するページは、オーサリングツールだけではできません。というか、オーサリングツールを使用して作成すると、テキストエディタで促成する労力の何十倍も必要です。 もちろん、HTMLやCSSの知識があれば、簡単ですが、それならツールを使う必要がない。マニュアルを読んで理解することと、それぞれのツールの癖やできないことを学ばなければならない。 どんな優れたツールを使おうと、HTMLやCSSの知識が絶対必要です。それなしで、ウェブページができるはずがありません。 サンプルどおりのウェブページを、画像のサイズやデザインを変えずにそのまま書き換えることくらいしかできません。ちょっと何かを変えようと思ったら地獄です。 実際に携帯電話にも対応するページを作成するためには 1) スタイルシートを解釈しないユーザーエージェント向きに、HTMLの要素と属性を使って、文書構造をマークアップしたHTMLを作成します。 せいぜい、個人のサイトで使用するタグなんて数十個でしょう。(中学校で学ぶ2,000語の単語と比べたら微々たる物です) 2) HTML内のスタイルシートで、外部スタイルシートを読まないユーザーエージェント向けのスタイルシートを書きます。 3) 外部スタイルシートで、高度なデザインを記述します。 たとえば、古い携帯電話では、ディスプレイ幅が120px程度しかないものがあります。それに合わせてHTMLを書きます。ついで、スタイルシートで画像を大きなものに置き換えるスタイルを書きます。そのときディスプレイは、640px~以上に対応するリキッドデザインにしておけばスマートフォンを含めて対応させられるでしょう。 画像サイズを含め、サイズは決めないことがポイントです。ディスプレイ幅に対する%で指定します。