บทเรียน HTML ชนิดรูปน้อย (1 : บทนำและหน้าแรก)

เมอจะขอออกตัวก่อนว่า เมอเรียน HTML ด้วยตัวเองทั้งหมด ผ่านหนังสือที่อ่านฟรีจากที่ร้านอย่าง BTS หรือ se-ed (ขอบคุณในที่นี้ที่ไม่ไล่ตะเพิดเมอเวลาว่างไปอ่านเล่น) และจากหนังสือของพี่ที่งกเอาเรื่อง (แอบแขวะ)
รวมถึง google ที่ใช้ search ข้อมูล script / tag ต่างๆ และ website อีกมากมายที่เมอไปเยี่ยมเยียนจนมี folder web tool ล้น

เมอเรียนเองแค่พอใช้งาน จึงไม่สามารถตอบละเอียดลึกหรือสอนลึกได้ และบางปัญหาเมอเองก็ยังแก้ไม่ได้รวมถึงยังไม่เข้าใจด้วยเหมือนกัน

ก่อนจะเริ่มสอน เมอจะแจ้งนิดนึงว่า
- เมอสอนแบบรูปน้อยมาก และบางครั้งอาจจะอ่านเข้าใจยาก (เมอได้รับคะแนนนิยมจากเพื่อนๆว่า ..... ไปพัฒนาการสอนซะ) ถ้าไม่เข้าใจขอให้ถามได้เลย ถ้าเมอสามารถตอบได้เมอจะตอบแน่นอน
- HTML เมอมองว่า ถ้าจะให้รู้เรื่อง สำหรับคนเริ่มเรียน ให้ทำไปพร้อมกับอ่านจะดีที่สุด ถ้าทำเป็นแล้ว จะสามารถอ่านและเห็นภาพการทำงานของมันตามได้
- เมอเป็นพวกใช้ HTML แบบถึก (หลายคนอาจจะเดาได้เลยถ้าพูดแบบนี้)
- เมอใช้ภาษาไม่เหมือนกับปกติทั่วไป อาจจะต้องเปลี่ยนแปลงเองเมื่อเรียนเพิ่มเติมที่อื่นนะ

ซึ่งตลอดการสอนของเมอ เมอจะแนะนำโปรแกรมตัวนึงที่ทุกคนที่ใช้ window มี ถ้าไม่มีหาโหลดเอาได้นั่นคือ .......... Notepad
คุณสมบัติของ Notepad นั้น เมอจะอธิบายดังนี้
1. มันไร้ซึ่งตัวช่วยในการทำ web page , HTML ใดๆ จึงเหมาะแก่การเรียนแบบถึก และทำไปเรียนไป จะทำให้เข้าใจได้ง่าย
2. มันมีติดตัว สามัญประจำ window
3. ใช้งานง่าย ไม่ต้องเรียนรู้อะไรมากเลยในการเริ่มต้นใช้งาน notepad

ก่อนอื่นก็มาตั้งค่ากับโปรแกรม notepad กันก่อน
1. พิมพ์อะไรก็ได้ใน notepad ซัก 2-3 บรรทัด
2. เลือกที่ menu Format -> Font...
3. เลือก font ที่ต้องการ ซึ่งถ้าไม่ได้รักใครชอบใครพิเศษ เมอแนะนำ Tahoma - Regular - 10 (กรณีที่พิมพ์แล้วไม่เป็นภาษาไทยให้ตั้งภาษาเป็น Thai)

Function ที่จะได้ใช้ใน Notepad ในการสอนของเมอมี 3 อย่าง
1. Format -> Word Warp มีผลทำให้เมื่อพิมพ์ไปจนถึงขอบด้านขวาของหน้า Notepad โปรแกรมจะตัดขึ้นบรรทัดใหม่ให้ (เฉพาะการแสดงผล แต่ในส่วนของข้อมูลจริงที่ save ไว้จะเป็นบรรทัดเดียวกัน) ซึ่งหากต้องการก็ตั้งได้ แต่เมอไม่ค่อยอยากแนะนำ เนื่องอาจจะทำให้เกิดความสับสนได้
2. Edit -> Find (Ctrl + F) ใช้ในการค้นหาคำหรือประโยคที่ต้องการ (ใส่ข้อความได้ 1 บรรทัดเมื่อจะค้นหา) มีประโยชน์มากถ้าไม่อยากเลื่อนหน้าจอไปมาให้ตาลาย
3. Edit -> Replace (Ctrl + H) ใช้ในการแทนที่คำที่ต้องการด้วยคำใหม่ (สามารถใช้ลบคำซ้ำๆออกได้ด้วยเช่นเดียวกันนะ เช่น ใส่คำว่า next ลงไปแล้วช่อง replace with ให้ทิ้งไว้ว่างๆ โปรแกรมก็จะลบคำว่า next ในหน้านั้นออกให้โดยนับจากตัวแรกสุดที่เจอในบรรทัดที่เริ่มค้นหา ..... ซึ่งรวมไปถึงถ้าว่า next อยู่ในคำยาวๆเช่น aaaanextdddd ระบบจะแทนที่กลายเป็น aaaadddd ไปเลย ^^")

นี่แหละ การเขียนแบบถึกๆล่ะ
จริงๆก็มีโปรแกรมอื่นที่ใช้งานได้ง่ายและสะดวกกว่า Notepad ซึ่งมี script , tag พร้อมให้เสร็จสรรพเลย แต่เมอจะไม่ขอพูดถึงมากละกัน เมอไม่เคยใช้ จะมีก็เช่น Textediter, Dream Weaver, Coffeecup HTML Editer และอื่นๆ
ซึ่งโดยมากแต่ละคนก็จะใช้แต่งกันไป Dreamweaver จะเป็นตัวหนึ่งที่ถูกพูดถึงมากที่สุดเพราะใช้งานง่ายและมีระบบสนับสนุนต่างๆครอบคลุมการเขียน website ได้อย่างดี

Cradit:mercuric