随着用戶的模式構建不斷的變化，網站(zhàn)建設逐漸步入了響應式以及自(zì)動适應設計(jì)的技術(shù)時代:

（1）了解以及明确用戶的設備類型和屏幕的尺寸大(dà)小

統計(jì)并分(fēn)析用戶使用設備的基本情況，明确設備的類型以及屏幕大(dà)小，例如(rú)移動設備手機(jī)端以及平闆端，在設計(jì)以及實現的時候要注意添加手勢功能，至于屏幕的尺寸，在設計(jì)時要注意手機(jī)以及平闆端的橫向以及縱向的大(dà)小，電腦端則要注意屏幕的普屏以及寬屏。

（2）設計(jì)線框原型

對于第一步中明确下來(lái)的設備屏幕尺寸分(fēn)别設計(jì)出不同的線框原型，需要明确不同尺寸下，網頁的布局需要怎樣去(qù)适應，内容的尺寸要怎麽去(qù)縮放(fàng)，功能和内容要怎麽删減，還(hái)要注意在特殊環境屏幕顯示的設計(jì)等等。

（3）對線框原型進行測試

将網站(zhàn)所需的圖片導入到相(xiàng)關的設備，并進行一系列的測試，這可(kě)以幫助建站(zhàn)者發現網站(zhàn)是否存在訪問(wèn)性以及可(kě)讀(dú)性等的問(wèn)題。

（4）網站(zhàn)的視覺設計(jì)

在對移動設備的作(zuò)視覺設計(jì)時，由于屏幕顯示尺寸與電腦端的不同，在設計(jì)時要保證網站(zhàn)内容文字的可(kě)讀(dú)性以及控件(jiàn)的點擊區域面積等等。

（5）前段的設計(jì)

和傳統的網頁開發比較，響應式的網站(zhàn)由于網頁布局以及内容尺寸發生(shēng)了改變，因此，最終的成品可(kě)能會和設計(jì)稿有較大(dà)的出入，這需要前端開發者與設計(jì)師(shī)進行更多的溝通。