div要素を無理に減らすな！ #cssnitelp9

posted at 13:42:04

後で要素が増えたりしたときにdivでくくっていると、便利だからという理由みたいです #cssnitelp9

posted at 13:43:38

コーディング時間短縮のポイント #cssnitelp9

posted at 13:43:53

きちんと記録してわかるようにする #cssnitelp9

posted at 13:44:01

より共通する部分から順に作る #cssnitelp9

posted at 13:44:20

エクセルのファイルを共有するのに気をつけていることは？ #cssnitelp9

posted at 13:46:45

エクセルの機能で共有機能もしくはGoogleDocなど #cssnitelp9

posted at 13:47:15

ただし、エクセルの機能はローカルのみ #cssnitelp9

posted at 13:47:34

過去のソースを使い回しはしない #cssnitelp9

posted at 13:48:47

おそらくはこれもIE対策系では？ RT @pikarira: ききたかった・・・ RT @chaco height をいれるな！は飛ばし。残念 #cssnitelp9

posted at 13:49:57

本読むとよくわかりますが、IE6対策は最初からやっているみたいです。後でその部分だけハックすするということはしないっぽいです。#cssnitelp9

posted at 13:51:35

過去のソースを使い回さないのは、ちゃんと理解できなかったり、IE6で崩れたりするのを防ぐため。 #cssnitelp9

posted at 13:53:16

これまた本読むとわかりますが、IE6対策は手戻りを防ぐためだったと思います。#cssnitelp9

posted at 13:54:10

今日の出演者、ハムさんからもらったマンゴーキャラメル、うまい！#cssnitelp9

posted at 14:09:25

ノーマルよりも甘さ控えめ？

posted at 14:10:10

@5509 を！イケメンw #cssnitelp9

posted at 14:11:14

画面が揺れて気持ち悪い〜#cssnitelp9

posted at 14:15:50

プラグインだけで何もできるけど･･･ #cssnitelp9

posted at 14:21:08

緑本だ！ #cssnitelp9

posted at 14:22:20

ユーザーの利益を第一に #cssnitelp9

posted at 14:22:44

jQueryでユーザビリティ向上 #cssnitelp9

posted at 14:23:09

元のHTML以外はjQueryで追加する #cssnitelp9

posted at 14:25:22

RT @crema: jQueryが担う分野。クロスブラウザ。クロスブラウザ対策で憂鬱になって出社拒否していた人も、jQueryで元気に出社w #cssnitelp9

posted at 14:29:42

すごい汗ですなー @5509

posted at 14:30:46

@5509 で、このあとあれに着替えるんだなw

posted at 14:31:44

いっぺんに都道府県が見渡せるセレクトボックスの解説中です。 @5509のサイトで公開されていたはず。#cssnitelp9

posted at 14:33:08

ここですね。 http://bit.ly/99CwM1 #cssnitelp9

posted at 14:34:08

くるくるってかわいいw #cssnitelp9

posted at 14:43:54

ここだよー。http://bit.ly/dyoafG RT @crema: すみません、いま @5509さんが説明したモノ、「TwitterFloatxxxxxx」のxxxxxxxの部分を聞き逃したのですが、なんでしたっけ？ #cssnitelp9

posted at 14:49:01

オールカラーでホントいい。RT @necoze: 「jQueryデザイン入門」今読んでる。超分かりやすいっす。 #cssnitelp9

posted at 14:49:43

いまは(+1)がついてるよねw #cssnitelp9

posted at 14:52:10

ハムさんだー！！！

posted at 14:53:39

mukiでた！

posted at 14:53:49

わたしもだぜ！RT @crema: 今日の私は、ハムさんとお揃いのTシャツなんだぜ！ #cssnitelp9

posted at 14:54:59

実装前に決めておくこと 動作、jsオフの時、対象ブラウザ、操作する部分をどこに記述するのか #cssnitelp9

posted at 14:58:03

モーダルウィンドウ #cssnitelp9

posted at 14:58:50

画面遷移なく、フォームの入力を確認 #cssnitelp9

posted at 14:59:24

実装が必ずしも便利になるとは限らない。という失敗例の紹介。 #cssnitelp9

posted at 15:01:30

透明度を利用したロールオーバー。#cssnitelp9

posted at 15:03:46

これかな。 http://bit.ly/9gl6e8 #cssnitelp9

posted at 15:06:48

前に誰かがほしいといっていたはず。http://bit.ly/9gl6e8 #cssnitelp9

posted at 15:08:48

ちょっとした気遣い、優しさ。誰が使うのか考えて。#cssnitelp9

posted at 15:23:41

RT @magi1125: JSオフ用警告をページ先頭に書くと検索エンジンにdescriptionとして扱われて残念な思いをするので注意！ #cssnitelp9

posted at 15:24:34

mukiの説明がなかったw #cssnitelp9

posted at 15:26:50

あ。鷹野さんが質問したwww #cssnitelp9

posted at 15:27:08

休み時間におしゃべり仲間が少ないって寂しいな。今日は名前だけの人もちゃんとお話ししたいなー。#cssnitelp9

posted at 15:57:12

またもイケメン。#cssnitelp9

posted at 15:57:44

HttpWatch Winだけ？ #cssnitelp9

posted at 16:00:30

ブラウザちゃん？

posted at 16:01:43

RT @webbingstudio: 1本目のスキル大杉氏（効率重視）と石本氏（パフォーマンス重視）は対極なのかな。コーダーの考え方は業態に左右されるところが多い。 #cssnitelp9

posted at 16:08:07

改善策 CSSスプライト #cssnitelp9

posted at 16:09:39

確かこれは超ディングの会社でも使っていたはず。#cssnitelp9

posted at 16:10:17

前の方はよく見えるけど、首が痛いし、肩がこるなぁ。

posted at 16:12:26

@edo_m18 どこにいるかわかれば、少しコード貸してあげられるのに。

posted at 16:13:24

RT @necoze: CSSスプライトはFireworksの拡張使うとかなり便利ですよー。最近お世話になってます。 http://bit.ly/c4vXRs #cssnitelp9

posted at 16:15:12

データURIスキーム #cssnitelp9

posted at 16:15:44

css、jsファイルを結合する #cssnitelp9

posted at 16:16:34

CSS3はパフォーマンスにいいけど、あいつらがねぇ。#cssnitelp9

posted at 16:19:13

奥の手公開！#cssnitelp9

posted at 16:19:38

Change Design! #cssnitelp9

posted at 16:20:19

コスト意識を説明してデザインを変更するのも一案。 #cssnitelp9

posted at 16:22:42

@edo_m18 あら残念。今日こそお話しできるかと思っていたのに。

posted at 16:23:33

もういっかいURLほしい。 #cssnitelp9

posted at 16:30:21

でた。「赤から緑に変わる」あたっくちゃーんす。goo.gl/O9ua

posted at 16:34:36

でた。「赤から緑に変わる」あたっくちゃーんす。 #cssnitelp9

posted at 16:35:33

ありがとうございまます！でも重い。RT @neotag: http://goo.gl/O9ua もう一個はわかりません＞＜ RT @chaco もういっかいURLほしい。 #cssnitelp9

posted at 16:39:39

O9がTakazudoさんのだね。RT @_kojika_: http://goo.gl/TRbO RT @neotag: http://goo.gl/O9ua もう一個はわかりません＞＜ RT @chaco もういっかいURLほしい。 #cssnitelp9

posted at 16:43:28

写真がツボ過ぎるwww #cssnitelp9

posted at 16:45:47

スライドで酔うw #cssnitelp9

posted at 16:47:46

RT @imagedrive: RT @hitoyam: CSS3がすごいのか @Takazudo がすごいのか分からなくなってきました。 #cssnitelp9

posted at 16:48:30

jsのライブラリを使えばアニメーションできるけど、裏で大変、CSSとJSの両方かかなきゃ、キーフレームはjsでかくと大変、長いスクリプトの中にアニメーションがあると複雑さ増大、CSSアニメーションなら一時停止や再生も簡単 #cssnitelp9

posted at 16:52:13

何でも適度にが大事だね。#cssnitelp9

posted at 16:54:50

使う人に優しく、出しゃばらない。#cssnitelp9

posted at 16:55:31

RT @crema: unobtrysive animation 出しゃばらないアニメーション。という考え方が大切。 #cssnitelp9

posted at 16:56:44

http://bit.ly/aR9SqpRT @izuizu: 福田さんのスライドURLは・・・ #cssnitelp9

posted at 16:59:55

Ustはありませんよー。RT @oppo240: ust中継されておりましたらurl教えて頂けないでしょうか。 #cssnitelp9

posted at 17:01:21

@izuizu RT @chaco: O9がTakazudoさんのだね。RT @_kojika_: http://bit.ly/9Yw1f1 RT @neotag: http://bit.ly/bl8NaD #cssnitelp9

posted at 17:04:15

@izuizu あう、表示が変わってる。でもこれでみられるはず。

posted at 17:05:25

Faruk Ateş http://farukat.es/ Progressive Enhancementの良い例 #cssnitelp9

posted at 17:10:48

これ？ SXSW Design Workshophttp://bit.ly/csPaH9 RT @crema: オススメサイト３つ目のURLを見逃したなう。 #cssnitelp9

posted at 17:13:53

IE9のお話 #cssnitelp9

posted at 17:14:47

@edo_m18 またこんどー！

posted at 17:15:07

RT @tsuj: マークアップエンジニアとデザイナーが完全分業してる場合、ここまで表現力が増したcss3はどちらがやるのかなぁ？ #cssnitelp9

posted at 17:41:08

@fuuri 大丈夫？元気をお出し。

posted at 17:43:01

html5はhead内がたくさん省略されて簡素になりますね。#cssnitelp9

posted at 17:45:20

html5.js #cssnitelp9

posted at 17:47:47

jsは条件分岐しないで読み込んでも大丈夫。リクエストが増えるだけ。 #cssnitelp9

posted at 17:49:30

@fuuri 遠足の前の子どものようだわね。

posted at 17:49:51

<div id="header">を<header>に変更できる感じ。#cssnitelp9

posted at 17:50:24

<header>はページ全体のヘッダー以外でも使ってよい。 #cssnitelp9

posted at 17:51:53

<header id="PageHeader">にしておくとよい。#cssnitelp9

posted at 17:52:26

見出し（hx>の及ぶ範囲で区切る。これが<section>タグ

posted at 17:53:56

見出しの影響範囲をsectionで囲む理由は、文章の中でアウトラインをつくるため。#cssnitelp9

posted at 17:56:22

<article>は独立したコンテンツ <section>の親みたいなもの。#cssnitelp9

posted at 17:57:39

articleの中にsectionがたくさん存在。#cssnitelp9

posted at 17:58:09

articleはfeedとして成り立つ固まり。 #cssnitelp9

posted at 18:00:09

主要なナビは<nav>で。グローバルナビとかローカルナビ。#cssnitelp9

posted at 18:01:26

記事の中でどうでもいい情報、バナーとか余談みたいなものは<aside>でマークアップ #cssnitelp9

posted at 18:03:03

判断が難しいよね。これからは単なる末端では、ますます作業が難しくなるのでは？と思った。#cssnitelp9

posted at 18:05:53

本文と関係ある画像は<figure> #cssnitelp9

posted at 18:06:30

とりあえずの寂しさ紛らわしの画像などは<figure>でマークアップしない。

posted at 18:07:08

動画も本文に関係あれば<figure>で。#cssnitelp9

posted at 18:08:03

よみがな<ruby>要素でマークアップされると、ブラウザによっては小さめの文字で上に表示してくれる #cssnitelp9

posted at 18:10:41

対応していない場合は普通に漢字（よみがな）という感じで表示 #cssnitelp9

posted at 18:11:31

<time datetile="YYYY-MM-DD">で日時。datetime属性で日付を指定できる #cssnitelp9

posted at 18:13:21

Copyright などライセンス的なものは<small>でマークアップ。前とは意味合いが変わっている。 #cssnitelp9

posted at 18:14:55

動画はobjectではなく、<video> #cssnitelp9

posted at 18:15:58

RT @necoze: copyrightとaddressについては雄さんのエントリが分かりやすいかも。 http://securecat.exblog.jp/8667579/ #cssnitelp9

posted at 18:18:59

対応してない形式には対応している形式をもう一つ読み込んでやるとみられる。#cssnitelp9

posted at 18:19:54

<video>要素にはCSSが有効 重なり順もhtmlの順 #cssnitelp9

posted at 18:21:55

IEは対応していないので、代替テキストしか表示されない。 表示するにはhtml5med.jsを読み込むことで表示。#cssnitelp9

posted at 18:23:17

RT @cipher: こういうの流すと役に立つのかしら。　html5media - Project Hosting on Google Code http://bit.ly/drX5W8

posted at 18:26:36

jsの名前違うみたい。後で探そう。RT @chaco: IEは対応していないので、代替テキストしか表示されない。 表示するにはhtml5med.jsを読み込むことで表示。#cssnitelp9

posted at 18:31:55

マークアップが全くわからないデザイナーさんのデザインは、コーディングが大変なことが多いと思う。#cssnitelp9

posted at 18:32:50

RT @purprin: ある目的に対して必要な技術なり情報であれば、知らないでいいとか不要ってことは何もないはず。自分でできなくとも、理解することはとっても大切。

posted at 18:34:14

羽田野さんの本、読んだけど、マークアップ以外の部分は難しかった。今日は少しでも理解したいぞ。#cssnitelp9

posted at 18:35:39

RT @necoze: これからデザイナーもマークアッパーもプログラマーも間の垣根を飛び越えて、コミュニケーションを密にしていかないといけないっすよね、とCSS3やHTML5の話聞いてて思う。WDEでも同じこと考えてたけど（要復習） #cssnitelp9

posted at 18:36:37

自分の専門以外の知識も広範囲に必要な時代になるなー。#cssnitelp9

posted at 18:37:06

コミュニケーションに必要なツールがもっともっと出てくるといいな。#cssnitelp9

posted at 18:38:11

本日たくさんフォローをいただいています。ありがとうございます。こいつかな？と思ったら話しかけてくださいね。#cssnitelp9

posted at 18:42:03

iPadがほしくなるお話。 #cssnitelp9

posted at 18:42:55

RT @izuizu: 相手の仕事を知って自分の仕事を知る、っていう感じ

posted at 18:44:03

RT @crema: canvasはIEを除いて全て実装済みなう。 #cssnitelp9

posted at 18:44:10

canvasとvideoの融合 #cssnitelp9

posted at 18:45:37

ライト、さっきのままなのでは？ このセッションはもっと暗い方がいいのかも。 #cssnitelp9

posted at 18:47:24

RT @kzms2: 対応状況を聞くと「またお前か。」と言うのは決まり文句ですね。 #cssnitelp9

posted at 18:48:33

手を広げるというより、知識として浅めに持っておく程度かなと思いますが。RT @securecat: なんで他人でもやれることに手を広げて自分にしかできないことに特化してかないの？それじゃあHTML5とか待たずして淘汰されるよ。 #cssnitelp9

posted at 18:52:35

コミュニケーションに必要な知識が増えた感じかな。実装はやらないけど、こんなことができるみたいという知識。これがあるとないではコミュニケーションの深さが違うと思う。#cssnitelp9

posted at 18:57:22

もっと会場暗くした方がよくないですか？#cssnitelp9

posted at 18:57:49

それならわかる。RT @securecat: わからない/できない→淘汰されるっていう思考じゃなく、わかることできることを高めていく思考のがいいよっていう話 RT @chaco: 手を広げるというより、知識として浅めに持っておく程度かなと思いますが。 #cssnitelp9

posted at 18:58:54

HTML5のAPIはJavascriptが必須 #cssnitelp9

posted at 18:59:48

RT @IMAGEDRIVE: RT @neotag: Javascript は食わず嫌いが多い気がする。あきらめずにやりつづければ、ほとんどの人ができると思う。気になるなら hello world から触ってみれば良いと思います。今日から。 #cssnitelp9

posted at 19:02:25

RT @crema: ますますリッチなユーザー体験がHTML5によって加速。 #cssnitelp9

posted at 19:02:34

RT @Zazie: 出来ることが増えて、さてどう有効に使うかだなー。あと、知らなかった、出来なかったはないようにしないと。 #cssnitelp9

posted at 19:05:53

最優秀賞該当なし #cssnitelp9

posted at 19:08:54

あ、同級生と同じ名前 ピクセルグリッド賞 #cssnitelp9

posted at 19:11:17

皆様お疲れ様でしたー。すごくいい勉強になりました！#cssnitelp9

posted at 19:18:47