携帯に掲載するホームページについて教えて！

質問

現在、ビルダーを使って、ｐｃでホームページを掲載しています。

携帯にもアップしたいのですが、基本的なことがわかりません。
ビルダーにもモバイルというもはあるのですが、今一、ｐｃサイトとの関連性が
良くわかりません。

現在、私のｈｐを携帯で見ると、画像は全く掲載されづにリンク文字は表示
されます。携帯の場合は、画像のサイズがあって掲載されないのかも
しれませんが・・・

基本的にｐｃと携帯、両方にサイトを掲載する場合は、携帯の画像サイズ
を考えて、サイトを作成し、それをｐｃにも兼用するといった具合に
なるんでしょうか？

携帯用、ｐｃ用と、両方のｈｐを作成する必要があるんでしょうか？

詳しい方、基本的なシステムを教えて頂けませんか？
宜しくお願いします。

回答No.5

hklkh · ベストアンサー

全く的外れの回答ですね

お礼

おっしゃるとおり

回答No.4

abacabu

色々不快にさせた部分があるようですので謝っておきます。
すいませんでした。
ではＷＥＢサイトを作成することについて簡単ではありますが書いておきます。
まずwindows環境でしたら、アクセサリに入っているメモ帳さえあれば、
HTML,CSS,CGI/Perl,Ruby,PHP,Javascript…すべてのプログラム、
ＨＴＭＬ、ＣＳＳ（これらはプログラムではない）を作成できます。
特に作成ソフト言うのはいらないです。
まぁサーバーサイドプログラムを作成する場合は、別途ご自分のパソコンに
Apacheなどのサーバープログラムをインストールし、同時にＰｅｒlを動かせる環境にする
為にＡｃｔｉｖｅＰｅｒｌなどをインストールする必要はあります。
そしてアップロードするならＦＴＰソフトなど。
ホームページ作成ソフトはあくまで作成の際に(どちらかというと修正の際に威力を発揮)
新しいページが出来てリンクを増やす際Dreamweaverですと関連付けした１つのグループを
まとめて自動でリンクを付けてくれます。主にこういう点が便利というだけです。
後重要なのはIllustrator、Photoshopこの２個はあると超便利です。
２個の画像を合成して１つの新しい画像を作成したりもできますので。
その他諸々素材作りには欠かせないものです。
その他色々必要なものはあるでしょうがここでは割愛します。

肝心な本題に入ります。ＷＥＢサイトを作成する為に１番必要なものは「知識」です。
各種ブラウザ、各種バージョンでしっかりと機能するサイトを作成する為の知識、
普通に作成して反映されないブラウザがあるなら、ブラウザ毎に条件付きコメントを
使って、対応させる為の知識、で、パソコンや、携帯、ipadやアンドロイド向けに
ホームページを作成、公開する為の知識、
こういった知識の方がむしろソフトよりも重要という事です。
私も独学ですので全てをわかるわけでもないですが、
知識さえあれば、Illustrator、Photoshop(どちらかでもいいですがこれは外せません)、
メモ帳をはじめとするテキストエディタ、アップするのに必要なＦＴＰソフト辺りがあると
ＨＴＭＬ、ＣＳＳ、Javascript位を使うホームページ(ＰＣ，携帯（Javascript不可）問わず)ですと
このくらいあると作成できます。何より重要なのは色々なものに対応する為の知識です。
知識にまさるソフトは無いです。
結論特に携帯向けコンテンツに別途必要なソフトは無いです。
前の回答で書いた疑似携帯ソフトは欲しいですね。全ての携帯を手に入れるのも
実質無理ですから(必要性は低い)。
あとはマークアップをしながらその環境にあった物を作る知識を存分に使う。
画像を使う場合は画質を下げながらも見栄えをあまり劣化させないように対処して
携帯でも見れるサイズまで落とすとか、そういう知識は必要です。
何が必要かと聞かれたらそれは知識です。
結局こういう事が言いたかったのですが…
色々すいませんでした。この知識を得るにはネットで調べたり、参考書を買ったり、
実際作って色々調整しながらつかむ事も大事です。

回答No.3

abacabu

またまた失礼。
なるほど、そういう質問でしたか、
まぁ先にも述べたとおりソフトは特に必要ないです。
煩わしくなければむしろwindowsのメモ帳で十分…
様は携帯の画面サイズなどの知識だけあれば十分です。
後はまぁ余り画像を使わない様にするとか(従量課金制契約対策)

お礼

よけいに解らなくなりました。
メモ帳？

サーバーにアップするにはソフトが無ければ駄目でしょ。
メモ帳でアップできません。

次回の回答で質問の趣旨が外れていたら、お返事は控えさせて頂きます。

回答No.2

abacabu

再度書き込み致します。
少々誤った書き込みが有ったので訂正…
画像の場合は
<img src="***" width="**%" height="**%" alt="">って事で、
画面というのを訂正します。
画面というより全体を<div id="***">と言うので囲っていた場合に
これをＣＳＳで
div#*** {
width: **%;
}
とするという事です。コンテンツの幅全てを％で指定すると
画面幅(パソコン画面、携帯画面それぞれの)の割合指定をします。
イメージを例に言うと仮にwidth(幅)="100%"とするという事です。
こうするとパソコンで見ても幅一杯の表示で、さらに画面倍率をあげても
画面幅一杯になります（<div id="***">という全体の囲いを800pxとしておくと
その幅(実際にはＣＳＳ初期化をしないと基本padding値があるので７９０pxくらい？)
になります）携帯で見ても携帯の画面幅一杯になります。
注意：基本的にimg要素のwidth.height(高さ)は、ｐｘ値で設定して置くと
画像を読み込む前にスペースだけ読み込んで他の部分を読み込んでくれるので
読み込みが速くなります。こちらの方が安全という事です。
この事から％に拘らず同じ相対単位のｐｘ設定でもいいです。
囲い(div)の幅は％値指定を推奨されてはいます。(リキッドレイアウト)
ｐｘ：画面サイズから割り出された数値で表示の大きさは画面サイズに依存します。
％：これは基本画面の総幅の％値になります。ただしdivで囲んで８００ｐｘとして
その中に背景や画像を入れていく場合にはその８００ｐｘが基準となります。
この場合の５０％は画面の半分ではなく８００ｐｘの半分の４００ｐｘ幅と同じとなります。
基本的にリキッドレイアウトオンリーで作る場合には携帯、ｐｃどちらにも対応できる
場合が有りますが、文字サイズの関係でやはりレイアウトが携帯で見ると崩れるので
それぞれ作った方が無難だと思います。
ちなみにソフトバンク(i Phone以外)とi-mode向けサイト制作支援ソフト（疑似携帯画面で
チェック出来るツール）が各社サイトで無償ダウンロードできます。auは現在休止中。
なおi Phone用というかi Pad用のチェックツールは現在Ｍａｃ用しかないです。
こんな感じでわかりましたでしょうか?

お礼

度々有り難うございます。

良くご存知ですね。しかしながら、貴殿の回答は操作方法であり、私が聞きたいのはもっと初歩話です。

要するに、携帯用のサイトはｐｃとは別に作成する必要があるんですか？
ということです。

だとすれば、ビルダーでは無しに、別のソフトがあるんですか？

これだけで結構です。操作方法はｐｃでサイトを作成しているので、理解できます。

回答No.1

abacabu

独学でＷＥＢサイトを作成している者です。
それこそが良く言われる相対単位で指定しましょうの最たるものです。
画像サイズも％で指定して画面幅も％…ト指定してみて下さい。
JavaScriptは使えませんが、普通に作れば普通にアップロードして公開されているサイトで、
やたら情報量の多いサイトでなければ閲覧可能です。
重たいサイト(情報量が膨大ＰＣで開いても重たい)は途中で携帯が断念してしまうでしょうが、
そうでない場合はちゃんと表示されます。
ＰＨＰやＣＧＩサイトも難しいかもしれませんが、(Ｘ)ＨＴＭＬで構築してＣＳＳでレイアウトした普通のサイト
でしたら今の携帯なら(auのwinなどでも)普通に見る事が出来ます。
文字の大きさを携帯サイズにしないとＰＣ用の文字の大きさだと大き過ぎますが…
あ、あとＣＳＳだけで作ったプルダウンメニュー(flloat.display使用)は文字は普通に打ってるのですが
表示すらされませんでしたね(私のau win環境)。

お礼

有り難うございます。

画像サイズも％で指定して画面幅も％…ト指定
って結局、どこで指定するんですか？

それと、そうするに２回作成する必要があるんですか？