“設(shè)計的首要任務(wù),不是美觀,而是幫助人們理解復(fù)雜信息。” ——《信息架構(gòu):超越Web設(shè)計》
很多人做官網(wǎng)時習(xí)慣直接上設(shè)計稿,但我想分享一下: 最近做一個企業(yè)官網(wǎng),先用了信息架構(gòu)思維,結(jié)果不僅讓老板很滿意,后續(xù)內(nèi)容更新也省心了很多。
常見誤區(qū):先做視覺稿就等于高效? 我一開始也以為先畫頁面就能快,但很快發(fā)現(xiàn):
客戶需要的核心內(nèi)容沒地方放;
產(chǎn)品介紹和解決方案反復(fù)修改,頁面結(jié)構(gòu)被打亂;
不同人理解的信息優(yōu)先級不一致,溝通成本陡增。
這些都源于沒有先規(guī)劃信息架構(gòu)。
書里有句話點醒我:“信息架構(gòu)要在任何設(shè)計和開發(fā)動作之前完成,它是產(chǎn)品內(nèi)容的支撐結(jié)構(gòu)。”
于是我用了三步:
1)卡片分類:把所有需要展示的內(nèi)容拆成卡片 比如:品牌故事、主營業(yè)務(wù)、核心優(yōu)勢、合作伙伴、聯(lián)系方式…… 然后和客戶、團隊一起做小型卡片分類工作坊,用他們的語言重新組合、排序。
結(jié)果:信息對他們自己來說也清晰了,不再互相矛盾。
2)搭建組織系統(tǒng):用樹狀圖規(guī)劃內(nèi)容結(jié)構(gòu) 書中提到:“組織系統(tǒng)是支撐信息環(huán)境的骨架。” 我把卡片分類結(jié)果轉(zhuǎn)成樹狀架構(gòu),先理清首頁→一級欄目→二級頁面的層級關(guān)系,確認(rèn)每一層放哪些信息。 這一步讓后續(xù)頁面數(shù)量、導(dǎo)航設(shè)計都一目了然。
3)定義導(dǎo)航與標(biāo)簽系統(tǒng):把內(nèi)容變成用戶可點可找的路徑 我沒直接用專業(yè)術(shù)語,而是用客戶和用戶能懂的標(biāo)簽命名欄目,比如把“公司介紹”改成“關(guān)于我們”,把“解決方案”明確細(xì)分成“產(chǎn)品服務(wù)”、“行業(yè)案例”等。
結(jié)果:用戶可以根據(jù)直覺快速定位需要的信息。
別把信息架構(gòu)當(dāng)成一次性工作 官網(wǎng)內(nèi)容常更新,要定期復(fù)盤:
舊頁面是否有信息冗余?
用戶搜索數(shù)據(jù)體現(xiàn)的新需求有沒有覆蓋?
新增內(nèi)容如何融入原有架構(gòu)?
持續(xù)維護信息架構(gòu)能讓官網(wǎng)始終保持清晰可用。



蘭亭妙微(www.73404.com.cn )是一家專注而深入的界面設(shè)計公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的大數(shù)據(jù)可視化界面設(shè)計、B端界面設(shè)計、桌面端界面設(shè)計、APP界面設(shè)計、圖標(biāo)定制、用戶體驗設(shè)計、交互設(shè)計、UI咨詢、高端網(wǎng)站設(shè)計、平面設(shè)計,以及相關(guān)的軟件開發(fā)服務(wù),咨詢電話:01063334945。我們建立了一個微信群,每天分享國內(nèi)外優(yōu)秀的設(shè)計,有興趣請加入一起學(xué)習(xí)成長,咨詢及進群請加藍小助微信ben_lanlan