前幾天,Opera宣布其用戶已經超過1億——桌面版和手機版均超過5000萬。Opera Mini是一個很優秀的手機瀏覽器,對手機用戶而言,Opera Mini為鍋牛般的手機互聯網訪問提供了更快更好的體驗。而最近最讓iPhone用戶驚喜的是,Opera mini 5通過了水果店的審核,已經可以免費下載。現在Opera mini 5已經發布了對各平臺的版本,包括Android/oPhone、Windows mobile、黑莓、Java等,支持絕大部分手機平臺。
Opera Mini 5被稱為Opera公司的“下一代”手機瀏覽器,可見它與Opera 10.5x一樣,也是一個很重要的里程碑,那么今天就讓我們看一看Opera Mini 5對移動網站開發的影響吧。
Opera Mini 5的特性
1、Opera Mini 5使用Presto 2.4的引擎,渲染能力與Opera Mobile 10(只有Windows Mobile和S60版本)基本持平;
2、由于Opera的 Vega圖形引擎無法在其代理服務器上使用,所以,一些CSS3屬性不能在Opera Mini 5中應用,比如border-radius、css transition等;(事物都有兩面性,Opera Mini速度快的關鍵就是其代理服務器提供了內容壓縮,而在這里,卻成為了技術的一個雞肋)
3、支持CSS3媒體查詢;
4、完全支持CSS3選擇器;
5、支持多背景圖片;
6、支持RGB(a)和HSL(a)色彩;
7、HTML 5的一些特性無法支持,比如網絡字體、表單等,經測試,Opera mini 5在html5test.com的測試中只拿到14分(共160分),只支持html5的doctype和部分canvas;
8、部分支持SVG,只會被渲染為光柵圖片;
9、支持Data URi。
Opera Mini 5與Opera桌面版和Opera mobile 10對標準的支持對比表
Zi Bin, Cheah整理了一份Opera Mini與Opeta Mobile 10以及桌面版的Opera 10.50在網頁標準支持方面的對比表。通過這個表格,我們可以詳細的看到三個平臺的Opera對標準的支持情況了。
桌面版 10.5x | Mobile 10 | Mini 5 | |
CSS3 常規屬性 | |||
網絡字體 | ![]() |
![]() |
![]() |
媒體查詢(meidia query) | ![]() |
![]() |
![]() |
text-shadow (包括多重text-shadow) | ![]() |
![]() |
![]() |
選擇器 | ![]() |
![]() |
![]() |
CSS3 背景與邊框 | |||
border-radius | ![]() |
![]() |
![]() |
background-clip | ![]() |
![]() |
![]() |
background-origin | ![]() |
![]() |
![]() |
多背景圖片 | ![]() |
![]() |
![]() |
background-attachment | ![]() |
![]() |
![]() |
box-shadow | ![]() |
![]() |
![]() |
border-image | ![]() |
![]() |
![]() |
CSS3 Transitions | |||
transition-property | ![]() |
![]() |
![]() |
transition-duration | ![]() |
![]() |
![]() |
transition-delay | ![]() |
![]() |
![]() |
transition-timing-function | ![]() |
![]() |
![]() |
ease | ![]() |
![]() |
![]() |
linear | ![]() |
![]() |
![]() |
ease-in | ![]() |
![]() |
![]() |
ease-out | ![]() |
![]() |
![]() |
ease-in-out | ![]() |
![]() |
![]() |
CSS3 2D 轉換 | |||
translate | ![]() |
![]() |
![]() |
translateX | ![]() |
![]() |
![]() |
translateY | ![]() |
![]() |
![]() |
scale | ![]() |
![]() |
![]() |
skew | ![]() |
![]() |
![]() |
rotate | ![]() |
![]() |
![]() |
transform-origin | ![]() |
![]() |
![]() |
CSS3色彩 | |||
rgba() | ![]() |
![]() |
![]() |
hsla() | ![]() |
![]() |
![]() |
html5 | |||
Video | ![]() |
![]() |
![]() |
Audio | ![]() |
![]() |
![]() |
Web Forms | ![]() |
![]() |
![]() |
存儲 | |||
Web Storage – Local Storage | ![]() |
![]() |
![]() |
Web Storage – Session Storage | ![]() |
![]() |
![]() |
Web SQL Storage | ![]() |
![]() |
![]() |
圖形 | |||
Canvas | ![]() |
![]() |
![]() |
SVG | ![]() |
![]() |
![]() |
雜項 | |||
Selectors API | ![]() |
![]() |
![]() |
Viewport元標簽 | N/A | ![]() |
![]() |
Opera Mini 5的User Agent
Opera Mini 5的User Agent如下:
Opera/9.80 (J2ME/MIDP; Opera Mini/5.0.18635/1030; U; en) Presto/2.4.15
總結
最近做了一些在Android/Ophone平臺上的頁面,本來以為Android的瀏覽器是基于webkit內核的,可以放心大膽的使用各種CSS3的屬性。但是后來發現在某些細節上表現很不好,而且Android各個版本之間的兼容性問題的確是比較嚴重的。而對于使用最為廣泛的Opera,目前來看基本上是實現了“跨平臺”了。保持瀏覽器在各個平臺上表現的一致性,無論對開發人員還是用戶,都是非常重要的,目前來看,Opera在這方面是個好榜樣。
當然沒有人會專門做一個只兼容Opera Mini的網站,我最近將研究一些關于移動互聯網開發的內容,歡迎關注。這個世界常常讓人很痛苦,但是只要認真面對,痛苦總會有快樂相隨。