レスポンシブWEBデザイン つくってみた。

2012年05月25日 03:57

  • LINEで送る
レスポンシブWEBデザイン つくってみた。

なんだか急に周りで熱が高まっているのか、「レスポンシブ WEB デザインにして!」という声をよく聞くため、欲しがってる人を羨ましがらせるために、自分のためだけに作ってみました。
このブログのテンプレートでやってみました。
(ブラウザの横幅を変更すると、いろいろ変わります)

結構「難しい」という声を聞いていたので時間があるときにやろうかな、というぐらいだったのですが、仕組みを理解してしまえば、結構簡単でした。
でも技術的にはできたけど、各メディアに最適化するのは大変かな・・・。

レスポンシブにするメリットというのは、各メディア端末向けにたくさんのファイル(テンプレート)を作らなくてよいところだと思います。
あれ? 制作者目線だな・・・。

作ってみて改めて思ったことですが、もう少し概念を固めないといけない技術だな、と。
例えば、携帯で使われる画像、PCで使われる画像、表示するファイルは同じもので良いでしょうか?
1ファイルで全ての端末に対応する必要はないかもしれないですが、携帯環境などには特に負荷がかかりすぎるかな、と感じました。僕なら携帯版だけは別 html ファイルにしたいかな。掲載する写真画像も PC 版とは別のものにしたいし。

流行だから、と飛びつくのではなく、いかにこの完結されてない中途半端で未完成な技術を使って、WEBという技術に向き合っていくかが問われる感じ。


数年前、テーブルレイアウトから css レイアウトになった時に、スタイルシート関連が大流行しました。
不思議なのは、その時にリキッドレイアウトが今まで全く見向きもされないできたということで、今でもほとんどのサイトが横幅が固定されているフィックスドレイアウトになっています。

紙媒体などは文字の大きさやレイアウト、改行の位置まで決めてしまうことで美しい体裁を保つことができるのですが、WEBの場合は様々な環境下で閲覧されるために、インタラクティブな要素も必要になります。
閲覧者の好みに合わせてデザインの変更ができるリキッドレイアウトは、WEBデザインをWEBデザインという概念にたらしめる「WEBのためのデザイン」でした。

紙上から解き放たれたはずのWEBデザインは、しかし紙の歴史によって作られた美的概念からは逃れられず、紙のように固定されたデザインのまま。

実際にはリキッドレイアウトは「使いにくい」という声が多かったみたいです。
僕もこのブログをリキッドレイアウトに無理矢理してましたが、正直バランス難しかった。

最近デザインの世界では「グリッドレイアウト」の概念が急浮上してるみたいですが、ミニマルデザイン、メトロUI の高評価なんかの影響があるかもですね。
僕はグリッドデザインというと、なぜかグーテンベルグを思い出すのですが。なんでだろ。同時期に習ったんかな。

それにしても、WEBの世界は、本当にいろんな技術がでてきて面白いです。
まだ未成熟な分野も多いので、自分なりの答えを出しつつ、喜ばれるものを作りたいですね。
 




同じカテゴリー(スキルアップ)の記事

このブログの新着情報を配信中!

RSSリーダーに登録することで、新着情報だけを確認することができ便利です。
上のアイコンをクリックしてご登録ください。

見るだけでは飽き足らない、あなた。あなたも小言に参加してみませんか。コメントトラックバック、ご自由にどうぞ。


入力した内容は表示されます
上の画像に書かれている文字を入力して下さい
 
<ご注意>
書き込まれた内容は公開され、ブログの持ち主だけが削除できます。
過去記事
デザイン特集
グルメ特集
アクセスカウンタ
読者登録
メールアドレスを入力して登録する事で、このブログの新着エントリーをメールでお届けいたします。解除は→こちら
現在の読者数 32人
QRコード
QRCODE
プロフィール
yasukawa
yasukawa
浜松在住クリエイター&デザイナーが仕事のことについて頑張って書いてみる。
【認知心理学、コミュニケーションデザイン、情報デザイン、UI/UX、インフォメーションアーキテクト、サイネージ(Scala)、3Dモデリング、データベースアプリ構築(FlileMaker)、Flash Script 2.0&3.0、サーバ構築(Linux)、IoTセンサー&電子工作(Arduino)
文部科学省後援情報検定 情報デザイン試験合格
日本商工会議所販売士検定試験2級合格
日本英語検定協会実用英語検定試験3級合格
デザインカレッジ 外部講師(WEBマーケティング)
日本最大級レビューメディア「zigsow」2021年ベストレビュワー