SlideShare une entreprise Scribd logo
1  sur  14
Télécharger pour lire hors ligne
第16期-变化ING
Koubei F2E 合沙  2010.2.8
Zen coding
                                ——CSS to html

示例:
 div#header>img.logo+ul#nav>li*4>a

对应的HTML
 <div id="header">
    <img class="logo">
    <ul id="nav">
       <li><a href=""></a>
       <li><a href=""></a>
       <li><a href=""></a>
       <li><a href=""></a>
    </ul>
 </div>


中文介绍: http://www.qianduan.net/zen-coding-a-new-way-to-write-html-code.html
开源地址:http://code.google.com/p/zen-coding/
Internet Explorer
                      ——IE9你啥时来? IE6你早点死吧!

    1.微软或明年3月公布IE9如何支持HTML 5

    2.已知IE9支持43个选择器中的41个(另外两个中一个有bug,一个不支持) 
      css选择器测试地址:http://www.css3.info/selectors-test/

    3.微软已申请加入万维网联盟(W3C)的可伸缩矢量图形(SVG)工作组

       IE团队博客:http://blogs.msdn.com/ie/archive/2009/11/18/an-early-look-at-ie9-
for-developers.aspx


     附:google 3月1日起,其产品Calendar,Site 停止支持IE 6,今年晚些时候,
Docs,Gmail也停止支持IE 6
WEB与GPU
          ——更高性质的页面渲染?web 3D? 无限畅想ing

    1.ie9会支持

    2.FF3.7会支持

    3.WebKit引擎会在2010中推出WebGL和3D图形规范OpenGL。也将支持GPU加
速

    4.Opera暂无消息

    5.Flash player 10.1完全支持GPU。
Cascading Style Sheets 3
                   ——该CSS3了,渐进式增强!

1.更多选择器和伪类           http://www.css3.info/selectors-test/test.html


2.更多颜色处理方式

3.还有更多......

现在可用的...

  用浙近式原则为除IE之外的浏览器适时增加更好交互效果

  http://www.qianduan.net/what-you-need-to-know-about-behavioral-css.html
  http://media.24ways.org/2009/14/3/index.html
不用Cookies或IP地址是可能追踪到浏览者的
                             ——有点搞不明白!


   平均每个浏览器发送10.5比特信息熵(发送消息最多的浏览器类型是:黑莓
14.7-15.5比特,Android的14.4比特,IE的13.2-13.5比特,Debian的13.5-15.3
比特),这意味着平均1500(2^10.5)人中有一个人与你有相同的User agent字
符串。EFF认为这不足以保护用户的隐私,特别是这些信息与其它信息如地理位
置或邮政编码或安装的不常见插件结合起来的话,User agent字符串将成为用户
真正的隐私问题。

  https://www.eff.org/deeplinks/2010/01/tracking-by-user-agent


  题外话:userAgent:userAgent不该改时变改,该改却不改!
IPV6
           ——IPV6啊,下一代互联网的标志!千年虫,64位!

 1.美运营商Comcast 1 月30 宣布IPv6商用计划

 2.谷歌宣布YouTube支持IPv6协议

 中国:

 1.全球IPv4剩余不足10% CNNIC呼吁加快向IPv6过渡

 2.中国电信宣布了明确的IPv6商用部署时间表,即2012年进入规模商用,2015
年以后IPv4网络和业务平台逐步退出

 IPV6:http://zh.wikipedia.org/wiki/IPv6
关健字“互联网
                               ——近期!!!

 1.互联网提名诺贝尔和平奖

 2.美国拟向世贸投诉中国互联网

 3.国际空间站接入互联网

 4.新疆又恢复开放27家区外网站 (有淘宝,不含口碑网)

  5.2009年12月30日,中国网民规模达到3.84亿人,普及率达到28.9%,手机用
户1.2亿.

 第25次中国互联网络发展状况统计报告
 http://tech.qq.com/zt/2010/cnnic25/
CNNIC成为根证书发布者
                   ——流氓不可怕,就怕流氓有文化!

1.微软把CNNIC列为根证书发布者

2.Mozilla同样也已经在FF3.6里把CNNIC列为根证书发布者

不信任理由:

CNNIC恶名远播! 流氓 ,政府控制!
https加密将也不安全!

AutoProxy 作者说:
https://docs.google.com/View?id=d5j3s7p_7f9r489fg


五毛动态:甘肃将建650人网评队伍
http://internet.solidot.org/article.pl?sid=10/01/22/0034201
中国Twitter!
          ——2010中国互联网会不会全面进入微博战国时代?

1.新浪的微博 t.sina.com

2.腾讯的滔滔,以及QQ邮件的广播. 

3.搜狐的微博 t.sohu.com

4.网易的微博 t.163.com

5.人民网微博

6......
1992年Windows 3.1在Web上
             ——WebOS?如若开发一个,还是有点难度的!

 一位喜欢浪费时间的web开发者在浏览器上重现了1992年的Windows 3.1的完
整体验

   Windows3.1:http://www.michaelv.org/

   mac:http://osx.portraitofakite.com/

   Ubuntu 6.06:
http://ossdb.quebecgeeks.net/ossdt/www.protic.
net/heritage_2007/lepagee/windows/frame2.htm


   flash版:http://www.ifizzle.com/ifizzlepb.html (翻墙)
Google Chrome的firebug
                 ——还凑合吧!其它chrome自带的也不错

 介绍:http://getfirebug.com/releases/lite/chrome/

 试用:http://getfirebug.com/releases/lite/beta/

 安装:https://chrome.google.com/extensions/detail/bnbbfjbeaefgipfjpdabmpadaacmafkj
google转化率工具
       ——[运营?产品?交互?视觉?前端?] 谁用谁知道!



http://browsersize.googlelabs.com/


中文实验室地址:http://labs.google.cn/

英文:http://www.googlelabs.com/
adobe labs browserlab
        ——视觉测试方便!还可以看看MAC系统下的效果



 包括了主流操作系统以及主浏览器的测试。多视图比较。


 地址:https://browserlab.adobe.com/

Contenu connexe

Similaire à Banquet 16

高性能网站最佳实践
高性能网站最佳实践高性能网站最佳实践
高性能网站最佳实践
longhao
 
富文本编辑器在互联网上的应用
富文本编辑器在互联网上的应用富文本编辑器在互联网上的应用
富文本编辑器在互联网上的应用
luolonghao
 
Css schema by_sofish
Css schema by_sofishCss schema by_sofish
Css schema by_sofish
Webrebuild
 
支付宝CSS构架
支付宝CSS构架支付宝CSS构架
支付宝CSS构架
Sofish Lin
 
前端样式开发演变之路
前端样式开发演变之路前端样式开发演变之路
前端样式开发演变之路
Zhao Lei
 
無名小站首頁改版 - 漸進增強與CSS3 (Wretch and Progressive Enhancement)
無名小站首頁改版 - 漸進增強與CSS3 (Wretch and Progressive Enhancement)無名小站首頁改版 - 漸進增強與CSS3 (Wretch and Progressive Enhancement)
無名小站首頁改版 - 漸進增強與CSS3 (Wretch and Progressive Enhancement)
Adam Wang
 

Similaire à Banquet 16 (20)

Exam 98-375 HTML5 Application Development Fundamentals
Exam 98-375 HTML5 Application Development FundamentalsExam 98-375 HTML5 Application Development Fundamentals
Exam 98-375 HTML5 Application Development Fundamentals
 
introduction of web 2.0
introduction of web 2.0introduction of web 2.0
introduction of web 2.0
 
Website Pracice Focusing on UX, Chinese
Website Pracice Focusing on UX, ChineseWebsite Pracice Focusing on UX, Chinese
Website Pracice Focusing on UX, Chinese
 
[2008]网站重构 -who am i
[2008]网站重构 -who am i[2008]网站重构 -who am i
[2008]网站重构 -who am i
 
PHP WEB 应用组织与结构
PHP WEB 应用组织与结构PHP WEB 应用组织与结构
PHP WEB 应用组织与结构
 
高性能网站最佳实践
高性能网站最佳实践高性能网站最佳实践
高性能网站最佳实践
 
Html5
Html5Html5
Html5
 
富文本编辑器在互联网上的应用
富文本编辑器在互联网上的应用富文本编辑器在互联网上的应用
富文本编辑器在互联网上的应用
 
Css schema by_sofish
Css schema by_sofishCss schema by_sofish
Css schema by_sofish
 
支付宝CSS构架
支付宝CSS构架支付宝CSS构架
支付宝CSS构架
 
Ox office現在。即未來(201509)
Ox office現在。即未來(201509)Ox office現在。即未來(201509)
Ox office現在。即未來(201509)
 
前端样式开发演变之路
前端样式开发演变之路前端样式开发演变之路
前端样式开发演变之路
 
Web dev road map part one
Web dev road map part oneWeb dev road map part one
Web dev road map part one
 
前端開發學習簡介
前端開發學習簡介前端開發學習簡介
前端開發學習簡介
 
無名小站首頁改版 - 漸進增強與CSS3 (Wretch and Progressive Enhancement)
無名小站首頁改版 - 漸進增強與CSS3 (Wretch and Progressive Enhancement)無名小站首頁改版 - 漸進增強與CSS3 (Wretch and Progressive Enhancement)
無名小站首頁改版 - 漸進增強與CSS3 (Wretch and Progressive Enhancement)
 
01 产品基础知识培训
01 产品基础知识培训01 产品基础知识培训
01 产品基础知识培训
 
互联网精准广告定向技术-by牛国柱
互联网精准广告定向技术-by牛国柱互联网精准广告定向技术-by牛国柱
互联网精准广告定向技术-by牛国柱
 
Data Pipeline Matters
Data Pipeline MattersData Pipeline Matters
Data Pipeline Matters
 
Windows 8.1 app 研習營三小時
Windows 8.1 app 研習營三小時Windows 8.1 app 研習營三小時
Windows 8.1 app 研習營三小時
 
移动Web开发框架jqm探讨
移动Web开发框架jqm探讨移动Web开发框架jqm探讨
移动Web开发框架jqm探讨
 

Plus de Koubei UED

Plus de Koubei UED (20)

Banquet 47
Banquet 47Banquet 47
Banquet 47
 
Banquet 51
Banquet 51Banquet 51
Banquet 51
 
Banquet 50
Banquet 50Banquet 50
Banquet 50
 
Banquet 49
Banquet 49Banquet 49
Banquet 49
 
Banquet 48
Banquet 48Banquet 48
Banquet 48
 
Banquet 46
Banquet 46Banquet 46
Banquet 46
 
Banquet 45
Banquet 45Banquet 45
Banquet 45
 
Banquet 43
Banquet 43Banquet 43
Banquet 43
 
Banquet 42
Banquet 42Banquet 42
Banquet 42
 
Banquet 41
Banquet 41Banquet 41
Banquet 41
 
Banquet 40
Banquet 40Banquet 40
Banquet 40
 
Banquet 39
Banquet 39Banquet 39
Banquet 39
 
Banquet 38
Banquet 38Banquet 38
Banquet 38
 
Banquet 37
Banquet 37Banquet 37
Banquet 37
 
Banquet 36
Banquet 36Banquet 36
Banquet 36
 
Koubei banquet 35
Koubei banquet 35Koubei banquet 35
Koubei banquet 35
 
Koubei banquet 34
Koubei banquet 34Koubei banquet 34
Koubei banquet 34
 
Koubei banquet 33
Koubei banquet 33Koubei banquet 33
Koubei banquet 33
 
Koubei banquet 32
Koubei banquet 32Koubei banquet 32
Koubei banquet 32
 
Koubei banquet 31
Koubei banquet 31Koubei banquet 31
Koubei banquet 31
 

Banquet 16

  • 2. Zen coding ——CSS to html 示例: div#header>img.logo+ul#nav>li*4>a 对应的HTML <div id="header"> <img class="logo"> <ul id="nav"> <li><a href=""></a> <li><a href=""></a> <li><a href=""></a> <li><a href=""></a> </ul> </div> 中文介绍: http://www.qianduan.net/zen-coding-a-new-way-to-write-html-code.html 开源地址:http://code.google.com/p/zen-coding/
  • 3. Internet Explorer ——IE9你啥时来? IE6你早点死吧! 1.微软或明年3月公布IE9如何支持HTML 5 2.已知IE9支持43个选择器中的41个(另外两个中一个有bug,一个不支持)  css选择器测试地址:http://www.css3.info/selectors-test/ 3.微软已申请加入万维网联盟(W3C)的可伸缩矢量图形(SVG)工作组 IE团队博客:http://blogs.msdn.com/ie/archive/2009/11/18/an-early-look-at-ie9- for-developers.aspx 附:google 3月1日起,其产品Calendar,Site 停止支持IE 6,今年晚些时候, Docs,Gmail也停止支持IE 6
  • 4. WEB与GPU ——更高性质的页面渲染?web 3D? 无限畅想ing 1.ie9会支持 2.FF3.7会支持 3.WebKit引擎会在2010中推出WebGL和3D图形规范OpenGL。也将支持GPU加 速 4.Opera暂无消息 5.Flash player 10.1完全支持GPU。
  • 5. Cascading Style Sheets 3 ——该CSS3了,渐进式增强! 1.更多选择器和伪类 http://www.css3.info/selectors-test/test.html 2.更多颜色处理方式 3.还有更多...... 现在可用的... 用浙近式原则为除IE之外的浏览器适时增加更好交互效果 http://www.qianduan.net/what-you-need-to-know-about-behavioral-css.html http://media.24ways.org/2009/14/3/index.html
  • 6. 不用Cookies或IP地址是可能追踪到浏览者的 ——有点搞不明白! 平均每个浏览器发送10.5比特信息熵(发送消息最多的浏览器类型是:黑莓 14.7-15.5比特,Android的14.4比特,IE的13.2-13.5比特,Debian的13.5-15.3 比特),这意味着平均1500(2^10.5)人中有一个人与你有相同的User agent字 符串。EFF认为这不足以保护用户的隐私,特别是这些信息与其它信息如地理位 置或邮政编码或安装的不常见插件结合起来的话,User agent字符串将成为用户 真正的隐私问题。 https://www.eff.org/deeplinks/2010/01/tracking-by-user-agent 题外话:userAgent:userAgent不该改时变改,该改却不改!
  • 7. IPV6 ——IPV6啊,下一代互联网的标志!千年虫,64位! 1.美运营商Comcast 1 月30 宣布IPv6商用计划 2.谷歌宣布YouTube支持IPv6协议 中国: 1.全球IPv4剩余不足10% CNNIC呼吁加快向IPv6过渡 2.中国电信宣布了明确的IPv6商用部署时间表,即2012年进入规模商用,2015 年以后IPv4网络和业务平台逐步退出 IPV6:http://zh.wikipedia.org/wiki/IPv6
  • 8. 关健字“互联网 ——近期!!! 1.互联网提名诺贝尔和平奖 2.美国拟向世贸投诉中国互联网 3.国际空间站接入互联网 4.新疆又恢复开放27家区外网站 (有淘宝,不含口碑网) 5.2009年12月30日,中国网民规模达到3.84亿人,普及率达到28.9%,手机用 户1.2亿. 第25次中国互联网络发展状况统计报告 http://tech.qq.com/zt/2010/cnnic25/
  • 9. CNNIC成为根证书发布者 ——流氓不可怕,就怕流氓有文化! 1.微软把CNNIC列为根证书发布者 2.Mozilla同样也已经在FF3.6里把CNNIC列为根证书发布者 不信任理由: CNNIC恶名远播! 流氓 ,政府控制! https加密将也不安全! AutoProxy 作者说: https://docs.google.com/View?id=d5j3s7p_7f9r489fg 五毛动态:甘肃将建650人网评队伍 http://internet.solidot.org/article.pl?sid=10/01/22/0034201
  • 10. 中国Twitter! ——2010中国互联网会不会全面进入微博战国时代? 1.新浪的微博 t.sina.com 2.腾讯的滔滔,以及QQ邮件的广播.  3.搜狐的微博 t.sohu.com 4.网易的微博 t.163.com 5.人民网微博 6......
  • 11. 1992年Windows 3.1在Web上 ——WebOS?如若开发一个,还是有点难度的! 一位喜欢浪费时间的web开发者在浏览器上重现了1992年的Windows 3.1的完 整体验 Windows3.1:http://www.michaelv.org/ mac:http://osx.portraitofakite.com/ Ubuntu 6.06: http://ossdb.quebecgeeks.net/ossdt/www.protic. net/heritage_2007/lepagee/windows/frame2.htm flash版:http://www.ifizzle.com/ifizzlepb.html (翻墙)
  • 12. Google Chrome的firebug ——还凑合吧!其它chrome自带的也不错 介绍:http://getfirebug.com/releases/lite/chrome/ 试用:http://getfirebug.com/releases/lite/beta/ 安装:https://chrome.google.com/extensions/detail/bnbbfjbeaefgipfjpdabmpadaacmafkj
  • 13. google转化率工具 ——[运营?产品?交互?视觉?前端?] 谁用谁知道! http://browsersize.googlelabs.com/ 中文实验室地址:http://labs.google.cn/ 英文:http://www.googlelabs.com/
  • 14. adobe labs browserlab ——视觉测试方便!还可以看看MAC系统下的效果 包括了主流操作系统以及主浏览器的测试。多视图比较。 地址:https://browserlab.adobe.com/