หน้าหลักระบบพัฒนาเว็บไซต์
หน้าHOME
จะประกอบด้วยเครื่องมือต่างๆ ดังนี้ โดยจะมีเมนู อยู่ 2 ตำแหน่ง
แถบตัวเลือก สำหรับเปลี่ยนภาษาไทย - อังกฤษ
เมนูหลัก เป็นส่วนแนวนอนบนสุด จะแสดงผลทุกๆ หน้าขณะที่ท่านยัง อยู่ในระบบพัฒนาเว็บไซต์ (แนะนำควรใช้เมนูตำแหน่งนี้เป็นหลัก)
เมนู HOME จะแสดงผลเฉพาะในหน้าหลักเท่านั้น โดยจะมี - Group Menu กลุ่มเมนู - System updates ระบบอัพเดทล่าสุด - Information providers ข้อมูลผู้ให้บริการ - Solve your problem สอบถามปัญหาต่างๆ
คลิ๊กบนภาพ เพื่อดูภาพใหญ่
กดปุ่ม Play แล้วกด ปุ่ม Pause เพื่อรอให้โหลดหมดก่อน พอเล่นจะได้ไม่สะดุด
เครื่องมือ Design
มาทำความรู้จักกับเครื่องมือที่จะช่วยให้เราพัฒนาเว็บไซต์โดยหน้าตา ก็จะคล้ายๆ กับโปรแกรมออฟฟิต ทั่วไป คิดว่าทุกท่านคงผ่านตากันมาบ้างแล้ว
Shortcut พื้นฐาน
คัดลอก (Copy)
วิธี : ถ้าต้องการ copy ข้อความ รูปภาพ หรือตาราง
หลังจากคลุมข้อความ , คลิ๊กที่รูปภาพ , หรือคลิ๊กที่ขอบตาราง
ใช้ปุ่มบนคีย์บอร์ด Ctrl + C เพื่อ copy
วาง (paste)
วิธี : ถ้าต้องการ paste ข้อความ รูปภาพ หรือตาราง
คลิ๊กตรงตำแหน่งที่จะวางข้อความ ,รูปภาพ , หรือตาราง
จากนั้น ใช้ปุ่มบนคีย์บอร์ด Ctrl + V เพื่อ paste
ปุ่ม
ชื่อ
ความหมาย
ยกเลิก (Undo)
ย้อนกลับไปก่อนการแก้ไข 1 ครั้ง
ทำซ้ำ (Redo)
ย้อนกลับ Undo หากเราย้อนกลับเกินตำแหน่งไป ก็ใช้ Redo ถอยกลับมา
ตัด (Cut)
สำหรับตัดข้อความที่คลุม (เมื่อใช้จะหายไป)
ทำสำเนา (Copy) สำหรับสำเนาข้อความเดิมที่คลุม (เมื่อใช้ข้อความเดิมคงอยู่) แปะ (Paste) สำหรับวางข้อความ ทั้งกรณีที่ตัด หรือสำเนามา ตัวหนา (Bold)
ทำข้อความที่เลือกให้เป็นตัวหนา
ตัวเอียง (Italic)
เปลี่ยนข้อความที่เลือกให้เป็นตัวเอียง
ขีดเส้นใต้(Underline)
เปลี่ยนข้อความที่เลือก ให้มีขีดเส้นใต้
ขีดเส้นทับ (Strike)
เปลี่ยนข้อความที่เลือก ให้มีเส้นขีดทับข้อความ
ตัวยก (Superscript)
เปลี่ยนข้อความที่เลือกให้เป็นตัวยก เช่น 25
ตัวห้อย (Subscript)
เปลี่ยนข้อความที่เลือกให้เป็นตัวห้อย เช่น H2 O
ชิดซ้าย (left)
จัดข้อความให้ชิดช้าย
อยู่ตรงกลาง (Center)
จัดข้อความให้กึ่งกลาง
ชิดขวา (Right)
จัดข้อความให้ชิดขวา
พอดีซ้าย-ขวา(Justify)
จัดข้อความให้ปลายบรรทัดเสมอกันทุกบรรทัด
เส้นคั่น Hr
เส้นคั่น (สามารถเปลี่ยนสีได้ โดยใช้ไอคอนสีตัวอักษร) Ordered list
แสดงรายการเป็นตัวเลข เพียง Enter ก็ใส่หมายเลขข้อให้อัตโนมัติ Bulleted list
แสดงรายการเป็นปุ่ม เพียง Enter ก็ใส่ปุ่มให้อัตโนมัติ
เยื้องขวา (Indent)
จัดข้อความไปทางขวาอีกหนึ่งย่อหน้า
เยื้องซ้าย(Unindent)
จัดข้อความไปทางซ้ายอีกหนึ่งย่อหน้า
ปุ่ม
ชื่อ
ความหมาย
สีตัวอักษร (Fore color)
เปลี่ยนข้อความที่เลือกให้มีสีตัวอักษร ตามต้องการ
สีพื้นหลัง (Bg. color)
เปลี่ยนข้อความที่เลือกให้มีสีพื้นตัวอักษร ตามต้องการ
ยกเลิกแบบ html ทั้งหมด (Cleanup Html)
ล้างรูปแบบ html เช่น สีหรือขนาดตัวอักษร เป็นต้น
ยกเลิก xml ของ word
ล้างรูปแบบ xml จาก word (แนะนำ copy ข้อความจาก word ไปวางในโปรแกรม notepad จากนั้นค่อย copy ไปวางในเว็บ จะดีกว่า) iframe ใช้สำหรับสร้าง iframe แก้ไข CSS กำหนดภาพพื้นหลังขั้นสูง หรือขอบตาราง และสไตล์ชีส Insert Clock
เพิ่มนาฬิกา Flash Insert Calendar
เพิ่มปฎิธิน Flash
Insert Charmap
เพิ่มสัญลักษณ์พิเศษ สร้างภาพหรือตัวอักษรเคลื่อนที่ ใช้กำหนดการเคลื่อนที่ของข้อความ หรือรูปภาพ ได้ 4 ทิศทาง คือ ซ้าย-ขวา บน-ล่าง เส้นขอบแบบประ ใช้ขยายเซลล์ที่มีตารางวางซ้อนอยู่ แล้วต้องการแก้ไขเซลล์ที่อยู่ด้านล่าง (คลิ๊ก2ครั้ง)
ปุ่ม
ชื่อ
ความหมาย
ไฮเปอร์ลิงค์ (Link)
สร้างหรือแก้ไขลิงค์ เพื่อเชื่อมโยงไปหน้าอื่น รวมถึงการทำลิงค์ Download ยกเลิกลิงค์ (Unlink) ใช้สำหรับลบลิงค์เดิม โดยเลือกข้อความลิงค์ หรือรูปภาพลิงค์ ก่อน Anchor ลิงค์ภายในเนื้อหาเพจเดียวกัน
เพิ่มรูปภาพ (Image Insert)
ใช้เพิ่มรูปภาพ จากเครื่องคอมพิวเตอร์เรา หรือเลือกจากที่เราอัปโหลดไว้แล้ว
เพิ่มรูปภาพจาก server อื่น
เป็นภาพเบื้องต้นที่ระบบเตรียมไว้ให้เลือก โดยแบ่งออกเป็นหมวดๆ หรือกรณีเชื่อมพื้นที่กับโฮสเปล่า ก็สามารถเรียกมาใช้งานได้ ผ่านไอคอนนี้
คุณสมบัติรูปของภาพ(Image Prop.)
ใช้ดูกำหนดคุณสมบัติของภาพเช่น กว้าง ยาว แหล่งที่มา เส้นขอบ หรือระยะของภาพ เป็นต้น
แสดงไฟล์มีเดียขึ้นมา(Image Popup)
ใช้เพิ่อให้คลิ๊ก แสดงภาพใหญ่ เหมือนการดูภาพขยาย
แสดงไฟล์มีเดียขึ้นมา จาก server อื่น(Image Popup)
ใช้เพิ่อให้คลิ๊ก แสดงภาพใหญ่ เหมือนการดูภาพขยาย หรือกรณีเชื่อมพื้นที่กับโฮสเปล่า ก็สามารถเรียกมาใช้งานได้ ผ่านไอคอนนี้
เพิ่ม / แก้ไข Flash
เพิ่มหรือแก้ไขภาพเคลื่อนไหว flash
เพิ่ม / แก้ไข Vdo
เพิ่มคลิ๊ปวีดีโอตระกูล wmv ,wma ,mp3 ใช้ url ของเพลง หรือคลื่นวิทยุ มาวางได้เลย
เพิ่ม / แก้ไข Script
เพียงแค่คลิ๊กในตำแหน่งที่ต้องการให้แสดงผล จากนั้นเลือกที่ไออคอนนี้เพื่อวาง Script ที่ต้องการ ใช้ได้หมดทั้ง java / embed code / หรือ code อื่นๆ
ปุ่ม
ชื่อ
ความหมาย
Table Insert
เพิ่มตาราง ใช้สร้างตารางเพื่อการจัดวาง ภาพหรือตัวอักษรให้เป็นสัดส่วน
Table Prop.
แก้ไขคุณสมบัติของตาราง เช่น กว้าง ยาว เส้นขอบ สีพื้น ภาพพื้น ทั้งตาราง เป็นต้น
Cell Prop.
แก้ไขคุณสมบัติของเซลล์ คือแต่ละช่องของตารางก็สามารถกำหนดคุณสมบัติของตัวเองได้ ไม่ว่าจะเป็น กว้าง ยาว สีพื้น ภาพพื้น เป็นต้น Insert row เพิ่มแถวด้านบน (แถวที่เพิ่ม จะเพิ่มลงมาด้านบน จากที่ pointer กระพริบอยู่ )
Insert row
เพิ่มแถวด้านล่าง (แถวที่เพิ่ม จะเพิ่มลงมาด้านล่าง จากที่ pointer กระพริบอยู่ ) Insert column เพิ่มคอลัมภ์ด้านซ้าย (คอลัมภ์ที่เพิ่ม จะเพิ่มไปทางซ้าย จากคอลัมภ์ที่ pointer กระพริบอยู่ )
Insert column
เพิ่มคอลัมภ์ด้านขวา (คอลัมภ์ที่เพิ่ม จะเพิ่มไปทางขวา จากคอลัมภ์ที่ pointer กระพริบอยู่ )
Row Delete
ลบแถวของตาราง (ลบแถวที่เลือก)
Column Delete
ลบคอลัมภ์ของตาราง (ลบคอลัมภ์ที่เลือก)
Merge Right
รวมเซลล์ทางด้านขวา
Merge Down
รวมเซลล์ทางด้านล่าง
Split Horizontal
แบ่งเซลล์ย่อยตามแนวตั้ง
Split Vertical
แบ่งเซลล์ย่อยตามแนวนอน
ปุ่ม
ชื่อ
ความหมาย
เท็กซ์ฟิลด์ Textfield
คำสั่งนี้ใช้ในกรณีที่ต้องการให้กรอกข้อมูลที่ไม่ยาวเกินไป เช่น ชื่อนามสกุล หมายเลขบัตรประชาชน
แถบตัวเลือก Select
คำสั่งนี้ใช้ในกรณีที่มีคำตอบชัดเจนโดยสามารถเลือกคำตอบได้ เช่น วันเดือนปี อายุ จังหวัด
เท็กซ์แอเรีย Textarea
คำสั่งนี้ใช้ในกรณีที่ต้องการให้กรอกข้อมูลเป็นจำนวนมาก เช่น ข้อเสนอแนะเพิ่มเติม
เรดิโอบัตตอน Radio
คำสั่งนี้ใช้ในกรณีที่ต้องการกำหนดให้เลือกคำตอบใดคำตอบหนึ่ง เช่น เพศ ระดับการศึกษาสูงสุด เท็กซ์บ๊อก Checkbox คำสั่งนี้ใช้ในกรณีที่ต้องการให้เลือกคำตอบมากกว่า 1 คำตอบ เช่น งานอดิเรก Button คำสั่งนี้ใช้ในการสร้างปุ่มส่งข้อมูล เช่น ปุ่มตกลงส่งข้อมูล ปุ่มล้างข้อมูล
Form
ใช้สร้างคำสั่งฟอร์ม ที่เป็นเส้นประ แดงส้ม เพื่อให้ฟอร์มสามารถทำงานได้
กลุ่มเครื่องมือ และรูปแบบอักษร
แบบตัวอักษร (Font)
ตัวอักษรมาตราฐาน ของ windows ขนาดตัวอักษร (Size)
เล็กสุด ใหญ่สุด 1 - 7 ขนาดที่เห็น ทั่วไปในเว็บไซต์ เป็น ขนาด 2 ถ้าอ่านสบายตา ก็เป็น 3 ย่อหน้าใหม่ (Paragraph)
รุปแบบข้อความมาตราฐาน Normal Heading 1 Heading 2 Heading 3 Heading 4 Heading 5 Heading 6
Html and TAG แทคโมดูลต่างๆ
ใช้เพิ่ม คำสั่งโปรแกรมสำเร็จรูปต่างๆ หรือ แทคต่างๆ บนหน้าเว็บไซต์
กดปุ่ม Play แล้วกด ปุ่ม Pause เพื่อรอให้โหลดหมดก่อน พอเล่นจะได้ไม่สะดุด