レスポンシブウェブデザイン

レスポンシブウェブデザインの無料テンプレート紹介している記事を探してみた

20130809001

このスタッフブログもモバイル対応にしたいなと前々から考えてはいるのですが、なかなか重い腰が上がらずにいます。
モバイル対応すれば、アクセス数も多少上がるだろうと予想は出来のですが、構築する時間がありません。

 

そこで、レスポンシブウェブデザインに対応したテンプレートを配布してくれているサイトを紹介している記事が多数あるので、そんな紹介しながらこのブログをレスポンシブウェブ対応にする為の情報を集めようかと思います。
テンプレートを個別で紹介するよりもこちらの方が多く紹介出来るので、デザインをまとめて紹介している記事を紹介していきます。

 

以前書いた「レスポンシブウェブデザインを簡単に確認する方法」という記事で、タブレットやスマートフォンの端末が無くてもレスポンシブウェブデザインの確認出来る方法を記事にしているので、こちらの合わせて読んでください。

 

続きを読む

Flashはスマートフォン向け検索に不利だとgoogleが明言!スマートフォンサイトを構築する際の注意点

2013061401

6月11日のgoogleウェブマスター公式ブログでスマートフォン向け検索ランキング変更の説明記事がアップされました。
最近googleもスマートフォン向けサイトの拡充を制作者側に作った方が良いとアピールし「携帯端末に最適化されたウェブサイトの構築方法」や「スマートフォン サイトによく見られるミス」等の記事も公開してきました。

 

そんな中で、スマートフォン向けサイトでの多いミスについて言及しております。

続きを読む

レスポンシブウェブデザインサイトを作る時に役立フレームワーク

20130610001
レスポンシブウェブデザインは、普通のウェブサイトをスマートフォンにも対応させる事の出来る技術です。
そんなレスポンシブウェブデザインサイトを制作する際、1から全て作るよりもベースとなるフレームワークがあったら便利ですよね。
そこで、海外でフレームワークを配布しているサイトがあるので紹介します。

 

レスポンシブウェブデザインサイトとスマートフォンサイトの違いは、過去の「3つのタイプのスマートフォン(モバイル)サイトとその違い」という記事で紹介しています。

続きを読む

参考にしたいレスポンシブウェブデザインのサイト(海外)

20130408001

3月の初めに国内のレスポンシブウェブデザインを採用したサイトをご紹介しました。
海外のレスポンシブウェブも紹介しますと言っていたのですが、紹介するのを忘れていたので、少し遅くなりましたが紹介したいと思います。

レスポンシブウェブは、海外の方が先に火がついた分面白いデザインのサイトも多いです。
特に最近では、スッキリとしたデザインや画像を大きく使ったデザイン等様々なサイトが存在しています。
そして、新しいサービスを紹介したサイトやスマートフォン用アプリを紹介したサイトのデザインは、日本でも似たようなデザインを取り入れる企業も増えていますね。

分かりやすく見やすいサイトは、参考にする企業が多いです。

3月に書いた国内のレスポンシブウェブデザインを紹介した記事も参考にして下さい。
参考にしたいレスポンシブウェブデザインのサイト(国内)
レスポンシブウェブデザインを簡単に確認する方法

続きを読む

レスポンシブウェブデザインを簡単に確認する方法

20130308

前回のレスポンシブウェブデザインを紹介した記事「参考にしたいレスポンシブウェブデザインのサイト(国内)」を公開した後に、どうやったらレスポンシブウェブを確認出来るか質問を頂いたので、簡単に確認できる方法を紹介します。

 

今回紹介するrwd bookmarkletを利用すると、PCサイト、タブレット縦、タブレット横、スマートフォン縦、スマートフォン横の表示方法を簡単に確認できるようになります。
レスポンシブウェブデザインがどういったものか確認したい時にはとても便利なので試してみてはいかがでしょうか?

 

続きを読む

参考にしたいレスポンシブウェブデザインのサイト(国内)

20130306001

現在は、レスポンシブウェブデザインでの制作依頼、提案が増えています。
デザインに思いっきりこだわるサイトには向いていませんが、スマートフォンサイトが欲しいという方には制作コストを下げる事が出来るのでお勧めです。
今回は、そんなレスポンシブウェブデザインを採用しているサイトをご紹介します。
レスポンシブウェブの詳しい情報はこちらの過去記事でご確認下さい。
3つのタイプのスマートフォン(モバイル)サイトとその違い

 

簡単に説明すると、画面(モニター)の横幅を認識してホームページの表示方法を変える手法です。
横幅が狭い時は、自動で画像を小さくしてメニューボタンの並び方を変えて、スマートフォン専用サイトにしたり出来る手法です。
最近ではgoogleもこの手法を勧めています。詳しくは「レスポンシブ・ウェブデザイン – メディアクエリのパワーを使いこなす」の記事をご覧ください。

 

続きを読む