กระบวนการ 13 ขั้นตอนในการพัฒนาเว็บไซต์
Phase 1 สำรวจปัจจัยสำคัญ (Research)
1. รู้จักตัวเอง – กำหนดเป้าหมายและสำรวจความพร้อม
2. เรียนรู้ผู้ใช้ – ระบุกลุ่มผู้ใช้และศึกษาความต้องการ
3. ศึกษาคู่แข่ง – สำรวจการแข่งขันและเรียนรู้คู่แข่งสิ่งที่ได้รับ
สิ่งที่ได้รับ
1. เป้าหมายหลักของเว็บไซต์
2. ความต้องการของผู้ใช้
3. กลยุทธ์ในการแข่งขัน
Phase 2 : พัฒนาเนื้อหา (Site Content)
4. สร้างกลยุทธ์การออกแบบ
5. หาข้อสรุปขอบเขตเนื้อหา
สิ่งที่ได้รับ
1.แนวทางการออกแบบเว็บไซต์
2.ขอบเขตเนื้อหาและการใช้งาน
3.ข้อมูลที่ถูกจัดอย่างเป็นระบบ
Phase 3 : พัฒนาโครงสร้างเว็บไซต์ (Site
Structure)
6. จัดระบบข้อมูล
7. จัดทำโครงสร้างข้อมูล
8. พัฒนาระบบเนวิเกชัน
สิ่งที่ได้รับ
1.แผนผังโครงสร้างข้อมูล
2.แนวทางการท่องเว็บ
3.ระบบเนวิเกชัน
Phase 4 : ออกแบบและพัฒนาหน้าเว็บ (Visual
design)
9. ออกแบบลักษณะหน้าตาเว็บเพจ
10. พัฒนาเว็บต้นแบบและข้อกำหนดสุดท้าย
สิ่งที่ได้รับ
1.ลักษณะหน้าตาของเว็บไซต์
2.เว็บเพจต้นแบบที่จะใช้ในการพัฒนา
3.รูปแบบโครงสร้างของเว็บไซต์
4.ข้อกำหนดในการพัฒนาเว็บไซต์
Phase 5 : พัฒนาและดำเนินการ (Production
and Operation)
11. ลงมือพัฒนาเว็บเพจ
12. เปิดตัวเว็บไซต์
13. ดูแลและพัฒนาต่อเนื่อง
สิ่งที่ได้รับ
1.เว็บไซต์ที่สมบูรณ์
2.เปิดตัวเว็บไซต์และทำให้เป็นที่รู้จัก
3.แนวทางการดูแลและพัฒนาต่อไป
ออกแบบกราฟฟิกสำหรับเว็บไซต์
รูปแบบกราฟฟิกสำหรับเว็บ
รูปแบบหลักมี 2
ประเภท คือ GIF และ JPG
GIF ย่อมาจากคำว่า
Graphic Interchange Format ได้รับความนิยมในยุคแรก มีระบบสีแบบ Index ซึ่งมีข้อมูลสีขนาด
8 บิต ทำให้มีสีมากสุด 256
สี มีการบีบอัดข้อมูลตามแนวของพิกเซล
เหมาะสำหรับกราฟฟิกที่ประกอบด้วยสีพื้น
JPG ย่อมาจากคำว่า
Joint Photographic Experst Group
มีข้อมูลสีขนาด 24
บิต (True Color) สามารถแสดงสีได้ถึง 16.7ล้านสี ใช้ระบบการบีบอัดที่มีลักษณะที่สูญเสีย (lossy) ไฟล์ประเภทนี้ควรนำไปใช้กับรูปถ่ายหรือกราฟฟิกที่มีการไล่ระดับสีอย่างละเอียดระบบการวัดความละเอียดของรูปภาพ
ระบบการวัดความละเอียดของรูปภาพที่แสดงผลบนมอนิเตอร์ควรใช้หน่วย pixel
por inch (ppi) การใช้งานจะนำหน่วย
dor per inch (dpi) ซึ่งเป็นหน่วยวัดความละเอียดของสิ่งพิมพ์มาใช้งานแทน
ppi ความละเอียดของรูปภาพที่ใช้ในเว็บไซต์ควรมีความละเอียดแค่
72 ppi
จัดรูปแบบตัวอักษรสำหรับเว็บไซต์ Typography
on the Web)
· ตัวอักษรมีหลายชนิด
แต่ละชนิดจะให้อารมณ์และความรู้สึกที่แตกต่างกัน ควรเลือกใช้ตัวอักษรให้
เหมาะสมกับเนื้อหาและข้อมูลที่ต้องการสื่อ
· ตัวอักษรมีความสำคัญในการสื่อข้อความถึงผู้ใช้
ส่วนประกอบของตัวอักษร
Ascender : ส่วนบนของตัวอักษรพิมพ์เล็กที่สูงกว่าความสูง
x-height ของตัวอักษร
Descender : ส่วนล่างของตัวอักษรพิมพ์เล็กที่ต่ำกว่าเส้น
baseline
Baseline : เส้นสมมติที่ตัวอักษรส่วนใหญ่ตั้งอยู่
Cap height : ความสูงจากเส้น baseline
ไปถึงส่วนบนสุดของตัวอักษรพิมพ์ใหญ่
X-height : ความสูงของตัวอักษร x ในแบบพิมพ์เล็ก
ซึ่งมักใช้อ้างถึงความสูงของตัวอักษรที่ไม่รวม ascender และ
descender
Point size : ระยะความสูงทั้งหมดวัดจากส่วนบนสุดถึงส่วนล่างสุดของตัวอักษร
ค่าความสูง x-height : จะมีผลต่อภาพรวมของตัวอักษรและความยากง่ายในการอ่าน
ความสะดวกในการอ่าน (Legibility)
·
หลีกเลี่ยงการใช้คำที่เป็นตัวพิมพ์ใหญ่ทั้งหมด
เพราะจะทำให้อ่านยาก และลดความสะดุดตาลง
· การใช้ตัวพิมพ์เล็กทั้งหมดในประโยค
จะสร้างความรู้สึกไม่เป็นทางการ และแสดงถึงความไม่สมบูรณ์ของเนื้อหา
· การใช้ตัวพิมพ์ใหญ่สำหรับตัวอักษรตัวแรกของแต่ละคำในประโยค
ควรใช้อย่างจำกัด เพราะเป็นการรบกวนรูปแบบโดยรวมของคำ ส่งผลให้อ่านยากขึ้น
· ไม่ควรแบ่งครึ่งสีตัวอักษรเพราะทำให้ภาพรวมของตัวอักษรขาดหายไป
สิ่งที่ควรคำนึงในการจัดข้อความให้หน้าเว็บ
· การจัดตำแหน่ง
(Alignment)
· ช่องว่างระหว่างตัวอักษร
และช่องว่างระหว่างคำ
· การจัดตำแหน่งแบบ
justify ทำให้เกิดช่องว่างของแต่ละคำ
· ระยะห่างระหว่างบรรทัด
· ความยาวของหน้าเว็บ
· ขนาดของตัวอักษร
· ดึงดูดความสนใจด้วยอักษรตัวใหญ่
· การเน้นข้อความให้เด่นชัด
· การใช้สีกับตัวอักษร
· การกำหนดขอบแบบ
Aliased และ Anti-aliased
คำแนะนำในการใช้ตัวอักษรในหน้าเว็บ
· ไม่ควรใช้ตัวอักษรชนิดที่หายากหรือไม่ได้มาพร้อมกับโปรแกรมต่างๆหรือเครื่องคอมฯ
· ระบุชนิดตัวอักษรให้ครอบคลุม
· กำหนดลักษณะของตัวอักษรที่อยู่ในทุกช่องของตาราง
· ระบุขนาดของตัวษรเสมอ
· ใช้
CSS ในการควบคุมรูปแบบการแสดงผล
ไม่มีความคิดเห็น:
แสดงความคิดเห็น