網頁設計

網頁設計 | 為您度身訂造,一次性建網收費,網頁永屬於客人!歡迎網頁設計 報價,首年網頁寄存免費,首年公司電郵服務免費,兼送 seo 網頁設計優化。無論是關鍵字分析,站內優化 On-Page seo 還是網外優化 Off-Page seo,一應俱全,讓客戶和生意自動上門,助您在同行中脫穎而出!

Google優化指南:零售篇

UX首頁設計

要解決的問題:我的網站是否提供用戶想要的?
Homepage best in class
進一步優化:菜單中的標籤圖標。
Homepage best in class WarbyParker

進一步優化:在菜單中標記圖標,不使用幻像按鈕。

UX導航設計

要解決的問題:用戶可以快速地瀏覽他們感興趣的內容嗎?
Navigation best in class:Net a Porter
Navigation best in class:macys

進一步優化:在菜單中標記圖示,以確保動畫符合RAIL標準。

UX搜尋設計

要解決的問題:如何幫助用戶找到他們要的內容?
Search best in class:Staples
進一步優化:標籤圖標。
Search best in class:Sephora

進一步優化:在菜單中標記圖標,以確保動畫符合RAIL標準。

UX產品類別設計

要解決的問題:用戶是否容易找到適合他們需求的產品?如果用戶不感興趣,如何引導他們的建立新的興趣?
Category Product best in class:Sephora

UX購物流程設計

要解決的問題:購買過程如何簡易化? 如何幫助猶豫不決的用戶在下次進行購買的行動?
Cart Conversion best in class:Zumiez

UX表單優化

要解決的問題:如何幫助用戶快速便捷地付款?
Form optimization best in class:Warby Parker
Form optimization best in class:ThredUp
Form optimization best in class:Zalando

UX CTA(Call to action)設計

引導用戶如何有效地與網站平台和產品服務的交互。

具有描述性的CTA設計

引導用戶如何有效地與網站平台和產品服務的交互。

引導性CTA設計的好處

研究顯示UX CTA 設計導致會員註冊人數增加了33%。
Call to action

在首頁清晰地進行有價值的引導

不要使用整頁插頁式廣告

不要自動輪播,應由用戶主導選擇

研究顯示自動輪播橫幅廣告沒有效益

主頁上的圖像自動輪播可以被視為橫幅廣告,不應該自動輪播,而應該由用戶主導播放與否。
Research shows that carousels rarely work
相關研究:

在首頁上顯示熱門類別

社交媒體等的認證

顯示合併菜單

面積佔頁面不多於5分1

顯示電話圖標和號碼

如果電話聯絡很重要,請在菜單中加入電話圖標或電話號碼

顯示實體店座標

如果您有實體店,請在頁眉或菜單中包含商店定位器圖標

UX商店定位圖標的例子

一頁就顯示整個菜單

當使用動態菜單或擴展器設計時,要一頁就能夠顯示整個菜單。

顯示客戶服務

在菜單中顯示售後操作,例如客戶服務。

動態菜單設計

使用動態菜單設計時,以得到更好的視覺層次。

UX動態菜單設計的例子

UX浮動菜單設計

當用戶滾動時該菜單時,可以考慮一個浮動菜單設計。

UX導航設計

可以考慮自下而上的導航。

UX網頁設計的優化指南

主頁和著陸頁

  • 首頁上半部要有清楚的CTA(Call to action)
  • CTA要帶上說明資訊(例如:登入免運費)
  • 首頁上半部要有清楚的價值主張
  • 不要使用滿版插頁廣告
  • 移除自動輪播
  • 在首頁放上主類別
  • 使用清晰的字體大小
  • 使用第三方認證

選單和瀏覽建議

  • 使用置頂選單或浮動置頂選單
  • 如果人流(到店)很重要的話,要包含該店的定位器在Menu裡
  • 如果打電話的功能是很重要的話,每一頁的最上方放直接撥打的按鈕
  • 讓選單選上呈現在一個頁面(不要超過,一次就可以看完所有選項)
  • 對於主要產品類別,按流量排。如果使用子類別,按字母順序排
  • 把售後服務也放在選單裡(例如:查詢包裹地點、會員系統)

UX網頁設計的搜尋建議

  • 務必要放上搜尋欄
  • 務必讓搜尋欄清晰可見
  • 使用自動建議字
  • 使用自動矯正拼字(假使拼錯也能找出相關商品)
  • 永遠給出答案(找不到相關產品時建議他其他可能在尋找的商品)
  • 包含預先搜尋或熱門搜尋建議

分類頁/產品首頁

  • 確保你的【價值主張】(EX:優惠訊息)出現在每一個渠道,包含分類頁、產品頁
  • 允許使用者簡單排序或是過濾龐大產品數量
  • 加入重要元素(EX:產品剩幾件、優惠期限到幾號)
  • 在產品頁上方提供價格資訊
  • 增加次要CTA扭,像是願望清單、電子郵件或電話。讓消費者跨裝置能持續進行購物流程
  • 如果產品數量眾多,請添加評論

轉換

  • 加入購物車之後不要直接跳轉到結帳(可以給消費者選項,像是查看購物車或繼續購物)
  • 減少結帳跳出點
  • 如果轉化流程超過2個步驟,請使用進度條(或步驟123這種)
  • 在轉換點強調你的【價值主張】
  • 有描述性的CTA
  • 利用寄到email或是 儲存等一下再看 讓使用者在其他裝置持續體驗
  • 允許結帳時使用訪客登入
  • 加入【吸引消費者加入會員的好處】給他們

表格優化

  • 必填項目請用*標示
  • 使用框內認證(假如消費者亂填會自動出現錯誤請他重填)
  • 使用自動代入
  • 減少填寫欄位數量(移除選擇性填寫的欄位,使用全姓名欄位來取代姓、名分開的欄位,隱藏公司欄位並且住址預設兩行。預設帳單寄送地址)
  • 使用正確的鍵盤(EX:輸入電話號碼就出現數字鍵盤)
  • 當選項少於四個時,用按鈕選擇,不要用下拉選單
  • 在數字填入的部分使用steppers,sliders 或是開放式填空,而非一大排得下拉選單

網頁設計費用的成本

網頁設計這一行業,價錢真是海鮮價,就算是同一個服務項目,一樣的要求,一樣的設計,一樣的質素,不同公司報出來的價錢都非常不同,可以一個是天價,一個是貼地價,甚至是成本價,那麼消費者如何選擇?網頁設計費用的差異又在那裡?

毫無疑問,網頁設計的成本是低了,技術門檻也是低了,但網頁設計的要求是愈來愈高。現在是移動設備的天下,人人手上都是機不離手,那麼你的網頁設計必然是智能手機優先—Mobile First!所以今時今日,響應式設計(Responsive Website)是基本。

響應式設計

所以網頁設計公司之間的競爭非常激烈,不怕老實講,本公司收到的查詢最少有三分之一是行家打來的,只要了解你的網頁設計服務套餐,包括什麼網頁設計費用,網站域名註冊,網頁寄存,公司電郵服務,做過的網頁設計模板等等。我只能感到無奈,Come on James, 本公司的定位非常清晰,我們的市場競爭對手鎖定在一系列的網頁網店平台:Shopify、Wix、weebly、Shopline、Webflow等等。對手如此強大,幸好還有一個平台是朋友,可以助陣幫忙,就是WordPress

對於客人的查詢,一些客人非常強調要看做過的網頁設計做參考,這是一個實在又有趣的問題,老實對我們而言,你不如直接說要什麼樣的設計,需要什麼功能,最好就是直接提供一個你想要的網站參考,以了解你真的知道自己需要什麼,畢竟我們未做過的網頁主題,不代表我們做不到!當然最重要是客戶要知道自己的預算,畢竟是一分價錢一分貨,如果你的預算比較充裕,有資金去做大事,那麼當然為你度身訂做(Tailor-made),什麼功能都是為你度身訂做!

否則,預算不大的,一律建議使用WordPress網頁設計,為此本司創立webPanda網頁設計品牌,專註於WordPress網頁設計,為客戶提供一站式WordPress網頁設計服務,WordPress網頁設計費用非常合理,webPanda提供3大服務費用:基礎服務計劃、進階服務計劃、尊貴服務計劃。WordPress網頁費用,由$980!可以說價錢非常貼地,甚至是成本價,所有服務計劃都附送Atra Pro(價值$7,768)包括多達150個進階版網頁主題,所有Astra Pro 功能和Ultimate Addons for Elementor,而進階服務計劃起強送現時最受歡迎的網站頁面編輯器外掛:Elementor Pro!

也許有我們未做過的網頁主題,但沒有WordPress做不到的網頁主題!詳情了解WordPress網頁主題

說了這麼多,那麼一個網站的成本在哪?真正的網頁成本就是你設計和管理一個網站的時間成本,貴公司運行一個網站的資源成本。其它必要的成本就是註冊一個網站域名和網站寄存,以WordPress網頁為例,運行一個WordPress網站費用可以參考以下:

域名註冊 HK$100-HK$250
網頁寄存(每月) HK$70 - HK$936
WordPress主題 HK$0 - HK$500
WordPress插件 HK$0 - HK$7,800
SSL證書 HK$0 - HK$4290
設計和開發費用 ?
想了解更多運行和設計一個WordPress網站的成本,請瀏覽WordPress網頁費用一文。

UX網頁設計首頁應該這樣做

要解決的問題

在首頁的網頁設計上,必須先要回答自己一個關鍵問題,就是我的網站是否提供的資訊是否是用戶想要的?

Homepage best in class
進一步優化:菜單中的標籤圖標。
Homepage best in class WarbyParker

進一步優化:在菜單中標記圖標,不使用幻像按鈕。

清晰的CTA(Call to action)設計

引導用戶如何有效地與網站平台和產品服務的交互。

具有描述性的CTA設計

引導用戶如何有效地與網站平台和產品服務的交互。

引導性CTA設計的好處

研究顯示UX CTA 設計導致會員註冊人數增加了33%

Call to action

在首頁清晰地進行有價值的引導

不要使用整頁插頁式廣告

不要自動輪播,應由用戶主導選擇

研究顯示自動輪播橫幅廣告沒有效益

主頁上的圖像自動輪播可以被視為橫幅廣告,不應該自動輪播,而應該由用戶主導播放與否。

Research shows that carousels rarely work
相關研究:

在首頁上顯示熱門產品類別

社交媒體等的認證

顯示合併菜單

面積佔頁面不多於5分1

顯示電話圖標和號碼

如果電話聯絡很重要,請在菜單中加入電話圖標或電話號碼

顯示實體店座標

如果您有實體店,請在頁眉或菜單中包含商店定位器圖標

UX商店定位圖標的例子

一頁就顯示整個菜單

當使用動態菜單或擴展器設計時,要一頁就能夠顯示整個菜單。

顯示客戶服務

在菜單中顯示售後操作,例如客戶服務。

動態菜單設計

使用動態菜單設計時,以得到更好的視覺層次。

UX動態菜單設計的例子

UX浮動菜單設計

當用戶滾動時該菜單時,可以考慮一個浮動菜單設計。

Python對SEO的7個建議

SEO(Search Engine Optimization):中譯為搜索引擎優化。是一種方式:利用搜索引擎的規則提高網站在有關搜索引擎內的自然排名。

目的:為網站提供生態式的自我營銷解決方案,讓其在行業內佔據領先地位,獲得品牌收益;SEO包含站外SEO站內SEO兩方面;為了從搜索引擎中獲得更多的免費流量,從網站結構、內容建設方案、用戶互動傳播、頁面等角度進行合理規劃,還會使搜索引擎中顯示的網站相關信息對用戶來說更具有吸引力。

優化策略

1、主題要明確,內容要豐富

在設計製作網站之前,要清晰設定網絡的主題、用途和內容。根據不同的用途來定位網站特性,可以是銷售平台也可以是宣傳網站,網站主題須明確突出,內容豐富飽滿,以符合用戶體驗為原則。

對於一個網站來說,優化網站的主題與實際內容才是最為重要的。一個網站需要有鮮明的主題,豐富的與主題相關的內容,專注於某些領域的變化的,及時更新。

2、引出鏈接要人氣化

搜索引擎判斷網站的好壞的一個標準是外部鏈接的多少以及所鏈接的網站質量。創建有人氣化的、有意義的引出鏈接,提高鏈接廣泛度,既能提高在搜索引擎的排名,同時也可以起到互相宣傳的作用。

研究表明:當一個網站的鏈接PR值達到4-6,那麼這個網頁的訪問量比較好;當鏈接PR值達到7以上,那麼網站的質量與知名度都很優秀了。如果一個網頁被其他網頁鏈接得越多,那麼該網頁越有可能有最新和最有價值的高質量網頁。

盡可能增加與行業網站、地區商務平台和合作夥伴網站之間的鏈接,被PR高的網站引用能更快地提高本站的PR,同時開發人員可以在訪問量較大、PR值較高網站上發表與網站主題以及業務相關的信息,用戶在別的網站看到這些信息,進而訪問該網站,即通過外部鏈接來提高該網站的訪問量。

3、關鍵詞設定要突出

網站的關鍵詞非常重要,它決定網站是否能被用戶搜索到,因此在關鍵詞的選擇上要特意注意。

關鍵詞的選擇必須突出,遵循一定的原則,如:關鍵詞要與網站主題相關,不要一味的追求熱門詞彙;避免使用含義很廣的一般性詞彙;根據產品的種類及特性,盡可能選取具體的詞;選取人們在使用搜索引擎時常用到與網站所需推廣的產品及服務相關的詞。

5至10個關鍵詞數量是比較適中的,密度可為2%—8%。要重視在標題(Page Title)、段落標題(Heading)這兩個網頁中最重要最顯眼的位置體現關鍵詞,還須在網頁內容、圖片的alt屬性、META標籤等網頁描述上均可不同的程度設置突出關鍵詞。

4、網站架構層次要清晰

網站結構上盡量避免採用框架結構,導航條盡量不使用FLASH按鈕。首先要重視網站首頁的設計,因為網站的首頁被搜索引擎檢測到的概率要比其他網頁大得多。

通常要將網站的首頁文件放在網站的根目錄下,因為根目錄下的檢索速度最快。其次要注意網站的層次(即子目錄)不宜太多,一級目錄不超過兩個層次,詳細目錄也不要超過四個層次。最後,網站的導航盡量使用純文字進行導航,因為文本要比圖片表達的信息更多。

5、頁面容量要合理化

網頁分為靜態網頁與動態網頁兩種,動態網頁即具有交互功能的網頁,也就是通過數據庫搜索返回數據,這樣搜索引擎在搜索時所費的時間較長,而且一旦數據庫中的內容更新,搜索引擎抓取的數據也不再準確,所以搜索引擎很少收錄動態網頁,排名結果也不好。

而靜態網頁不具備交互功能,即單純的信息介紹,搜索引擎搜索時所費時間短,而且準確,所以願意收錄,排名結果比較好。所以網站要盡量使用靜態網頁,減少使用動態網頁。

網頁容量越小顯示速度越快,對搜索引擎蜘蛛程序的友好度越高,因而在製作網頁的時候要盡量精簡HTML代碼,通常網頁容量不超過15kB。網頁中的Java.script和CSS盡可能和網頁分離。應該鼓勵遵循W3C的規範使用,更規範的XHTML和XML作為顯示格式。

6、網站導航要清晰化

搜素引擎是通過專有的蜘蛛程序來查找出每一個網頁上的HTML代碼,當網頁上有鏈接時就逐個搜索,直到沒有指向任何頁面的鏈接。蜘蛛程序需要訪問完所有的頁面需要花費很長的時間,所以網站的導航需要便於蜘蛛程序進行索引收錄。

可根據自己的網站結構,製作網站地圖,在網頁地圖中列出網站所有子欄目的鏈接,並將網站中所有的文件放在網站的根目錄下。網站地圖可增加搜索引擎友好度,可讓蜘蛛程序快速訪問整個站點上的所有網頁和欄目。

7、網站發布要更新

為了更好的實現與搜索引擎對話,將經過優化的企業網站主動提交到各搜索引擎,讓其免費收錄,爭取較好的自然排名。一個網站如果能夠進行有規律的更新,那麼搜索引擎更容易收錄。因而合理的更新網站也是搜索引擎優化的一個重要方法。

語音用戶界面設計 VUI

什麼是語音用戶界面(VUI)

語音用戶界面(VUI)使用語音識別來理解語音命令和回答問題,並且通常使用文本到語音來播放答复,從而使人的自然語言與電腦的交互成為可能。現在VUI變得越來越普遍,人們正在利用這些免提,免提界面在許多情況下提供的價值。

設計一個好的VUI需要電腦科學,語言學和人為因素心理學的跨學科人才—所有這些大數據都是昂貴且難以獲得的技能。即使使用高級開發工具,構建有效的VUI也需要對要執行的任務以及將使用最終系統的目標受眾有深入的了解。 VUI與用戶的任務心理模型越接近,則幾乎不需要培訓就可以使用它,從而帶來更高的效率和更高的用戶滿意度。

VUI 的特色

VUI是任何語音應用程序的接口,通過簡單的自然語音交談來控制機器語音的人工智能,總體而言是因為從文本到語音,語音到文本的處理和雲服務之類的技術進步推動了此類接口的大規模採用。

VUI需要可靠地響應人的自然語言輸入,否則它們將被用戶拒絕並失去價值。所以專為普通大眾設計的VUI應該強調易用性,並為首次呼叫者提供大量幫助和指導。

而為一小部分高級用戶(包括現場服務人員)設計的VUI應該更多地關註生產力,而不是幫助和指導。這樣的應用程序應該簡化呼叫流程,最大程度地減少提示,消除不必要的迭代,並允許精心製作的“混合主動對話”,使呼叫者可以一次發聲,以任何順序或組合輸入幾條信息。簡而言之,語音應用程序必須針對自動化的特定業務流程精心設計。

具有完整語音用戶界面的按鍵,可以使呼叫者無需按下任何按鈕即可自動化說出請求和響應,無論口音或方言的影響如何,它們都可以響應多種聲音,和響應幾個命令, 即時對自然語音信息並提供適當的反饋,從而準確地模仿自然對話。

但並非所有的業務流程都能很好地實現語音自動化。一般而言,查詢和交易越複雜,它們進行自動化的挑戰就越大,在某些情況下,自動化根本不適用,因此,實時業務代表協助是唯一的選擇。例如,法律諮詢熱線將很難實現自動化。另一方面,語音是處理快速常規交易的理想選擇,例如更改工作訂單的狀態,完成時間或費用輸入或在帳戶之間轉移資金。

VUI 的應用

語音用戶界面已添加到汽車,家庭自動化系統,電腦操作系統,洗衣機和微波爐等家用電器以及電視遙控器中,它是與智能手機和智能揚聲器上的虛擬助手進行交互的主要方式。

VUI的歷史

VUI的早期應用包括直接或通過(通常是藍牙)耳機或車輛音頻系統進行語音激活的電話撥號。

2007年,美國有線電視新聞網(CNN)的商業文章報導說,語音命令已經超過10億美元,並且Google和Apple這樣的公司都在嘗試創建語音識別功能。自從這篇文章發表以來已經有好幾年了,從那時起,全世界見證了各種語音命令設備。此外,谷歌創建了一個名為Pico TTS的語音識別引擎,蘋果公司也發布了Siri。

語音指令軟件產品 Apple Mac和Windows PC均為其最新的操作系統提供內置的語音識別功能。

微軟Windows兩種Microsoft操作系統Windows 7和Windows Vista提供語音識別功能。微軟集成語音

VUI的未來

語音命令設備變得越來越廣泛,並且始終在創造使用人類語音的創新方法,而語音用戶界面設計(VUI)將是現在和未來最重要用戶界面設計!將在大數據和5G中發揮潛力,主導人和人工智能(AI)的交互 。

UI&UX設計是什麼

什麼是UI? 什麼是UX? 簡而言之...

蘋果公司創始人,NeXT軟體公司創辦人喬布斯(Steven Jobs) 以下的一句話就言簡意賅概括了:UI 就是How it looks;UX 就是How it works.

Steve Jobs

什麼是UI? 什麼是UX? 詳細述之...

在那個印刷的時代,紙媒主導的年代,設計師就泛指是平面設計師(Graphic Designer);後來網絡網路的出現,網頁的誕生,網頁設計師(Web Designer)應時成為灸手可熱的設計新寵兒;現在因為智能電話的誕生,APP亦橫空出世,平面設計師和網頁設計師一個華麗轉身,登上設計的數碼列車,紛紛轉職為令人趨之若騖的UI設計師和UX設計師,仿佛一夜之間,設計師都進行了大數據的軟件升級,不是成為UI設計師,就成了UX設計師。
 

UI(User Interface)是指用戶介面設計,主要專業是設計頁面上的功能、顧及使用的便利性與整個設計的美學,將公司的視覺識別系統VI(Visual Identity)通過網站,APP的介面,美觀性地,一致性地串連在一起,使用戶一眼就識別出公司的品牌,UI就是眼見即所得,非常直接,用戶體驗非常直觀。

UX(User Experience)是指用戶體驗,根據用戶的習慣,安排整個網站頁面的內容規劃,像是哪些區塊的內容要先在網站上出現,行動呼籲按鈕(Call to Action, CTA)的位置應該擺在哪裡,策略性引導用戶如何有效使用產品,以達致產品服務為用戶所接受,並產生使用慣性和黏力,進而影響其生活消費選擇。

UI設計師做什麼?

UX設計師做什麼?

什麼是UI

什麼是UX

Scroll to Top