มี ที่ นี่

Posts Tagged ‘tag’

อีกไม่นาน HTML 5 ก็น่าจะออกมาเสร็จแล้ว ก็ต้องตามเทรนกันหน่อย เพราะว่ามันเด็ดเกินไปแล้ว วู้วววววว…….

สิ่งที่เพิ่มขึ้นมาจาก 4 เป็น 5 ถือได้ว่าเป็นก้าวที่สำคัญเลยก็ว่าได้ เพราะ ได้ตัดอะไรที่ไม่ได้ใช้ และกำกวมออกไปเยอะ ให้ไปใช้งานใน CSS แทน เพื่อที่ HTML จะเป็น หน้าของข้อมูลและ CSS จะเป็นรูปในการแสดงผล จากที่ HTML 4 เราก็ได้เห็นมาแล้ว ว่า CSS นั้นมีบทบาทเป็ฯอย่างมาก

Tag ที่ถูกตัดออกไปใน HTML 5(จาก4)

<acronym> ใช้บอกว่าเป็นตัวย่อ หรือ อักษรย่อ ได้เปลี่ยนเป็น <abbr> แทน

<applet> ใช้ในการสร้าง embedded applet

<basefont> ใช้เพื่อกำหนด  size สี ขนาด ของ font ทั่วไป (CSS แย่งซีนไปแล้ว)

<big> ใช้ให้เป็นตัวอักษรใหญ่ (มี strong และ CSS แย่งซีนไปเช่นกัน)

<center> ใช้กำหนดว่าอยู่ตรงกลาง

<dir> บอกว่าเป็น directory list (ผมเองยังไม่เคยใช้เลย)

<font> สร้างตัวอักษร Inline

<frame> สร้าง frame

<frameset> set frame ตามกำหนด

<noframes> (อันนี้ก็ไม่เคยใช้)

<s> มาจาก strike คือเส้นขีดคาดนั่นเอง(ใช้ del แทน)

<strike> ไปด้วยกันเลยเหมือนกับ <s>

<tt> เอาไว้ประกาศ teletype text (ไม่เคยใช้อีกและ)

<u> Underline

Tag ที่ถูกเพิ่มเข้ามาใน HTML 5(จาก4)

<article> บอกว่าเป็นบทความ

<aside> บอกว่านอกเหนือจาก page content

<audio> file เสียง

<canvas> วาด graphic 2D

<command> บอกเป็น command ให้ทำต่างๆ

ตัวอย่าง
<menu type="toolbar">
 <command type="radio" radiogroup="alignment" checked="checked"
          label="Left" icon="icons/alL.png" onclick="setAlign('left')">
 <command type="radio" radiogroup="alignment"
          label="Center" icon="icons/alC.png" onclick="setAlign('center')">
 <command type="radio" radiogroup="alignment"
          label="Right" icon="icons/alR.png" onclick="setAlign('right')">
 <hr>
 <command type="command" disabled
          label="Publish" icon="icons/pub.png" onclick="publish()">
</menu>

<datalist> รายละเอียดเสริมของรายการที่เราจะแสดง

<input list=”cars” />
<datalist id=”cars”>
<option value=”BMW”>
<option value=”Ford”>
<option value=”Volvo”>
</datalist>

<details> รายละเอียดของหน้านั้นๆ

<embed> เอาไว้เล่น embedded content ต่างๆ

<figcaption> แสดง caption ของ figure นั้นๆ

<figure>
   <img src="/pix/39627052_fd8dcd98b5.jpg">
   <figcaption>Kissat</figcaption>
</figure>

<figure> แสดงเนื้อหาที่เป็นสื่อต่างๆ

<footer> แสดงว่าเป็นส่วนล่างสุดของหน้า

<header> แสดงว่าเป็นส่วนหัวของหน้า

<hgroup> เอาไว้แสดงว่าเป็นกลุ่มของหัวเรื่อง

<hgroup>
<h1>Welcome to my WWF</h1>
<h2>For a living planet</h2>
</hgroup>

<p>The rest of the content…</p>

<keygen> บอกว่าตรงนี้คือ key ที่ gen เอา

<form action="processkey.cgi" method="post" enctype="multipart/form-data">
 <p><keygen name="key"></p>
 <p><input type=submit value="Submit key..."></p>
</form>

<mark> hilight text ที่ต้องการจะได้ไม่ต้องทำ span class=”hilight”

<meter> ค่ากำหนดอยู่ในช่วง

Storage space usage: <meter value=6 max=8>6 blocks used (out of 8 total)</meter>
Voter turnout: <meter value=0.75><img alt="75%" src="graph75.png"></meter>
Tickets sold: <meter min="0" max="100" value="75"></meter>

<nav> navigator

<nav>
   <h1>Navigation</h1>
   <ul>
    <li><a href="articles.html">Index of all articles</a></li>
    <li><a href="today.html">Things sheeple need to wake up for today</a></li>
    <li><a href="successes.html">Sheeple we have managed to wake</a></li>
   </ul>
</nav>

<output> แสดงผลลัพท์

<form action=”form_action.asp” method=”get” name=”sumform”>
<output name=”sum”></output>
</form>

<progress> แสดงปริมาณการทำงาน

The object’s downloading progress:
<progress>
<span id=”objprogress”>76</span>%
</progress>

<rp> ruby annotations (ขอข้ามก่อน อ่านยัง งงๆ อยู่)

<rt> รู้ว่าใช้อธิบาย <rp>

<ruby> (ขอข้ามก่อน อ่านยัง งงๆ อยู่)

<section> section ของ content(เนื้อหามากๆ ก็แบ่งเป็น section ได้สบายเลย)

<source>

<video controls autoplay>
 <source src='video.mp4' type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'>
 <source src='video.ogv' type='video/ogg; codecs="theora, vorbis"'
         onerror="fallback(parentNode)">
 ...
</video>

<summary> สรุป

<time> แสดงเวลา

Published <time>2009-10-21</time>.

<video>

ข้อมูลจาก (w3schools.com/html5/html5_reference.asp) Thankyou หลายเด้อ

แต่จากที่ผมดูแล้วยังมี tag ที่ W3School ยังไม่ได้ลงอีกหลาย tag เลยทีเดียว เพราะเราดูที่ http://www.whatwg.org/specs/web-apps/current-work/

555 เกาะติดสถาณะการณ์มากๆ เท่าที่ดูจะมีอีกเช่น

<figcaption>

<samp>

<kbd>

<bdo>

<wbr>

<menu> บอกว่าเป็นเมนู

และในอีกสิ่งหนึ่งที่เพิ่ม option มาอีกเพียบคือ <input> element มี

Telephone state

URL state

Date and Time state

และอีกเพียบ เหอะๆ แต่อย่างไรก็ตาม มี feature ใหม่พวกนี้ทีไร ก็ไม่ค่อยได้ใช้ประโยชน์กับคนไทยเท่าที่ควร เพราะอะไรรู้ใหม่ IE 6-7 ยังครอง market share ที่ 1 ของประเทศไทยอยู่ ถึง HTML 5 จะออกมาใช้งานได้อย่างสมบูรณ์ แต่ก็เล่นไม่ได้อยู่ดี แล้วยิ่งเรื่องของธุรกิจด้วยแล้ว ยังไงก็ต้องเกาะกลุ่มลูกค้าส่วนใหญ่ไว้

แสดงให้เห็นถึงว่า

คนไทยไม่ต้องการ security มากเท่าที่ควร

คนไทยไม่ต้องการ feature มากเท่าที่ควร

คนไทยไม่ต้อง Technology มากเท่าที่ควร

คนไทยไม่ขวนขวายเท่าที่ควร

แล้วจะยังไงต่อไป

วันนี้ต้องเขียน tag clound ขึ้นมาให้กับ SOBI2 ตอนแรกไปโหลด Smart Tag มาแล้วแต่แค่เอา keyword ออกมาเป็น list เฉยๆ เลยไม่ได้แบบที่ต้องการ เขียนใหม่เลยซะงั้น

เริ่มต้นด้วย ก็ get keyword ออกมา ปกติแล้วก็ วน loop กรองค่านิดหน่อย แต่ที่ ไม่รู้คือ เอ่ มันตัวใหญ่ตัวเล็กยังไงหว่า 555 ก็เลยหาๆ ดูมีคนเขียนไว้ให้ดูด้วย ที่

การเขียน function tag clound ทำ link ให้หน่อย เพื่อเชิดชูเจ้าของ อันนี้เป็นการแสดงออกมาในรูปแบบของ style ที่ มีค่าของ font size ต่างกันครับ

ขอบคุณไว้ ณ ที่นี้ครับผม

หลายๆคนเปิด option เกี่ยวกับ tag และใส่ไปโดยไม่ได้คาดหวังอะไร เพราะเห็นว่ามีและคนอื่นบอกว่าดี ผมขอบอกเลยนะครับว่า สงสัยต้องคิดดีๆ ก่อนใส่ซะหน่อยแล้ว

tag นั้นเป็นสิ่งที่เราจะต้องใส่เอง เป็นคำที่บ่งบอกเกี่ยวกับเนื้อหา หรืออะไรก็ตามที่จะตามมาที่จะตามมาที่ บทความ หรือ สินค้านั้นๆได้

tag เองไม่ได้ถูกนำมาใช้กับบทความอย่างเดียว แต่ยังนำมาใช้กับสินค้าได้อีกด้วย ประโยนช์ของ tag นั้นมากมายเหลือเกินจนเราอาจจะต้องขอบคุณคนที่คิดค้นคำว่า tag เลยทีเดียว

tag เองไม่ได้ถูกเพิ่มด้วยระบบจะต้องใส่ลงไปเอง ทำให้คนใส่นั้นเกิดอาการขี้เกียจขึ้นมาในทันที และอารมณ์ของการใส่นั้นช่างเป็นอะไรที่ไม่อยากใส่เป็นอย่า่งยิ่ง ถ้าไม่มีจัดประสงค์และความพยายามพอควรเพราะ tagจะใส่หลังเนื้อความ เมื่อความในใจหมดไปแล้ว ความว่างเปล่าก็เิกิดขึ้นไม่รู้จะใส่อะไร

tag นั้นในบางระบบถึงกับมีการ generate ออกมาเลยทีเดียว ซึ่ง tag นั้นมาจาก คำที่เกิดบ่อยครั้งในเนื้อหา ตัวหน้า การเน้นเนื้อหา, มาจาก title และมาจาก keyword  จะเห็นว่า tag นั้นเป็นเหมือนกับการค้นหาคำสำคัญนั่นเอง แต่คนที่คิดว่ามันมีประโยชน์นั้นจะมีสักกี่คน

คราวนี้เราจะมาดูประโยชน์ของ tag ที่เกี่ยวกับ SEO กันครับ tag เวลาที่เราจะทำให้ page นั้นมี rank สูงๆ แข่งกับคนอื่นได้ แน่นอนว่าเราต้องให้หน้าเว็บนั้นๆ มี keyword นั้นพอประมาณขึ้นอยู่กับเนื้อหาด้วยว่าจะมีขนาดมากน้อยขนาดใหน แต่จะต้องมีมากหรือน้อยนี่แหละครับ ที่เราเองไม่รู้เลยว่า ความเหมาะสมมันอยู่ตรงใหน ซึ่งหลายๆ คนก็เอาความประมาณและเนื้อหาที่พอประมาณมาวัดแล้วลอง ก็จะได้ เป็น % ที่น่าจะดีออกมา ไม่บอกนะว่ากี่%

แต่ถ้าเราพยายามพี่จะทำหน้านั้นให้ดีกว่าหน้าอื่นซึ่งอยู่บนโลก internet อีกแสนหน้าล้านหน้า เราจะทำได้หรือเปล่า นั่นน่ะซิ แล้วทำไมไม่เห็นพูดเรื่อง tag เลย ไม่เห็นเกี่ยวกับ tag เลย tag จะช่วยอะไรได้ ผมบอกได้เลยนะครับว่า tag นั้นช่วยได้จริงๆ

เวลาที่ tag cloud อยู่บนหน้าเว็บนั้น จะทำให้หน้าที่เป็น index ของ tag แต่ละคำและ link ของ tag จะเป็นการดึงข้อมูลที่มี tag เหมือนกันออกมา ลองคิดดูนะครับว่า ถ้าเรามีบทความ 5 บทความ เนื้อหาข้างในคล้ายๆกัน tag ย่อมคล้ายคลึงกันและมีคำเดียวกันอยู่ด้วย เวลาที่ search คำนั้นออกมาแหละครับผลลัพท์ที่ออกมาคือการได้เนื้อหาที่คล้ายๆกันออกมา และยังระบุเป็นคำได้เลยดด้วย

เหมือนกับเรา SEO กับหน้านึงเลยทีเดียว ไม่ต้องเขียน content ยาวๆเกี่ยวกับ keyword นั้นๆอีกต่อไป เราก็มี index ดีๆได้โดยมาจากการ generate ซะด้วยซ้ำ

ยิ่งคุณมี tag ในแต่ละบทความมากๆ และบทความเยอะๆ  index ที่เป็นคำเน้นๆ ยิ่งมากขึ้นไปอีก

จากที่เราได้บอกเกี่ยวกับข้อดีของมันมาซะเยอะ แต่คนที่ใส่ tag ตอนนี้นั้นใส่มั่วๆไป ใส่คำ 2 คำ ทำให้ tag ที่ออกมานั้นเป็น keyword น้อย ทำให้ไม่เห็นผลเท่าใหร่

ลองดูนะครับใส่ tag แบบเกี่ยวกับเนื้อหาจริงๆ เป็นชื่อ category ยังได้เลย อะไรที่เป็นตัวหน้าก็เอามาเป็น tag เลยก็ได้ เพราะถือว่าเราเน้นแล้ว แล้วจะได้ index อีกเยอะ

tag cloud นั้นเป็นอีกสิ่งที่สำคัญเลย อิิอิใน web 2.0 -3.0ไม่ว่า 2.0 นั้นจะเปลี่ยนไปเป็น 3.0 เร็วขนาดใหน แต่การที่เปลี่ยนเป็น web 2.0 นั้นช่างมากเหลือเกิน ไม่ว่าจะเป็น CSS, feed หรืออะไรอีกหลายอย่าง ทำให้สิ่งพวกนี้ยังเป็นพื้นฐานต่อไปเรื่อยได้สิ่งที่จะให้มีคือ tag cloud ครับโดย เป็น tag ของสินค้าและ article(content) ต่างๆ โดยการได้มานี้ ก็จะได้มาจา่กการใส่ของ user เอง และการเพิ่มให้จากระบบครับการเพิ่มเองด้วยมือคงไม่ต้องพูดอะไรมาก แต่การให้ระบบสร้าง tag ขึ้นมาเองนี่ซิครับ tag นั้นคือคำสำคัญๆ ของสิ่งนั้นๆ เพราะฉนั้นถ้าเป็น article ก็จะเป็น อักษรตัวหนา เป็น อักษรเีอียง ที่สำคัญ และก็ ข้อมูลที่อยู่ใน tag h ต่างๆครับเราก็เอามาตัดออกเป็นคำๆ แล้วเราก็จะได้ tag ออกมา 

หลายๆคนคงจะงงกับ tag จริงๆว่ามันคืืออะไร แล้วเอาไว้ทำอะไร แล้วมีประโยชน์อย่างไรเวลาที่เราใส่ไปแล้ว

Tag เองมีความมหายว่า

tag	[N] แถบป้ายบอกข้อมูล, See also: แถบป้ายราคา, Syn. badge, card, tab, stamp, label, sticker
tag	[N] สำนวนหรือประโยค
tag	[N] คำลงท้าย, Syn. tag question
tag	[N] หัวหุ้มปลายเชือกผูกรองเท้า
tag	[N] การเล่นไล่จับของเด็ก, See also: การไล่จับในกีฬาเบสบอล, Syn. cross tag, freeze tag, squat tag
tag	[VT] ติดป้าย, Syn. hold, earmark
tag	[VT] กล่าวหา

ข้อมูลจาก http://dict.longdo.com/?search=tag&service=&sourceid=opensearch

เอ่ แล้วเจ้า tag นี่ เอาไว้ใช้ทำอะไร

หลักการของ tag นั้นมาจากวิวัฒนาการของการต้องจากที่จะจัดหมวดหมู่ขึ้นของ ยุค Web 2.0 และต่อๆ ไป เพราะแต่ก่อนการที่จะบอกว่าข้อมูลอะไรอยู่ที่ใหนใหนเราจะหาจากหมวดหมู่ ซึ่งจะมีความลึกลงแบบ Tree

parent

|-Category1
|-Category2
|-Sub 1
|-Sub 2

ซึ่งข้อมูลแบบนี้เกิดจากการแบ่งข้อมูลจากใหญ่มาหาเล็ก ซึ่งในโลกของเว็บนั้นมีข้อมูลมหาศาลไม่สามามารถแจกแจงได้ครบด้าน

ยกตัวอย่างง่ายๆนะครับ ถ้าผมไปเที่ยวที่เชียงใหม่แล้วผมถ่ายรูปมาเขียนบทความเกี่ยวกับ Trip ที่ผมไปเที่ยวมา คุณคิดว่าบทความนี้จะอยู่ในหมวดหมู่ใดบ้าง

ภาพช่องการใส่ tag ของ word press

นั้นแหละครับมันก็ขึ้นอยู่กับการแจกแจงของแต่ละคน แต่ถ้าผมใส่ Tag เข้าไปด้วยว่า “เที่ยว, เชียงใหม่, ภาพเชียงใหม่” แล้วมีบทความการท่องเที่ยวหลายๆแห่ง การที่ต้องการจะดูบทความเกี่ยวกับ เชียงใหม่นั้นไม่ยากเลย ถึงแม้ บทความนี้จะอยู่ในหมวดหมู่ ภาพถ่ายก็ตามครับ

แล้วเจ้า Tag ทำอะไรได้อีกบ้าง ผมขออ้างิงนะครับจากบทความนี้ http://champcpe.exteen.com/20061023/tag

ใส่ Tag ทำไม?
การใส่ Tag มีประโยชน์หลายอย่างดังนี้ครับ

• ใส่ แล้ว exteen จะนำไปติดต่อกับ technorati ซึ่งเป็นเว็บรวม blog จากทั่วโลก ดังนั้น เวลาคนจากที่ต่างๆ มา search tag ที่ตรงกับของเรา ก็จะเห็น blog เราด้วย
• ใส่แล้วจะปรากฏในหน้า Tag (ลิงค์จากหน้าแรก) เป็นการจัดหมวดหมู่ของเรื่องที่เขียนเหมือนๆ กัน ให้อยู่รวมกัน ทำให้ค้นหาข้อมูลสะดวก เจ้าของบลอค ก็สามารถเผยแพร่เรื่องราวที่เขียน ได้ง่ายขึ้น คนหาก็หาง่ายขึ้น
• ใส่แล้ว เราสามารถมาคลิกดูได้ว่า คนที่เขียน tag เหมือนเรานี้มีใครบ้าง จะได้สร้างเป็นสังคมย่อยๆ ต่อไป
• สามารถดูเทรนด์ได้ว่า คนใน exteen ชอบเขียนเรื่องอะไรกัน

ต่อไปมาดูประโยชน์ของผมนะครับ

•  ด้าน SEOทำให้เกิด Link ไปตาม Tag ที่มีบทความที่ไกล้เคียงกันมากขึ้น เกิดการสร้าง link ที่มีคุณภาพมากขึ้น
• ด้านการสืบค้น สามารถสืบค้นได้ง่ายและหลากหลายมากกว่าเดิมและได้ผลลัพท์ที่ไกล้เคียงมากขึ้น
• ถ้าผมอยากรู้ว่า สินค้าตัวนึงมี keyword อะไรบ้างผมสามารถดูจาก tag ได้

ใช่ครับมันวัดอะไรได้หลายๆ อย่างเลยใช่ใหมล่ะครับ

ปัจจุบันไม่ใช่แต่บทความอย่างเดียวที่มี  ไม่ว่าจะเป็นสินค้าหรือบริการหลายๆอย่างก็ใช้ Tag เข้ามาช่วยด้วยเพราะเราสามารถบอกได้หลายทางมากกว่าหมวดหมู่ เช่น Amazon.com ก็ใช้ Tag มานานมากแล้ว

Web ในเมืองไทยปัจจุบัน(14 สิงหาคม 2551) ยังไม่มีการใช้ Tag มากนัก กลุ่มผู้ใช้งานมากๆจะอยู่กับ Blog และบทความ

นี่เป็นสถานะการของ บทความ ที่มี tag กำกับไว้่นะครับแล้ว เส้นๆคือ tag ที่เหมือนกัน จะสังเกตุได้ว่ามีความสัมพันธ์ข้องข้อมูลมากกว่า หมวดหมู่มาก นี่คือ tag tag เดียวนะครับแล้วถ้ามีหลายๆ tag จะมีความสัมพันธ์กันขนาดใหน

วิธีการใส่ tag ที่ถูกต้อง

โดยส่วนใหญ่แล้ว tag จะเป็นคำ 2-3 คำเพื่อบอก อะไรเกี่้ยวกับบทความนั้นๆ จะมีเว้นวรรคได้ และใ้ช้ตัวคอมม่า (commas) ในการแบ่ง tag แต่ละ tag ตัวอย่าง

 tag, การใส่ tag, tag คืออะไร, ประโยชน์ของ tag

เป็นต้นครับ