重宝!レスポンシブWEBデザイン、iOS、Android各端末のチェッカー。縦横もOK!

ウェブサイト制作者さん、便利な重宝サイト(ツール)がリリースされましたよ!
その名も「レスポンシブチェッカー」。

*URLは、http:// から正確に入力してください。

iOS、Android各端末で、どんな風に見えるかがプレビューできます。
しかも、縦、横、両方で。

RESPONSIVE CHECKER(レスポンシブチェッカー)

現在、プレビュー対応機種は以下のとおり。

iPhone 5
iPad mini
iPad
Galaxy Tab 10.1
Xperia AX SO-01E
HTC Aria

サイトに埋め込んだ、YouTubeや、Google Adsenseなども表示されます。

レスポンシブチェッカーをリリースしたのは、株式会社G.A.Pさん(東京・新宿)。ウェブサイト制作、システム開発、アプリ開発、マーケティングなどが主な事業内容。マイナビのAndroidアプリや、Facebookの三国志診断アプリなどをリリースされています。

レスポンシブWEBデザインとは?

一般ユーザーにもわかりやすいように、ザックリ行きます。

【2000年代前半〜2000年代後半】
PC用サイトとは別に、携帯用サイトを作るのが一般的でした。

・携帯用サイトはPC用とは別で用意する事が多かった。
・iMode絵文字などを入れたり、文字を色づけなど装飾したり。
・URL(サイトのアドレス)はそれぞれ別。
・もしくは別URLにリダイレクト(自動転送)。
↓

【2010年〜】
スマホ時代に入り、PCサイトがそのまま見れる。やった〜!

・URL(サイトのアドレス)は、PC用・携帯用おなじ。

スマートフォン、タブレット用サイトは、不要になるかと思われたが…。
↓
「パソコン用のサイト、スマホで見にくくない?」。…なんて声がチラホラ。
↓
【2010年〜】
スマホ時代に入ってなお、携帯端末用に別サイト(別デザイン)を用意しないといけなかった。

結局、昔と手間一緒じゃん…。
↓
【近年】
デバイス(端末)によって、自動的にサイトデザインを変化させる「レスポンシブWebデザイン」が流行。

・PC、スマホ、タブレット。どんなサイズの画面が来ても、最適な幅で表示される。
・URLは当然同じ。
・GoogleがレスポンシブWebデザインを推奨中。流行に拍車。


レスポンシブWebデザイン「超」実践デザイン集中講義
山崎 大助
ソフトバンククリエイティブ
売り上げランキング: 22,039

レスポンシブWebデザインテクニックブック プロが教えるマルチデバイス対応の手法
野田 一輝 加藤 俊司 藤田 拓人 清水 豊 細川 富代 野田 真穂 川下 城誉 根岸 良樹 岩堀 真吾 大竹 孔明
エムディエヌコーポレーション
売り上げランキング: 45,038

ただし、万能ではない「レスポンシブWEBデザイン」。

コンテンツ・セッション(ワードキャンプ)


→ 株式会社LIG 竹内さん
ウチは3〜4割がスマートフォンからのアクセス。あと、レスポンジブ・デザインはおすすめ出来ない。デザインと導線設計は、PC用・スマホ用それぞれに必要と考えている。サイト制作という立場から考えると、レスポンシブは工数が増えるので、日数・費用とも掛かってしまう。

WordCamp Tokyo 2012メモ書きレポート。コンテンツセッションが最高でした!より


 

今年9月、東京で開催されたWordPressの祭典「WordCamp Tokyo 2013」のヒトコマ。

ユーザー視点にたった場合、使いやすさ(導線、デザイン)としてはレスポンシブはおすすめ出来ないとの見解。

確かに、レスポンシブはPC用サイトの情報を全て表示するので、特に情報量の多いサイトは猛烈に縦長のサイト(ページ)になってしまう。これだと、ページ全体を見渡してもらうのは困難でしょう。確かに、レスポンシブは万能ではないと言える。同感です。


<最後にひとこと>
ここ10年を振り返っただけで、相当ウェブデザインは変化してきていますね。昔はPCからのアクセスが主だったのが、今や外出中、動き回っている人がメイン・ターゲットに。日進月歩で面白くなって行きますね!