<figure>
figure ซึ่งส่วนใหญ่จะคิดว่าเป็นแทกที่บ่งบอกภาพของเนื้อหาในเพจนั้นๆ เพียงอย่างเดียว ที่จริงมันไม่ใช่อย่างนั้นครับ ถูก แต่ถูกไม่หมด figure ยังใช้บ่งบอกความหมายนอกเหนือจากภาพได้ครับ
figure นั้นจะแสดงเนื้อหาที่เกี่ยวข้องกับเนื้อหาหลัก เช่นรูปภาพประกอบเนื้อหา ซึ่งอาจจะวางตำแหน่งไว้ส่วนไหนของเพจก็ได้
ส่วนลำดับความสำคัญนั้น ให้เราดูว่าเมื่อนำข้อมูลใน figure ออกนั้น เนื้อหาหลักรวมๆ ของเพจนั้นก็ยังไมไ่ด้มีการเปลี่ยนแปลง หรือมีผลกระทบอะไรมากมาย เช่นนั้นเราก็สามารถใช้ figure ได้
figure นี้ใช้กับหลักๆ คือ
- บ่งบอกภาพในเพจ
- บ่งบอกโค๊ด โปรแกรมที่แสดงในเพจ
- บ่งบอกคติ หรือวลีของบทกลอนต่างๆ
- chart หรือ แผนผัง ไดอะแกรมต่างๆ
figcaptionนั้น ใช้อธิบายเพิ่มเติมเนื้อหาของ figure อีกทีนืงครับมีก็ได้ไม่มีก็ได้ ถ้ามีก็ ใส่ใน figure ได้เลยเช่น
<figure>
<img src="images/box-img.png">
<figcaption>ภาพแสดงรูปกล่อง</figcaption>
</figure>
หรือตัวอย่างนี้ใช้ figure กับกลอน
<figure>
"คุณกำหนดคนที่จะเข้ามาในชีวิตคุณไม่ได้
แต่คุณเลือกตัดเขาออกไปจากชีวิตของคุณได้"
</figure>
หรือตัวอย่างนี้ใช้ figure กับ code คอมพิวเตอร์
<figure>
$i = 10;
$j = 20;
echo $i+$j;
<figcaption>ตัวอย่างการ echo ด้วยตัวแปรใน php</figcaption>
</figure>
ง่ายๆ นะครับ figure นั้น คืออะไรก็ได้ ที่เราบังคับเอากรอบใส่มันเป็นภาพ ไม่
ว่าจะเป็นตัวอักษร หรือโค๊ดโปรแกรม หรืออะไรก็ตาม
ให้คิดภาพว่า figure เป็นกรอบรูป แล้วเราเอากรอบรูปนี้ไปครอบกับอะำร
ก็ตาม สิ่งที่อยู่ในกรอบรูปจะกลายเป็นภาพทันที น่าจะพอเข้าใจได้บ้างแล้วนะครับ
และเมื่อเราครอบ figure หน้าที่ของสิ่งที่เราครอบจะกลาย
เป็นแค่ ภาพประกอบของบทความ หรือหน้าเพจก็เท่านั้น
เองครับ
<aside>
tag aside หมายถึง เน้อหาที่อาจจะไม่ใช่ประเด็นหลักของหน้านั้นๆ เราจึงนำมันมาอยู่ในภายใต้ tag aside เช่น sidebar ด้านขวามือของเว็บ ซึ่งส่วนใหญ่ด้านขวามือของเว็บไซต์นั้นจะเป็นพวก ติดต่อเราผ่าน Social media พวกติดต่อเราทาง facebook, twitter, บุคมาร์กต่างๆ แต่ aside ก็ไม่ได้มีความหมายแค่นั้น อาจจะวางไว้ตรงอื่นที่ไม่ใช่ sidebar ของเว็บก็ได้เช่น
<article>
<h1>aside ใช้ทำอะไร</h1>
<p>aside มีหน้าที่แบ่งแยกเนื้อหาที่ไม่ใช่เนื้อหาหลักของหน้าเพจนั้นๆ</p>
<aside>แชร์หน้านี้ :: ตอบกลับ </aside>
</article>
ด้านบนนี้ aside ใช้ทำหน้าที่ใน article ซึ่งบ่งบอกว่า การแชร์หน้านี้ หรือการกดเพื่อตอบกลับ ไม่ใช่เนื้อหาที่แท้จริงของตัว article นั้นๆ ครับ
แท็ก article
<article>
Tag นี้มีไว้เพื่อหุ้มเนื้อความหลักในเพจ โดยทั่วไปอาจจะมี section อยู่ใน article อีกทีก็ได้
อีกทั้ง article ยังใช้งานเกี่ยวกับพวก comment news blog post forum ของเว็บอีกด้วย
ตัวอย่าง การใช้ Article เพื่อบ่งบอกเนื้อความหลัก
<article>
<h1>Article มีไว้เพื่อ</h1>
<p>Tag นี้มีไว้เพื่อหุ้มเนื้อความหลักในเพจ โดยทั่วไปอาจจะมี section อยู่ใน article อีกทีก็ได้
อีกทั้ง article ยังใช้งานเกี่ยวกับพวก comment news blog post forum ของเว็บอีกด้วย
</p>
</article>
ตัวอย่างการใช้ Article ร่วมกับ Section
<article>
<h1>Article มีไว้เพื่อ</h1>
<p>Tag นี้มีไว้เพื่อหุ้มเนื้อความหลักในเพจ โดยทั่วไปอาจจะมี section อยู่ใน article อีกทีก็ได้
อีกทั้ง article ยังใช้งานเกี่ยวกับพวก comment news blog post forum ของเว็บอีกด้วย หลักๆ แบ่งวิธีใช้เป็นสองประเภทดังนี้
</p>
<section>
<h2>Article ใชักับเนื้อความหลักของเพจ</h2>
<p>ส่วนใหญ่เนื้อความหลักของหน้านั้นๆ ควรคุมไว้ด้วย Article อยู่แล้ว</p>
</section>
<section>
<h2>Article ใชักับคอมเมนท์ของเพจนั้นๆ</h2>
<p>เช่น พวกการโพสคอมเมนท์ในเว็บ 2.0 เป็นต้น</p>
</section>
</article>
ดังนั้น ก็ขึ้นอยู่กับเราด้วยครับว่าใช้แบบไหนจะเหมาสมที่สุด ซึ่งตัวอย่างที่ผมกล่าวมา เป็นตัวอย่างที่ใชักันมากสุดครับ
