List หรือ ข้อมูลที่เป็นลิสต์ (ol, ul, dl)

ในขั้นต้นของการคิดวิเคราะห์ข้อมูลที่จะนำมาทำเป็น list ในรูปแบบต่างๆ ความเข้าใจในพื้นฐานของความเป็น list คือสิ่งสำคัญ เราจะรู้ได้อย่างไรว่าอันไหนคือ list ที่ต้องเรียงลำดับ (ol) อันไหนคือ list ที่ไม่ต้องเรียงลำดับ (ul) หรืออันไหนคือ list ของข้อมูลที่มีขอบข่ายของหัวข้อและการบรรยายที่กว้างและมากออกไป (dl)

เนื้อหาในบทความนี้เราจะมาดูกันว่าเราจะเลือกใช้ Element กับข้อมูลที่เราต้องการนำเสนอให้เหมาะสมอย่างไร

List ทั้ง 3 รูปแบบ

1. ol หรือ ordered list คือ list ที่ต้องการนำเสนอแบบเรียงลำดับ เช่น ข้อ 1,2,3,… ไปเรื่อยๆ

ตัวอย่างการใช้

<h1> ข้อดีของการทำเว็บแบบ Height Accessibility </h1>
<p> การทำเว็บเพื่อให้ง่ายและมีประสิทธิภาพการเข้าถึงข้อมูล  แบบสุดยอด มีประโยชน์เป็นข้อๆ ดังนี้  </p>
<ol>
    <li>  สามารถทำให้หน้าเว็บมีคุณค่ามากกว่าเดิม  </li>
<li>  Robots ชอบใจและแวะเวียนมาเยี่ยมบ่อยกว่าเดิม  </li>
<li>  เว็บถูกหลักอนามัยเหมาะสำหรับการเข้าถึงทุกรูปแบบ  </li>
<li>  ฯลฯ </li>
</ol>

การแสดงผล Ol

ข้อดีของการทำเว็บแบบ Height Accessibility

การทำเว็บเพื่อให้ง่ายและมีประสิทธิภาพการเข้าถึงข้อมูล แบบสุดยอด มีประโยชน์เป็นข้อๆ ดังนี้

  1. สามารถทำให้หน้าเว็บมีคุณค่ามากกว่าเดิม
  2. Robots ชอบใจและแวะเวียนมาเยี่ยมบ่อยกว่าเดิม
  3. เว็บถูกหลักอนามัยเหมาะสำหรับการเข้าถึงทุกรูปแบบ
  4. ฯลฯ

ข้อมูลที่เขียนขึ้นข้างต้นจะถูกนำเสนอออกมาในลักษณะ header ของ h1, description ของ paragraph ของ p และข้อมูลที่เป็น list ที่ถูกเรียงเป็นข้อๆ 1,2,3,4… ของ ol นั่นเอง

2. ul หรือ unordered list คือ list ที่ไม่ต้องการการเรียงลำดับ แต่เน้นการนำเสนอเพื่อสร้างความเข้าใจเป็นหลัก โดยจาก ol ที่มีเลขหน้า ค่าปกติพื้นฐานจะถูกเปลี่ยนมาเป็น bullet (•) นำหน้าแทน

ตัวอย่างการใช้ ul

<h1> เอกสารที่ต้องเตรียมให้พร้อมเมื่อต้องเข้าร่วมสัมมนา  </h1>
<p> ผู้เข้าร่วมฟังการสัมมนาในครั้งนี้  ควรจะมีอุปกรณ์ส่วนตัวที่ต้องเตรียมมา เว้นแต่ว่าหามิได้ </p>
<ul>
    <li>  ถุงยางอนามัย  </li>
    <li>  ปืน </li>
    <li>  กางเกงยีนส์  </li>
    <li>  มะละกอ </li>
</ul>

การแสดงผล Ul

เอกสารที่ต้องเตรียมให้พร้อมเมื่อต้องเข้าร่วมสัมมนา

ผู้เข้าร่วมฟังการสัมมนาในครั้งนี้ ควรจะมีอุปกรณ์ส่วนตัวที่ต้องเตรียมมา เว้นแต่ว่าหามิได้

  • ถุงยางอนามัย
  • ปืน
  • กางเกงยีนส์
  • มะละกอ

ข้อมูลที่ถูกนำเสนอแบบ ul จะเน้นไปที่การนำเสนอเป็น list อย่างเดียว โดยไม่ได้เน้นว่าอะไรสำคัญ มาก่อนหลัง หรือการนับเป็นจำนวนข้อๆ ซึ่งนั่นคือข้อแตกต่างที่พอสรุปได้แบบสังเขปของการใช้ ol และ ul

จาก list ทั้งสองแบบที่กล่าวมาข้างต้น การนำเสนอข้อมูลจะถูกใช้โดย <li> หรือ list ซึ่งเป็น Definition ของทั้ง ol และ ul นั่นเอง

ในเรื่องต่อไป เราจะมาดูการใช้ dl dt dd กันครับ

Back to Top

2 Responses to List หรือ ข้อมูลที่เป็นลิสต์ (ol, ul, dl)

Leave a Reply

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

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Back to Top