ในบทความนี้ คุณจะได้เรียนรู้วิธีใช้ HTML เพื่อเขียนเว็บไซต์แรกของคุณ! บทความนี้จะให้ตัวอย่างประกอบเพื่อความเข้าใจที่ดีขึ้น มาจองกันได้เลยว่าบทความนี้ถูกออกแบบมาสำหรับผู้ที่เพิ่งเริ่มเรียนรู้ HTML นอกจากนี้ เราสัญญาว่าเมื่ออ่านบทความนี้จบ คุณจะรับประกันว่าจะสร้างเว็บไซต์แรกของคุณสำเร็จ
HTML ย่อมาจาก HyperText Markup Language นั่นคือภาษาสำหรับการจัดระเบียบข้อความ
ต่างจากภาษาโปรแกรม (JavaScript, PHP ฯลฯ) ที่ใช้สคริปต์เพื่อดำเนินการบนเว็บไซต์ ภาษาสำหรับการจัดลำดับ (HTML) ใช้แท็กเพื่อทำเครื่องหมายเนื้อหาเว็บไซต์
มาเริ่มเรียน HTML กันตั้งแต่เริ่มต้น
ภาษาอังกฤษประกอบด้วยตัวอักษร A B C ฯลฯ ดังนั้น HTML จึงประกอบด้วย "ตัวอักษร" ที่แปลกประหลาด:,,
etc "ตัวอักษร" แปลกๆ เหล่านี้ของภาษา HTML นี้เรียกว่าแท็กโดยเว็บมาสเตอร์
ต่อไปนี้คือตัวอย่างแท็ก HTML
Tags สร้างการขีดเส้นใต้บริเวณขอบของข้อความนี้
แท็ก HTML ที่จับคู่กับรูปแบบภาษา CSS ช่วยให้คุณสร้างเว็บไซต์ได้อย่างรวดเร็วและมีประสิทธิภาพ
ที่ของ HTML ในภาษาอื่นๆ
อย่างที่รู้กันว่าเว็บไซต์ดีๆสร้างอย่างน้อย 5 ภาษา
เว็บไซต์ทันสมัยสร้างด้วยภาษา:
- HTML (โครงสร้างและลำดับ).
- CSS (เนื้อหาสไตล์).
- JavaScript (การทำงานของเบราว์เซอร์).
- PHP (การกระทำของเซิร์ฟเวอร์).
- SQL (ที่เก็บข้อมูล).
HTML เป็นภาษาพื้นฐานหลักที่ใช้ภาษาอื่น ดังนั้น การเรียนรู้ HTML ควรเป็นขั้นตอนแรกสำหรับทุกคนที่เรียนรู้วิธีสร้างเว็บไซต์บนเว็บ
แท็ก
ภาษา HTML มีการเปลี่ยนแปลงตลอดหลายปีที่ผ่านมานับตั้งแต่เริ่มก่อตั้ง ในขณะนี้ เว็บไซต์อินเทอร์เน็ตส่วนใหญ่กำลังเปลี่ยนไปใช้ภาษาเวอร์ชันล่าสุด - HTML5 แต่ถึงแม้จะเป็น HTML5 พื้นฐานของภาษาก็ยังคงไม่เปลี่ยนแปลง
โครงสร้างของหน้า HTML ก็เหมือนแซนด์วิช เช่นเดียวกับแซนวิชที่มีขนมปังสองแผ่น เอกสาร HTML มีแท็ก HTML เปิดและปิด
แท็กเหล่านี้ เหมือนกับขนมปังในแซนวิช ที่ล้อมรอบทุกอย่างภายใน
แท็ก
ในขณะที่คุณเรียนรู้ HTML ต่อไป คุณควรทำความคุ้นเคยกับแท็กอย่างแน่นอน ภายในแท็กหลักคือเนื้อหาทั้งหมดของไซต์ รวมทั้งแท็ก แท็กนี้จำเป็นและมีการตั้งค่าทั้งหมดของหน้าเว็บไซต์ที่เขียนแท็ก ผู้เข้าชมเว็บไซต์จะมองไม่เห็นการตั้งค่าเหล่านี้ มีเพียงเบราว์เซอร์ (Google Chrome, Mozilla Firefox ฯลฯ) เท่านั้นที่เห็น
บล็อกการตั้งค่าหน้าเว็บมีองค์ประกอบ "ไม่แสดงผล" ทั้งหมดที่ช่วยให้เบราว์เซอร์แสดงเว็บไซต์ของคุณอย่างถูกต้องบนเว็บ
ตัวเลือกทั้งหมดที่สามารถกำหนดค่าภายในแท็กเราจะดู แต่ในภายหลัง - เมื่อถึงเวลา
แท็ก
แท็ก เหมือนแท็ก อยู่ในแท็ก
แท็กนี้จำเป็นเพื่อแสดงข้อมูลทั้งหมดที่คุณต้องการแสดงบนไซต์ของคุณ
หัวเรื่อง ย่อหน้า ตาราง รูปภาพ และลิงก์เป็นเพียงส่วนเล็กๆ ขององค์ประกอบที่สามารถอยู่ภายในแท็กได้
โครงสร้างพื้นฐานของเอกสาร HTML:
… …
เว็บไซต์แรกของคุณ
ตอนนี้คุณรู้แล้วว่าคุณสามารถสร้างเว็บไซต์โดยใช้ HTML และแท็กพื้นฐานที่ใช้สำหรับสิ่งนี้:
- . กำหนดขอบเขตของหน้าเว็บ
- . ประกอบด้วยการตั้งค่าสำหรับแสดงหน้าเว็บในเบราว์เซอร์
- . ประกอบด้วยองค์ประกอบหน้าเว็บทั้งหมด (รูปภาพ วิดีโอ ข้อความ และอื่นๆ) ที่คุณต้องการแสดงต่อผู้เยี่ยมชมเว็บไซต์
แท็กอื่นๆ เช่น,,, เราจะพูดถึงเร็วๆ นี้
มันคงจะดีถ้าผู้อ่านไม่เพียงแค่อ่านบทความนี้ แต่ยังวิ่งเพื่อฝึกฝนทักษะของพวกเขาในทันที เพื่อฝึกฝนทักษะ HTML ของคุณ คุณจะต้องสร้างเว็บไซต์แรกของคุณ ซึ่งจะเป็นสนามทดสอบสำหรับทักษะใหม่ของคุณ
เป็นที่ทราบกันดีว่าผู้ให้บริการมือถือ ("MTS", "MegaFon" เป็นต้น) ให้บริการมือถือแก่เรา ในทำนองเดียวกัน ให้บริการสำหรับการสร้างและการจัดการไซต์โดยผู้ให้บริการโฮสต์ ในการสร้างเว็บไซต์ของคุณ ให้ไปที่เว็บไซต์ของผู้ให้บริการโฮสติ้งฟรีใดๆ
ผู้ให้บริการโฮสต์ที่ได้รับการยืนยัน ได้แก่ BEGET หรือreg ตัวอย่างเช่น เลือกใครก็ได้
หลังจากลงทะเบียนสั้นๆ หลังจาก 24 ชั่วโมง เว็บไซต์แรกของคุณบนอินเทอร์เน็ตจะถูกสร้างขึ้นโดยอัตโนมัติ ซึ่งจะปรากฏให้คนทั้งโลกเห็น และคุณสามารถเริ่มฝึกฝนได้!
โครงสร้างเว็บไซต์ที่ทันสมัย
เมื่อคุณมีเว็บไซต์ของคุณแล้ว ให้ตรวจดูว่าแท็กมีแท็กอะไรบ้างและแท็กเหล่านั้นจัดระเบียบข้อมูลบนเว็บไซต์อย่างไร
โครงสร้างของเว็บไซต์ที่ทันสมัย รูปภาพด้านบนคือการแสดงแผนผังของโครงสร้างที่มาพร้อมกับเวอร์ชันล่าสุดของภาษา HTML - HTML5 นอกเหนือจาก HTML5 แล้ว ไม่ใช่แค่แท็กใหม่ แต่ยังรวมถึงความหมายของการสร้างเว็บไซต์ด้วย แท็กทั้งหมดที่คุณเห็นในภาพจะอยู่ภายในแท็กหลัก แท็กเหล่านี้ช่วยคุณ "ร่าง" โครงสร้างเว็บไซต์ของคุณและให้ความหมาย
ตัวอย่างเช่น ภายในแท็ก … สะดวกในการวางชื่อเว็บไซต์ (แท็ก) และคำอธิบายเว็บไซต์ (แท็ก)
สะดวกที่จะวางเมนู (ลิงก์) ของเว็บไซต์ (แท็ก) ไว้ในแท็ก
สะดวกในการวางบล็อคข้อมูลขนาดใหญ่ที่เกี่ยวข้องกับความหมายภายในแท็ก อาจเป็นได้หลายบทความ โดยแต่ละบทความ "ห่อ" ในแท็ก หรือรูปภาพ (แท็ก) หรือตาราง (แท็ก
) และอื่นๆ
สะดวกที่จะใส่ข้อมูลในแท็กที่ไม่ตรงกับความหมายของ.
ในแท็ก เป็นเรื่องปกติที่จะใส่ข้อมูลเพิ่มเติม เช่น ข้อมูลติดต่อ ส่วนเพิ่มเติมของไซต์ และอื่นๆ
ตอนนี้คุณก็เชี่ยวชาญมากขึ้นอีกหน่อยว่าเว็บไซต์สมัยใหม่ทำมาจากอะไร มาดูตัวอย่างกันความสับสนในหัวของฉันถูกแทนที่ด้วยความกลัวจากความเข้าใจ
ดังนั้น เมื่อคุณเปิดตัวจัดการไฟล์บนไซต์ของผู้ให้บริการโฮสต์ของคุณและพบเอกสารชื่อ index.php อย่าลังเลที่จะเขียนมันลงไป ราวกับว่าสร้างโครงสร้างเว็บไซต์ของคุณขึ้นมาใหม่
เว็บไซต์แรกของฉัน
ชื่อเพจ
คำอธิบายหน้า
ลิงค์ 1 | ลิงค์ 2 | ลิงค์ 3
ชื่อบทความ
นี่คือบล็อกที่มีข้อมูลใดๆ และด้วยความช่วยเหลือของ CSS คุณสามารถกำหนดสีให้กับบล็อกนี้ และทั้งเว็บไซต์ที่มีเนื้อหาทั้งหมด ตามที่คุณต้องการ © สงวนลิขสิทธิ์
จำได้ไหมว่าเราบอกว่ามีการตั้งค่าที่แตกต่างกันสำหรับเว็บไซต์? นี่มัน:
- เราแสดงเบราว์เซอร์ที่ไซต์สามารถมีทั้งอักขระรัสเซียและอังกฤษ (มิฉะนั้น เมื่อคุณเปิดไซต์ คุณจะเห็น krakozyabry แย่มาก)
- ใช้เพื่อระบุชื่อหน้า ซึ่งจะแสดงในแท็บเบราว์เซอร์และในเครื่องมือค้นหา ("Yandex", Google และอื่นๆ)
แน่นอน หากไม่มีการจัดสไตล์ CSS เว็บไซต์ของคุณจะดูตระหนี่ (ตัวอักษรสีดำบนพื้นหลังสีขาว) แต่อย่าลืมลองเขียนหน้าแรกเป็น HTML ก่อน
ยินดีด้วย! คุณเพิ่งสร้างหน้าเว็บแรกบนเว็บไซต์ของคุณเอง! มันจะน่าสนใจมากขึ้น!