Notepad++ ข้อดี เป็นโปรแกรม Text-Editor ที่รองรับภาษาเขียนโปรแกรมมากมาย พร้อมการไฮไล้ท์ เปลี่ยนสีคำสั่ง (Syntax) เมื่อพิมพ์ถูก ให้คุณไม่พลาดการผิดพลาดที่ไม่เป็นเรื่อง มีระบบช่วยเติมคำสั่งให้ถูกต้องโดยอัตโนมัติ (Auto-Completion) เพื่อป้องกันการลืมคำสั่ง หรือการสะกดคำสั่งที่ถูกต้อง ข้อเสีย เครื่องมือในการช่วยเหลือในการเขียนโปรแกรมมีน้อย
Editplus ข้อดี สามารถใช้กับภาษาไทยได้ แยกคำสั่งต่างๆ ด้วยการแสดงสีที่ไม่เหมือนกัน ทำให้เราสามารถตรวจสอบได้ง่ายว่า เราพิมพ์ผิดที่คำสั่งไหน สามารถทำตัวเองเป็น web browser ได้ด้วย ข้อเสีย ไม่สามารถใช้กับโปรแกรมที่มีการรับ Argument ได้
Dreamweaver ข้อดี เว็บที่เราเขียนหน้าจอ Dreamweaver จะแสดงแบบเดียวกับเว็บเพจจริงๆ ช่วยให้เราเขียนเว็บเพจง่ายขึ้น ไม่ต้องเขียน Code HTML เอง มีเครื่องมือในการ Upload หน้าเว็บเพจไปที่เครื่อง Server เพื่อทำการเผยแพร่งานที่เราสร้างในอินเทอร์เน็ต โดยการส่งผ่าน FTP หรือ โดยการใช้โปรแกรม FTP ภายนอกช่วย เช่น WS FTP ข้อเสีย หน้าจอที่แสดงผลเสมือนจริง กับการแสดงผลจริงใน web browser อาจไม่ตรงกัน ขึ้นอยู่กับ web browser ที่เราใช้ด้วย
Sublime ข้อดี เร็วมาก ทั้งตอนเปิดโปรแกรม เรียกไฟล์ หรือฟังก์ชั่นต่างๆ Multiple Cursors สามารถ แก้ไขหลายๆ ที่ในทีเดียว ช่วยประหยัดเวลาได้มากๆ Minimap สำหรับดูว่าเราแก้โค้ดส่วนไหนของไฟล์อยู่ Sublime Package Control เป็น plugin ที่ช่วยให้เราควบคุม package ต่างๆ ที่เราจะลงเพิ่มใน sublime text ได้ ข้อเสีย ภาษาไทยไม่ค่อยเสถียร ไม่สามารถ Generate Project แบบ Netbeans ได้
Atom ข้อดี รองรับภาษาไทยซึ่งตัดปัญหาเรื่อง “สระลอย” แบบ sublime text ไปได้เลย editor สำหรับคนทำเว็บไซต์หรือนักเขียนโปรแกรมต่าง ๆ เมนูการใช้งานคล้ายๆกัน shortcut key คล้ายๆ กันกับ sublime ทั้งหมดรองรับมัลติมีเดีย เช่น การใส่เสียง, การแทรกไฟล์วิดีโอ, การใช้งานร่วมกับโปรแกรม Flash, Fireworks Training ข้อเสีย ภาษาบางตัวไม่ support และhd โหลดน้อย
แนวทางในการศึกษาเว็บไซต์ชื่อ
www3school
อธิบายหน้าที่และประโยชน์ของโปรแกรม
1. FileZilla โปรแกรมสำหรับเคลื่อนย้ายไฟล์ระหว่างเครื่องของเรากับ server เพื่อดาวน์โหลดหรืออัปโหลดไฟล์ โดยเฉพาะกับเว็บไซต์ ทำให้เหมาะสำหรับนักออกแบบ
1. FileZilla โปรแกรมสำหรับเคลื่อนย้ายไฟล์ระหว่างเครื่องของเรากับ server เพื่อดาวน์โหลดหรืออัปโหลดไฟล์ โดยเฉพาะกับเว็บไซต์ ทำให้เหมาะสำหรับนักออกแบบ
2. TeamViewer การควบคุม หรือ ใช้เครื่องคอมพิวเตอร์ร่วมกัน สำหรับสอน แก้ไข สำธิต และอื่นๆ ในระยะไกล
3. Dream weaver สร้างเว็บเพจแบบเสมือนจริง มีฟังก์ชันที่ทำให้ผู้ใช้สามารถจัดวางข้อความ รูปภาพ ตาราง ฟอร์ม วิดีโอ รวมถึงองค์ประกอบอื่น ๆ ภายในเว็บเพจได้อย่างสวยงามตามที่ผู้ใช้ต้องการ โดยไม่ต้องใช้ภาษาสคริปต์ที่ยุ่งยากซับซ้อน
4. Sniping Tools เป็นเครื่องมือสำหรับ Screenshot หน้าจอคอมพิวเตอร์ เริ่มใช้งานมาตั้งแต่ Windows Vista มาจนถึงปัจจุบัน โดยท่านสามารถเลือกรูปแบบในการ Screenshot ได้ 4 รูปแบบ ประกอบด้วย Free-form, Rectangular, Window และ Full screen มีเครื่องมือ Snipping Tool Editor สำหรับคอมเม้น หรือ ไฮน์ไลน์ข้อความก่อนบันทึกข้อมูล สำหรับชนิดของไฟล์ที่โปรแกรมรองรับได้แก่ PNG, GIF, JPEG และ HTML
ภาษา HTML : ( Hyper Text Markup Language) คือ ภาษาในการเขียนเว็บไซต์
มีโครงสร้าง 2 ส่วน คือ แทก head กับ Body ตัวอย่างโครงสร้างภาษา Html เขียนคำสั่งดังนี้
<html>
<head> <title>หัว</title></head>
<body>
เนื้อหา
</body>
</html>
ตัวอย่าง Tag พื้นฐานภาษา HTML
2.การใส่รูปภาพ 01.jpg ในเพจ เขียนคำสั่ง อย่างไร
<img src= “01.jpg”>
<img src= “01.jpg”>
3.เขียนโครงสร้างของ Tag ตาราง 2 แถว 3 คอลัมน์
<table>
<tr>
<td>1</td><td>2</td><td>3</td>
</tr>
<tr>
<td>1</td><td>2</td><td>3</td>
</tr>
</Table>
Tag <p> กับ Tag <br> ต่างกันอย่างไร
<p> ย่อหน้า </p> ห่าง 1 บรรทัด
<br> ขึ้นบรรทัดใหม่
tag <H> คือ กำหนดขนาดตัวอักษร <H1><H5>(ใหญ่ ไปเล็ก)
ตัวอย่างใช้งาน <h1>ใหญ่สุดๆ</h1>
Tag Form คือ สำหรับการรับค่าจากผู้ใช้
ตัวอย่าง การใช้งานหรือรูปแบบ
<form medthod= “POST” action= “file.php”>
<input type= “text” name= “code”>
</form>
Cascading Style Sheets คือ ภาษาสำหรับการจัดรูปแบบเว็บไซต์
ประโยชน์
เพื่อช่วยการทำงานในการเขียนภาษา html จัดรูปแบบของเว็บไซต์ให้สวยงาม
