Drkcore

12 11 2011 HTML5 Tweet

ウェブデザインのつくり方、インターフェイスデザインの考え方。

「ウェブデザインのつくり方、インターフェイスデザインの考え方。」という本を読んだら、blogのデザインを弄りたくなったので、少し手を加えてみた。モバイル対応を目>的とした作業だったんだけど、結局モバイル対応はしてない。

ProductName ウェブデザインのつくり方、インターフェイスデザインの考え方。
矢野りん
MdN / 2415円 ( 2011-09-26 )


本書を読めばデザインの基本的なレイアウトの話とか色の選択とか一通り押さえられるのでオススメですね。内容も図が豊富でわかりやすいし。

僕は、レスポンシブwebデザインに興味があったので、media-queryのあたりを読むために購入。

レスポンシブ・ウェブデザインってのは結局media-queryなんかを利用して

Media queriesはコンテンツを表示したブラウザの幅サイズを取得し、そのサイズに応じてCSSのプロパティを取捨選択するために使うプロパティです

というわけで、結局

さまざまな表示環境で同じHTMLをリソースとして活用できるようになります

とあるように、HTMLを使いまわす技法の一つということか。

一通り読んだあとで、じゃぁ、自分のブログシステムをレスポンシブ・ウェブデザインにしてみようとしたんだが、1カラムなんで別にフロートにする必要もないしサイドバー的なモノも用意してないから、特にやることがなかった。

色々検討していて、気がついたのはmedia-queryでCSSで切り替えるっていうのは結局CSSをいじることであってテンプレートをいじるのとは違うなぁと。例えば、モバイルデバイス向けにアドセンスを切り替えたりとか文書構造替えたりってのはテンプレートいじったほうが早いし、スマートだよなぁと。

結局WAFをいじくっているのであればそっちのテンプレートでゴニョゴニョと調整したほうが楽だよなぁと、自分はUserAgentみてWAFのテンプレート切り替えるほうが好きだわという結論に至り、レスポンシブ・ウェブデザインへの興味が急速に(指数関数のオーダーで)薄れたのであった。

とはいえ、スマホ判定したら別のURLにリダイレクトってのは好きじゃないかなぁ、意味論的に気持ち悪い気がする。それともlink rel="alternate"みたいな感じでどうにかできるのかな?

ここらへんがよくわかっていない。

ちなみにスマートフォンサイトを作るというテーマに絞るならば、以下の本が丁寧に説明してあって良いですね。

ProductName iPhone+Android スマートフォンサイト制作入門 (WEB PROFESSIONAL)
たにぐちまこと
アスキー・メディアワークス / 2499円 ( 2011-02-19 )


About

  • もう5年目(wishlistありマス♡)
  • 最近はPythonとDeepLearning
  • 日本酒自粛中
  • ドラムンベースからミニマルまで
  • ポケモンGOゆるめ

Tag

Python Deep Learning javascript chemoinformatics Emacs sake and more...

Ad

© kzfm 2003-2021