Chrome+HTML5 Conferenceに参加してきました 5

取りあえずはこの記事で終了です。
Chrome+HTML5 Conferenceは面白かったです。

しかし、やはりいつの時代も最先端の技術を使おうとすると
「下位互換」って言うのは問題になってきますね。
みんなが最新の同じ物を使えば簡単に解決する問題なんですが
そんな簡単にいかないのが人の世の中ってもんですよね。

ともあれ、これをきっかけにHTML5の勉強もスタートさせたいところ。
特に私の場合はWebデザインと言うよりはHTML5を使った
クロスプラットフォームでの開発がメインになります。

デザインできませんしね。
HTML5を使って、いかに楽をするか。考えて行きたいと思います。

SVGについてのお話。
文字や絵などをベクタデータで描くことで容量の節減や
画面の拡大縮小による劣化を防いだり、アニメーションが出来たり。

画像のように美しく見えるが画像ではなく、文字なので
テキストを選択してコピーしたり、テキストリンクを埋め込むことも。

なかなか面白い技術だとは思うのですが、やはり複雑なものを
描画するためにはIllustratorなどから出力したものを利用しなくては
いけなかったり、使えるブラウザが限られ過ぎてるのがネックですね。

ちょっと私には手を出しづらいと思いましたので、簡易です。
資料などは以下のURLになります。

◆ 実用例
http://www.pxgrid.com
ロゴ部分がSVGになっているようです。

◆ 後編 Dive into SVG スライド
小山田晃浩
http://www.slideshare.net/yomotsu/dive-into-svg

これからHTML5を使っていく上での注意点、
既存のHTML5に対応していないブラウザと共存させていく上で
注意していかなければいけないところなど。

「スマートフォン向けモバイルサイト開発」と被っている内容の
箇所が多かったのと、結局のところは色んな知識を得て経験則などで
上手く共存させていかないといけない、みたいなお話だったので
結論がぼやけた感じで？？と言うのが正直な感想です。

「Modernizr」によって調査できるのは、それに対応しているかどうか、
だけなので同じような機能を実現させなくてはいけない、と
なった場合にどうすれば良いかを紹介されています。

Polyfills

標準機能を真似するライブラリ。
補修材の名前が由来。
対応状況の「のび」を埋める

Modernizr.load() + Polyfills
→ 存在しなかったら、代替のPolyfillsを利用する

注意点として、Polyfillsで何でも解決出来るわけではない。
出来はするかもしれないが、使うほど古い環境に負担がかかる。
結果としてアクセシビリティが下がってしまうそれは「対応」なのか？

選択肢として「使わない」ことも考えて欲しい。
本当にその機能は必要か？（モダンブラウザにも必要？）

Placeholderなど。それが無ければ分からないような
検索窓はフォームとして問題ないのか。便利に使えるからこそ考えたい。
→ 果たして、それが何かの問題解決になるのか。
→ その効果は、ユーザにとっていい体験として提供されるのか。

「使える！」か「使える？」か
いろんな方法があります。
活かし方を知って「使える！」に。