การเขียน HTML ครั้งแรกยากหรือง่าย?

กระทู้สนทนา

HTML5 HTML

มาทำความรู้จักก่อนว่า HTML เป็นภาษาโปรแกรมหรือเปล่า HTML จริงๆ แล้วเป็น Hypertext markup language ไม่ใช่ภาษาโปรแกรมทีใช้สำหรับการคำนวณหน้าที่หลักๆ ของ HTML มีไว้สำหรับจัดโครงสร้างของหน้าเว็ปของเราก่อนจะตกแต่งหรือทำให้หน้าเว็ปสามารถตอบโต้กับผู้ใช้ … ส่วนคำถามที่วามันง่ายหรือยากนั้นจริงๆ ก็ง่ายแต่จะงงๆ เมื่อเริ่มเขียนครั้งแรก

การทำงานของ HTML เป็นยังไง?

การทำงานของ HTML เป็นการใช้ Tags ในการจัดโครงสร้างของหน้าเว็ปก่อน
ตัวอย่าง :

ก็จะเห็นว่าจะใช้ <tag> และ </tag> ในการจัดโครงสร้างของหน้าเว็ปส่วน <!DOCTYPE html> ที่อยู่บนสุดของบรรทัดนั้นไม่ใช่แท็ก แต่ต้องใส่ไว้เสมอเป็นการบอกเว็บว่าหน้านี้เขียนด้วย HTML5 เพื่อให้แสดงผลได้อย่างถูกต้องนั้นเอง กลับมาที่ <tag> และ </tag> สองตัวนี้คืออะไร ?

<tag> เป็นแท็กเปิด เปิดก็ต้องปิดด้วย </tag> แค่นั้นเลย … และถ้าสังเกตดูตรง <html> ตรงบรรทัด 3 จะเห็นว่ามี lang=”en” นั้นเรียกว่า “attribute” เป็นเหมือนการกำหนดข้อมูลหรือกำหนดการตั้งค่าของ tag อะไรประมาณนั้น และมาดูกันว่าแท็กหลักๆ มีอะไรบ้างกันดีกว่า

แท็กหลักๆ มีอะไรบ้างใน HTML

แท็กหลักๆ มีดังนี้

<html> จุดเริ่มต้นของหน้าเว็บส่วน </html> จุดสิ้นสุดของหน้าเว็บมันจะคุมหลายๆ แท็ก

<head> ไว้สำหรับแท็กที่ไม่แสดงบนเว็ปเช่น <title> และอื่นๆ

<body> ไว้สำหรับแท็กที่แสดงบนเว็ปเช่น <h1> และอื่นๆ

<title> ต้องอยู่ใน <head> ใช้สำหรับตั้งชือเว็บ

เราจะตกแต่งหน้าเว็ปยังไง?

มี 2 วิธีคือการใช้แท็ก <style>...</styles> หรือ <link rel=”stylesheet” href=”styles.css”>
ตัวอย่างการใช้แท็ก <style>...</styles> :

ส่วน <link rel=”stylesheet” href=”styles.css”> นั้นคุณจะต้องสร้างไฟล์ชือ “styles” และไฟล์ต้องเป็น .css มันใช้ภาษาโปรแกรม css หลังจากนั้นก็เขียน <link rel=”stylesheet” href=”styles.css”> ลงใน <head> เพียงแค่นี้มันก็จะทำงานร่วมกันแล้ว

ทำให้หน้าเว็ปสามารถตอบโต้กับผู้ใช้ยังไง?

สามารถใช้แท็ก <script>...</script> ใส่เข้าไผใน <head> แต่แนะนำให้เขียนแยกกันจะดีกว่าด้วยการเพิ่ม attribute ชื่อว่า “src” ( ตัวอย่าง: <script src=”main.js”></script> ) และสร้างไฟล์แยกออกมาชือว่า “main” และไฟล์ต้องเป็น .js และก็เขียน script ได้เลย … เพิ่มเติมมันจะใช้ภาษาโปรแกรม JavaScript

จบ

หากมีข้อผิดพลาดหรือเขียนผิดตรงไหนสามารถคอมเม้นเพิ่มเติมได้ครับ และก็เป็นแค่ข้อมูลคร่าวๆ พอให้รู้ว่า HTML เป็นยังไงครับ