SEO 新手在剛接觸網頁優化時，首先都會遇到程式碼不知道該如何進行 Meta Tag 元標籤屬性的添加問題，除了基本的 Title Tag 標題屬性、Keywords Tag 關鍵字屬性與 Description Tag 描述屬性之外，還有社群媒體的專用標籤。
而現在有一款免費的線上 SEO 工具「metatags.io」，能夠幫你即時的顯示網站的預覽圖，讓你快速預覽網站的標題、網址與描述在 Google 搜尋結果的顯示畫面，同時也能讓你即時的進行編輯與修改，並幫助你自動產生相對應的標籤屬性。
只要透過「metatags.io」，除了能夠預覽搜尋結果的顯示結果之外，也能迅速幫你產生 Facebook、Twitter、LinkedIn、Pinterest、Slack…等等社群媒體的社群標籤屬性，讓你的文章或網站被分享到社群媒體時，都能正確的顯示網站的圖片、標題、網址與敘述。
Meta Tag 元標籤屬性產生器 – 自動產生程式碼的線上 SEO 工具
網站名稱：Meta Tags — Preview, Edit and Generate
網站網址：https://metatags.io/
Meta Tags 線上產生器教學
步驟一
輸入指定網址
前往「https://metatags.io/」進入 Meta Tags — Preview, Edit and Generate 的頁面，在上方搜尋框中輸入你的網址：
步驟二
設定 MetaData
在「METADATA」欄位當中，可以上傳你自訂義的圖片、更改你的預設標題（Title Tag）與敘述標籤（Description Tag）：
當你上傳圖片與設定標題、敘述之後，在右側就會即時顯示這些設定在 Google 搜尋結果、Facebook、Twitter…等社群媒體，當中的呈現樣式：
步驟三
點擊「GENERATE TAGS」按鈕，產生 Meta Tags 程式碼：
接著只要複製自動產生出來的 Meta Tags 到你的程式碼 <head> 當中，就大功告成拉！
程式碼區塊當中就大功告成了！” class=”wp-image-2952″/>metatags.io 使用心得
目前這個自動產生 Meta Tags 的線上 SEO 工具也有提供 WordPress 的付費外掛，如果你的網站是使用 WordPress 建立的，那麼你也可以參考購買他的 WordPress 外掛做使用。
不管你是使用他的免費線上工具來產生 Meta Tags，或是直接購買他的 WordPress 付費外掛，替你的網站添加 Meta Tags 標籤屬性就是這麼簡單！
如果你覺得這個線上 SEO 工具產生 Meta Tags 的功能非常好用，你可以在下方留言告訴我你的使用心得哦！
延伸閱讀
- On-page SEO 網站優化 – 改善內容提升排名的秘訣
- Redacted 線上馬賽克工具，輕鬆幫你的圖片加上模糊馬賽克
- CC Search – 圖片創用 CC 搜尋引擎，全球最大免費圖庫搜尋引擎
- LambdaTest – 瀏覽器相容性測試工具，檢測你的網站在所有平台裝置上的相容性
- Uptime Robot – 免費網站監控工具，斷線就會立即通知你！
- DesignEvo – 免費線上 Logo 設計、商標製作工具
- 3 個最佳的結構化資料測試工具（Structured Data Testing Tools）【2019】
- Screely – 免費將圖片快速轉成網頁預覽樣式的線上工具，前端設計師的好幫手！
- Wappalyzer – 查看網站所使用的環境、技術、主機與分析工具，一覽無遺！
- Qlearly – 看板樣式的書籤管理工具，讓你 Chrome、FireFox 的書籤管理更有效
發佈留言