Information

CSS Nite in TAKAMATSU, Vol.7 スライド&音声公開「CSS3で変わるWeb制作」 鷹野 雅弘さん

takano2012年5月20日、香川県高松市アルファあなぶきホールで開催した「CSS Nite in TAKAMATSU, Vol.7 with Microsoft ~今日から使えるHTML5&CSS3~」での鷹野 雅弘株式会社スイッチ)さんのセッション『CSS3で変わるWeb制作』のスライドと音声を公開します。

セッション2「CSS3で変わるWeb制作」を担当しました鷹野です。

ご参加ありがとうございました。「画像いらずでメンテナンス向上」という切り口でCSS3をご紹介しましたが、もうひとつ、表現力のひろがり、という面も無視できません。

デザイン、コーディングの両方に取り組まれている方は、これまで実現したいけど、HTMLがややこしくなり、画像も増えるので…と躊躇する場面があったことでしょう。「おっと、これが可能なら…」と、新しいアイデアのインスピレーションにつながるかも!

「レスポンシブWebデザイン」について

ご紹介した「レスポンシブWebデザイン」はDreamweaver CS6でも新機能「可変グリッドレイアウト」によって推していますが、次のような問題も抱えています。

  • PCサイトのレイアウトを変えたままでは重い
    • 画像:モバイル用には異なる画像をはき出すしくみが必須
    • 「display: none;」で隠しても、読んでいる
  • そもそもレイアウトを変えるだけでなく、コンテンツの最適化が必要では?
    • 机でPCを使うのと、スマートフォンを出先で使うのでは、必要なコンテンツがまったく異なる(ことが多い)

同じスマートフォン/OSでも、画面サイズが異なることへの対応としてレスポンシブWebデザインのスキルを身に付けておく必要があると考えていますが、スマートフォン対応とスマートフォン最適化は異なることを忘れずに。ちなみに、アップルのサイトは、基本的に、レスポンシブWebデザイン、jQuery Mobileなどのスマートフォン対応はされていません…

昨年9月のCSS Niteにて、レスポンシブWebデザイン、jQuery Mobileをテーマに講演していますので、ぜひ、ご覧ください(ビデオがあります)。
http://cssnite.jp/archives/post_2163.html

CodeZineにて、次の記事を執筆しました。
サンプルで学ぶDreamweaver CS6!「レスポンシブWebデザイン」に挑戦してみよう
http://codezine.jp/article/detail/6574

参照リンクなどは下記にまとめました。
CSS Nite in TAKAMATSU, Vol.7「CSS3で変わるWeb制作」フォローアップ
http://cssnite.jp/takamatsu/vol07/takano/


Comments:0

Comment Form
Remember personal info

Trackbacks:0

Trackback URL for this entry
http://cssnite.webridge-kagawa.com/vol7/archives/1041/trackback/
Listed below are links to weblogs that reference
CSS Nite in TAKAMATSU, Vol.7 スライド&音声公開「CSS3で変わるWeb制作」 鷹野 雅弘さん from CSS Nite in TAKAMATSU 公式サイト