網頁設計教學系列-方便快速的META產生器

之前DOUBLE冠有分享一篇META標籤的文章,之後會再打一篇關於連結到FB社群的部分,不過今天先分享一個還不錯用的META產生器,跟大家講為什麼要寫META,因為蜘蛛搜尋引擎搜尋到網頁時,它必須判斷你是什麼樣的網頁,擁有什麼樣的內容,所以META在SEO這一塊是相當重要的,今天重要就是怎麼快速產生META標籤,一起看看!

實用查詢

  • 網站名稱:實用查詢
  • META產生器網址:按這裡

這是一位部落客網友的網站,他裡面有分享一篇關於META產生器部分,其實也是相當好用,

 

第一步 來到這邊 它有很多表格,裡面各別是META的產生器,你可以在表格裡面打入你想要的內容,接著按產生,

 

 

最後就會產生META標籤的原始碼了,是不是超級快速又方便呢?? 這個好用的方式就介紹給大家啦!

就像以下這樣

<META NAME="Title" CONTENT="如:Meta 標籤產生器">
<META NAME="Author" CONTENT="如:實用查詢">
<META NAME="Subject" CONTENT="如:Meta 標籤產生器">
<META NAME="Description" CONTENT="如:線上產生META標籤工具">
<META NAME="Keywords" CONTENT="如:MATE,標籤產生器">
<META NAME="Generator" CONTENT="如:Meta 標籤產生器">
<META NAME="Language" CONTENT="如:utf-8″>
<META NAME="Expires" CONTENT="如:Wed, 27 Sep 2012 08:21:57 GMT">
<META NAME="Abstract" CONTENT="如:Meta 標籤產生器">
<META NAME="Copyright" CONTENT="如:http://doublekung.tw">
<META NAME="Designer" CONTENT="如:實用查詢">
<META NAME="Publisher" CONTENT="如:實用查詢">
<META NAME="Revisit-After" CONTENT="請在此輸入標題,如:Meta 標籤產生器 Days"> 

熱門相關文章

網頁設計教學系列-常用meta標籤介紹
上次因為一次聚會,聊到這個meta的部分,自己很常用一些meta的部分,像是keywords,description等,這些是很常用的部分,每個網頁都很需要,最近做了一下功課,有些meta的語法我們還是必須要知道,以便在不同的網站,寫上不同的meta,一起來看看今天這篇文章! 寫這個meta,其實對seo也有相當大的幫助,關鍵字下的對,有時候很容易找到你的網站,不過有時候很多台灣網站,像description和keywords都打一模一樣,這兩個其實有相當大的差別,讓DOUBLE冠來介紹一下用法, 網頁描述語法<meta name="description" content="" /> 大致上的架構就像我標題那樣,正確用法大概像下面這樣, <meta name="description" content="今天主題是分享HTML META標籤語法" /> 這個等於你的副標一樣意思,等同要描述一個人大概的樣子,寫這個語法主要描述大概網頁主方向,描述這個是什樣的網頁。 網頁描述關鍵字<meta name="keywords" content="" ...
繼續閱讀
網頁設計教學系列-HTML5語法分享2(CANVAS)
今天要分享的HTML5語法,就是平常我們會在繪圖軟體裡面,我們會用矩形工具來畫正方形,三角形等等的,現在最新的HTML5語法,雖然還沒有一套完整規範,不過大致上的一些語意標籤,都是有規範出來的,像今天介紹的CANVAS語意標籤,就是可以用來畫正方形,三角形,透過HTML5語法即可,一起來看看! 這邊沒有做各瀏覽器測試,只是單純分享HTML5語法,所以大致上以能支援HTML5語法的瀏覽器為主,像是CHROME,FIREFOX,IE9等, 比如今天我們想要畫一個正方形: 在這邊的做法,透過HTML5必須要搭配JAVASCRIPT才能畫出來,以下是程式碼, <!DOCTYPE HTML> <html> <title></title> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <script type="application/javascript"> function draw_m() { var m_canvas ...
繼續閱讀
網頁設計教學系列-做出在兩個不同解析度所呈現出來的效果!
今天要分享的東西,可能從標題看不太出來在講什麼樣的意思,這邊今天要講的,就是網頁設計的爸爸和小孩,也就是父區塊和子區塊,有時候在1024X768看到的是子區塊,在1366X768看見的是父區塊和子區塊的結合,這樣做的好處就是不會在不同解析度下,所呈現出來的感覺不會差太多,讓我們來看看今天的教學! 比如我們今天看到一個部落格網站長這樣子,這是1024X768的解析度畫面, 不過在其他的寬螢幕和筆電可能是這樣子,比如1366X768,   或許是現在圖片尺寸關係,所以有點看不出來,不過如果在做網頁如果遇到不同解析度的話,是件麻煩問題,所以通常我們都會設父區塊和子區塊,比如今天我們設一個父區塊和子區塊, 之後我們在為這兩個區塊寫上CSS背景顏色,這邊是原始碼, <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" ...
繼續閱讀
網頁設計教學系列-CSS+DIV排版-1
今天要分享的東西,也是網頁設計很基本的排版設計,以WORDPRESS來看,就是一塊header+content+sidebar+footer的一種排版方式居多,所以今天這裡要先介紹基本類似的兩欄式排版方式,先從基礎的學起,以後在用其它東西時,會比較得心應手,話不多說,馬上開始今天的排版教學! CSS排版教學 CSS+DIV排版 首先我們來看我們想要達到的效果,這是預覽CHROME17的畫面, HTML原始碼 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" ...
繼續閱讀
網頁設計教學系列-HTML5語法分享!
今天要介紹的東西,就是最近還滿夯的HTML5,這篇只是從一些基礎的東西開始分享,大概了解基本的觀念而已,之後如果學到更多好玩的東西,再一次分享給大家,不過昨天這樣摸一摸,還滿佩服賈伯斯所帶來當的創意,雖然HTML5還沒有真正完全到答一個標準,不過我想這是遲早的趨勢,一起來看! 比如我們呈現效果像下圖這樣,以前用HTML4語法也很簡單,就很多區塊設DIV就行了,這邊要分享HTML5的寫法, HTML5文件檔頭簡單設定 以往我們熟悉的HTML語法,剛開始文件一開頭都會這樣寫, <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"> 但HTML5的文件一開頭寫法相當簡單,只要像下圖這樣寫就可以 <!DOCTYPE html> 寫法變得相當簡單, 我們從WORDPRESS預設佈景也看到是這樣子寫的 <!DOCTYPE ...
繼續閱讀
網頁設計教學系列-常用meta標籤介紹
網頁設計教學系列-HTML5語法分享2(CANVAS)
網頁設計教學系列-做出在兩個不同解析度所呈現出來的效果!
網頁設計教學系列-CSS+DIV排版-1
網頁設計教學系列-HTML5語法分享!

發表迴響

你的電子郵件位址並不會被公開。 必要欄位標記為 *

你可以使用這些 HTML 標籤與屬性: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>