XHTML กับ CSS แล้วมันดีกับ Search Engine (SEO) ยังไง

เห็นด้วยกับทุกท่านครับ ดีใจที่เห็นคนไทยมีคนสนใจ XHTML กับ CSS และพยายามใช้ให้ถูกต้อง เพราะประเทศอื่น ๆ เขาไปกันไกลแล้ว จริง ๆ ผมเคยคิดที่จะทำเว็บเช่นนี้เหมือนกัน แต่ไม่มีเวลา ก็เลยล้มเลิกไป แต่ตัวผมเองนั้นก็ศึกษา XHTML, CSS และ WCAG 1.0 + WCAG 2.0 มามากกว่า 5 ปีแล้ว (พอดีว่าทำงานในองค์กรคนพิการ แล้วเขามีข้อบังคับว่า ต้องรู้จัก 3 ตัวนี้ซึ่งมีส่วนช่วยให้คนพิการเข้าถึงข้อมูลข่าวสารจากเว็บได้สะดวกขึ้น)

แต่พอได้ทำแล้วก็รู้สึกชอบมากเลยครับ มันทำให้เราสามารถทำเว็บได้เร็วขึ้น แก้ไขอะไรก็ง่ายขึ้น ฯลฯ มีข้อดีหลายอย่าง บรรยายไม่หมดบางคนอาจสงสัยว่า ถ้าใช้ XHTML กับ CSS แล้วมันดีกับ Search Engine ยังไง อันนี้ก็เป็นเพราะว่า

  1. XHTML นั้นจะมีข้อมูลที่เป็นเท็กซ์มากกว่าเว็บทั่ว ๆ ไป ทำให้ Search Engine หาข้อมูลได้ง่ายกว่า
  2. XHTML เป็นภาษาแบบ Semantic ทำให้ Search Engine เข้าใจโครงสร้างเอกสารได้ง่ายขึ้น รู้ว่าข้อความใดมีความสำคัญมากน้อยจากการใช้ Tag ของเราในการ Mark up
  3. CSS ช่วยทำหน้าที่ในการแสดงผลข้อมูล (การตกแต่ง) ทำให้เนื้อหาและข้อมูลถูกแยกออกจากกัน วิธีนี้จะทำให้ Search Engine หาข้อมูลได้แม่นยำขึ้น ไม่ต้องเสียเวลาในการคัดแยกโค้ดขยะที่ไม่จำเป็นออกไปก่อน

อย่างไรก็ตาม การทำ Mark up เอกสารนั้น จริง ๆ แล้วเป็นเรื่องที่เราควรจะซีเรียสนะครับ เห็นหลายเว็บแล้ว แม้ว่าเว็บจะดูสวย ข้อมูลเป็นระเบียบ ผ่านการตรวจสอบของ W3C แล้ว แต่ การ Mark up เอกสารก็ยังไม่ Make sense อยู่ดี ที่พบบ่อยมากคือ การใช้แท็กผิดวัตถุประสงค์ เช่น

  1. ข้ามลำดับ Heading เช่น ไม่ยอมใช้ <h1> แต่ใช้ <h2> หรืออื่น ๆ แทน หรือบางคนข้ามจาก <h2> ไป <h4> หรืออื่น ๆ
  2. การใช้แท็กเปล่า ไม่มีข้อความใด ๆ (โดยมากมักใช้ทำบรรทัดว่าง) นั้นก็พบได้บ่อย ซึ่งไม่ควรทำ
  3. การใช้ <br /> ในการทำย่อหน้า อันนี้ก็ไม่ควร เพราะไม่ใช่หน้าที่ของ <br />
  4. ใช้ Text เปล่า ๆ โดยไม่มีการ Mark up คือไม่ใช้แท็กอะไรเลย ทำให้ไม่ทราบว่า ข้อความเหล่านั้นทำหน้าที่อะไรในเอกสาร
  5. ภาพที่ไม่มีคำอธิบายภาพ เช่น <img src=”somepic.jpg” /> ซึ่งที่ถูกต้องคือ <img src=”somepic.jpg” alt=”ดอกกุหลาบสีแดง” /> เพื่อเอื้ออำนวยให้คนพิการทางสายตาสามารถเลือกอ่านข้อมูลนี้แทนได้ (เพราะโปรแกรมสังเคราะห์เสียงไม่สามารถเข้าใจโค้ดรูปภาพได้)ฯลฯ

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

Back to Top

13 Responses to XHTML กับ CSS แล้วมันดีกับ Search Engine (SEO) ยังไง

  1. annimal

    WCAG : โปรดเอื้อเฟื้อแก่ผู้พิการด้วยนั่นเอง

    Reply

  2. radiz

    อืมนะตั้งแต่อ่านมาทำผิดอยู่ข้อนึง 555+

    Reply

  3. iake

    ทำข้ามไปอันนึง

    Reply

  4. norm

    555 *-* กฎเค้ามีไว้แหก(คำแก้ตัวของคนที่ทำไม่เป็น)

    Reply

  5. noob

    ขอถามแบบโง่ ๆ นะครับ สองบรรทัดข้างบนสุดของ source มีไว้เพื่ออะไรครับ

    Reply

  6. ซาร่า

    ความคิดเห็นที่5

    ขอถามแบบโง่ ๆ นะครับ สองบรรทัดข้างบนสุดของ source มีไว้เพื่ออะไรครับ

    โดย noob | เมื่อ 2007-06-28 23:48:08

    ——————–

    พระเจ้าช่วยกล้วยทอด

    พระเจ้าจอร์ช มันทอดยาก

    ใครว่าเราแกล้งโง่

    Reply

  7. โดม

    ชอบมากจอร์ช

    Reply

  8. โดม

    ความคิดเห็นที่

    5

    ขอถามแบบโง่ ๆ นะครับ สองบรรทัดข้างบนสุดของ source มีไว้เพื่ออะไรครับ

    ———————-

    ลองอ่านบทความเรื่อง DDT เอ๊ย DTD ก่อนนะครับ

    Reply

  9. sarawoot

    ขอบคุณสำหรับข้อมูลดีๆๆครับ เด็กเทคนิค

    Reply

  10. Woody

    หมายถึงอันนี้หรือเปล่าครับ (2 บรรทัดที่ว่า)

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"&gt;

    ประโยชน์ก็คือ บอกประเภทเอกสารให้บราวเซอร์ (หรือโปรแกรมอื่น ๆ) ทราบว่าเป็นเอกสารประเภทไหน ถ้าต้องการตรวจความถูกต้องของเอกสาร จะใช้ไฟล์ DTD ตัวไหน (ในตัวอย่างได้อ้างอิงไฟล์http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtdซึ่งเป็น DTD ของ XHTML 1.0 Strict) เท่าที่ทราบก็มีเท่านี้ครับ แต่คิดว่าน่าจะมีประโยชน์อย่างอื่นอีก

    Reply

  11. jommann

    อย่างที่ว่าแหละครับ เขียนโปรแกรมมาก้อเยอะ บางครั้งก้อเผลอ เขียนซะ ตัวเองอ่านไม่ออกซะงั้น

    Reply

  12. weerachat

    รู้สึกว่าการที่เราเขียน Code อย่างถูกต้องก็เป็นการช่วยเหลือคนอีกหลายประเภทที่มีปัญหาทางร่างกาย …

    Reply

  13. por

    อ่านเข้าใจได้ ทันทีเป็นบทความที่ดีอีกบทความหนึ่งครับ

    Reply

Leave a Reply

Your email address will not be published. Required fields are marked *

Connect with Facebook

Back to Top