みなさんこんにちは！おさかなです！
今回は「Responsive Web Design JP」について、書いていこうと思います！
それでは、レッツゴー！！！！！
・レスポンシブデザインのサンプルを探している方
・スマホのデザインを考え中の方
・Webデザイナー・エンジニアの方
「Responsive Web Design JP」って何？
「Responsive Web Design JP」とは、日本の秀逸なレスポンシブデザインのWebサイトがまとめられているページのことです。実際にサイトを訪問すれば、コードのチェックも可能です！(いいね！)
https://osakanav.com/nomad-code
実際に使ってみよう！
それでは早速サイトにアクセスしましょう！
ページをスクロールすると、色々なデザインが表示されます！(おお！)
(これ美味しそう…🍫)
気になるデザインをクリックすると…？
こんな感じで、実際のサイトに飛べます！(いい感じ！)
嬉野茶時っていうお茶🍵のサイト、和っぽくて個人的に好きです！
ちなみにサイトを開いた状態で「F12」キーを押して、デベロッパーツールを開くと、ソースコードが見れます！(ふむふむ…。)
使用されているカラー、フォントなども確認できます！(お〜！)
ちなみに、ショートカットキー「Ctrl」＋「U」からも、ページのソースを見れます。
右のメニューから「CATEGORY」を選択すると…？
こんな感じで「アパレル」「インテリア」「芸能」など、カテゴリ別にサイトを検索できます！(便利)
「家電・AV機器」を選択すると、こんな感じで表示されました！(商品欲しくなっちゃう！)
オムロンの血圧計とかもありました！(電気屋さん行きたい)
メニューから「COLOR」を選択すると…？
デザインに使用されている「カラー」ごとに検索できます！(いいね！)
黄色はこんな感じ！(おおー！)
メニューから「TECHNIQUE」を選択すると…？
jQueryやVue.jsなど、サイトに使用されている技術ごとに検索ができます！
(個人的には、これが一番すごいと思いました！)
Reactを押すと、こんな感じ！
メニューの一番下にある「TYPE」を押すと…？
「EC」「コーポレート」サイトや「ブログ」など、サイトの種類別に検索できます！(助かる)
ECサイトはこんな感じです！(わあ〜！)
みなさんも是非サイトデザインの参考にしてみてください！
https://osakanav.com/nippon-colors
レスポンシブって、たまに噛む。
レスポンシブ…レスポンシブ…。
これで全ての操作は完了です。(やった～！)
お疲れ様でした☕
ここまで読んでくださり、ありがとうございました！
https://osakanav.com/canva-design
