電子書籍の厳選無料作品が豊富!

webサイトで、スマホで見るとパソコンで見た時より縮小されてるような形で表示されることが多いんですが、
スマホ用のサイトがない場合はそのように表示されるものですか?

A 回答 (2件)

パターンがいくつかあって、


製作者側の設定もあるし、ユーザー側の端末やブラウザ・設定による事もあります。
制作者側の仕様や設定は、#1さんの考えだけど、
スマホを想定していなかった場合は、縮小されて全体が表示される場合もあるし、アップされた一部(左上部)しか表示されないパターンもあります。
固定幅やレスポンシブ、viewportや-webkit-text-size-adjustだったり各々の制作方法によります。
制作者の意図や考えも違いますので、コンテンツによってはどちらが良いとは言えない(好みや利便性)事もあります。

ユーザー側だと、iPhoneやAndroidなどの違いもあるし、
ユーザーの設定によってPC版表示もできますし・・・

スマホに限らず、タブレットでも違うようになりますよ。

スマホ用といっても、別々のファイルを作って振り分けるパターンと、同じファイルをCSSで違う見え方にしているパターンもあります。
    • good
    • 0
この回答へのお礼

ご回答ありがとうございました。なるほど、色んなパターンがあるんですね…
Webは面白いですが、奥が深いです。もっと勉強していきます><
色々とありがとうございます!
今後も質問を投稿する機会があるかと思いますが、また見かけたらどうぞよろしくお願いいたします。

お礼日時:2016/02/07 07:19

>スマホ用のサイトがない場合はそのように表示されるものですか?


ここは重要なので先に説明しておきます。
HTMLでウェブページを作成する最大の、そして唯一の目的は
【引用】____________ここから
 HTML文書が、ブラウザやプラットフォームの違いを超えてうまく働くべきであるということは、多くが認めるところである。 相互運用性の達成は、コンテンツプロバイダのコストを低下させる。なぜならただ1種類の文書しか作る必要がなくなるからだ。 もし【相互運用性確保の】努力が成されなければ、Webは互換性のないフォーマット毎に分け隔てられた世界に分割され、すべての関係者にとっての商業的可能性が減少することとなるであろう、大きなリスクを負うこととなる
・・・【中略】・・・
  HTMLは、どんな環境からもWebの情報を利用できるようにすべきだという方針の下に開発されている。例えば、様々な解像度や色深度のグラフィックディスプレイを持つPCや、携帯電話、モバイル機器、音声入出力機器、帯域が広いコンピュータや狭いコンピュータ、等の環境である。
 ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ここまで[Introduction to HTML 4 (ja)( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html4 … )]より

 お分かりのように、スマホ用にページを作ることは、最初から間違っている。このHTML4.01の勧告(1999年)の16年経っていますから、スマホやタブレット、ガラケーはむろんですが、ここに書かれていない印刷機、点字端末、テレビ、そして検索エンジンまで、すべてをたった一つの文書で完結するのがHTMLの目的なのです。

 では、なぜスマホで小さく表示されてしまうかというのは、スマホはディスプレイが小さいために、上記の対策がされていないページを見ると、横に大きくスクロールしないと読めなくなってしまいます。一行読むごとに右左にスクロールしてたら面倒ですし、それが他の動作---ページをめくるとかになっても困りますから、縮小して表示するようにされているのです。
 ずばり「どんな環境からもWebの情報を利用できるよう」にされていないページは縮小して最低限読めるようにしてある。虫眼鏡を併用してでも(^^)

 具体的には、980pxより広いデザインのページは、その1/3程度の例えば320pxまで縮小するようになっている。---スマホやブラウザの機能---

 制作側からですと、コンピューターに指示(mete)すればよい。<head></head>内に、
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=0.6">
とか指定して、0.6より小さくならないようにする。

★もちろん、それ以前の問題として
1) ページはリキッド---ウィンドウ幅に追随して横幅が変化すること・・・何もしてなければHTMLはそもそもそのようにできている。
2) media-typeでスタイルを切り替える。(HTML4.01の機能)
 印刷が想定されるページなら印刷用のスタイルシート(media="print")、携帯電話なども想定するなら(media="handheld")、視覚弱者用にスクリーンリーダー用media="speak,aural"や展示端末用media="embossed"まで用意するかも

3) 特定のサイズ以下ではデザインそのものを変更する。(HTML5,CSS3)
 メディア別スタイルシートの拡張でmedia queryと呼ばれます。
@media screen and (max-width: 760px) {}
@media screen and (max-width: 480px) {...}
@media screen and (max-width: 320px) {...}
とか、

>webサイトで、スマホで見るとパソコンで見た時より縮小されてるような形で表示されることが多いんですが、
 素人がおつくりになっている。しかたなくブラウザが縮めて表示している。
>スマホ用のサイトがない場合はそのように表示されるものですか?
 スマホ用の対策がされていない。
 スマホ用と言って別のもの作ってはなりません。
    • good
    • 0
この回答へのお礼

詳しく書いていただきありがとうございます。
一部まだ理解できていないところがあるのですが(頭が悪いもので…;;)、何度も読み返して勉強させていただきます。
参考になりました。ありがとうございました。

お礼日時:2016/02/07 07:15

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!