400-611-9921
2015-12-10
1733
世界范圍內移動設備的使用數(shù)量在與日俱增。面對在跨越多個不同設備上創(chuàng)建良好web體驗的挑戰(zhàn),現(xiàn)在已經(jīng)存在多種解決方案。但是對于任何一個給定的項目,這些解決方案中哪個是最合適的?為了回答這個問題,《移動優(yōu)先》作者Luke以Bagcheck應用作為案例(注:Bagcheck是一家從事搜索與發(fā)現(xiàn)業(yè)務的創(chuàng)新型企業(yè)),解釋了選擇分別設計移動版和桌面版背后的原因,并通過對比提煉出四個優(yōu)化移動Web產(chǎn)品的建議。全文如下:
本人是響應式Web設計(Responsive Web Design)理念的擁護者和粉絲。但經(jīng)常有人這樣問我:為什么我們還要為Bagcheck單獨構建一個獨立的移動版本,而不使用流體網(wǎng)格(fluid grids),彈性圖片(flexible images)和媒體查詢(media queries)等方法來為我們的移動用戶提供一個響應式Web解決方案?
對于我們的Bagcheck站點來講,網(wǎng)站性能以及網(wǎng)站開發(fā)速度是兩個至關重要的問題。我們所做的決定中,很多都是為了使網(wǎng)站性能和開發(fā)速度兩者都盡可能的快(畢竟我們是一家新成立的企業(yè))。作為我們關注網(wǎng)站性能的一部分,我們也很注重“什么才是必須的”這樣的理念。這意味著我們需要向不同設備或者用戶呈現(xiàn)一些他們需要的東西。我們樂于做一些優(yōu)化工作。使用雙重模板系統(tǒng)(dual template system)我們就可以從以下多個方面進行優(yōu)化,比如資源順序(source order),媒體(media),URL結構以及應用程序設計。
最初我們以命令行接口(command-line interface)的形式構建Bagcheck,在此基礎之上我們創(chuàng)建了一個移動Web體驗版的Bagcheck,接著很快就開發(fā)出了一個桌面Web體驗版的Bagcheck。這樣的過程很可能也影響到了我們所使用的開發(fā)方法。
另外值得一提的是,雖然自己能夠勝任編碼工作,但我主要是一個設計師。因為我關注的焦點是設計要素,所以在這篇文章里會盡量多的包含一些技術層面的資源鏈接,如果你有更多的資源和實現(xiàn)想法,趕快發(fā)給我吧!
響應式Web設計(Responsive Web Design)最為核心的部分是,將相同的HTML代碼應用到不同的設備上面來,并且根據(jù)具體設備自身的性能來動態(tài)調整(主要是通過CSS)外觀顯示。HTML標記有一個資源順序,這個資源順序通常規(guī)定Web頁面如何被瀏覽器渲染。盡管可以使用JavaScript和CSS技術來改變HTML元素的位置布局,但想以一種可靠的方式在多種不同設備上面進行HTML元素重定位則非常具有挑戰(zhàn)性。
就拿網(wǎng)站導航菜單這個簡單的例子來說吧,對于那些擁有較大屏幕以及鼠標/鍵盤等輸入的設備來說,將導航菜單放置到網(wǎng)頁的頂部是很常見的做法,其原因有以下幾個方面:
400-611-9921
020-29860991
地址1:廣州市天河區(qū)珠江新城邦華環(huán)球廣場16F
業(yè)務 QQ: 3561401262
E-mail: sales@zomsky.com