在和客戶(hù)溝通時(shí)，都會(huì)談到做個(gè)什么樣的網(wǎng)站，是H5響應(yīng)式的還是單PC的，兩者的價(jià)格區(qū)間也肯定是不一樣的，在現(xiàn)在互聯(lián)網(wǎng)手機(jī)移動(dòng)端應(yīng)用越來(lái)越廣泛的時(shí)候，響應(yīng)式網(wǎng)頁(yè)設(shè)計(jì)是眾多企業(yè)的首選。

建站注意事項(xiàng)

那在網(wǎng)頁(yè)設(shè)計(jì)期間，設(shè)計(jì)師常見(jiàn)的問(wèn)題是跨瀏覽器兼容性，跨不同瀏覽器的兼容性，兼容性代表什么，須確保網(wǎng)頁(yè)設(shè)計(jì)正常工作，其外觀在平臺(tái)上都沒(méi)有錯(cuò)誤功能正常，在設(shè)計(jì)新項(xiàng)目時(shí)，在整個(gè)網(wǎng)頁(yè)設(shè)計(jì)過(guò)程中，必須不遺余力保持跨瀏覽器兼容性。

新CSS3版本中引入的許多新CSS功能，得到主流瀏覽器的廣泛支持，但是有些是不可識(shí)別的，如果設(shè)計(jì)依賴(lài)于不支持的CSS，可能會(huì)造成重大問(wèn)題。

不僅僅是各種瀏覽器類(lèi)型，同一瀏覽器的不同版本技術(shù)也不同，進(jìn)一步使跨瀏覽器兼容性變得復(fù)雜。

對(duì)于瀏覽器兼容性問(wèn)題，照片和媒體需要靈活并適應(yīng)不同的設(shè)備，同時(shí)不會(huì)減慢頁(yè)面加載速度，對(duì)于不同屏幕尺寸，在高分辨率顯示器上的性能等問(wèn)題，沒(méi)有確定的解決方案。

對(duì)所有設(shè)備使用單個(gè)映像并不是一個(gè)明智的解決方案，用戶(hù)加載設(shè)計(jì)所需的時(shí)間。加載超慢速圖像后，這些高分辨率圖像可能會(huì)以原始大小的四分之一顯示。

媒體查詢(xún)不適用于舊版瀏覽器，只有更新過(guò)的具有強(qiáng)大CSS3支持的瀏覽器，才能正確地看到應(yīng)用了許規(guī)則的響應(yīng)式網(wǎng)頁(yè)。

respond.js方案也是簡(jiǎn)單的，一個(gè)respond.js的腳本，使舊的瀏覽器版本能夠理解和執(zhí)行CSS3媒體查詢(xún)，在頁(yè)面上調(diào)用此腳本，為舊版瀏覽器添加對(duì)媒體查詢(xún)，寬度，和所有媒體類(lèi)型的支持。

Respond.js很容易成為理想的解決方案，對(duì)于許多項(xiàng)目來(lái)說(shuō)，是一個(gè)很好的解決方案，從新的CSS瀏覽器和智能手機(jī)設(shè)計(jì)的瀏覽器中讀取的，使舊版瀏覽器讀取媒體查詢(xún)中的CSS3指令。

可以下載完整版本的庫(kù)，如果只需要在瀏覽器中測(cè)試CSS3的兼容性，可以設(shè)置庫(kù)提供的各種并創(chuàng)建自己的壓縮代碼。將代碼粘貼到外部js文件中，包含在HTML文檔的標(biāo)記中。

在單個(gè)文件中使用CSS3，這個(gè)庫(kù)要求將代碼分成幾個(gè)CSS文件，每個(gè)文件對(duì)應(yīng)一種設(shè)備類(lèi)型，該庫(kù)解析設(shè)備的分辨率并調(diào)用為該特定屏幕分辨率設(shè)計(jì)的CSS。

在網(wǎng)頁(yè)設(shè)計(jì)過(guò)程中，可以參考同行或者大佬家的網(wǎng)站，可以下載腳本查看它是如何工作的，使用以下行激活頁(yè)面上的庫(kù)，在范圍中看到CSS文件列表，每組分辨率都有一個(gè)，這些文件中的每一個(gè)都包含僅與特定設(shè)備相關(guān)的CSS屬性，應(yīng)用于屏幕大小的常見(jiàn)CSS應(yīng)該包含在不同文件中。