首先,我想以乙個真實的事例開始今天的主題。曾經有乙個**專案,在建設初期並沒有把移動裝置考慮在內,但是在隨後的設計過程中,大約有80%的客戶會問這樣乙個疑問:**在ipad上面的顯示效果會是怎樣?面對整個問題,整個開發團隊開始慌了手腳,於是整個專案的時間表需要重新制定,預算也跟著增加,而且最終做出來的效果也不盡如人意。
這個故事的寓意就是說,從專案一開始就要將各式各樣的移動裝置考慮在內,而且要意識到未來的不可**性並且具有前瞻性,因為老一套的東西總是要被淘汰的,新事物總會不斷湧現。
那麼是選擇設計響應式**還是打造專門的移動**?
其實這個話題幾乎已經蓋棺定論了,隨著3g的普及,越來越多的人使用手機上網。移動裝置正超過桌面裝置,成為訪問網際網路的最常見終端,響應式**設計已經成為大勢所趨。但我還是想對兩者進行簡單的比較,建設響應式**是不是比移動**成本要來得低?起初,建設移動**和響應式**花費的成本可能差不多,但是因為移動**存在n多不同的版本,後續的資料更新和裝置維護需要大量的費用投入,而響應式**則不存在這樣的問題。另外,像galaxynote這樣的板或者是大螢幕的手機仍然處於灰色地帶,它們到底是顯示移動版本的頁面還是顯示桌面版本的頁面 ,真的是讓使用者左右為難。
相比單獨的移動**,雖然響應式**後續的維護成本會比較低,但這並不代表響應式設計就是完美無缺的。而且涉及到預算問題,每一分錢都很重要,所以作好有效的預算也是很有必要的,下面是建設響應式**需要需要考慮的一些因素:
1.與時俱進,掌握最新動態
讓每個人都掌握業內的最新動態,確保團隊裡的每乙個人都了解響應式設計是什麼。如果不了解當下的最新情況,花點時間去了解,看看當下的趨勢是什麼,然後一起討論如何去開展工作。
這很可能是財政預算需要考慮的最重要因素。很多開發人員一定很熟悉典型的「瀑布模式」的開發過程,「瀑布模式」只按照標準的桌面瀏覽器進行設計,除此之外,幾乎沒有考慮任何其它的設計開發環境,隨著問題的不斷積累,不得不放慢腳步,來應付各種棘手的問題。這是它最大的缺點。跨平台同步進行的響應式設計的出現讓那些呆板的線性過程在多螢幕時代顯得一無是處。
當然,因為響應式設計是跨平台同步進行,相對「瀑布模式」的開發過程而言,密切合作對於乙個成功的響應式設計專案來說是絕對必要的。而在整個開發過程中,要給團隊足夠的時間來分類整理那些不可避免的、棘手的設計問題。
只按照標準的桌面瀏覽器進行網頁設計的的時代已經一去不復返,隨著工作量的加大,測試和qa時間也相應增加,所以在作預算的時候,時間問題也是需要考慮的因素。另外,整個網頁將會支援哪些裝置、將針對那些裝置進行優化也是需要事先考慮好,因為「支援」和「優化」兩者之間還是有區別的。如果要針對每種裝置進行優化,這是不可行的。鑑於預算有限,包容性並且前瞻性的解決方案就顯得尤為重要了。
4.購買測試裝置
在裝置上進行實際操作和測試是非常有必要的,這就意味著在測試裝置方面又要投入一筆預算。
5.了解渠道策略
有許多專案規劃者在進行響應式**設計的時候喜歡將整個專案細分,先是開發桌面版,再接著是手機版,最後是平板電腦版,其實這已經脫離響應式設計的本質。真正的響應式設計從一開始就考慮到這些跨平台問題,從而進行更詳細的前期框架構圖,設計和測試。
viabradfrostweb
(danice供雷鋒網
HTML5 響應式(自適應)網頁設計
現在,很多專案都需要做響應式或者自適應的來適應我們不同螢幕尺寸的手機,電腦等裝置,那麼就需要我們在頁面上下功夫,下面我就來說一下如何做響應式 自適應 的網頁設計 1 在網頁 的頭部,加入一行viewport元標籤 在網頁的中增加以上這句話,可以讓網頁的寬度自動適應手機螢幕的寬度,下面是這些屬性的解釋...
HTML5 響應式(自適應)網頁設計
現在,很多專案都需要做響應式或者自適應的來適應我們不同螢幕尺寸的手機,電腦等裝置,那麼就需要我們在頁面上下功夫,下面我就來說一下如何做響應式 自適應 的網頁設計 1 在網頁 的頭部,加入一行viewport元標籤 在網頁的中增加以上這句話,可以讓網頁的寬度自動適應手機螢幕的寬度,下面是這些屬性的解釋...
響應式網頁設計教程 展示響應式設計的基本原理
響應式網頁設計,毫無疑問地變得越來越重要了。如果你還沒聽說過響應式設計,可以先看看我之前發的文章響應式 對新手來說,響應式設計聽起來可能會有點複雜,但事實上,它比你想象的簡單得多。為了讓你能快速入門,我準備了乙個簡易的教程。通過這三個步驟,你一定可以了解響應式設計的基本原理和media query ...