初めてのHTML5 なにができるの？第2回 HTML5とか勉強会 for ビギナー #html5j

「第2回 HTML5とか勉強会 for ビギナー」で「初めてのHTML5 なにができるの？」という内容で発表してきた。

内容はこんな感じ。

僕の資料はこちら。

来てくれて、さらにblogまで書いてくれてありがと！

第二回の勉強会も部長の山崎大介(_AIR_NOTE)さんが尽力してくれて、とても楽しい時間だった。大したことはしてないけど、僕もちょっとだけお手伝いしてる。

HTML5とか勉強会 for ビギナー

html5jの部活動のひとつとして、「HTML5とか勉強会 for ビギナー」がある。名称はまたちょっと変わるかもしれないけど。

名前の通り、初心者向けの勉強会。普段のHTML5とか勉強会は、初心者にフォーカスしたものではないけど、やっぱり初心者のひとってたくさんいるし、そういう人たちにも html5j を知ってもらいたいし、HTML5に触れてほしい。

まだまだ進め方は模索しているところだけど、第1回、第2回はこんな感じでやっていた。

今後変わるかもしれないけど、これ、なかなかよいと思う。

僕の担当したセッションのテーマは「初めてのHTML5（概念・なにができるの？）」だった。

最初に来ている人たちにいくつか質問した。聞きたかったのは「みなさん、なにしてるひとですか？」ということ。どんなバックグラウンドのひとが来てるのかなと思って。重複はあると思うけど、Web制作に関わっている人が1/3、デザイナが1/4、エンジニアが1/4くらいだった気がする。

セッションでは最初に「ウェブの進化」を紹介して、Web や HTML の歴史、W3Cの仕様策定の流れを説明した。初心者でも Web や HTML は身近な技術だと思うので、それらがどうやって進化してきたのかを紹介した。

次に、身近なWebサイトで使われている HTML5 の技術を紹介した。紹介したのはこれらのサイト。

いろいろな技術が使われているけど、いくつかピックアップして紹介した。詳細はスライドを見てもらえればと。

Appleのサイトからは、SVGを紹介した。SVGがテキストの情報で描画されていることを説明した。

Microsoftのサイトからは、サイトが MediaQueries を使ったレスポンシブ・ウェブデザインで、様々なデバイスに対応させていることと、Webフォントでアイコンを表現していることを説明した。

食べログのサイトからは、リッチスニペット(RDFa)でレストランの情報などを構造的に意味付けして、検索結果で点数や価格帯が表示されていることを説明した。

初心者向けって、難しい。どんな人達がくるのかわからないし、初心者といってもひとそれぞれ違うし。HTML5 を身近に感じてほしいなと思って、みんなが知っているようなサイトをピックアップしてみた。

ここから先は、スライドのまとめに書いたこと。

HTML5に関連した技術、たくさんある。すぐには必要のない技術かもしれない。でも どんな技術があるか知っておく ことは大切だと思っている。

僕も初心者だった。はじめて参加したHTML5とか勉強会は2010年12月だった。 1年くらい連続で参加して、毎回ブログを書いたりした。HTML5が楽しくて、仕事では使っていなかったけど楽しかったから、調べて勉強した。

その後、勉強会やカンファレンスでLTの募集があったので応募してLTした。関係ないけど、その2年も前のWebFontsのLTを覚えてくれた人に立て続けに会った。感動。

お声掛け頂いて、2012年1月から html5j のスタッフになった。

HTML5を勉強し始めたころはSIerのSEで、いまの主な仕事はRuby プログラマ。だけど、いろいろ頑張って仕事でやってるサービスをHTML5にした。なにが役に立つのかわからない。

先を見越してドットを繋ぐことはできないけど、ドットが繋がるようには努力したと思う。いろんな技術があるから、興味の持てるものがあるんじゃないかな、と思う。

f:id:sadah:20130724214348j:plain

今回はWindows女子部の方々に協力していただき、会場はマイクロソフトだった。

女の子と仲良くなれて楽しかった :)