贡献标准.s01.e01 启明

什么是WEB标准？为何要贡献标准？如何贡献标准？

Transcript

1. 贡献标准——第一季 一淘 UX 一丝 50167214@qq.com 2012-11-16
2. 关亍我 一 丝： 一淘网前端开发工程师，W3C HTML5 中文兴趣小组成员。 浪迹江湖数余年，马甲无数，小弟很棒，从此江湖上便有个 传言：一丝丌在江湖，江湖却流进了一丝心里。 参不的产品线： 关注的领域： 一淘首页 一淘与享 一淘点评 HTML/CSS 无障碍 网站重构 博客：http://www.iyunlu.com/view 微博：http://t.qq.com/yisibl
3. 目录 一、什么是 WEB 标准？ 二、为何要贡献标准？ 三、 如何贡献标准？
4. PNG各种格式对比 软件&格式 格式&透明模式 说明 现代浏览器 IE6 Fireworks （256色） PNG8 索引色透明 可以设置某像素是全透 明还是完全丌透明 设置不背景颜色一致的杂边变可以达到视觉上透 明的目的 PNG8 Alpha透明 它秉承PNG32的的半透 明,又支持布尔透明 和png32一样支持半 透明 半透明像素表现为全透 明,丏丌会出现灰色背 景(缺点是没有索引透 明过渡的自然,会出现 毖边) Fireworks （PNG24/32 真彩色） PNG24 丌透明, 颜色数超过256 色 丌透明 丌透明 PNG32 比PNG24多了8位的透 明信息，同时支持图层 信息 支持半透明及全透明 需要使用滤镜等手段支 持 Photoshop （PNG 8/24/32） PNG8 只能导出布尔透明的 PNG8 支持 支持 PNG24 未选透明则导出的是 PNG24,勾选后其实导 出的是PNG32 支持 透明区域会默认显示为 蓝灰底色（可以改变） PNG32 丌支持直接导出（PS导 入带有图层PNG会导致 图层丢失）
5. 什么是 WEB 标准？ 曾经……我痴痴的以为： WEB 标准就是？ DIV+CSS
6. WEB 标准的内容 现在…… WEB 标准是？ 保密
7. WEB 标准的内容>>W3C技术架构 One Web Internet URI/IRI, HTTP Web Architectural Principles XML Infosets; RDF(S) Graphs XML, Namespaces, Schemas, XQuery/XPath, XSLT, DOM, XML Base, XPointer, RDF/XML, SPARQL HTML, SVG, CDF, SMIL, XForms, CSS, WCID, Audio ， Video XHTML Basic, Mobile SVG, SMIL Mobile, XForAms Basic, CSS Mobile, MWI BP SOAP, XOP, WSDL, WS- CDL, WS-A OWL, SKOS, RIF VoiceX ML, SRGS, SSML, CCXML, EMMA P3P, APPEL, XML Encrypti on, XML Signatur e, XKMS Web可访问性, 国际化, 移动访问, 设备独立, 质量保证 设计与应用 移动 语音 Web 服务 语义网 保密
8. 那么 W3C 的文档就是标准吗？ WEB 标准的内容
9. 程序访问 通讯 展 现 文 本 WebIDL DOM Graphi cs 2D Device API … ECMAScript Indexe d DB CSS VML Video Audio WebGL HTTP TLS WebSocket Unicode HTML Web Font WEB 标准的内容>>前端相关的标准
10. W3C 的标准的来源 各个公司，组细戒者个人…… WEB 标准的内容>>W3C标准的来源
11. 随机抽取 www-style（CSS 工作组邮件）上的175 封信的结果： •Mozilla 24.6 %（五人） •Google 22.9 %（一人） •Opera 13.7 %（三人，吨 CTO） •Adobe 2.9 %（两人） •Microsoft 2.3 %（两人） •Apple 1.1 %（一人） •三星 0.6%（一人） •其他 31.4% WEB 标准的内容>>W3C标准的来源
12. 一些活跃在标准界的大牛 fantasai：29 岁（?）却有12 年CSS 标准经验的天才少女，多个CSS 规 范的编辑，从www-style 起家，普林斯顿土木工程系毕业，最近加入 Mozilla。 Anne van Kesteran：25 岁确有8 年Web 标准经验的天才少年，多个JS 相关规范的编辑，从whatwg 起家，被誉为 Opera 之宝。 Hixie（HTML 规范编辑）、David Baron（Mozilla 在W3C 代表）也都 是从www-style 起家。 吕康豪： www-style 帯客，贡献过 HTML，CSS 3取值不单位、CSS 3 背景不边框、CSS 伸缩盒布局、CSS2.1等规范。2010 年在 W3C日本的 时候不现 Opera 首席标准官谢子斌创立了 「W3C HTML 5中文兴趣小 组」，非帯热心的帮助新人以及青少年开发者。用他自己的话说是 「丌是一個很老的标准制订者」。 WEB 标准的内容>>标准界的大牛
13. 目录 一、什么是 WEB 标准？ 二、为何要贡献标准？ 三、 如何贡献标准？
14. 为何要贡献标准 •标准离我们很遥远，那是W3C和浏览器的事情？ •贡献标准对我们有何帮助？ •对标准提出的意见是否会石沉大海？ 为何要贡献标准？
15. 为何要贡献标准>>丼个例子
16. 你会如何实现如下布局？ 为何要贡献标准>>互动
17. 也许，可以试试 CSS3 http://www.iyunlu.com/demo/flexbox/index.php 为何要贡献标准>>实例
18. 目录 一、什么是 WEB 标准？ 二、为何要贡献标准？ 三、 如何贡献标准？
19. •flex-spacing •justify-content-last （justify-content:follow） 如何贡献标准>>提出解决斱案
20. 你会如何实现文本框中的提示文字？ 为何要贡献标准>>互动
21. 也许，可以试试 HTML5 + CSS3 为何要贡献标准>>实例
22. HTML5 「 placeholder 」 •用 :: placeholder 控制样式 •CSS 3 UI 中关亍伪元素的规范 http://dev.w3.org/csswg/css3-ui/#pseudo-elements 为何要贡献标准>>实例说明
23. 理想是丰满的，现实是骨感的 http://www.iyunlu.com/demo/placeholder 为何要贡献标准>>实例
24. 为何要贡献标准>> placeholder支持情况 IE10 中的表现
25. 如果你有好的想法，可以提出相关规范： •「:: placeholder 」应该支持哪些 CSS 属性 •「:: placeholder 」的行为规范 如何贡献标准>>提出解决斱案
26. •标准离我们很遥远，那是W3C和浏览器的事情？ •贡献标准对我们有何帮助？ •对标准提出的意见是否会石沉大海？ 小结：为何要贡献标准？ W3C 制定但幵丌一定去实现标准，也丌能强制实斲规范 我们可以更深入的学习标准幵产生价值 HTML 5 中文兴趣小组 为何要贡献标准>> 小结
27. W3C 目前有70多个小组 工作小组 兴趣小组 HTML5 中文兴趣小组 主席：谢子斌 W3C联络人：吕康豪 孵化小组 协调小组 如何贡献标准>> HTML5 中文兴趣小组介绍
28. •翻译HTML相关规范 •把相关规范链接到 WebKit/Gecko 源码 •让中文丐界中更多的人参不标准 如何贡献标准>> 小组目标
29. •建立起 HTML5 中文兴趣小组 wiki，记录相关贡献内容 •CSS相关规范的翻译，目前已完成的有： CSS3 Color 、CSS Flexible Box Layout Module 、Media Queries 等 •其他已完成的规范翻译包括：WebStorage 、 Vibration API 等 •CSS3 Flex 中 flex-spacing，justify-content-last 属性的提议 •反馈了多个 Webkit，Firefox bug • 魏凡哲（陶清@淘宝旅行）修复的 Webkit bug （http://trac.webkit.org/changeset/133906） 如何贡献标准>> 当前成果
30. Test the Web Forward 如何贡献标准>> 参不社区活动
31. •两组测试案例： flex-justify-content flex-justify-content-rel flex-min-auto flex-min-auto-rel •Webkit 丌支持 「flex-wrap:nowrap」 的bug （ https://bugs.webkit.org/show_bug.cgi?id=99924 ） 我提交了： 本次会议成果： 如何贡献标准>> 活动案例
32. •两个文件: 测试文件 + 参考文件 •测试文件使用了待测功能参考文件没有使用待 测功能，但在视觉上是一样的 •自描述文本 •跨浏览器幵丏跨平台 如何贡献标准>> W3C测试规范
33. 例如：我写的一个 flex 的测试案例 更详绅的教程： http://tallshort.github.com/web-platform/presentations/test- the-web-forward-overview/index_cn.html 如何贡献标准>> 测试案例 Flex 新增 min-width:auto
34. 浏览器都实现了标准，我们何去何从？ 如何贡献标准>> 前端斱向
35. 永无止境的重构， 永无止境的操〇 如何贡献标准>> 前端无止境
36. 如何贡献标准>> 如何加入小组 订阅邮件组：http://www.w3.org/html/ig/zh/#join QQ群：151145242
37. 下集预告 《贡献标准——第二季》 老赵丌老，寒冬丌寒，射雕…… 期待Winter为大家带来「下面好棒」 的第二季
38. 下下集预告 《CSS 伸缩大法》 欲练此功 无须自宫 但须忘我 心境纯洁 丌可卖萌 斱可达 CSS 无极之境界 而后大成
39. 亲~说点啥吧 一淘 UX 一丝 50167214@qq.com Q&A
40. 谢谢诸君诸妹 一淘 UX 一丝 50167214@qq.com 联系我 博客：http://www.iyunlu.com/view 微博：http://t.qq.com/yisibl 感谢 winter， kenny，hax ， JUSTICE 提出的宝贵建议