網站設計與建構指南：提升搜尋引擎排名及用戶體驗 – 新視界網頁設計 https://www.vf.com.tw Vision Flow Tue, 11 Dec 2018 03:18:32 +0000 zh-TW hourly 1 https://wordpress.org/?v=7.1.3 https://www.vf.com.tw/wp-content/uploads/2018/11/vf8-150x150.png 網站設計與建構指南：提升搜尋引擎排名及用戶體驗 – 新視界網頁設計 https://www.vf.com.tw 32 32 如何新增頁面至選單 https://www.vf.com.tw/teaching/getting-started/how-to-add.html Mon, 10 Dec 2018 07:10:47 +0000 https://www.webs.com.tw/?p=5648

1. 進入選單管理

  1. 由後台滑鼠移至外觀，會出現子選單
  2. 由子選單點選選單，進入選單管理

2. 修改調整選單

  1. 點選下拉式選單，選擇想要編輯的選單
  2. 按下選取按鈕，確認編輯該選單。
  3. 可選擇頁面、文章、商品等任何項目，點選後，按下方的[新增至選單]
  4. 將加入選單的項目，按住，移至想放的位置，或拖曳現有選單，移至想修改的位置，亦可按住往右移，可成為子選單。
  5. 核取自動加入選單後，新增的頁面便能自動加入該選單，但要注意選當長度是否適當，建議太多選單時可以多利用子選單，選單字數也不適合太長，會影響美觀。
  6. 選取想讓選單出現的位置。
  7. 確認後記得按儲存選單，才能生效喔。

3. 設定子選單

  1. 按住選單可自由拖曳，移至域設定為上一層選單位置下方後，往右移動，便會自動成為子選單。確認後按儲存選單即可。
]]> 聯絡表單教學 https://www.vf.com.tw/teaching/getting-started/form-editor.html Mon, 23 Jul 2018 09:31:18 +0000 https://www.webs.com.tw/?p=5998

一、表單欄位新增修改教學

  1. 進入聯絡我們的頁面，選擇以 Elementor 編輯，然後點選表單區塊。
  2. 選擇表單欄位。
  3. 選擇想編輯的項目，直接修改即可。
  4. 如果需要複製，請直接選取複製，複製後再回到上一步驟修改。
  5. 如果不需要該欄位，可直接刪除。
  6. 如果需要新的欄位，可新增新欄位。

二、表單聯絡人修改

  1. 選擇電子郵件，然後直接修改聯絡人郵件即可。
  2. 如果還想寄副本給別人，可在此輸入另一人的 Email。

三、自訂表單訊息

  1. 選擇其他選項，輸入相關訊息即可。
]]> 如何隱藏我的網站 https://www.vf.com.tw/teaching/getting-started/how-to-hide-website.html Tue, 19 Jun 2018 08:17:21 +0000 https://www.webs.com.tw/?p=5992

雖然在 SEO的立場，我們不建議您這樣做，但有時候您可能不想讓人看到您的網站，可以使用這個方式來隱藏，不過如果有人知道您的網址，還是可以看到您的網站，這個方式並無強制性，也不會馬上生效，要等搜尋引擎檢查後才會生效。

  1. 選擇設定(Settings)中的閱讀
  2. 在搜尋引擎可見度的選項打勾，阻止搜尋引擎索引這個網站即可。
]]> 滿千送百優惠教學 https://www.vf.com.tw/teaching/shopping-cart-teaching/coupon-2.html Fri, 27 Apr 2018 03:17:17 +0000 https://www.webs.com.tw/?p=5621

新增優惠卷

  1. 點選Woocommerce 中的折價卷。
  2. 點選 新增折價卷 或 建立第一張優惠卷。

設定折扣種類

  1. 百分比折扣，輸入想打的折扣 %數，如想打九折則輸入10。
  2. 固定購物車折扣，結帳時總金額的折扣金額優惠，如果要設定滿千送百，需選擇 2, 3 。
  3. 固定商品折扣，結帳時的商品折價優惠，如果要設定滿千送百，需選擇 2, 3。

新增 滿額優惠

  1. 輸入折價卷名稱，此名稱為套用於結帳之優惠碼。
  2. 輸入折扣說明(選填)。
  3. 選擇 固定商品折扣 或 固定購物車折扣。
  4. 輸入折扣金額。
  5. 設定使用限制。

新增 滿額優惠

  1. 輸入折價卷名稱，此名稱為套用於結帳之優惠碼。
  2. 輸入折扣說明(選填)。
  3. 選擇 固定商品折扣 或 固定購物車折扣。
  4. 輸入折扣金額。
  5. 設定使用限制。
  6. 輸入可取得折扣的 最低消費金額。
  7. 設定使用上限
  8. 設定每個用戶的使用上限

使用優惠卷

  1. 輸入優惠卷後，點選 使用折價卷，即可取得折扣。
  2. 折價卷生效後，便可直接看到優惠。
]]> 如何使用優惠卷功能 https://www.vf.com.tw/teaching/shopping-cart-teaching/coupon.html Fri, 27 Apr 2018 02:39:39 +0000 https://www.webs.com.tw/?p=5595

新增優惠卷

  1. 點選Woocommerce 中的折價卷。
  2. 點選 新增折價卷 或 建立第一張優惠卷。

設定折扣種類

  1. 百分比折扣，輸入想打的折扣 %數，如想打九折則輸入10。
  2. 固定購物車折扣，結帳時總金額的折扣金額優惠。
  3. 固定商品折扣，結帳時的商品折價優惠。

新增 折扣優惠(九折)

  1. 輸入折價卷名稱，此名稱為套用於結帳之優惠碼。
  2. 輸入折扣說明(選填)。
  3. 選擇百分比折扣。
  4. 輸入折扣優惠，此數字為折扣百分比，如九折，則輸入 10 (不是輸入 90哦，90則是打一折)，八折輸入 20，依此類推。
  5. 發表或更新後即能使用。

使用優惠卷

  1. 輸入優惠卷後，點選 使用折價卷，即可取得折扣。
  2. 折價卷生效後，便可直接看到優惠。
]]> 如何修改首頁標題背景圖片 https://www.vf.com.tw/teaching/elementor-started/how-to-change-homepage-background.html Tue, 13 Mar 2018 03:09:31 +0000 https://www.webs.com.tw/?p=5386
  1. 進入首頁，選擇以 Elementor 編輯，然後點選標題區塊。
  2. 選擇左邊編輯功能的樣式。
  3. 選擇想新增或置換的圖片後，儲存即可。
]]> 錨點設定 – 設定同頁特定區塊的選單連結 https://www.vf.com.tw/teaching/elementor-started/anchor-setting.html Tue, 13 Mar 2018 02:46:42 +0000 https://www.webs.com.tw/?p=5375

錨點設定 - 設定同頁特定區塊連結

  1. 點選想設定錨點的項目。
  2. 左方功能表中點選進階。
  3. 填入錨點名稱。
  4. 設定連結為該頁網址後加上 #錨點名稱，如 http://webs.com.tw/web-design-quote.html#webdesign-price
]]> 如何溝通網頁設計風格 https://www.vf.com.tw/webdesign/how-to-communicate-web-design-style.html Sat, 20 Jan 2018 04:20:24 +0000 https://www.webs.com.tw/?p=4620

如何選擇想要的網頁設計風格

許多客戶在設計網頁實都會有個想法，會想像自己的網站樣式，但這個非常抽象，而且您的預想網站樣式可能是基於您經常看的網站而來；然而，目前絕大多數的網站，大多還是十多年前所設計的，沒有響應式設計、沒有滿版、沒有英雄形象、沒有嵌入式選單、沒有全文字化，沒有…..；我們聆聽客戶想要的設計風格，其實大多數都是已經落伍且被淘汰的風格設計；這是因為客戶較無機會接觸世界頂尖的網站，所以不會得到這方面的資訊，所以我們建議，您可以參考我們的風格選擇， 這些都是目前最好的設計，當然，您也可以不用這麼燒腦，只要您把資料給我們設計師，我們的設計團隊會依據您的資料屬性，提估最適合的設計。

現代網頁設計風格標準

我喜歡的網站適合我嗎？

我們經常會收到一些客戶的要求，喜歡A網站的設計，希望能參考他們，但客戶的資料屬性跟 A網站差異頗大，譬如 A網站文字少，圖片多，而客戶文字多，圖片少，結果設計出來的結果通常都慘不忍睹，經常需要打掉重做，早期有幾件照客戶要求做出來的客戶自己也不喜歡，在溝通之後，全權授權我們設計師設計的結果，客戶反而非常喜歡！

所以我們都會建議，如果您喜歡 A網站，我們只會參考他的風格，但不會完全照抄，因為您的資料是不一樣的，我們會為您的資料及行業屬性，設計更適合您的網站。

或是有客戶會提出一些十多年前的設計給我們參考，這些設計並無響應式設計，或是幾乎是以圖片來設計整個網站，沒有全文字化，這種幾乎都是被淘汰的設計，這都讓我們很尷尬，不知道到底要照客戶的想法設計個過時的網站，還是要建議客戶用新的設計，但到後來，我們幾乎都是跟客戶溝通，放手讓我們來設計，而客戶最終對我們設計的結果也都很滿意，只是溝通過程變得很冗長，所以我們還是在一次建議，信任我們的設計，您會得到最好的結果。

你們有設計過我們的行業嗎？

經常有些客戶會問，你們有沒有做過我們行業的網站，其實這個問題應該分成形象設計與程式功能設計來說，除非您的行業非常特別，有特殊需求的功能，且要高額預算才需要問，否則如果是一般形象或是購物網站，其實架構都是差不多的，新一代的形象設計其實並無行業別之分，不同行業僅是素材不同而已，而且要知道，每個客戶要求的審美觀不同，我們都是針對每個客戶的喜好來設計的，他喜歡不見得您也喜歡，如果您也喜歡他的設計，我們也不能完全複製，如果您不喜歡他的設計，可能是交件後被客戶改醜了，並不是我們做不出來您想要的東西，只因每個人的審美觀念不同，所以還是建議您參考我們的風格選擇比較準確。

]]> 什麼是好的網頁設計標準? https://www.vf.com.tw/compare/whats-good-design.html Fri, 19 Jan 2018 08:48:23 +0000 https://www.webs.com.tw/?p=4591

完美的定義

網站做得好，業績一把罩！但好的標準是甚麼呢？該如何選擇網頁設計公司呢？每家公司都說他們的設計最好，但好不好並不是自己說的，我們分析了2016~2018 全球的主要設計趨勢，列出最重要的六個重點供您參考，我們的網頁設計完全符合此規格，如果您找的設計公司還沒有這些設計，建議您可以換一家了。

一、滿板設計

近年來最重要的設計指標，除了RWD響應式設計之外，就是滿版設計了，現在幾乎所有全球知名企業都是使用滿版的網頁設計，滿版的設計質感更好，更大器，且不但是網站，現在連手機也要追求滿板、全螢幕了；如 蘋果、微軟、白宮、賓士、Sony、華碩、三星等等都早已採用，所以如果沒有特別原因，您的網站還是兩邊留白的傳統的固定寬度，那就是該升級了！

根據分析，網站太醜或太老舊，不符合新世代的設計，很難讓客戶上門，而滿版的視覺效果非常好，美麗吸睛的設計，才能讓客戶舒適而愉悅的瀏覽您的網站，便能提升形象，讓客戶容易產生信任感，進而提高合作與採購意願！我們提供與蘋果、華碩、微軟、HP、三星等世界一流企業同等級的頂級設計規格，讓您的企業形象質感滿分。

滿版設計
傳統響應式網頁設計
非滿版設計

二、響應式網頁設計

行動時代，人們已經習慣在手機上瀏覽網站，手機瀏覽網站比例已經超過電腦，如果手機沒有響應式網頁設計，無法在手機上自動調整成最適合的介面，代表您已經放棄了超過六成的客戶。

RWD響應式(回應式)是目前最重要的設計，自從2012年行動網路用戶漸多，能配合手機版面的RWD響應式網頁設計就越來越重要，更是連續幾年以來第一名的設計趨勢，近年更有大量企業紛紛升級為響應式網頁，Google 更在宣布 2015年宣布，如果沒有響應式設計，將不會出現在手機上的搜尋結果，所以響應式網頁設計，是目前的必要項目，如果您現在找的網頁設計公司還沒有響應式設計，即便再便宜都不要，因為沒多久您一定得再重作有響應式的網站。

我們所有的方案都有包含 RWD響應式網頁設計！

響應式網頁設計

四、大標題文字取代美工文字

早期沒有響應式的網頁設計時(現在還是非常多)，形象圖片都是以美工圖案來設計，這樣的設計好處是簡單，僅需再美工軟體處理好再放到網頁即可，成本較低，但這樣的設計在行動裝置上卻無法自動調整到適合的尺寸，解析度也不夠好，而且SEO效果較差，因搜尋引擎無法辨識，現在最好的方式是用文字來設計主標題與副標題，才能讓手機、平板、電腦等所有客戶都能有最棒的視覺體驗。

且文字才能被搜尋引擎蒐錄進資料庫，進而擁有良好的SEO設計，網頁用圖片設計已經過時了，而且對SEO非常不友善。網站想要有成果，必須要讓搜尋引擎收錄，才有機會被客戶搜尋到，但傳統網站許多重要文字都設計在圖片中，搜尋引擎根本無法理解，自然效果不彰；我們的網站為全文字化，符合搜尋引擎規範，比一般網站更有機會讓客戶搜尋到。

網頁設計-風格5

五、英雄視覺形象 HERO IMAGE

英雄視覺形象往往是一個訪客在網站上遇到的第一個視覺; 它提供了該網站最重要內容的概念，精準傳達品牌意涵。

英雄圖像通常由圖像和文字組成，並且可以是靜態的或動態的（例如圖像和/或主題的旋轉列表），效果有如電影一般的出色。在網頁設計中，英雄形像是一個大型的網站橫幅圖像，傑出地放置在網頁上，一般是在頁首或中間。

所呈現的內容隨著網站的目的而不同：它可以是關於網站的相關新聞，具體的網站鏈接，或者在電子商務的情況下，是最暢銷的或戰略性地放置的產品或服務。

六、SEO 搜尋引擎優化

隨著網站曝光的可見度越來越重要，能出現在客戶搜尋的結果，幾乎就是獲利的保證，所以網路廣告大行其道，但卻很少人注意到，網站本質是最重要的，也是所有行銷的基礎，如果網站SEO設計的不好，則廣告費就一直居高不下，無法降低。

有一些指標您可以了解：

  1. 網址優化：您可以注意到網頁設計公司提供的客戶作品中，他們的網址都是一連串無意義的程式碼，您可以將滑鼠移置連結，就能看到左下角出現網址，或是直接在網址列查看網址，如: xxx.com.tw/con.php?lang=tw&trib=2&pid=3 ，這些對搜尋引擎是沒有意義的，相當扣分，我們的網址都是有意義的，且優化過的。

  2. 用圖片設計網頁：把所有文字都設計到圖片上，這是十多年前的的網頁設計方式，但令人驚訝的是現在還有很多這樣設計的網站，圖片對搜尋引擎較無意義，文字對搜尋引擎才重要，我們的設計都是全文字化的，效果當然好很多。

  3. 網站架構優化：許多舊程式設計出來的網站，表面上看起來漂亮，但效果卻不好，這是先天無法改善的，唯有從程式優化，讓搜尋引擎熟悉且喜歡，才能達到最好的效果。我們的架構有針對搜尋引擎優化，先天就比一般網佔有優勢。
]]> 新增可變商品-顏色、尺寸等選擇 https://www.vf.com.tw/teaching/shopping-cart-teaching/v-product.html Tue, 16 Jan 2018 08:50:30 +0000 https://www.webs.com.tw/?p=4552

如何設定尺寸、顏色等屬性

1. 設定屬性

  1. 新增商品後，在商品管理中的商品資料，選擇為可變商品。
  2. 點選屬性，進入新增屬性內容。
  3. 按 新增屬性。
  4. 輸入屬性名稱，如顏色、尺寸等，在數值中輸入屬性內容，如顏色或尺寸，中間需以 | 分隔。
  5. 將用於變化類型打勾，然後按 儲存屬性

2. 設定變化類型

  1. 點選 “變化屬性” 標籤。
  2. 點選每個屬性的數值，進入編輯該屬性的內容。
  3. 輸入圖片、類型、庫存、價格、重量等資訊，請注意，每個不同屬性都是不同商品。
  4. 最後在下方按 儲存 即可。
]]>