レスポンシブに出来るデザインと出来ないデザイン

質問

レスポンシブに出来るデザインと出来ないデザインがあると聞いたのですが、
具体的にどんなデザインだと出来ないという情報が無いのですがどんなデザインは出来ないのでしょうか？

スマホがワンカラムなのでワンカラムに出来ないサイトは出来ないということでしょうか？
380px以上でワンカラムに出来ればどんなデザインも大丈夫なのでしょうか？
またスマホやタブレット用のサイズのときはGVを下に持っていくなどそれようのUIに変形するように実務ではすべきなのでしょうか？
それともPCと同じ順番でもよいのでしょうか？

また賛否両論でこれからWEBクリエイターを目指す者がこちらを習得すべきなのでしょうか？
それともそれぞれの端末ごとの作成を習得した方がよほどよいのでしょうか？

回答No.3

tkmojo · ベストアンサー

発想がそもそもちょっと違うような気がします。

レスポンシブでの制作の場合には、「レスポンシブ対応できるようにデザイン等を企画する」というのが大前提です。
既存のサイトをそのままレスポンシブ化するわけではないです。
ですので、レスポンシブに出来ないデザインになるわけがないですよね。

既存のサイトをレスポンシブ化しようとした場合でも、
レスポンシブに出来ないデザインというのは基本的には無いです。
最悪津堂の悪いものは消せばいいだけなので。
レスポンシブを意識していないサイトは9割以上が「やりにくい、やらないほうがいい、やる意味がない」サイトです。
レスポンシブへの対応は無理ではないですが、無理矢理感の強いサイトになるでしょう。

お礼

無理をすればなんでも可能なのですね。
ただしやすいサイトとしにくいデザインのサイトがあると思うのですがその違いを知りたかったのです。

それがワンカラムにしやすいかしにくいかなのかと思ったのです。

回答No.2

神崎 渉瑠（@taloo）

どちらかというと「HTMLを書き換えずにどれくらいCSSだけでデザインを変更する知識と技術を持っているか」ではないですかね。
特にスマホだとJavaScriptを使う事も多いですし、Ajaxを使えばHTMLを書き換える事も含めて自由ですから、「HTMLとCSSで表現できるデザイン」が事実上のデザインの限界です。

>またスマホやタブレット用のサイズのときはGVを下に持っていくなどそれようのUIに変形するように実務ではすべきなのでしょうか？
>それともPCと同じ順番でもよいのでしょうか？

それをすることで使いやすくなるならする方がいいです。

>また賛否両論でこれからWEBクリエイターを目指す者がこちらを習得すべきなのでしょうか？

クリエイターをめざすなら全部やってください。

回答No.1

ORUKA1951

どうも、変な扉からこの世界に入られたようですね。
ウェブページをHTMLで作成するのは、ただ
【引用】＿＿＿＿＿＿＿＿＿＿＿＿ここから
HTML文書が、ブラウザやプラットフォームの違いを超えてうまく働くべきであるということは、多くが認めるところである。 相互運用性の達成は、コンテンツプロバイダのコストを低下させる。なぜならただ1種類の文書しか作る必要がなくなるからだ。 もし【相互運用性確保の】努力が成されなければ、Webは互換性のないフォーマット毎に分け隔てられた世界に分割され、すべての関係者にとっての商業的可能性が減少することとなるであろう、大きなリスクを負うこととなる。
・・・【中略】・・・
　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の創成 ― World Wide Webはいかにして生まれどこに向かうのか( http://www.amazon.co.jp/Web%E3%81%AE%E5%89%B5%E6%88%90-%E2%80%95-World-Wide-Web%E3%81%AF%E3%81%84%E3%81%8B%E3%81%AB%E3%81%97%E3%81%A6%E7%94%9F%E3%81%BE%E3%82%8C%E3%81%A9%E3%81%93%E3%81%AB%E5%90%91%E3%81%8B%E3%81%86%E3%81%AE%E3%81%8B/dp/product-description/4839902879/ref=dp_proddesc_0?ie=UTF8&n=465392&s=books )」
「いかなる国のどのようなコンピュータを使っている誰もが、この画面に対して アクセス可能でなければならない。そして、ほかの人たちが見つけることができる ように、リファレンスすなわちリンクをつくれるようにしなければいけない。( http://www.sal.tohoku.ac.jp/~gothit/webpolicy.html )」

　ですので、そもそもHTMLは、何もしなければ!!!。高解像度のパソコン/スマホだけでなく、携帯電話だろうが、プリンターだろうが、スクリーンリーダーだろうが、点字出力だろうが利用できるものなのですよ。
★だって、そのためにわざわざHTMLでウェブページを作るのですから

　この世界を学び始めたら、イの一番に学ぶ最大のポイントです。

　ウェブページを、その対極にあるワープロやDTP( http://ja.wikipedia.org/wiki/DTP )の一種だと誤解されている人は、本当に多いです。
　HTMLは、SGMLを参考に作られました。SGMLの背景( http://ja.wikipedia.org/wiki/SGML#.E8.83.8C.E6.99.AF )あたりを読んでおきましょう。

　すなわち、<h1>ここは見出し</h1><p>ここから、ここまでは一つの段落</p><ol><li>これは序列リストの項目</li></ol>とテキストだけで、文書に意味を持たせるのです。
　それを視覚ブラウザで見ると見出しは太字の大きな文字で、段落は前後で改行して、リストに番号が振られるのは、ブラウザのもつスタイルシートによるものです。もちろんスクリーンリーダーブラウザは見出しを男声の大きめな声で、段落は一気に読み進み、その前後で間を取るでしょう。

★本来HTMLで作成されたページは、どのような端末でも利用できるはずです。
★それをscreenメディア(PCやスマホ)用にスタイルシートでデザインします。
　原則はリキッドで製作します。--スマホから超幅広ディスプレイまで対応
　　それ以外の端末用(携帯電話-handheld、印刷--print)用のスタイルシートを書く
　　視覚障害者も訪問者に考慮しなければならないときは、speachやbraille、embossedも
★メディア別スタイルシートの拡張で、CSS3以降は、スクリーン用の場合はスマホなど高解像度の小さい画面用にレスポンシブ/mediaqueryでスタイルシートを切り替えることが可能になりました。

＞それともそれぞれの端末ごとの作成を習得した方がよほどよいのでしょうか？
　いま何種類のスマホディスプレイやPC用、携帯電話(ガラケー)用ディスプレイがあるのでしょう。それらにお付き合いする気ですか？？？。今秋以降、来年再来年に販売される物は？
　「HTMLは、どんな環境からもWebの情報を利用できるようにすべきだ」という原則忘れたら・・ダメですよ。

　今学ぶべきは、徹底した「構造とプレゼンテーションの分離( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/intro/intro.html#h-2.4.1 )」と、スタイルシートの基本です。
HTML 4.01 仕様書邦訳( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/cover.html )
CSS 2.1仕様（日本語訳）( http://momdo.s35.xrea.com/web-html-test/spec/CSS21/cover.html )
　だけは、しっかり読んで身につけておきましょう。