所屬行業(yè):汽車配件
功能亮點(diǎn):二級導(dǎo)航、視頻展示模塊
構(gòu)建網(wǎng)站對于企業(yè)而言,往往起到兩大作用,其一“好看”,以此彰顯品牌塑造企業(yè)形象,其二“好賣”,通過線上推廣為產(chǎn)品銷量賦能。那如何搭建“好看”與“好賣”兩者兼得的企業(yè)官網(wǎng)?
今天,我們以專注于車聯(lián)網(wǎng)大數(shù)據(jù)研究及應(yīng)用的自主創(chuàng)新型高科技企業(yè)“廣州亞美信息科技有限公司(以下簡稱‘亞美科技’)”借助凡科建站所構(gòu)建的PC+小程序官網(wǎng)為例,來看看“好看又好賣”的企業(yè)官網(wǎng)是如何打造的。
別具設(shè)計(jì)感的官網(wǎng)首頁
給予良好的第一觀感
網(wǎng)站首頁作為網(wǎng)站的門面,良好的頁面布局、恰當(dāng)?shù)膬?nèi)容對于用戶體驗(yàn)起到至關(guān)重要的作用。
其中,首屏大圖占據(jù)了官網(wǎng)首頁的絕對位置,它決定了訪客對官網(wǎng)的第一觀感。
因此,首屏大圖往往會(huì)將品牌理念、產(chǎn)品廣告語等傳遞價(jià)值的信息作為首要放置的內(nèi)容,同時(shí)它的設(shè)計(jì)也會(huì)影響到官網(wǎng)整體的氣質(zhì)。
以亞美科技為例,作為汽車軟硬件生態(tài)解決供應(yīng)商,廣告語“更懂車主”即體現(xiàn)產(chǎn)品在各方面為車主提供全方位信息的幫助,也表達(dá)了企業(yè) “為更懂車主不斷創(chuàng)新” 的價(jià)值主張。
因此,在首屏大圖設(shè)計(jì)上,亞美科技以汽車停靠于荒野之上星空之下的開闊風(fēng)景照來體現(xiàn)借助其產(chǎn)品能讓車主“行至更遠(yuǎn),行至舒適”的理念。
這種以“產(chǎn)品使用場景+實(shí)景照”是官網(wǎng)首屏大圖常用處理方式,借此向訪客說明產(chǎn)品在哪方面帶來益處,同時(shí)也讓其感知到企業(yè)的價(jià)值觀與愿景。
作為影響影響官網(wǎng)整體氣質(zhì)的首屏大圖,其他子頁面上也該延續(xù)該設(shè)計(jì),形成統(tǒng)一的風(fēng)格,以此來增強(qiáng)網(wǎng)站的整體觀感。
我們可以看到,亞美科技官網(wǎng)的企業(yè)子頁面大圖都延續(xù)了星空夜色沉穩(wěn)的色調(diào),即呼應(yīng)了首頁大圖,同時(shí)襯托出產(chǎn)品的質(zhì)感。
當(dāng)訪客領(lǐng)略完首屏大圖后,想繼續(xù)留住客戶,就要向他們傳達(dá)產(chǎn)品的核心價(jià)值、優(yōu)勢、賣點(diǎn),讓他們清晰明了地清楚購買產(chǎn)品的真正獲益之處。
若是把首屏大圖范圍看作“價(jià)值表達(dá)區(qū)域”,那么緊接著的便是“營銷區(qū)域”,它所起到的作用是輔助價(jià)值的闡述、強(qiáng)化獨(dú)特的銷售主張。
亞美科技官網(wǎng)在此區(qū)域,將產(chǎn)品的功能特性、12大產(chǎn)品功能介紹,以文字加圖標(biāo)的形式進(jìn)行展現(xiàn),以此詮釋產(chǎn)品“更懂車主”的主張。
最后就是“重申區(qū)域”,當(dāng)訪客在“營銷區(qū)域”進(jìn)行長時(shí)間停留,對產(chǎn)品有了一定程度的認(rèn)知后,能抵達(dá)首頁的底部證明訪客的需求意愿已經(jīng)足夠高。因此可以安排有關(guān)產(chǎn)品或企業(yè)的更多詳情提供給訪客。
以“價(jià)值表達(dá)區(qū)”“營銷區(qū)”“重申區(qū)”三大區(qū)域合理安排官網(wǎng)內(nèi)容,能更好地提升訪客的瀏覽體驗(yàn),從而提升轉(zhuǎn)化率。
簡單精準(zhǔn)的導(dǎo)航設(shè)計(jì)
提升訪客使用體驗(yàn)
除了頁面內(nèi)容與設(shè)計(jì)的安排,網(wǎng)站一些功能性的細(xì)節(jié)安排也會(huì)影響訪客的使用體驗(yàn)。如經(jīng)常被忽視的網(wǎng)站導(dǎo)航欄設(shè)計(jì)。
其實(shí),導(dǎo)航的設(shè)計(jì)在用戶體驗(yàn)建設(shè)方面很有幫助,而且地位不低。簡單直觀的導(dǎo)航可以提高網(wǎng)站的易用性,而且便于用戶找到想要的內(nèi)容,提升網(wǎng)站的轉(zhuǎn)化。
以亞美科技官網(wǎng)導(dǎo)航欄為例,在一級導(dǎo)航欄中設(shè)置7個(gè)項(xiàng)目,從產(chǎn)品品類、產(chǎn)品面對面、產(chǎn)品購買等細(xì)致的導(dǎo)向,讓訪客能輕松地找到想要的內(nèi)容。
除此之外,為訪客預(yù)先設(shè)定瀏覽的路徑,每個(gè)欄目按照動(dòng)線安排,契合訪客對產(chǎn)品由淺入深的了解,最后實(shí)現(xiàn)產(chǎn)品購買。
對于二級導(dǎo)航欄的設(shè)置,為更快更精準(zhǔn)地顯示出內(nèi)容,亞美科技官網(wǎng)采用鼠標(biāo)觸碰自動(dòng)彈出下拉欄的方式,減少了訪客多余的操作。同時(shí)采用與品牌VI色相符的底色進(jìn)行襯托,突出二級菜單欄內(nèi)容。
看似“簡單”的導(dǎo)航設(shè)計(jì),其實(shí)在一定程度上影響訪客的瀏覽時(shí)長與體驗(yàn)。畢竟當(dāng)訪客不能快速找到自己想要的內(nèi)容時(shí),大概率會(huì)離開網(wǎng)站。因此,在導(dǎo)航欄的設(shè)計(jì)上必須做到簡約且精準(zhǔn),正如亞美科技官網(wǎng)最終所呈現(xiàn)的效果。
構(gòu)建小程序官網(wǎng)
進(jìn)行私域精細(xì)化運(yùn)營
除了構(gòu)建PC端官網(wǎng)作為宣傳的窗口,亞美科技同時(shí)也借助凡科輕站構(gòu)建了小程序官網(wǎng),以公眾號為依托,對私域流量進(jìn)行精細(xì)化運(yùn)營。
與PC官網(wǎng)注重設(shè)計(jì)美感與使用體驗(yàn)感不同,小程序官網(wǎng)則更側(cè)重于內(nèi)容的充實(shí)。通過內(nèi)容的高頻更新,借助小程序在微信上易于轉(zhuǎn)發(fā)、易于傳播的優(yōu)勢,能讓企業(yè)銷售端與客戶進(jìn)行高頻的互動(dòng),從而挖掘到潛在的客戶。
以亞美科技小程序官網(wǎng)為例,官網(wǎng)上只有兩大模塊,分別是企業(yè)介紹+產(chǎn)品展示模塊、視頻模塊。企業(yè)介紹+產(chǎn)品展示作為固定內(nèi)容,便于引流而來的客戶第一時(shí)間了解企業(yè)與產(chǎn)品的詳情,而視頻模塊則擔(dān)當(dāng)引流的作用。
每個(gè)月的28日,亞美科技以行業(yè)、產(chǎn)品或企業(yè)自身為主題制作成視頻在小程序上線,邀請客戶觀看,提升他們對產(chǎn)品與企業(yè)的認(rèn)可度。
亞美科技市場負(fù)責(zé)人表示,私域精細(xì)化運(yùn)營的優(yōu)點(diǎn)在于可以反復(fù)觸達(dá),通過每月在小程序上更新干貨視頻,由銷售人員通過小程序直接轉(zhuǎn)發(fā)給客戶,讓兩者間實(shí)現(xiàn)周期性的互動(dòng)。以這種方式賦能銷售,能很好地提升銷量。
正是借助這種方式,亞美科技小程序官網(wǎng)一直保持著持續(xù)的流量,對于提升品牌影響力與銷售力起到良好的作用。
最后,“好看又好賣”的官網(wǎng)如何打造?亞美科技已經(jīng)給出了答案,首先是PC官網(wǎng)注重設(shè)計(jì)感與使用感,如網(wǎng)頁三大區(qū)域的細(xì)致安排、導(dǎo)航欄簡單易用的設(shè)計(jì),其次是兼?zhèn)渌接蛄髁砍氐倪\(yùn)營,構(gòu)建小程序官網(wǎng),對客戶進(jìn)行反復(fù)觸達(dá),從而提升客戶對品牌與產(chǎn)品的認(rèn)可度。