ก่อนอื่นเราของอนุญาตแทนตัวเองว่า “โซวอน” นะคะ โซวอนว่าในปัจจุบันคงมีคนอยากทำเว็บเองมากขึ้นแน่นอน เนื่องจากค่าจ้างโปรแกรมเมอร์ในการเขียนเว็บนั้นช่างแพงแสนแพง วันนี้โซวอนเลยอยากเขียนบทความเกี่ยวกับพื้นฐานที่ควรรู้ของ ภาษา HTML ขึ้นมาให้เพื่อน ๆ ได้เรียนรู้กัน เพราะโซวอนก็เรียนอยู่ในสายที่เกี่ยวข้องกับการเขียนโปรแกรม เลยอยากมาแบ่งปันความรู้ให้เพื่อน ๆ ได้เรียนรู้กัน แต่ก่อนที่จะเข้าสู่เนื้อหา เพื่อน ๆ คงสงสัยกันว่า เฮ้ย!!! HTML ที่ว่านี่คืออะไร มันทำอะไร ทำไมคนที่จะเขียนเว็บต้องรู้จักมัน ภาษา HTML หรือ Hypertext Markup Language เป็นภาษาหลักที่ใช้ในการแสดงผลบนเว็บบราวเซอร์ในอินเตอร์ โดยสามารถนำเสนอข้อมูลตัวอักษร ตาราง ลำดับ รวมทั้งเชื่อมต่อเพื่อ แสดงภาพ, เสียง และไฟล์ในรูปแบบอื่น (ลักษณะการเขียนของภาษา html)สำหรับตัวโซวอนเอง โซวอนมองว่าการเขียน HTML โซวอนไม่ได้ศึกษาเพียงแค่ต้องการที่จะเขียนเว็บเท่านั่น HTML ยังช่วยเราในเรื่องอื่น ๆ อีกด้วยเช่น การเข้าดู code ของหน้าเว็บไซต์ต่าง ๆ ตกใจใช่ไหมล่ะคะ ที่เราสามารถดู code ของเว็บไซต์อื่นได้ จนบางครั้งเรายังสามารถแก้ไข้ code ได้อีกด้วยนะ เดี๋ยวเราจะบอกวิธีการทำหลังจากที่เพื่อน ๆ รู้พื้นฐานกันบ้าง หลังจากจบเนื้อหาเราจะบอกนะ เอาละเพื่อน ๆ คงพอจะรู้จัก HTML ขึ้นมาบ้างแล้วแหละ งั้นต่อไปเรามาเข้าสู้เนื้อหาที่เป็นพื้นฐานของ HTML กันเลยภาษา html จะมีฟอร์มในการเขียนดังนี้ หัวข้อเรื่อง ของหน้านี้ เนื้อหาที่จะแสดงใน web browser จากตัวอย่างข้างบนจะเห็นได้ว่า ถ้าหากเราต้องการที่จะเขียนเนื้อหาที่จะให้แสดงในเว็บก็ต้องเขียนภายใต้ tag body จาก code ข้างบนถ้าเรานำไปแสดงบนเว็บเพจจะได้เว็บที่มีลักษณะดังรูปต่อไปนี้รูปภาพโดย SONE4EVA ในภาษา html เขาจะเรียก <> ว่า tag ซึ่งในแต่ละ tag นั้นก็จะมีความหมายและการแสดงผลที่แตกต่างกันไปต่อไปเราจะมาเรียนรู้กันว่าใน ภาษา html มี tag อะไรบ้างและแสดงผลอย่างไรมาเริ่มกันที่ tag h1, h2, h3, h4, h5, h6 tag พวกนี้ก็จะเป็น tag ที่ใช้กำหนดขนาดตัวอักษรวิธีการใช้ Page Title h1 h2 h3 h4 h5 h6 ผลลัพธ์รูปภาพโดย SONE4EVA ต่อไปคือ tag นี้เป็นตัวกำหนดย่อหน้าวิธีการใช้ Page Title p1 p2 ผลลัพธ์รูปภาพโดย SONE4EVA ต่อไปคือ เป็น tag ที่เชื่อมไปยังเว็บอื่นด้วยลิ้งค์ หรือ หน้าอื่นวิธีการใช้ Page Title This is a link ผลลัพธ์รูปภาพโดย SONE4EVA เมื่อเราคลิ๊ก this is a link ก็จะไปยังหน้า link ที่เราใส่ ต่อไป เป็น tag ใส่รูปวิธีการใช้ Page Title ผลลัพธ์รูปภาพโดย ka_re จาก Pixabay ต่อไปเป็น tag แสดงปุ่มกดวิธีการใช้ Page Title Click me ผลลัพธ์รูปภาพโดย SONE4EVA ต่อไปเป็น tag แสดงลิสต์จุด ที่ใช้งานร่วมกับ tag li เป็น tag ที่บอกว่าขอข้อมูลอยู่ในลิสต์เดียวกันวิธีการใช้ Page Title Coffee Tea Milk ผลลัพธ์ รูปภาพโดย SONE4EVA และสุดท้าย tag แสดงอันดับ ที่ใช้งานร่วมกับ tag li เป็นtagที่บอกว่าขอข้อมูลอยู่ในลิสต์เดียวกันวิธีการใช้ Page Title Coffee Tea Milk ผลลัพธ์ รูปภาพโดย SONE4EVA จบกันไปแล้วสำหรับเนื้อหาเบื้องต้นที่เราบอก ต่อมาหลังจากที่เราได้บอกกับเพื่อน ๆ ไว้ว่าเราจะพาเพื่อน ๆ ไปดู code และ แก้ไข้ code ของเว็บไซต์อื่นกัน สิ่งแรกที่เพื่อน ๆ ต้องทำนั่นคือ กด F12 หลังจากที่เรากดเสร็จเราจะเห็น code เหมือนรูปด้านล่าง แค่นี้เองง่ายใช่ไหมล่ะ รูปภาพโดย SONE4EVA ทีนี้เราจะแก้คะแนนเพื่อไปอวดเพื่อน ๆ ของเรา แล้วมันจะแก้ยังไงล่ะ เราขอบอกเลยว่ามันไม่ยากเลยเพียงเราใช้ความรู้ที่เราสอนไปข้างบนก็จะสามารถทำได้แล้ว แต่หลายคนอ่าจจะยังไม่รู้เดี๋ยวเราบอก สิ่งที่ต้องทำก็คือ หาตัวเลข 101 ให้เจอเสร็จแล้วพิมพ์แก้ใหม่ แค่นี้เองง่ายใช่ไหมล่ะรูปภาพโดย SONE4EVAคะแนนเราเยอะขึ้นไหม ^ ^เป็นยังไงกันบ้างคะเพื่อน ๆ เราหวังบทความบทนี้จะช่วยเพื่อน ๆ มีความรู้และเข้าใจ HTML มากยิ่งขึ้นนะคะรูปภาพหน้าปก รูปภาพโดย tookapic จาก Pixabay -->>>