Web Design
กระบวนการพัฒนาเว็บไซต์
การจัดระบบโครงสร้างข้อมูล คือการพิจารณาว่า เว็บควรจะมีข้อมูลและการทำงานใดบ้าง โดยเริ่มจากการกำหนดเป้าหมาย กลุ่มผู้ใช้เป้าหมาย เนื้อหาและการใช้งานที่จำเป็น นำมาจัดกลุ่มให้เป็นระบบเป็นพื้นฐานในการออกแบบเว็บไซต์ที่ดี มีทั้งหมด 5 Phase
Phase 1 : สำรวจปัจจัยสำคัญ (Research)
1. รู้จักตัวเอง-กำหนดเป้าหมายและสำรวจความพร้อม
2 .เรียนรู้ผู้ใช้-ระบุกลุ่มผู้ใช้และศึกษาความต้องการ
3. ศึกษาคู่แข่ง-สำรวจการแข่งขันและการเรียนรู้คู่แข่ง
สิ่งที่ได้รับ
- เป้าหมายหลักของเว็บ
- ความต้องการของผู้ใช้
- กลยุทธ์ในการแข่งขัน
Phase 2 : พัฒนาเนื้อหา (Site Content)
4 .สร้างกลยุทธ์การออกแบบ
5 .หาข้อสรุปขอบเขตเนื้อหา
สิ่งที่ได้รับ
- แนวทางการออกแบบเว็บ
- ขอบเขตเนื้อหาและการใช้งาน
- ข้อมูลที่ถูกจัดอย่างเป็นระบบ
Phase 3 : พัฒนาโครงสร้างเว็บไซต์ (Site
Structure)
6. จัดระบบข้อมูล
7. จัดทำโครงสร้างข้อมูล
8. พัฒนาระบบเนวิเกชัน
สิ่งที่ได้รับ
- แนวทางการออกแบบเว็บ
- ขอบเขตเนื้อหาและการใช้งาน
- ข้อมูลที่ถูกจัดอย่างเป็นระบบ
Phase 4 : ออกแบบและพัฒนาหน้าเว็บ (Visual Design)
9. ออกแบบลักษณะหน้าตาเว็บ
10. พัฒนาเว็บต้นแบบและข้อกำหนดสุดท้าย
สิ่งที่ได้รับ
- ลักษณะหน้าตาของเว็บ
- เว็บต้นแบบที่จะใช้ในการพัฒนา
- รูปแบบโครงสร้างของเว็บ
- ข้อกำหนดในการพัฒนาเว็บ
Phase 5 : พัฒนาและดำเนินการ (Production &
Operation)
11. ลงมือพัฒนาเว็บ
12. เปิดเว็บไซต์
13. ดูแลและพัฒนาต่อเนื่อง
สิ่งที่ได้รับ
- เว็บที่สมบูรณ์
- เปิดตัวเว็บและทำให้เป็นที่รู้จัก
- แนวทางการดูแลและพัฒนาต่อไป
------------------------------------------------------------
จัดระบบข้อมูลในเว็บ
ปัญหาความคลุมเครือของกลุ่มข้อมูล
- การแบ่งข้อมูลต้องอาศัยพื้นฐานทางด้านภาษามาช่วยเพราะคำหนึ่งคำมีความหมายได้หลายอย่างในเหตุการณ์ต่างกัน
- การแบ่งหมวกหมู่ในเว็บมักจะเกี่ยวข้องกับสิ่งที่เป็นนามธรรม เช่น หัวเรื่องหรือข้อความ ดังนั้นจึงเป็นการยากที่จะทำให้ทุกคนเข้าใจระบบการจัดกลุ่มข้อมูลที่เราได้ออกแบบไว้
การจัดลำดับความสำคัญของข้อมูล
ได้แก่
การจัดกลุ่มข้อมูลการกำหนดตำแหน่งของข้อมูลและเทคนิคที่ใช้นำเสนอผู้ออกแบบควรจัดกลุ่มข้อมูลที่มีความสัมพันธ์กันให้อยู่ในกลุ่มเดียวกัน
โดยรูปแบบการจัดกลุ่มข้อมูลอาจกระทำได้หลายลักษณะ หลักการออกแบบโครงสร้างระบบข้อมูลแบบลำดับชั้นควรมีจำนวน
7 บวกลบ 2
รายการในเมนูที่มีจำนวนรายการมากกว่า 10
จะสร้างความรู้สึกว่ามากเกินไปส่วนความลึกไม่ควรเกิน 4-5
ชั้น
เพราะจะทำให้ผู้ใช้อาจหมดหวังและเลิกล้มความตั้งใจได้
โครงสร้างระบบข้อมูลแบบไฮเปอร์เท็กซ์มีลักษณะคล้ายเครือข่ายโยงใยโครงสร้างระบบนี้แบ่งเป็น
2 ส่วนคือ รายการ
หรือกลุ่มข้อมูลที่ถูกลิงค์กับลิงค์ที่เชื่อมโยงข้อมูลเหล่านั้นส่วนใหญ่จึง
มักนำระบบนี้มาใช้เป็นส่วนเสริมให้กับโครงสร้างข้อมูลแบบลำดับชั้น
โครงสร้างข้อมูลแบบฐานข้อมูล
มักนิยมใช้กับเว็บขนาดใหญ่ การนำระบบฐานข้อมูลมาใช้ในเว็บจะช่วยเพิ่มความสามารถในการค้นหาข้อมูลได้อย่างรวดเร็วและถูกต้อง แต่เป็นเรื่องยากที่จะเอาข้อมูลทั้งหมดมาไว้ในฐานข้อมูล
--------------------------------------------------------------
ออกแบบกราฟฟิกสำหรับเว็บไซต์
รูปแบบกราฟฟิกสำหรับเว็บ
รูปแบบหลักมี 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
โปรแกรมกราฟฟิกสำหรับเว็บ
Adobe PhotoShop
Adobe ImageReady
Firework
--------------------------------------------------------------
ไม่มีความคิดเห็น:
แสดงความคิดเห็น