让Adobe来告诉你CSS3跟HTML5有多酷

一直以来都以发展Flash技术闻名的Adobe，自从被Apple重重的一拳打在脸上后也开始认真的发展CSS3与HTML5技术相关软件与应用，而在上个月初，Adobe推出了Beta网站—the expressive web，这个网站是基于HTML5环境，运用CSS3的搭配，制作出一些新颖的网页效果，换句话说，the expressive web是Adobe为了展示HTML5与CSS3的效果所制作的展示网站，你可以随著左下方的箭头一格一格观看，相信每点一格都会让你发现一些惊奇。 为什么这个网站是Beta？原因很简单，因为并不是所有的浏览器都可以看到完整的画面，而且也不是所有的浏览器都可以支持HTML5新增的全部功能（更何况HTML5还没有正式订定完成），只能说普遍上都可以运作而已，至于哪些浏览器不能支持？想当然尔，如果你的浏览器不是最新版本，那支持机率当然就会比较低，而每个展示画面下方都会列出哪项新功能在哪些浏览器有支持，而这些有支持的浏览器又占整体使用者多少百分比？根据8月份的浏览器市场份额统计数据显示，使用支持HTML5和CSS3的浏览器用户，上都在50%左右，因为目前不支持HTML5和CSS3标准的浏览器基本是以旧版IE为主，其中IE6/IE7/IE8三个版本加起来的市场份额超过46%，其他浏览器大都支持该标准。 通过the expressive web网站的建立，Adobe展示小组也公布了本次过程中所学到的经验，以下将用我个人的理解加上自己的解说将Adobe小组的经验做一个简短的呈现：

• 尽早决定是否支持旧版浏览器—支持旧版浏览器可以提高网站完整性却会消耗过多的维护时程。
• 只使用HTML5与CSS3在你的网站—避免使用其他版本以减少页面上语言与浏览器的冲突。
• 随著HTML5的制定，网站应随之维护的更佳完善—彻底执行HTML5规范来制作网站。
• 浏览器支持的性能不在仅限于Javascript—随著CSS3的诞生，部分的动态效果也可以转由CSS3来执行。
• 不要动太多东西—这个道理很简单，太多动态会消耗电脑效能，一般页面上常见会同时使用动态的部分就有主选单、次选单、主视觉banner等，需要考虑过多的动态效果会让电脑效能吃紧，效能吃紧会大大影响页面呈现的效果。
• 要考虑全部用户—一定要替那些看不到最新的HTML5或CSS3效果的使用者思考，否则你的网站将会残破不堪。
• 要记得设计也要符合智能型手机的使用者—目前智能型手机的使用者已经大幅增加，日后肯定只会越来越多，绝对不可以忽视页面在智能型手机上画面的呈现有多重要！
• 使用Modernizr—Modernizr是一个Open Source 的Javascript 资源库，可以帮助你建构HTML5与CSS3。
• 好的工具—Adobe Edge Preview是Adobe最近推出的新软件，可以帮助你预览与建立HTML5与CSS3网站，最重要的是还是可以使用Flash制作动画嵌入HTML5的Video Tag中。

最后，在the expressive web上也有资源库页面，可以让你查看the expressive web上使用的HTML5与CSS3有哪些之外，也整理了一些HTML5与CSS3的资源网站供大家查看，相信大家看完这个网站，对于HTML5与CSS3会有更明确的视觉感受！ 文章出处：草监影像私人频道

标签:HTML5CSS3浏览器相关Adobe