育將電腦工作室 - 線上書籍

網頁設計與雲端應用
=========

一、網頁應該注意事項

1. 網頁標題：例 商品 商品類別 網站名稱 
 <http://bootstrap.ugm.com.tw/modal.html> ```
 <pre class="brush:as3;">
 <title>modal 模態彈窗 bootstrap 育將電腦工作室</title>
 ```
2. 設定META ```
 <pre class="brush:as3;">
 <meta name="author" content="作者名稱">
 <meta name="copyright" content="版權所有人名稱">
 ```
 
 
 例：<https://www.hsin-hc.com> 
 keywords：搜尋關鍵字，思考方向，訪客會用什麼「關鍵字」來搜尋網站 
 description：當網站被搜尋出來時，在網頁出現的描述 ```
 <pre class="brush:as3;">
 <meta name="keywords" content="肉乾,肉鬆,肉脯,豬肉乾,豬肉鬆,魚鬆,魚脯,杏仁肉乾,乾貨零嘴,臘味肉品,贈品禮盒,馨香珍,香腸">
 <meta name="description" content="馨香珍肉鬆肉乾專賣店，訂購專線(日)06-595-8300、(夜)06-213-7301(行動)0916-055028、0970-426206，台南市關廟區市場內67號">
 <meta name="robots" content="index,follow">
 <meta name="rating" content="general">
 <meta name="author" content="育將電腦工作室">
 <meta name="generator" content="XOOPS">
 ```
 
 例：香純豬肉鬆 
 ![](https://www.ugm.com.tw/uploads/tad_book3/image/106/14/1.jpg)
3. Favicon： 
 如果沒有它，網站就會返回 404 Not Found ```
 <pre class="brush:as3;">
 
 <link rel="shortcut icon" type="image/ico" href="https://www.jinghung.com/themes/u_jinghung/icon/favicon.ico">
 <link rel="icon" type="image/png" href="https://www.jinghung.com/themes/u_jinghung/icon/favicon.png">
 ```
4. 設定OG 
 清除快取： [Facebook Debugger](https://developers.facebook.com/tools/debug) ```
 <pre class="brush:as3;">
 <meta property="og:title" content="網站名稱或標題" >
 <meta property="og:url" content="網址">
 <meta property="og:image" content="要顯示的縮圖網址">
 <meta property="og:description" content="網頁描述" >
 ```
 
二、做好網頁優化提升網站搜尋排名

1. 每頁只有一個h1，其他依重要性給予h2、h3、......
2. 適當的文字敘述，對應meta keywords
3. 圖片記得加 alt 屬性
 
三、善用Google的網站管理工具：Search Console

1. Search Console 網址：<https://www.google.com/webmasters/tools/home?hl=zh-TW>
2. Google Search Console 以前的名稱是 Google Webmaster（網站管理工具），是 Google開發的 免費SEO工具
3. 安裝 
 輸入網址=>「新增內容」 
 ![](https://www.ugm.com.tw/uploads/tad_book3/image/106/15/2.jpg) 
 下載驗證檔=>上傳至網站根目錄=>確認檔案=>「驗證」 
 ![](https://www.ugm.com.tw/uploads/tad_book3/image/106/15/2-1.jpg) 
 下載檔案至「本地端專案根目錄」 
 ![](https://www.ugm.com.tw/uploads/tad_book3/image/106/15/2-2.jpg) 
 上傳 
 ![](https://www.ugm.com.tw/uploads/tad_book3/image/106/15/2-3.jpg) 
 驗證 
 ![](https://www.ugm.com.tw/uploads/tad_book3/image/106/15/2-4.jpg) 
 驗證成功 
 ![](https://www.ugm.com.tw/uploads/tad_book3/image/106/15/2-5.jpg)

Title1

Title2

Title3

Title1

Title2

Title3

MarkDown