矛盾出來了,像我們這些小作坊,基本都是設計布局一人搞定。甚至還有加後台程序的。假設設計的時候考慮布局了,我們都有這個能力進行調整。但像大公司,分工嚴格的情況下,如果設計師不懂css不會布局。或者理解有誤,那麼設計稿就會讓布局人員耗費大量的時間和精力。因為浏覽器太多!
經常看到有網友抱怨設計師給的稿子無法還原。因為他們對浏覽器和屏幕的理解不一樣。也有的是因為效果太絢,顏色太多。更有甚者是使用flash制作嫌浪費,而html又雞肋.....好吧,我們拋開這最後一種情況,只談對屏幕和效果以及設計布局的理解。
先談屏幕:
屏幕分辨率,還是以1024×768為主。而滿屏的定義則無從談起。為什麼?請看一下原因:
要使得網頁滿屏。很多人說寬度1003,也有人說是1004。而我則不這樣認為。
假設客戶要求網頁滿屏。那麼,你就要曉得用戶的顯示器尺寸的屏幕分辨率。如果客戶對這玩意認知度很低。就不要輕易去改人家的分辨率。我1440×900的寬屏,我用1024×768的分辨率,我樂意!如果這客戶要求一定要滿屏,那麼問題又出現了,如果交貨的時候客戶換了一台不同尺寸的顯示器呢?分辨率變大了,你的網頁窄了,分辨率小了,你的網頁寬了!你咋辦?
其實滿屏也分兩種,我姑且命名一種為內容滿屏,一種為視覺滿屏!
所謂內容滿屏,就是指網站上的東西,左邊界就在顯示器左邊界,右邊界就是在顯示器右邊界。最佳的解決辦法就是使用百分比。而百分比帶來的負面效應:
所謂視覺滿屏,其實是一種取巧的做法。而這種方法。其實很簡單,一個網站的頭部,無非就是導航和banner,如果導航在最上邊,那麼,將導航的背景呈100%,導航居中。如果banner在最上邊,那麼注意處理圖片兩端,還是100%寬+背景!
OK,雖然內容寬度還有可能是1000、1003、甚至是900或更低,視覺上依然是百分百的寬度,只要避免最小寬度大於浏覽器寬度、或客戶的顯示器分辨率寬度大於你的最小寬度。永遠OK。
談布局和循環:
這裡有篇文章http://weilaixu.cn/read.php/174.htm
其實呢,說網頁制作,直角最簡單,比如老印,他的東西全部是直角。用他的話說就是刀切一樣!為嘛?簡單方便速度快內容清晰!
布局以按照設計稿為標准。或者說叫使用html還原設計稿,如果html截圖能和設計稿重疊,再過了標准,我認為就是最高境界了!
問題最大的,其實還是在設計和還原效果上!雖然可以使用css的負值、浮動、重疊等屬性進行不規則布局,但問題依然存在,工作量和難度有可能依然會翻倍。還有,那可惡的N種浏覽器!
對於復雜的設計稿、復雜的效果、甚至是過分的設計,如何降低使用html還原設計稿的工作量及難度!
問題集中體現在設計和效果上!
先說設計:
網頁設計,除了體現效果,還有很多不可缺少的東西。這裡不談純粹用來欣賞的網站。畢竟大部分的站點需要被大量閱讀的。
我在做設計的時候,一般的站點是不考慮布局的!但那些藝術氣息特濃厚,效果忒多忒強烈的站,在吃自己的虧吃了兩次之後,就開始主動考慮後期布局,盡量避免讓布局難度加大!
如果設計的時候,考慮到重復利用圖片、背景等。會降低布局切片的很多工作。或者我可以說,頁面重復利用率越高,就越快!主頁雖然是主頁,子頁雖然更簡單,但重復利用主頁上已經下載了的東西,不更好麼?我想說的是,要有全局的思維!
當然了,你肯定也想到了flash的應用。但flash貌似也有浏覽器兼容問題!
如果設計和布局中間有某個問題被耽擱或某一方不退讓,那麼程序、交互就要延後,上線日期也要推遲。
如果制作方擅自行動修改而設計方死活有意見......
唉,問題可大可小!做個網頁也不容易啊!