รวม 5 HTML Tag เบื้องต้น

HTML คือ ภาษาที่ใช้ในการแสดงผลต่างๆ ผ่าน Browser เบื้องหลังรูปภาพสวยๆ ข้อความยาวๆ Layout ต่างๆ ที่เราเห็นนั้นข้างหลังคือ HTML ทั้งนั้น ซึ่งการเขียนบทความบนเว็บไซต์นอกจากจะเขียนบทความให้คมแล้ว เรายังต้องทำตามข้อกำหนดของมาตรฐาน HTML อีกด้วย

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

1. heading – ไม่ใช่เพื่อขนาดตัวอักษร แต่ดีต่อใจกับ SEO

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

ทีนี้ถ้าพอเห็นภาพแล้ว เราก็ควรจะหย่อน Keyword ที่เราต้องการให้ได้ผลการค้นหาบน google ลงไปใน h1 อย่างแน่นอน และถ้าในบทความมี h2, h3 เราก็ควรหาโอกาสหย่อนลงไปเช่นกัน แต่ก็ให้พอเหมาะสม ไม่เช่นนั้นอาจถูกมองว่าเป็น spam เอาได้

heading มีให้เลือกใช้ตั้งแต่ h1-h6 ซึ่งในการเขียนคอนเทนต์นั้นเราก็ใช้กันเพียง h2, h3 เท่านั้นแหละ

2. paragraph – โปรแกรมจะรู้ทันทีว่าตรงนี้คือย่อหน้าใหม่

การขึ้น paragraph หรือย่อหน้าที่มนุษย์เข้าใจคือการเว้นระยะห่างของกลุ่มประโยคอย่างชัดเจน ทว่าคอมพิวเตอร์นั้นไม่ได้ใช้ตามองแบบเรา แต่เข้าใจเมื่อมี tag <p>…ประโยค…</p> ลักษณะอย่างนี้ต่างหาก

3. a href – ใส่ลิงก์ในข้อความ ทำได้มากกว่าที่คิด

ในส่วนของ Link Text นั้น ผมอยากให้ทุกคนใส่ทุกครั้ง ถ้า URL ที่เราลิงก์ไปนั้นมีความยาวจนน่ารำคาญ ก็ควรปรับให้สั้นลง และในส่วนของ Open Link a new tab นั้นถ้าไม่จำเป็นก็ไม่ต้องติ๊กครับ เข้าใจว่ามันสะดวก ผมก็อยากใช้ แต่ผมเองเคยใช้ tool ของ Google Check มันฟ้องว่าไม่ควร

4. img – รูปภาพสื่อความหมาย ใช้ข้อความอธิบายได้ด้วย

img เป็น tag ที่ใช้ในการแสดงผลภาพโดยการใส่ลิงก์เข้าไปใน attribute ถ้าถูกมันก็จะปรากฏภาพออกมา แต่ก็ยังมีส่วนที่สำคัญรองลงมาจากภาพ และมีความสำคัญต่อ SEO พอสมควรด้วย นั่นคือชื่อของรูปภาพที่ควรตั้งให้เข้ากับบทความ

5. svg – วาดภาพด้วย Code โคตรเล็ก โคตรชัด

เล่าถึงรูปภาพ เลยนึกถึง svg tag เป็น tag ที่ส่วนมากผู้ใช้จะเป็นโปรแกรมเมอร์ แต่ก็อยากจะให้นักเขียนทราบไว้บ้าง ปกติแล้วเราใช้ไฟล์ภาพที่เป็น .jpg กันใช่ไหมครับ ซึ่งเบื้องหลังของภาพนี้คือตัวอักษรจำนวนมากมาเรียงกัน ยิ่งตัวอักษรมาก ความละเอียดภาพยิ่งมาก ยิ่งทำให้ไฟล์มีขนาดใหญ่

ที่มาจาก https://www.rainmaker.in.th/5-basic-html-tag-for-editors/

ข้อคิดเห็น