-
ID:aVmBJq さんの質問

初心者ながらレスポンシブサイトを作ってるんですが
なかなかうまく実装できません。
検索でいろんなのを見ているのですが、
皆さんは今までの経験でいきなり出来たりするんですか?
それとも本やらレスポンシブについて書かれてるサイト見たりして
身につけましたか?

何か初心者でもこれ読めば理解できるかもしれないっていうサイトとかがあれば
教えて下さい…。

みんなの回答 13 件

ID:CARFo8 さんの回答

ありません。根性です。

ID:aVmBJq

根性でレスポンシブ作ってるんですか…すごい

ID:C7PyMj

結構根性だよね。

ID:IPnXcU

トライ&エラーを繰り返すだけだから、まぁ根性だよね。

ID:E0Cxi3

だね

ID:8.pQMs

はじめは根性だと思う。慣れてくると設計できるようになるから。

ID:aVmBJq

ご回答ありがとうございます。
PC上の表示とスマホでの確認でかなりレイアウトが異なって
挫けそうだったので、根性で…頑張ります;;

ID:CARFo8

それはレスポンシブ云々というよりCSSかもですね。

ID:HPy4oP さんの回答

少し古いですが、
このチュートリアルだけやってシンプルなページなら組めるようになりました。

ASCII.jp:ゼロから始めるレスポンシブWebデザイン入門

http://goo.gl/aIaifK
ID:aVmBJq

このサイト私も見ました!
同じように見ながらやっていけばいいんですね、
ただ読んで終わっていたので。。

ID:jUDi26 さんの回答

凝った事しないならcssで解像度によって変わる部分だけ別にスタイル作るだけだよ。


  • @media screen and (min-width: ○○px) {
    }

  • とかで括ればいい。
    あとは通常の作り方と基本的には一緒。

ID:.Y7yrS

そしてブレイクポイントと画像の扱いに悩む→そこも根性

ID:aVmBJq

なんとか別スタイル作ってブレイクポイントで切り替わるようになったのですが、PCでブラウザのサイズを伸縮してcss設定してたのですが、
実機(Androidで見た時にあるはずの文字がどっかにずれてたりしてまして…
作成する時はPCと実機確認しながらcss組んでるんですか?

ID:89qC0s

機種依存の可能性も疑ってみては?

ID:n73wH/

Chromeで開発者ツール開いてDeviceを切り替えてテストしてる。
ただ、なんだかんだで実機でも見とかないと安心はできない。
特にJS使ってるページは。

ID:OZi.3a さんの回答

マジレス1

『HTML5&CSS3デザインブック』について

http://ebisu.com/note/about-html5-css3-designbook/
ID:aVmBJq

やっぱ本買って読んでみるしかないですかね・・

ID:OZi.3a さんの回答

マジレス2

レスポンシブWebデザイン対応のサイトを1から作ってみた手順と感想

http://ruucb.com/blog/2014-03-09/responsive-web-design/
ID:aVmBJq

読んでみます!ありがとうございます!

ID:WB8f3N さんの回答

ドットインストールとかどうでしょう
レスポンシブデザイン専用のレッスンがあったはずです。

ID:aVmBJq

このサイト、初めて知りました!
あまりお金かけられないので、無料の動画の視聴だけで
見てみたいと思います!ありがとうございます!

ID:QHyK.F さんの回答

経験少ないならモバイルファーストなデザインから作ってくといいかも

ID:aVmBJq

モバイルファーストなデザイン…確かにそうかもしれないですね。
モバイルはいつも後で考えてしまいますし。
ありがとうございます!

ID:BbCowU さんの回答

フレームワークを使うと楽

ID:aVmBJq

フレームワーク使えばいいんですか!
あー…確かにその方が楽ですよね。
0から組もうとしちゃだめですね。
ありがとうございます!

ID:6b.ONg さんの回答

最初のころは本をみて勉強しました。後はほかのレスポンシブのサイトをみてためしに同じの作ってみるとかがいいかと思います。そしたらなれますよ(#^.^#)

ID:aVmBJq

やはり本って読んどかないとだめですかね。
作りたいサイトと同じ構成のレスポンシブサイトを探して
やろうかなって思ってたので、間違いじゃないんですね
ありがとうございます!

ID:0tnZ.0 さんの回答

一番売れてるレスポンシブの公式本らしい。
一番わかりやすかった。

レスポンシブWebデザイン 公式本

http://www.amazon.co.jp/gp/product/4883378578
ID:enjrbR さんの回答

本でもいいけど、フレームワークがどのように書かれているかを見るだけでもかなり勉強になるよ。最近だと、Sass/Lessの状態での配布も多いしね。

ID:Alzpc5 さんの回答

他の方の回答にあるように、フレームワーク(代表的なものだと Bootstrap, Foundation)を使うのが一番だと思います。
ゼロから組みたいなら、Sassのミックスインライブラリ Bourbon Neat とか使えると思いますよ。
最初は自分のレベルに合いそうな本を買って来て、簡単なサンプルを作りながら学習するのが一番だと思います。あまり背伸びすると気が滅入るので…w

Bourbon Neat

http://neat.bourbon.io/
ID:CwL9vA さんの回答

レスポンシブって言っても可変(サイト幅を%表示)にしてるだけでこれは昔からあったしやっていた。

そこに最近はメディアクエリーで画面幅によってCSSを切り分けているだけなので、投稿者さんがどの程度のレベルか分かりませんが基本的な実践的なCSSの知識がないだけだと思いますよ。

実践で活躍している方は皆「勉強」と言うより、新しいプロパティ増えたなー!>使ってみよ!>出来た!な感覚だと思います。*複雑なレイアウトを除く。

どちらにしても、ソースや投稿者様のレベルが謎なのでアドバイス出来ません。

最終更新日:2015-02-18 (2,783 views)

関連するトピックス

ページ上部に戻る