講個秘訣給沒參加dotCSS/dotJS的吳姓網友

Transcript

1. #講個秘訣 給沒參加dotCSS/dotJS 的吳姓網友 hlb / 布丁 @ KKTIX 售票亭
2. KKTIX ⼤大家好像都⽤用過了...... m(_ _)m
3. “誰負責寫CSS？” “幾乎都會寫耶......”
4. 45% Desktop
5. 1.3% IE < 9 this month （我們有在徵前端⼯工程師）
6. dotCSS/dotJS The largest CSS/JavaScript conference in Europe
7. dotJS ~ 900 attendees this year
8. dotCSS (first year) 400 attendees expected
9. 歐洲研討會 SUN MON TUE WED THU FRI SAT 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30
10. Paris
11. 場地 https://www.flickr.com/photos/97226415@N08/15797290266
12. 20 speakers
13. 12hrs ✈️
14. dotCSS: Doors now opening at *1pm* …Unfortunately we have not seen the same level of interest from them for CSS as for our other conference topics, and we were faced with a choice: increase the price of the tickets or skip lunch (our biggest cost). We think that most of you come for the speakers and not for the food so we have decided to move the first session from the morning to the early afternoon and shorten the breaks a bit to keep roughly the same number of talks and lightning talks. In the case you were coming for the food, well, email us and we'll refund you :)
15. 危機處理++ 有誠意 + 掌握核⼼心價值
16. 問：午餐到底多貴？ 隨便發個麵包也可以辦全天吧
17. dotJS午餐 https://www.flickr.com/photos/97226415@N08/15833108071
18. dotJS午餐 https://www.flickr.com/photos/97226415@N08/15835096855
19. dotJS午餐 https://www.flickr.com/photos/97226415@N08/15833342291
20. dotJS after party https://www.flickr.com/photos/97226415@N08/15809890646
21. dotJS after party https://www.flickr.com/photos/97226415@N08/15648672500
22. dotJS after party https://www.flickr.com/photos/97226415@N08/15833499335
23. – Sylvain Zimmer, Founder of dotConferences “This is a wireless-less conference”
24. 雖然官⽅方指定語⾔言是英⽂文 “Can you speak French?”
25. CSS 20 YEARS OLD 2014/10/10
26. 20 years of CSS: maturity or senility? Daniel Glazman @glazou
 CSS Working Group, Co-chair http://disruptive-innovations.com/zoo/slides/20141114-dotCSS/dotCSS2014.pdf 開場
27. CSSWG 的決策過程 各種蠢決策，以及為什麼
28. Variables 從 CSS 2 (1998)提出之後，⼤大家都覺得需要有
29. Variables 花了 16 年 LCWD
30. CSS Custom Properties for Cascading Variables 什麼？
31. Variables body { --corpcolor: orange; } #foo { color: var(--corpcolor); }
32. 為什麼不⽤用 #define • Faaaaaaaaaar too simple... • Do you really think we’re Web designers? • We love fighting for 15 years and then blame W3C Process for being slow... • Don’t you love our innovative -- notation?
33. Flexbox
34. Selectors 4 各種梗 :matches() or « even the examples in the spec don’t show why we need it »
35. mailing list 是你的好 朋友
36. Typography on the web, and how HTML and CSS are currently poorly suited for it Bert Bos
 Father of CSS 結束
37. XSL v.s. CSS
38. CSS v.s. Latex
39. Quotation & Punctuation
42. You are the first generation to know CSS Your parents don’t know it
43. Bridging the gap between developers and designers at Guardian Kaelig Deloumeau-Prigent http://www.thedotpost.com/2014/11/kaelig-deloumeau-prigent-bridging-the-gap-between-developers-and- designers
44. 共通語⾔言 Designers, Engineers, Product Manager, UX Designer, Editorial
45. Use Sass variables color, typography
46. Breakpoints media query https://github.com/sass-mq/sass-mq
47. Ten Principles for Effective Front-end Development Harry Roberts (csswizardy) https://speakerdeck.com/csswizardry/ten-principles-for-effective-front-end-development
48. Understand the business 花了⼀一個⽉月做了超漂亮的 css spinner，⽽而且可以 cross browser – over design
50. The User The Business The Team
51. The User The Business The Team
53. The User The Business The Team
54. KEEP CALM AND WRITE SASS Hugo Giraudel https://speakerdeck.com/hugogiraudel/keep-calm-and-write-sass
55. autoprefixer https://github.com/postcss/autoprefixer
56. SassDoc http://sassdoc.com/
57. CSS? WTF! Estelle Weyl http://estelle.github.io/doyouknowcss/
58. 投影⽚片⽤用 CSS 控制 <O>
59. 如何避免 important .disabled { cursor: default !important; } p.btn { cursor: pointer; }
60. .disabled { cursor: default !important; } p.btn { cursor: pointer; } .disabled.disabled.disabled { cursor: default; } p.btn { cursor: pointer; } 如何避免 important
61. 邪惡的瀏覽器偵測技巧 2014 年版 好孩⼦子不要⽤用 O_O\~/ http://codepen.io/hlb/pen/QwdxQm
62. Making Twitter UI infrastructure Nicolas Gallagher http://www.thedotpost.com/2014/11/nicolas-gallagher-thinking-beyond-scalable-css
63. scalability issue 牽⼀一髮⽽而動全⾝身
64. not knowing what component has already been made, not knowing what css was safe to remove, not knowing what css is necessary to correctly render a page… small change can make large impact
65. Scalable UI design design for adaptability and requirement of always changing UI and dealing with… unexpected demand of the business and changes we have to make
66. SUIT CSS http://suitcss.github.io/
67. Videos (updating) http://www.thedotpost.com/
69. Component
70. Design Language
71. Move Faster
72. Merci!