大多數(shù)客戶不完全了解線框，為什么它們很重要。線框在業(yè)界有些爭(zhēng)議。許多成功的網(wǎng)頁(yè)開(kāi)發(fā)公司完全跳過(guò)這一步，因?yàn)樗麄冇X(jué)得耗時(shí)且不必要。我相信線框?qū)τ谀木W(wǎng)站的正確流動(dòng)和整體成功至關(guān)重要。所以，讓我們進(jìn)一步了解這個(gè)非常有用的工具。

什么是線框？

線框是一個(gè)視覺(jué)指南，代表網(wǎng)站頁(yè)面的骨架框架。它顯示了各種元素的位置和布局，包括內(nèi)容和導(dǎo)航，以及交互和功能元素。網(wǎng)站線框也稱為頁(yè)面原理圖或屏幕藍(lán)圖，有時(shí)稱為原型。

線框通常不包括實(shí)際設(shè)計(jì)和排版，并且通常以黑白準(zhǔn)備。他們專注于網(wǎng)站的內(nèi)容和信息流，而不是其外觀。線框是設(shè)計(jì)過(guò)程的重要組成部分，因?yàn)樗鼈冊(cè)试S我們專注于用戶體驗(yàn)和功能，而不會(huì)分散視覺(jué)設(shè)計(jì)。它們?cè)试S我們決定要顯示哪些信息，哪些信息更重要或優(yōu)先，網(wǎng)站將如何交互，信息將如何流動(dòng)，最后，顯示各種場(chǎng)景如何播放甚至創(chuàng)建交互式環(huán)境。您可以看到所有這些和首次體驗(yàn)?zāi)男戮W(wǎng)站，甚至看到第一個(gè)設(shè)計(jì)綜合（或“comp”）之前。線框可以比設(shè)計(jì)組合更容易地更改和修改。在設(shè)計(jì)階段之前，他們提供了一個(gè)審查和討論概念的設(shè)置，并進(jìn)行了重大改變。隨著項(xiàng)目進(jìn)展，結(jié)果更好的設(shè)計(jì)comps和更少的迭代。

在網(wǎng)頁(yè)設(shè)計(jì)中使用線框

有很多方法來(lái)構(gòu)造線框。一些機(jī)構(gòu)在紙上生成低保真（較不詳細(xì)的）草圖，生產(chǎn)速度快。這對(duì)于一些更簡(jiǎn)單的網(wǎng)站來(lái)說(shuō)可能就足夠了。對(duì)于更復(fù)雜的網(wǎng)站，例如社交網(wǎng)絡(luò)或具有大量交互性的網(wǎng)站，高保真度，詳細(xì)的，有時(shí)事件交互的線框是首選的。這些類型的線框通常用于記錄網(wǎng)站項(xiàng)目，因?yàn)樗鼈儼c網(wǎng)站用戶的體驗(yàn)和最終設(shè)計(jì)更緊密匹配的細(xì)節(jié)級(jí)別，因此需要更長(zhǎng)時(shí)間才能創(chuàng)建。開(kāi)發(fā)團(tuán)隊(duì)還可以在設(shè)計(jì)實(shí)施和編程期間使用這種交互式線框作為參考，以了解當(dāng)用戶按某個(gè)按鈕時(shí)會(huì)發(fā)生什么或采取某種行動(dòng)。

檢查線框的提示

檢查線框時(shí)，請(qǐng)記住它們只是原理圖。不要以為這個(gè)頁(yè)面的視覺(jué)設(shè)計(jì)只是你所看到的彩色版本。讓您的網(wǎng)絡(luò)開(kāi)發(fā)人員走過(guò)線框，并解釋屏幕上的一切。他們應(yīng)該能夠?yàn)樗性靥峁├碛?，為什么它們位于何處，為什么這種布局和流程是最佳的。線框通常以單頁(yè)（通常是主頁(yè)）開(kāi)始，以建立方向，然后專注于網(wǎng)站地圖的其他部分。請(qǐng)注意，您在技術(shù)上不需要網(wǎng)頁(yè)的每一頁(yè)的線框，只適用于與其他網(wǎng)站唯一或不同的網(wǎng)頁(yè)。

線框，可用性和UX

線框的最終目標(biāo)是在設(shè)計(jì)過(guò)程的早期發(fā)現(xiàn)并避免潛在的可用性陷阱。大多數(shù)網(wǎng)站都有可用性問(wèn)題。大多數(shù)這些問(wèn)題阻止用戶回來(lái)，并可能導(dǎo)致令人不快，有時(shí)令人沮喪的用戶體驗(yàn)。通過(guò)設(shè)計(jì)高保真，交互式線框并在項(xiàng)目初期對(duì)可用性和UX問(wèn)題進(jìn)行審查，可以輕松避免這些問(wèn)題。著名的網(wǎng)絡(luò)可用性顧問(wèn)和作者史蒂夫·克魯格（Steve Krug）提供了一個(gè)非常簡(jiǎn)單的可用性測(cè)試：“不要讓我想起”。人們不喜歡解決事情的工作原理。史蒂夫的另一個(gè)測(cè)試是“不要浪費(fèi)我的時(shí)間”。在搜索信息的時(shí)間過(guò)長(zhǎng)時(shí)，這是令人沮喪的。大多數(shù)人會(huì)繼續(xù)前進(jìn)。如果您的網(wǎng)站的使用不直觀，信息很難找到，您和您的Web開(kāi)發(fā)人員應(yīng)該回到繪圖板。對(duì)于真正的線框UX /可用性評(píng)估，重要的是讓一個(gè)人有一個(gè)新的視角，一個(gè)不熟悉網(wǎng)站的人。這個(gè)人會(huì)提供一個(gè)更好的觀點(diǎn)（像一個(gè)典型的網(wǎng)站用戶），他們的反饋將是無(wú)價(jià)的。