網站首頁設計,10個步驟教你設計賺錢首頁！ -日日升 - DAYUP

網站首頁設計,教學如下 · 第一點：掌握Kiss準則 · 第二點：選擇目標客戶會產生共鳴的素材 · 第三點：圖片優於文字 · 第四點：強調特色不超過三點 · 第五點： ... 網站首頁設計,10個步驟教你設計賺錢首頁！ Home 網站設計知識 網站首頁設計,10個步驟教你設計賺錢首頁！ BY吳開/行銷總監 2018/09/5 網站首頁的重要性 網站首頁設計,是設計網站非常重要的一個環節，企業花了大筆的廣告費將客戶導入到網站首頁，但卻因為設計不良，消費者無法產生共鳴，造成極高的跳出率，這樣在電商是無法成功的！而網站首頁也要隨著時代而做改變，早期的網頁多會使用Flash或是大量的動畫呈現品牌風格，不過隨著時代變化，現在這種設計方式已經不吃香了，在現代人手一機的情況，客戶是沒有時間等待一個動畫跑完的，再者也有越來越多的瀏覽介面不支援Flash動畫，也讓這種設計方式逐漸被取代。

現代的網站，強調的是精準、快速，如果能融入日本思維“永遠為客戶多想一點”，會讓客戶更有被理解的感覺，進而增加品牌好感，讓客戶對品牌擁有忠誠感（這也是台灣目前所欠缺的能力，要培養的不是只有短期效益，而是要建立精緻的品牌，獲得長遠的成功！），在我學習日本網站設計多年的經歷下，有哪些細節需要注意？哪些關鍵將大幅提升網站成交率？以下我將為你一一介紹： 網站首頁設計,教學如下 首頁是客戶的登入網站的第一步，最主要的功能是類似書本的大綱作用，如何在這一頁中引起客戶的興趣，並且流暢的引導到不同的頁面做詳細介紹，是在電商戰略中能否成功的重要關鍵！ 第一點：掌握Kiss準則Kiss原則，又稱為Keepitsimplestupid！是由Virgin集團的英國總裁-理查布蘭森提出的，簡單的東西複雜化很容易，但是複雜的東西簡單化，就要考驗你的營銷實力，人們都是喜歡看簡單的東西，所以請將你的首頁內容縮減、易懂！不然太過複雜，客戶都還沒有提起興趣，就會立刻跳出去！網站這部分還沒進入到產品詳細說明，重點是在提起客戶的興趣，因此應該盡量把素材和內容弄的淺顯易懂，不要有過多需要深度理解的字句，非必要的JavaScript特效或程式也應該拿除，圖示要盡量朝向扁平化設計，也不要有太複雜的圖示，才能有效傳達品牌的感覺，讓客戶提起興趣或好奇心，才會想依照你設計的流程，把網站看完，並購買。

日本高單價蛋塔KBBake網站首頁，就用非常精簡的圖示，並搭配恰到好處的簡單文字，傳達烘培、新鮮的堅持與美好，讓人想馬上咬一口，並對品牌留下深刻印象日本啤酒商網站首頁，則將啤酒的味道簡化為三種口味代表，會讓客戶提起好奇心，想進一步深入瞭解那是什麼味道或是如何製造的？大幅提升了客戶的興趣，進而點進去了解產品詳細資訊，越有興趣了解產品細節，就越容易達成購買！ 第二點：選擇目標客戶會產生共鳴的素材在行銷學中，要能夠有效達成行銷目的，首先你必須先精準定義你的客戶Persona是什麼樣子，並揣摩他們希望看到什麼樣的資訊，想解決什麼樣的問題，另外我們要行銷日本和台灣，所以你的素材要選亞洲人，會比歐美人士的照片，更讓人產生共鳴感，增加銷售機會！舉例來說，ANA航空公司為了要提高搭乘他們飛機去日本的客戶，特別做出了一個IsJapanCool?的網站，吸引各國客戶前往日本旅遊，其首頁分門別類了各種在日本才有的精緻主題，讓人感覺日本的旅遊真的是多采多姿，很想立刻飛過去一探究竟，ANA雖然是航空公司，不過他清楚知道如果能創造客戶想要去日本的心態，並從最源頭的旅程介紹開始，就很有可能獲得客戶選擇搭乘他們班機的機會，真是內容行銷的高招！可以點右上角的MATSURI日文叫做祭り也就是祭典的意思（頁面連結），會看到各種日本充滿神秘色彩的傳統祭典活動介紹，讓人看完真的好想趕快坐他們的飛機、參加他們的旅遊行程，跑去日本朝聖呀！ 第三點：圖片優於文字根據研究，90%傳遞至大腦的信息，是視覺性質，也只有圖片才能夠讓大腦留下深刻的印象，網站首頁所要達成的目的，就是要讓客戶產生深刻印象，就算沒有完整看完網站，也會因為你的首頁佈置夠有味道而留下記憶，未來在生活中，碰到相類似的事件時，會第一個想到你的產品或服務，那麼成交的機率就會倍增了！日本Toyota就很好的在首頁運用了這個技巧：由於Toyota的汽車組裝師越來越難應徵，因此他們在招募高中畢業的新員工時，就用網站跳脫了傳統的招募方式，不再只用一堆字說服你組裝工作不難、這工作一點也不枯燥…等，而是用視覺化的圖像，讓人翻轉汽車組裝師的印象，看過他們網站的日本高中生，在應徵工作時，就會第一個想到Toyota的汽車裝修工作，大幅增加了求職意願。

他們還使用圖像化的縮圖，介紹工作內容，讓人覺得修理工作不會太過枯燥乏味、反而覺得有點酷 第四點：強調特色不超過三點在首頁設計時，最怕遇到廠商把10幾項優點全部寫上去，然後客戶看完後，沒有一個能記住，反而把你遺忘，太多的特色會讓你變得沒特色，你應該聚焦在產品3個內的最佳特色，才能徹底打動消費者購買或試用的心態，從競爭對手中脫穎而出。

下列案列是本汽車商Daihatsu，設計充滿巧思的首頁：由於日本地狹人稠，停車地方都不大，因此日本的汽車都非常短，坐起來就沒哪麼舒適，因此Daihatsu公司就打造了一款，往上加高的車款，讓人坐起來更舒服，他不再強調售價、馬力、性能，而是用很誇張的方式＊把業務員拉高），全站只主打他很高、超級高、非常高，坐起來會超級舒適，讓客戶產生非常深刻的印象，在想買高＋舒適的小車，就會立刻想到他們，非常絕的行銷案列：他們還在網站背景埋入影片，強調很高的誇張感覺，讓你以後看到類似的車款，就會想到他們的業務員被拉高的樣子，進而產生興趣購買。

第五點：網站主色要同調根據心理學角度：品牌的色系如能統一，會讓企業更有質感，並讓人感到放心，網站設計要能夠成功銷售，很大的重點是要讓客戶聚焦，如果有一大堆各種色系的出現，會讓你的資訊變得太混雜，客戶會不知道要看哪裡，容易降低了解你產品的興趣，好的網站設計就是要在關鍵時刻配出高反差的顏色，讓客戶有效點擊該連結，產生購買意願！（可參考文章UIUX設計有什麼差異?)這間日本咖啡廳就將主要顏色設定為墨綠金，而不是用各種彩色的搭配，讓人感覺更有統一感，人們喜歡一制性或是對稱的東西，如果色彩太過在雜亂，會讓客戶想趕快離開這個網站 第六點：用大標題吸引目光大標題的設計，能夠提起客戶的好奇心，或是能夠為圖片展現出絕佳的加成效果，建議可以放入客戶碰到的痛點問題，或是一些誇張的字句，可以大大提升客戶的好奇心，看要怎麼解決該痛點的問題，進而點擊連結查看詳情。

《我們為何如此好奇》(Why?WhatMakesUsCurious)一書的作者馬里奧·利維奧(MarioLivio)就曾提到：好奇心分為兩種，一種是知覺型好奇，一種是知識型好奇；就知識型好奇而言，大人跟孩子是一樣的。

這一切可能都是為了生存。

我們需要非常瞭解我們周圍的環境才能生存，所以是進化的壓力（evolutionarypressure）讓我們產生好奇心。

祥可見連結。

日本大阪經濟法科大學，就用為什麼要學經營學為大標題，讓看到的學生會去想對呀，我為什麼要學經營學？下方又提出了智慧手機、百元咖啡、品牌口紅要如何經營、銷售呢？等生活問題，讓學生會想進一步瞭解這些生活常常碰到的問題（心想我如果不了解，就會落後別人，沒法進步，被社會淘汰…等OS）進而想點進去好好瞭解（如果下方沒有提供解答，學生一定會像身體養一樣，不去騷一騷是不會罷手的！）提對痛點問題，會讓你下個頁面的點擊率大增！另外如果你想讓圖片更有張力，也可以填入誇張的大標題，讓效果放大，下面賣乾麵的日本廠商babystar就很好的應用這項技巧，加入YAbaby~!並搭配搞笑藝人的動作，以及紅黃高警示色系的搭配，讓整張畫面充滿張力，瞬間提高了客戶的興趣（心想你在說啥Baby?）想把文章看完。

（對於網站顏色配色技巧，可以參考文章：網站色彩心理學） 第七點：有大量的笑臉照片＊根據《皇家學會開放科學》期刊上的研究，山羊能夠分辨人臉的情緒，研究人員在山羊前貼上不笑與笑臉的照片，並一次放出一隻山羊，看看牠們有什麼反應。

他們發現這些山羊會筆直地朝微笑人臉照片走去，並且還在微笑人臉照片前停留，有的山羊還會用鼻子來磨蹭、嗅聞照片。

詳細文章可參考連結。

人類也是一樣，對有笑臉的網站會本能地產生喜歡感，在逛網站時看到笑臉，能讓人感到放鬆、親近，也會產生安全、信賴的感覺，讓人在本能上沒有防備心的產生購買。

下面是由日本牙刷公司做的網站，就加入了許多愛笑的Model與醫生，讓整個首頁一進來時，就讓客人完全放鬆，大幅增加點擊商品詳情的意願！（建議也可放上一些創辦人或團隊微笑的照片，也會為首頁產生出充滿人氣的熱鬧效果） 第八點：放入行動呼籲按鈕CTA首頁一定要帶入行動呼籲按鈕，也就是CTA(Calltoaction)，不能讓客戶看完首頁後不知道下步要幹嘛，沒有加入CTA會讓客戶想跳出去，你該引導客戶繼續看下去你網站的精彩內容，CTA可以是了解產品詳情、立即訂閱、問題解答..等，按鈕的內容請盡量簡單易懂，不要讓客戶想太久就衝動按下去！不過這邊不建議在首頁時就加入立即購買的按鈕，客戶都還不了解你，就要別人購買，相信一般人都會覺得不舒服，應該是在理解完你是誰，你的產品有什麼特色，我是否有需要…等，客人腦中小劇場的問題都差不多得到解答後才會想購買。

（購買按鈕請留到產品詳細介紹頁面中，才能提高購買率）日本HagenDazs冰淇淋公司首頁，就很聰明的設計他們有很多樣的好吃冰淇淋，每個冰淇淋的人氣有多高，讓你想點中間的Enter按鈕，來趟好吃冰淇淋尋寶之旅，是個非常強的行銷規劃！每個點進去的客人在看過首頁後，一定會想深度發掘還有哪個好吃口味的冰淇淋！？提升品牌好感與記憶性！有興趣可以去玩玩看（頁面連結） 第九點：加入案列分享在電商能否成交的重點，就是信賴感，如果能在首頁就告訴客戶你服務過哪些人，他們對你的評價如何…等，對於整個網站會有非超高度的加分效果，比如說你服務過麥當勞、蘋果或是政府部門，就會瞬間增加可信度，客戶甚至不用看後面的介紹，可能就會直接想找你服務了！美國電商銷售第一的Casper床墊，就會在首頁放上有哪些名人用過他們的產品，並在Twitter討論，大大增加了客戶的信心，想趕快向她們一樣。

第十點：構思邏輯動線最後，當你都瞭解了上述內容，準備大展身手時，你必須要構思好首頁的動線是否順暢，在首頁的哪個步驟，讓客戶點連結看品牌故事？什麼時候點連結到頁面查看產品細節？都是你必須事先想好大綱，並規劃好的。

下圖為客戶到達官網首頁後，前往下個頁面的流程圖，你就像導覽員一樣，規劃好步驟，一步步引導你的客戶逐步了解品牌，並確保在相應的每個頁面，都能逐步提高客戶的興趣，減少調出率，最終走向最右邊的購買寶座，你就會成功了！ 以上就是設計賺錢首頁的方法！如果你想找日日升，幫忙打造高成交率的網站，歡迎查看我們的服務。

延伸閱讀：UIUX設計有什麼差異?4個專業手法，教你打造高成交網站！網站設計配色,用3種色彩心理學影響客戶決定！網站SEO優化,讓Google官方教你怎麼做！  本文採用 創用CC姓名標示-非商業性-禁止改作4.0國際授權條款授權. 分享在facebook 分享給好友 開啟品牌設計專案的第一步START→ 日式開發型官網 客戶見證 機車店-官網上線業績提升40% 美髮店-官網讓每季營業額破紀錄 傳產-新官網上線業績翻1倍 燈光音響-用官網獲得跨縣市生意 ►追蹤開開先生粉專 你好，我叫做吳開近期正在經營開開先生的粉專，分享我在日本跨境、電商知識、企業家經營、美好家庭的生活，希望也能對你的人生多了些收穫。

DESIGNPROCESS 日日升擅長以官網、廣告、社群的搭配為客戶創造一次又一次的品牌價值 STEP0 行前開會 日日升團隊將優先進行電商策略討論，我們會前往企業討論所需具備的元素，並給予客戶最大的協助。

歡迎來信申請，獲得品牌快速成長的機會。

STEP0 STEP1 訂製品牌官網 官網就像是樹根，是一切品牌電商佈局的源頭，讓後續流量能夠為品牌扎實帶來增幅度的重要關鍵步驟。

了解更多→  STEP1 STEP2 社群、媒體廣告曝光 日日升團隊擁有專業投手、社群顧問，將協助業主分配最有效行銷預算分配，讓好設計大量曝光給目標受眾，品牌和受眾能以做最有效率的方式接觸互動。

了解更多→  STEP2 STEP3 日式品牌加速網路購物流程 在日式的質感品牌下，讓你在眾多競爭者中脫穎而出，為品牌留下關鍵的被選擇機會，並在數位行銷後期持續發酵～！ STEP3 OTHERPOSTS 網路行銷,有了FB和IG，我還需要網站嗎？5個問答幫你解惑 網路行銷,現代的電商行銷已經有太多選擇，在我們經歷 ReadMore» FB廣告投放,一個月內投放100種廣告心得 FB廣告投放,在現代要使用對的工具外，你還需要精準 ReadMore» Facebook社團經營,7個關鍵重點報你知 Facebook社團經營,你是否有感覺，現在做臉書 ReadMore» Facebook頭號粉絲?三步驟教你如何獲得頭號粉絲頭銜！ Facebook頭號粉絲,我最近在逛臉書，看到了這個新東西，你是否也發現了照片下面的留言… ReadMore» 企業接班,我背水一戰的覺悟與成績：不再甘於代工，轉型品牌、進軍日本！（下） 企業接班,你的時代即將來臨！企業接班,在以下的「 ReadMore» 二代接班,我背水一戰的覺悟與成績：不再甘於代工，轉型品牌、進軍日本！（上） 二代接班,你有多勇敢做創新？二代接班,很多人都說 ReadMore» «上一頁 下一頁» 站在風口前，連匠人都會飛日日升將幫助台灣廠商，以日式電商手法操作品牌，『在實戰的過程中，提升品牌的知名度與影響力』，並以最新的電商工具佈局，向全球訴說Taiwan的經典故事！ 關於日日升 執行團隊 網站設計 跨境服務 BLOG文章分類 最新小文 網站設計知識 電商行銷策略 日本市場分析 其他說說 聯絡我們 Mail : [email protected]台北：台北市大安區信義路四段170號3樓Tel  :02-77519100台南 :台南市東區崇學路165號7FTel  :06-5121608東京：東京都北区中里2-11-10Mon-Fri:9:00～18:00 Facebook Instagram Envelope Copyright©DayUp2018