「発想・見せ方が面白い」レスポンシブWebデザイン海外事例
巷では「リッチなコンテンツはレスポンシブWebデザインに馴染まない」との声も聞こえますが、ポイントを絞って使えばレスポンシブ対応サイトでも期待以上の効果を発揮することができます。 そこで今回は、動画等の視覚的な演出を効果的に使った、海外のレスポンシブWebデザイン事例を紹介させていただきます。 中にはECサイトや管理ツールなど、国内ではレスポンシブWebデザインが余り浸透していない分野も紹介していますので、ブレイクスルーのきっかけにしてもらえればと思います。 Case1.デザインと機能性を兼ね備えたECサイト SKINNY TIES (米) [ECサイト / ファッション] 直観的な操作で完結する、モバイルファーストな設計 様々なネクタイを「カラー」「デザイン」「幅」から選べるショッピングサイト。 注目すべきは、直観的で分りやすい商品検索や購入方法にあります。 ナビゲーションから直接、カラ
リニューアルサイト構築時に助けてもらったシリーズ ～レスポンシブWebデザインのチェックができる便利ツール～｜Tips*Blog｜株式会社コプロシステム
コプロシステム・Webデザイングループの石川と申します。 昨年の2月からパッタリと当ブログを更新できないでいましたが、連載を再開いたします。 以前からご覧いただいていた方も、初めてご覧になる方も、今後ともどうぞよろしくお願いいたします。 さて、今週5月20日の月曜日、2010年10月から約2年半ぶりにコーポレートサイトをリニューアルしました。 当日のお知らせページにも記載していますが、今回のリニューアルにおける大きなポイントのひとつとして、「レスポンシブWebデザインの導入」があげられます。 （レスポンシブWebデザインそのものの詳細については、過去の記事をご覧ください） 今回のエントリーでは、そのリニューアルサイト構築時に助けてもらったシリーズとして、レスポンシブWebデザインのチェックをするのにとても便利だったツールをご紹介したいと思います。 チェック、チェック、チェック!! サイトを
IMJ | Webサイト構築・運用・コンサルティングはIMJへ
ABOUT US IMJは常に生活者視点を持ったクリエイティブな発想で企業のビジネスを変革し、成果を最大化することで、あらゆる世界にインパクトを与え、新しい領域へと前進させていきます。
メールのためのレスポンシブWebデザインフレームワーク·Antwort MOONGIFT
AntwortはレスポンシブなHTMLメールを実現するスタイルシートフレームワークです。 HTMLはWebブラウザを使って閲覧するのに用いるのが基本ですが、他にも使われることがあります。その一つがHTMLメールです。独自の知識が必要になることもあるのですが、Antwortを使えばそのエッセンスだけすぐに得ることができます。 サンプルデザインです。 スマートフォンではこのように見えます。 デスクトップ、スマートフォンに対応しています。 Antwortはレスポンシブなデザインになっています。デスクトップで見た場合もスマートフォンで見た場合もカラムの構成は違っても情報は正しく伝達できるようになっています。Appleのメール（iOS/Mac OSX）、Gmail、Androidのメール、Outlook 2000/2003/2007、Hotmail、Outlook.com、Yahoo! Mail、A
レスポンシブなカルーセル実装jQueryプラグイン「Slastislide」:phpspot開発日誌
Elastislide - A Responsive jQuery Carousel Plugin | Codrops レスポンシブでカッコいいカルーセル実装jQueryプラグイン「Slastislide」 動きがいい感じな上に、ブラウザを縮小すると全体的に縮小されて使いやすそうです jQueryプラグインの形なので使うのも簡単です 通常モード スマホ等モード。ちょっとちっちゃいかも（＾＾；） 関連エントリ 高機能なカルーセルを実装するjQueryプラグイン５０まとめ ホイールも効いて超いい感じのカルーセル実装jQueryチュートリアル スマフォでも使える３Dカルーセル実装jQueryプラグイン「Cloud Carousel Touch」
流行期を過ぎたレスポンシブ・Webデザインのこれから
ちょうど1年前に私が書いた記事（スマホ対応の新潮流「レスポンシブ・Webデザイン」とは？）を皮きりに、日本のWebメディアやブログでも「レスポンシブ・Webデザイン」が話題になっている。みなさんも一度はレスポンシブ・Webデザインについて聞いた、あるいは記事を目にしたことがあるのではないだろうか？ スマートフォン向けのWebサイトを提供する上で、レスポンシブ・Webデザインは有効な手段だという認識が海外で広がっているが、日本では「流行」「夢の世界」「現実的ではない」などと誤解している方が多いようだ。誤解を生む背景には、レスポンシブ・Webデザインの定義を勘違いしていたり、深く理解せずに言葉遊びとして捉えていたりする傾向があるように思う。 そこで、あらためてレスポンシブ ・Webデザインのメリットと今後の動向について紹介する。 レスポンシブ・Webデザインとは？ レスポンシブ・Webデザイン
レスポンシブWebデザインとは (1/5)
スマートフォンやタブレット、PCなどあらゆるデバイスに対応する制作手法として注目されている「レスポンシブWebデザイン」。レスポンシブWebデザインの概念からサイト制作の基本まで、レスポンシブWebデザインによる制作案件を数多くこなす菊池 崇氏が解説します。（編集部） 本連載で紹介したレスポンシブWebデザインの基礎に加えて、画像や動画のレスポンシブ対応、パフォーマンス改善といった商用サイト構築のノウハウを大幅に加筆。さらに、解像度に依存しないレスポンシブWebデザインの考え方やスマートテレビ対応などの応用テクも盛り込みました。 レスポンシブWebデザイン マルチデバイス時代のコンセプトとテクニック 定価：2,625円 (本体2,500円)／形態：B5変 (232ページ) ISBN：978-4-04-886323-0 レスポンシブWebデザイン（Responsive Web Design）
レスポンシブWebデザインのウェブサイトを半年運営してみて思ったこと
昨年2011年10月に仕事で運営に携わっている大学ウェブサイトでレスポンシブWebデザイン (しかもフル可変グリッドレイアウト) を導入して、はや半年。約6ヶ月間、レスポンシブWebデザイン（RWD）で制作したウェブサイトを運営してみて思ったことをまとめてみました。これからレスポンシブWebデザインを導入したいと考えている方の参考になれば幸いです。 プロジェクトの概要 大学のウェブサイトをリニューアルするにあたり、さまざまな状況や制限などを考慮、また、今後3〜5年を見据えて、レスポンシブWebデザインを取り入れた制作を行いました。大学公式ブログでもリニューアルについて紹介しているので、ぜひそちらもご覧ください。そこで書いたように、以下のような思いもあり、このリニューアルを行いました： 今回、新しい試みを行った背景には、このウェブサイトが「大学のウェブサイト」であることが大きな要因の一つとし
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Responsive Web Design JP（日本国内の秀逸なレスポンシブWebデザインを集めたギャラリーサイト）
cmmntr.com
新着記事
iPhoneやiPad等にもWebサイトを最適化するレスポンシブWebデザイン構築に役立つフレームワークやTipsいろいろ - かちびと.net