2017年4月2日

2017年3月のてげWebまとめ

鹿児島市で毎月開催しているてげてげなWebのなんでも勉強会「てげWeb」の2017年3月開催分まとめ。
2
森 史憲🍛🍻🍫 / コーディングデザイン @mr_moo555

今週金曜日3/31はてげWeb開催日です!今回は通常のてげWeb+3Dプリンター講習会です。森はコーディングネタ(SVGのアクセシビリティなど)、IoTなおもちゃを持っていきます。残席わずかですので参加を迷われている方はお早めに。 tegeweb-201703.peatix.com/view

2017-03-29 17:00:19
リンク Peatix てげWeb @ モノづくりスペース TUKUDDO 2017年はモノづくりしよう!てげてげなゆるーい勉強会、2017年も続きます。今月は金曜日開催です。場所は先月に引き続きモノづくりスペース TUKUDDOです。内容はいつものてげW... powered by Peatix : More than a ticket. 52
megushio @megushio

3月のてげWeb、19:00〜スタートです。不調だった3Dプリンターも順調に動いております。年度末でお忙しい事とは存じますが、ご参加の皆様お待ちしておりま〜す(^o^) #tegeweb pic.twitter.com/PUXXSKjuuf

2017-03-31 18:14:36
拡大
megushio @megushio

3Dプリンターの不調を開催当日までにビシっと調整して下さった @tukuddo の皆様、本当にありがとうございました〜 #tegeweb

2017-03-31 18:21:44
megushio @megushio

皆様いらっしゃったので、3月のてげWebスタートです!最近のてげWebは動画の紹介から始まるので、まずは、これから♪ #tegeweb ▼しびれるようなアコースティック・ギターの演奏 ted.com/talks/rodrigo_…

2017-03-31 19:08:07
リンク www.ted.com しびれるようなアコースティック・ギターの演奏 ギターデュオのロドリーゴ・イ・ガブリエーラは、超人的な速弾きのリフと驚異的なリズムを組み合わせ、フラメンコ・ギターとヘビメタを見事に融合させたスタイルを生み出しました。披露された曲目は「サウンドメーカー」です。 10
megushio @megushio

お次は、この動画のご紹介!お化け屋敷とかに使ったら楽しそう☆ #tegeweb流動床インターフェース youtube.com/watch?v=9MjOrr…

2017-03-31 19:13:53
拡大
リンク YouTube 流動床インターフェース:液体のようにふるまう砂を用いた インタラクションシステム 2017年3月2日~4日 明治大学中野キャンパスで開催された、情報処理学会シンポジウム「インタラクション2017」において「 流動床インタフェース:液体のようにふるまう砂を用いたインタラクションシステム」をデモ発表し、「インタラクティブ発表賞」(一般投票部門)および「インタラクティブ発表賞」(プログラム委員推薦部... 14 users 774
TUKUDDO -鹿児島のモノづくりスペ @tukuddo

本日のイベント、てげてげなゆるーい勉強会『てげWeb』がはじまりました。皆さんでピザをつまみつつ、まずは動画鑑賞。面白いアイディア紹介の動画に笑いがあふれています。#TUKUDDOblog.tukuddo.com/2017/03/31/%e6… pic.twitter.com/dAlZtyaa6D

2017-03-31 19:58:18
拡大
megushio @megushio

3Dプリンター講習会の前に、最近買った面白いIoTおもちゃをご紹介 #tegewebPhonotonic youtube.com/watch?v=mhM_rb…

2017-03-31 19:21:56
拡大
リンク YouTube Phonotonic - I am music Phonotonic is a new way for everyone to make, listen and live music. Control the beat and melody just by moving with Phonotonic! (view full Break Dance video... 452
megushio @megushio

Phonotonic を使ってプロのダンサーさんが踊るとこんな感じ。これを見た時、私は日置市の情熱家さんにご紹介したいと思いました〜。 #tegeweb youtube.com/watch?v=z6EpCQ…

2017-03-31 19:23:31
拡大
リンク YouTube Phonotonic - J4L - Urban Films Festival Performance TEST / Phonotonic avec les danseuses du Just4ladies Liss Funk, Amélie Poulain, Alfreda Habillées par agnès b Mur Qbiq - Nasty vidéo réalisée par ... 63
megushio @megushio

3Dプリンター講習会の前に、今日のメインテーマ「Webアクセシビリティ」についてのお話〜。参照する文書としてJIS8341-3(WCAG2.0を元にしているやつ)が策定されてますね〜 #tegeweb w3.org/TR/2008/REC-WC…

2017-03-31 19:32:26
megushio @megushio

SVGはimg要素で指定しても、インラインSVGでもsvgの内部の「title要素」が読まれる” ひえっ!そうなのかっ!! #tegeweb

2017-03-31 19:36:20
megushio @megushio

img要素でSVGを指定したときはMac / iOSのVoiceOver向けにrole="img"を追加すると良いらしいです。 #tegeweb

2017-03-31 19:36:57
megushio @megushio

読まれなくていい画像(装飾用として使った画像など)は、aria-hidden="true"を指定すると良いそうです。 #tegeweb

2017-03-31 19:38:50
megushio @megushio

tabキーで移動する時の要素のフォーカスは、outlineプロパティでボーダーを引く。そうするとレイアウトに影響しない#tegeweb

2017-03-31 19:44:43
megushio @megushio

祖先要素がoverflow: hidden; していると線が表示されないので、outlineプロパティ以外で対応するべし。 #tegeweb

2017-03-31 19:46:05
megushio @megushio

地図内の要素もフォーカスがあたるので、outlineプロパティを設定すべし。 #tegeweb

2017-03-31 19:47:07
megushio @megushio

リンク、ボタン、フォーム要素じゃないと反応しない。input type="checkbox"、input type="radio"、selectは見た目を変更することが多いので注意する事…だそうです。 #tegeweb

2017-03-31 19:52:51
megushio @megushio

アクセシビリティの話はここまで〜。 #tegeweb

2017-03-31 20:00:07
megushio @megushio

お次の coding で困った!…は、flexbox flex-direction: column使用時、画像を入れている要素の高さがIE11でおかしくなる→解決法:該当の要素に flex: 0 0 auto; を入れる #tegeweb

2017-03-31 20:02:04
残りを読む(19)

コメント

コメントがまだありません。感想を最初に伝えてみませんか?