繪制網(wǎng)站的線框圖是開(kāi)發(fā)設(shè)計(jì)網(wǎng)站的第一步。也是網(wǎng)站視覺(jué)外觀進(jìn)行初步表達(dá)的一種形式。它是網(wǎng)站建設(shè)項(xiàng)目進(jìn)行中的藍(lán)圖，用來(lái)傳達(dá)策劃和設(shè)計(jì)思想，用來(lái)表現(xiàn)網(wǎng)頁(yè)的布局和核心元素。更深層次地講，線框圖對(duì)于決定用戶怎樣跟界面交互有十分重要的作用。

　　什么是線框圖?

　　網(wǎng)站線框圖(Wireframe)通俗來(lái)講就是網(wǎng)站框架的草圖，是網(wǎng)站設(shè)計(jì)師將客戶需求圖形化的一種展現(xiàn)形式。線框圖是低保真的設(shè)計(jì)圖，用于表達(dá)：

　　內(nèi)容大綱(什么東西)

　　信息結(jié)構(gòu)(在哪)

　　用戶的交互行為描述(怎么操作)

　　框線圖是什么樣子?

　　根據(jù)不同的表達(dá)和溝通需要，線框圖可以從復(fù)雜到簡(jiǎn)單。下圖是一個(gè)企業(yè)網(wǎng)站的簡(jiǎn)單線框圖，用于表達(dá)頁(yè)面布局：

　　網(wǎng)頁(yè)設(shè)計(jì)線框圖-新龍制作

　　線框圖設(shè)計(jì)很重要，可以讓設(shè)計(jì)師把注意力集中在規(guī)劃排版和界面的交互上，而不受顏色、字體選擇甚至內(nèi)容的干擾。

　　為什么需要使用線框圖?

　　在項(xiàng)目設(shè)計(jì)初始階段，需要關(guān)注網(wǎng)站的功能、信息架構(gòu)、用戶體驗(yàn)、用戶交互流程、可用性等因素，線框圖在此發(fā)揮巨大作用。網(wǎng)站建設(shè)公司能夠使用線框圖表達(dá)網(wǎng)站的核心功能和信息布局，以及用戶交互和增強(qiáng)用戶體驗(yàn)，并與委托方進(jìn)行溝通。

　　線框圖常常用來(lái)作項(xiàng)目方案說(shuō)明，它是與客戶進(jìn)行設(shè)計(jì)溝通的工具。這種拋開(kāi)視覺(jué)表現(xiàn)的骨架能夠幫助雙方明確網(wǎng)站核心部分，建站客戶因此能夠了解網(wǎng)站設(shè)計(jì)公司的主要策劃思想并參與到項(xiàng)目討論中。

　　不僅僅是大型網(wǎng)站在設(shè)計(jì)階段需要投入時(shí)間和精力制作線框圖，對(duì)于中小企業(yè)建設(shè)網(wǎng)站項(xiàng)目線框圖在網(wǎng)頁(yè)設(shè)計(jì)中的重要性也是不容忽視的，如果省去線框圖繪制將可能造成后期大量修改，延誤交付時(shí)間。

　　建站客戶應(yīng)如何審閱線框圖?

　　當(dāng)客戶審閱線框設(shè)計(jì)時(shí)，請(qǐng)注意：

　　信息架構(gòu)：從上到下查看信息架構(gòu)流程和線框上顯示內(nèi)容的優(yōu)先級(jí)。

　　內(nèi)容策略：在線框圖階段，會(huì)采用有意義文字描述板塊標(biāo)題，但對(duì)細(xì)節(jié)局部的圖文是采用框線代替圖片及替代文字占位表示。

　　頁(yè)面布局：頁(yè)面布局是否滿足您的需要?如果是的，請(qǐng)確保再次詢問(wèn)該布局是否仍然有意義。通過(guò)審閱線框圖可以拾起遺漏，使方案更加完善。

　　功能性：查看網(wǎng)站功能性元素是否放置在合適的位置。比如行動(dòng)號(hào)召按鈕是否放置在訪問(wèn)者的主要視線范圍內(nèi)?社交媒體分享按鈕是否使用順手(把社交媒體按鈕放在屏幕左側(cè)肯定沒(méi)有放在右側(cè)好用)?

　　用戶交互：站在訪問(wèn)者角度考慮如何更便捷地使用網(wǎng)站。導(dǎo)航的結(jié)構(gòu)是否復(fù)雜?訪問(wèn)者需要點(diǎn)擊多少次才能聯(lián)系到網(wǎng)站管理員?產(chǎn)品詳情是否埋藏太深?網(wǎng)站是否看起來(lái)簡(jiǎn)單明了?等等。