')}.navbar-light .navbar-text{color:rgba(0,0,0,.5)}.navbar-light .navbar-text a,.navbar-light .navbar-text a:focus,.navbar-light .navbar-text a:hover{color:rgba(0,0,0,.9)}.navbar-dark .navbar-brand,.navbar-dark .navbar-brand:focus,.navbar-dark .navbar-brand:hover{color:#fff}.navbar-dark .navbar-nav .nav-link{color:hsla(0,0%,100%,.5)}.navbar-dark .navbar-nav .nav-link:focus,.navbar-dark .navbar-nav .nav-link:hover{color:hsla(0,0%,100%,.75)}.navbar-dark .navbar-nav .nav-link.disabled{color:hsla(0,0%,100%,.25)}.navbar-dark .navbar-nav .active>.nav-link,.navbar-dark .navbar-nav .nav-link.active,.navbar-dark .navbar-nav .nav-link.show,.navbar-dark .navbar-nav .show>.nav-link{color:#fff}.navbar-dark .navbar-toggler{color:hsla(0,0%,100%,.5);border-color:hsla(0,0%,100%,.1)}.navbar-dark .navbar-toggler-icon{background-image:url('data:image/svg+xml;charset=utf-8, ')}.navbar-dark .navbar-text{color:hsla(0,0%,100%,.5)}.navbar-dark .navbar-text a,.navbar-dark .navbar-text a:focus,.navbar-dark .navbar-text a:hover{color:#fff}.card{position:relative;display:flex;flex-direction:column;min-width:0;word-wrap:break-word;background-color:#fff;background-clip:border-box;border:1px solid rgba(0,0,0,.125);border-radius:.25rem}.card>hr{margin-right:0;margin-left:0}.card>.list-group{border-top:inherit;border-bottom:inherit}.card>.list-group:first-child{border-top-width:0;border-top-left-radius:calc(.25rem - 1px);border-top-right-radius:calc(.25rem - 1px)}.card>.list-group:last-child{border-bottom-width:0;border-bottom-right-radius:calc(.25rem - 1px);border-bottom-left-radius:calc(.25rem - 1px)}.card>.card-header+.list-group,.card>.list-group+.card-footer{border-top:0}.card-body{flex:1 1 auto;min-height:1px;padding:1.25rem}.card-title{margin-bottom:.75rem}.card-subtitle{margin-top:-.375rem}.card-subtitle,.card-text:last-child{margin-bottom:0}.card-link:hover{text-decoration:none}.card-link+.card-link{margin-left:1.25rem}.card-header{padding:.75rem 1.25rem;margin-bottom:0;background-color:rgba(0,0,0,.03);border-bottom:1px solid rgba(0,0,0,.125)}.card-header:first-child{border-radius:calc(.25rem - 1px) calc(.25rem - 1px) 0 0}.card-footer{padding:.75rem 1.25rem;background-color:rgba(0,0,0,.03);border-top:1px solid rgba(0,0,0,.125)}.card-footer:last-child{border-radius:0 0 calc(.25rem - 1px) calc(.25rem - 1px)}.card-header-tabs{margin-bottom:-.75rem;border-bottom:0}.card-header-pills,.card-header-tabs{margin-right:-.625rem;margin-left:-.625rem}.card-img-overlay{position:absolute;top:0;right:0;bottom:0;left:0;padding:1.25rem;border-radius:calc(.25rem - 1px)}.card-img,.card-img-bottom,.card-img-top{flex-shrink:0;width:100%}.card-img,.card-img-top{border-top-left-radius:calc(.25rem - 1px);border-top-right-radius:calc(.25rem - 1px)}.card-img,.card-img-bottom{border-bottom-right-radius:calc(.25rem - 1px);border-bottom-left-radius:calc(.25rem - 1px)}.card-deck .card{margin-bottom:15px}@media (min-width:576px){.card-deck{display:flex;flex-flow:row wrap;margin-right:-15px;margin-left:-15px}.card-deck .card{flex:1 0;margin-right:15px;margin-bottom:0;margin-left:15px}}.card-group>.card{margin-bottom:15px}@media (min-width:576px){.card-group{display:flex;flex-flow:row wrap}.card-group>.card{flex:1 0;margin-bottom:0}.card-group>.card+.card{margin-left:0;border-left:0}.card-group>.card:not(:last-child){border-top-right-radius:0;border-bottom-right-radius:0}.card-group>.card:not(:last-child) .card-header,.card-group>.card:not(:last-child) .card-img-top{border-top-right-radius:0}.card-group>.card:not(:last-child) .card-footer,.card-group>.card:not(:last-child) .card-img-bottom{border-bottom-right-radius:0}.card-group>.card:not(:first-child){border-top-left-radius:0;border-bottom-left-radius:0}.card-group>.card:not(:first-child) .card-header,.card-group>.card:not(:first-child) .card-img-top{border-top-left-radius:0}.card-group>.card:not(:first-child) .card-footer,.card-group>.card:not(:first-child) .card-img-bottom{border-bottom-left-radius:0}}.card-columns .card{margin-bottom:.75rem}@media (min-width:576px){.card-columns{-webkit-column-count:3;column-count:3;-webkit-column-gap:1.25rem;column-gap:1.25rem;orphans:1;widows:1}.card-columns .card{display:inline-block;width:100%}}.breadcrumb{display:flex;flex-wrap:wrap;padding:.75rem 1rem;margin-bottom:1rem;list-style:none;background-color:#e9ecef;border-radius:.25rem}.breadcrumb-item+.breadcrumb-item{padding-left:.5rem}.breadcrumb-item+.breadcrumb-item:before{float:left;padding-right:.5rem;color:#6c757d;content:"/"}.breadcrumb-item+.breadcrumb-item:hover:before{text-decoration:underline;text-decoration:none}.breadcrumb-item.active{color:#6c757d}.pagination{display:flex;padding-left:0;list-style:none;border-radius:.25rem}.page-link{position:relative;display:block;padding:.5rem .75rem;margin-left:-1px;line-height:1.25;color:#007bff;background-color:#fff;border:1px solid #dee2e6}.page-link:hover{z-index:2;color:#0056b3;text-decoration:none;background-color:#e9ecef;border-color:#dee2e6}.page-link:focus{z-index:3;outline:0;box-shadow:0 0 0 .2rem rgba(0,123,255,.25)}.page-item:first-child .page-link{margin-left:0;border-top-left-radius:.25rem;border-bottom-left-radius:.25rem}.page-item:last-child .page-link{border-top-right-radius:.25rem;border-bottom-right-radius:.25rem}.page-item.active .page-link{z-index:3;color:#fff;background-color:#007bff;border-color:#007bff}.page-item.disabled .page-link{color:#6c757d;pointer-events:none;cursor:auto;background-color:#fff;border-color:#dee2e6}.pagination-lg .page-link{padding:.75rem 1.5rem;font-size:1.25rem;line-height:1.5}.pagination-lg .page-item:first-child .page-link{border-top-left-radius:.3rem;border-bottom-left-radius:.3rem}.pagination-lg .page-item:last-child .page-link{border-top-right-radius:.3rem;border-bottom-right-radius:.3rem}.pagination-sm .page-link{padding:.25rem .5rem;font-size:.875rem;line-height:1.5}.pagination-sm .page-item:first-child .page-link{border-top-left-radius:.2rem;border-bottom-left-radius:.2rem}.pagination-sm .page-item:last-child .page-link{border-top-right-radius:.2rem;border-bottom-right-radius:.2rem}.badge{display:inline-block;padding:.25em .4em;font-size:75%;font-weight:700;line-height:1;text-align:center;white-space:nowrap;vertical-align:baseline;border-radius:.25rem;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out}@media (prefers-reduced-motion:reduce){.badge{transition:none}}a.badge:focus,a.badge:hover{text-decoration:none}.badge:empty{display:none}.btn .badge{position:relative;top:-1px}.badge-pill{padding-right:.6em;padding-left:.6em;border-radius:10rem}.badge-secondary{color:#fff;background-color:#6c757d}a.badge-secondary:focus,a.badge-secondary:hover{color:#fff;background-color:#545b62}a.badge-secondary.focus,a.badge-secondary:focus{outline:0;box-shadow:0 0 0 .2rem rgba(108,117,125,.5)}.badge-danger{color:#fff;background-color:#dc3545}a.badge-danger:focus,a.badge-danger:hover{color:#fff;background-color:#bd2130}a.badge-danger.focus,a.badge-danger:focus{outline:0;box-shadow:0 0 0 .2rem rgba(220,53,69,.5)}.App{display:flex;flex-direction:column}.App>.pageContent{flex:1 1;overflow:auto;padding-top:10px}.navbar-nav{flex-direction:row}.navbar-nav>*{padding-left:10px}.container{width:100%;max-width:1170px;padding-left:15px;padding-right:15px}@media only screen and (min-width:768px){.container{display:flex;flex-wrap:wrap;padding-left:30px;padding-right:30px}.container.dir-column{flex-direction:column}}.eu-cookie-notification-dialog{position:fixed;left:20px;bottom:-300px;padding:15px;width:310px;z-index:10000;font-size:12px;border-radius:4px;box-sizing:border-box;color:#555;background-color:#f4f6f8}.eu-cookie-notification-dialog .notification-title{font-size:14px;font-weight:700}.eu-cookie-notification-dialog .notification-content{padding:12px 0;line-height:1.4;display:inline-block}.eu-cookie-notification-dialog .link-text{margin:0 5px;color:#555;text-decoration:underline}.eu-cookie-notification-dialog .link-text:hover{color:#555}.eu-cookie-notification-dialog .notification-footer{display:flex;align-items:center}.eu-cookie-notification-dialog .common-button{cursor:pointer;color:#fff;font-size:12px;font-weight:700;padding:6px 10px;margin-right:10px;border-radius:4px;text-align:center;letter-spacing:normal;background-color:#4b5056}.eu-cookie-notification-dialog .setting-btn{color:#4b5056;background-color:#fff;border:1px solid #4b5056}.eu-cookie-notification-dialog .cancel-link{cursor:pointer}.eu-cookie-setting-dialog{width:100%;position:fixed;top:50%;left:50%;display:none;padding:20px;z-index:10000;max-width:500px;border-radius:5px;box-sizing:border-box;color:#555;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);background-color:#f4f6f8;-webkit-animation:slide_in_animation .3s ease-in-out;animation:slide_in_animation .3s ease-in-out}.eu-cookie-setting-dialog .setting-title{font-size:14px;font-weight:700}.eu-cookie-setting-dialog .setting-item{display:flex;margin-top:20px;align-items:flex-start}.eu-cookie-setting-dialog .item-content{font-size:12px;margin:0 8px}.eu-cookie-setting-dialog .cookie-checkbox{cursor:pointer}.eu-cookie-setting-dialog .cookie-checkbox.necessary{cursor:not-allowed}.eu-cookie-setting-dialog .item-label{line-height:1;font-weight:700}.eu-cookie-setting-dialog .item-text{margin-top:5px;line-height:1.5}.eu-cookie-setting-dialog .setting-footer{margin-top:20px;text-align:right}.eu-cookie-setting-dialog .save-btn{cursor:pointer;color:#fff;font-size:12px;font-weight:700;padding:8px 10px;border-radius:4px;display:inline-block;letter-spacing:normal;background:#4b5056}.eu-cookie-setting-mask{position:fixed;display:none;top:0;left:0;width:100%;height:100%;z-index:10000;cursor:pointer;background:rgba(0,0,0,.4);-webkit-animation:slide_in_animation .2s ease-in-out;animation:slide_in_animation .2s ease-in-out}@-webkit-keyframes slide_in_animation{0%{opacity:0}to{opacity:1}}@keyframes slide_in_animation{0%{opacity:0}to{opacity:1}}.rtl-layout .eu-cookie-notification-dialog{right:20px;left:auto;text-align:right}.rtl-layout .eu-cookie-notification-dialog .common-button{margin-right:0;margin-left:10px}.rtl-layout .eu-cookie-setting-dialog-wrapper{text-align:right}.rtl-layout .eu-cookie-setting-dialog-wrapper .setting-footer{text-align:left}@media only screen and (max-width:520px){.eu-cookie-notification-dialog{width:100%;left:0}.rtl-layout .eu-cookie-notification-dialog{left:auto;right:0}}
網站不會做?這三個網站案例或許能幫你! - 網路行銷實戰 - Strikingly
文章摘要:
網站設計技巧
網站案例介紹
現在已經到了2021年,在過去的一年中,COVID-19讓很多企業都希望透過網路來提高企業收益,而架設網站是提高線上收益的一個好方法。網站對於企業的重要性不言而喻,沒有網站,企業就很難在網路上宣傳展示自己並開展數位行銷。製作一個高品質網站 對於提升銷量、獲取粉絲,甚至是改善品牌形象都大有裨益。今天,我給大家整理了幾個不錯的網站案例 ,供你在架站的時候參考。
不過如果網站做得非常低劣,那也無法吸引顧客。如何才能讓網站架設地高級一些 呢?這裡給大家總結了五個簡單的網站設計 技巧,按照下面這幾點來做,可以收穫不少的架站知識。
1.頁面簡潔 如果你的網站非常繁瑣花哨,那麼訪客們就會感到很疲勞。所以,盡量在網站的主頁立即傳達出你的核心訊息,讓他們能一眼就明白你是做什麼的,而無需滾動或單擊其他版塊。比如下圖這個用 Strikingly系統 做成的網站案例,用美觀的banner、號召性用語、簡單準確的品牌介紹來快速吸引顧客眼球,讓訪客能迅速了解它的業務。
2.視覺層次有邏輯 層次結構非常重要,好的網頁結構能幫助顧客更好地理解你的品牌,給客戶留下深刻印象。
要想讓網站分明,你需要注重各版塊的邏輯,層層遞進,每個版塊一個主題,然後再透過文字或貼圖詳細介紹自己。讀者通常會先注意到你顯眼的標題,然後才轉向較小的段落文本。
當需要展示的資訊比較多時,你可以啟用多頁面網站功能,Strikingly 就提供多頁面網站功能,分門別類地多方位展示自己。你也可以透過媒體版塊植入Youtube影片,點擊這裡 可以瞭解相關內容。
3.風格、字型統一 網站風格要和品牌相關,各頁面、版塊風格應該是一樣的,這樣才能給客戶留下深刻的品牌印象。另外,在一個網站中,盡量不要使用超過三種不同的字型。太多變的通常看起來很混亂,會分散你的品牌形象,讓讀者也覺得淩亂。
4.多種內容表現方式 貼圖、GIF、影片、文字、背景音樂……專業網站架設平台會給架站者多種資訊展示方式。尤其現在影片是流行趨勢,比起靜態圖影片更能吸引目光,各位架站者可以靈活利用這些形式來讓網站更有活力。
5.頁尾 一個高品質的網站,要有實用的轉化功能,考慮到客戶的溝通需求。當客戶瀏覽完一個頁面,有合作意向、想要跟你聯繫時,如果你沒有提供聯繫方式,那就尷尬了。所以,在網站頁尾,你可以添加你的聯繫方式、社群媒體圖示、留言表單或任何其他相關連結,增加轉化率。
總之,高品質架站需要你考慮多個方面,但作為新手只要你注意以上5點,就起碼具備了網站架設的基本功,但是只有這些還是不夠的,我們還需要更多的實際案例來加深我們對於網頁設計的理解,以下三個網站案例 就不錯:
1. WHEELYS CAFÉ
這個網站案例是使用自助架站平台Strikingly架設出來的,整體設計非常簡潔,首頁加入了一個影片來展示他們的品牌,相比於單調的圖片來說更加動態,可以展現的元素更多。紅框標注的導航欄僅有“品牌介紹、最新消息、更多資訊”,點擊更多資訊,我們可以看到咖啡的售賣地點等資訊,可以幫助品牌更好地開展行銷。
2. PEIXUELI ART STUDIO
要介紹的第二個網站案例是使用Strikingly 架設的沛雪立工作室(PEIXUELI ART STUDIO),這網站主要是用於介紹他們家的一些工藝品,網站的背景色為灰黑色調,字體基本上是純白色,與背景的搭配相得益彰,整體上網站頁面簡潔,風格字體統一,是一個比較不錯的網站。我們從網站導航欄就可以清楚地看到有柴燒 Wood-fired、瓷 Porcelain、陶 Pottery、黑陶 Black Clay多種工藝品,只需點擊就可以快速跳轉到詳細介紹介面,非常方便。
我們可以點擊到“瓷”介面,可以看到圖片的排版整齊,風格一致,也符合我們上文提到的視覺邏輯,可以提高訪客的瀏覽體驗,我們在為網站添加圖片時也可以參考這個網站案例的圖片放置方式。
3. FINGERTIP ART
這個網站也是來自Strikingly的網站案例,主要目的是介紹紡織工藝品。網站的Banner設計非常簡約,導航欄居於左側,購買連結位於左下角,最後一頁也有聯繫方式。
網站整體美觀素雅,圖片與文字搭配效果良好,網站的內容介紹也很全面,整體符合我們上文中所說的網站設計技巧,是一個不錯的行銷網站,值得學習。一般來說,簡報的PPT的調性應該與網站一致,點擊這裡 也可以繼續學習。
以上三個網站案例都是使用Strikingly架設的,如果你也有架站需求,可以在Strikingly 的用戶案例 中多瀏覽借鑒,點擊這些用戶案例,還會提供網站案例所使用到的架站模板,或者去Strikingly的模板庫中看看,那裡有大量種類豐富且品質精美的模板,選擇一個適合的模板開始架設網站吧!
點擊這裡 ,查看更多最佳設計網站範例。
點擊這裡 ,了解選擇Strikingly來進行網頁設計的七大理由!
現在註冊Strikingly ,可以永久免費使用高品質網站模板,如果還不夠用的話,也可以無條件免費試用 14天進階功能!
Cookie的使用
我們使用cookie來改善瀏覽體驗、保證安全性和資料收集。一旦點擊接受,就表示你接受這些用於廣告和分析的cookie。你可以隨時更改你的cookie設定。 了解更多