まとめレスポンシブデザインは増えてきたけど・・・にゃんこ師匠PCにもスマホにも対応したレスポンシブデザインは当たり前になったにゃ~ミツオカでも、うちのおじいちゃんが「スマホに変えたのに、阿部寛のホームページは昔のまんまじゃ!」て驚いて腰抜かしてました!にゃんこ師匠おお...あれは一生変わらない人類の宝なんじゃ...。タブレット通常のレスポンシブ対応は基本的に要素の並びは一緒なのですが、ファーストビューのコメントの配置の比率を上手に使われています。スマホ版ではスマートな印象ですが、パソコン版では余白を多めに取ることで温かみのある印象を与えてくれます。タブレット基本のデザインはスマホ版、パソコン版ともに変わらない、シンプルなデザインです。Items部は、パソコン版ではマウスを乗せると、服の上にカテゴリーやブランドが現れます。スマホ版では、長押しすると服の写真の上にカテゴリーやブランドが出てきます。タブレットパソコンで、画面のサイズを変えることってないでしょうか?別のページやフォルダを開く際、画面のサイズを変えると、ある時突然形が変わることがあります。CAFEは、サイズを変更した際のレイアウトの切り替えが非常に滑らかです。タブレットパソコン版では映像や、背景画像をクリックすると説明ページにするなど、動きに富んだサイトです。スマホ版では一転、静止画をメインとした最低限の動きに抑えられています。ユーザーの使用の意図に沿ったデザインパソコンで「ういろう」を調べる際、家で時間をかけることの方が多いですよね。時間をかけて見てもらえる以上、「特別な品」として演出したい意図があり動きやデザインを実現しています。スマホで調べる際は、お店を探したり、商品をさらっと見たいなど、情報を得たい人の方が多いと思われます。そのため、動きが少なく情報が見やすい静止画をメインとし、情報を見やすくしています。HUBが、必ずフッターやサイドにぴったり収まるように設計されています。事業説明の図も、画面のサイズに合わせてデザインを変えているのも特徴的。にゃんこ師匠スマホだとリンクが近いと誤タッチがおきやすい。タブレット白を基調にした、シンプルで直感的に使いやすいサイトです。スマホ版で縦並びにしても見やすいよう、ページを構成するアイテムをボックスで作成しており、サイズの違う端末でも画一的に見え、コーディングがしやすいのも特徴です。タブレットパソコン版、スマホ版ともに見え方がほとんど同じになるように設計されています。スマホ版とパソコン版でデザインが違うのもオシャレで素敵ですが、どちらから見ても同じように見えるデザインは同じ印象を与えるので、企業ブランディングがしやすいメリットがありますよね。要素を中央配置にし、コンテンツ部は同じレイアウトの繰り返しにすることで、統一感を持たせておるにゃミツオカW3Gの公式サイトはコチラまとめいかがでしたか?レスポンシブデザインの一番のポイントは「画面サイズが変更されても、見やすいサイトにする」こと。スマートフォンでも、PCでも見やすいのは勿論のこと、それぞれで工夫が違うものがあると、ついついどちらからも閲覧したくなりますよね。今回は、にゃんこ師匠の主観で選びましたが、まだまだユーザー目線のレスポンシブデザインを施したサイトはたくさんあります。社長と一杯飲みながらお話してみたい方はこちらミツオカフリーランスエンジニア様の募集はこちらにゃんこ師匠その他、お問い合わせはこちらミツオカお気軽にお問い合わせください!せっかくなので、別の記事もぜひ読んでいって下さいね!一緒に働いてくれる仲間を募集しております!ライトコードでは、仲間を募集しております!当社のモットーは「好きなことを仕事にするエンジニア集団」「エンジニアによるエンジニアのための会社」。エンジニアであるあなたの「やってみたいこと」を全力で応援する会社です。ライトコードは現在、急成長中!だからこそ、あなたにお任せしたいやりがいのあるお仕事は沢山あります。「コアメンバー」として活躍してくれる、あなたからのご応募をお待ちしております!なお、ご応募の前に、「話しだけ聞いてみたい」「社内の雰囲気を知りたい」という方はこちらをご覧ください。「好きなことを仕事にするエンジニア集団」の(株)ライトコードのメディア編集部が書いている記事です。rightcodeエンジニア大募集中!私たちライトコードでは、エンジニアを募集しております。私服大歓迎のカジュアルな職場なので、お気軽にご応募ください!また、フリーエンジニアの方も募集しております。