| ขั้นตอนสู่ความสำเร็จในการทำเว็บไซต์ | ||
|
|
||
|
||
Category Archives: Web Design
การสร้างเอกลักษณ์ของเว็บไซต์ (Web Identity)
| การสร้างเอกลักษณ์ของเว็บไซต์ (Web Identity) | ||
|
|
||
|
||
เทคนิค “การออกแบบเว็บให้ Google รัก”
ตอนนี้ผมเชื่อว่าคนไทยมากกว่า 90% ที่ใช้อินเทอร์เน็ต มักจะใช้ เสริช์เอนจิ้น (Search Engine)ในการค้นหาข้อมูลที่ต้องการ จากอินเทอร์เน็ต และจากข้อมูลของ Truehits.net พบกว่า คนไทยเกินกว่า 90% ใช้ Search Engine ของ Google.com (และจากการสำรวจของผม ทุกครั้งที่มีโอกาสไปสอนและสอบถามกับคนที่เรียน พบกว่าข้อมูลเป็นไปตาม Truehits.net) จากข้อมูลที่บอกมา ทำให้เห็นได้ว่า คนส่วนใหญ่จะหาเว็บไซต์ที่เค้าต้องการหา จาก Google ค่อนข้างมาก ซึ่งหากคุณ “สามารถทำให้เว็บไซต์ของคุณสามารถติดอันดับต้นในการค้นหา ของ Search Engine” ได้ นั้นหมายถึงการที่คนที่เป็นลูกค้าคุณจะสามารถรู้ และเข้าไปยังเว็บไซต์คุณได้
ดังนั้นการทำการตลาดผ่าน Search Engine ถือเป็นวิธีและช่องทางที่ เจ้าของเว็บไซต์ “ทุกคน” ควรทราบและนำไปปฏิบัติกับเว็บไซต์ของคุณ โดยวันนี้ผมจะมาทิปและเทคนิคง่าย ๆ ในการทำให้เว็บไซต์ของคุณเข้าไปอยู่ในอันดับของ Search Engine โดยเราเรียกวิธีการทำแบบนี้ว่า Search Engine Optimization หรือ เรียกสั้นๆ ว่า SEO และทิปและเทคนิคนี้จะเน้นกับเว็ไซต์ Google.com ซะส่วนใหญ่นะครับ
เทคนิคการทำให้เว็บไซต์ติดใน Searh Engine
***************************************************************************
1. ใส่ Keyword ใน Title ของหน้าเว็บ
การใส่ Key Word ในหน้าเว็บไซต์ในส่วนของแท็ก <Title> จะช่วยทำให้ Search Engine รู้ว่าเว็บไซต์หน้านั้นๆ ของคุณ มีข้อมูลเกี่ยวกับอะไร ซึ่งข้อมูลนี้จะแสดงอยู่ในตำแหน่งบนด้านบนสุดของบราวเซอร์ ซึ่งตำแหน่งนี้ถือเป็นปัจจัยที่สำคัญส่วนหนึ่ง
2. การใส่ Key Word ที่ต้องการในส่วนด้านบนของเว็บไซต์และการเน้นด้วยตัวหนา
การเน้น Key Word ที่ต้องการในหน้าเว็บไซต์ด้านบน และมีการเน้น key word ภายในหน้าเว็บไซต์ด้วย ตัวหน้า หรือการใช้แท็ก <b> จะเป็นการเน้นให้ Search Engine รู้ว่า นี้คือคำที่เราต้องการเน้นและให้ความสำคัญเป็นพิเศษ ซึ่ง Search Engine จะให้ความสำคัญและน้ำหนักกับ Key Word เหล่านี้
3. หลีกเลี่ยงการออกแบบเว็บไซต์ด้วย Flash หรือรูปภาพเยอะ ไม่มีตัวหนังสือ
เพราะ Google จะอ่านจากโค๊ดของหน้าเว็บไซต์ ซึ่งหากเว็บไซต์คุณ มีแต่ภาพ และยิ่งเป็น Flash ด้วยแล้วละก็ Google จะไม่รู้จักเว็บไซต์คุณเลยว่าเกี่ยวกับอะไร คุณควรปรับเปลี่ยนเพิ่ม ตัวหนังสือเข้าไปในเว็บไซต์ เพื่อให้ Google ได้รู้จักเว็บไซต์อของคุณ
4. หลีกเลี่ยงใช้ออกแบบเว็บไซต์ด้วยเฟรม
เพราะการออกแบบเว็บไซต์ด้วย เฟรม <frame> จะทำให้ Search Engine จะไม่สามารถทราบได้ถึงข้อมูลที่มีอยู่ในเนื้อหาในหน้านั้นๆ เพราะเนื้อหาในหน้านั้น ๆได้ถูกแบ่งออกเป็นส่วนๆ โดยการใช้เฟรม ดังนั้นคุณควรหลีกเลี่ยงซะ (การใช้เฟรม คือ การออกแบบหน้าเว็บที่มีหน้าเว็บหลาย ๆส่วนประกอบเข้าด้วยกันในหน้าเดียว)
5. การเขียนเว็บด้วยภาษาง่าย ๆ ไม่ใช่โค๊ดที่สลับสับซ้อน
การออกแบบเว็บไซต์ โดยมี code ที่สั้นและกระชับเป็นปัจจัยสำคัญที่ทำให้เว็บไซต์คุณง่ายต่อการค้นหาของ Search Engine อย่าใช้ code ฟุ่มเฟือยจนเกินไป ไม่ใช้ table มากเกินไป ลดการใช้ JavaScript และ CSS เท่าที่จำเป็นเท่านั้น นอกจากนี้ คำค้นหาสำคัญๆ ควรอยู่ส่วนบนๆของเว็บเพจให้มากที่สุด
6. ควรตั้งชื่อไฟล์รูปภาพ และใส่คำอธิบายให้กับภาพ
คุณควรตั้งชื่อไฟล์รูปภาพที่ตรงกับ Keyword ที่คุณต้องการ และควรใส่คำอธิบายภาพ โดยใช้แท็ก <alt> คำอธิบาย </alt> เพื่อทำให้ Search Engine รู้ว่าภาพที่คุณใส่เข้าไปในเว็บไซต์คุณคือภาพอะไร และเกี่ยวกับอะไร ซึ่งจะมีผลต่อการค้นหาของ Search Engine ด้วย
7. ใส่ คีย์เวริด์ ให้หนาแน่น ภายในหน้าเว็บไซต์
การที่ในหน้าเว็บไซต์ของคุณมี Key Word ที่ซ้ำๆ หลายๆ คำในหน้านั้นๆ (Key Word Density) นั่นหมายถึงหน้าๆ นั้นของคุณมีข้อมูลและเรื่องราวที่เกี่ยวกับคำๆนั้น ซึ่ง Search Engine ให้ความสำคัญกับส่วนนี้ เช่นกัน ซึ่งควรจะมีการซ้ำๆ กันของ Key Word ในหนึ่งหน้าเว็บ ไม่ควรเกิน 20% ซึ่งหากใส่มากเกินไปจะกลายเป็นการ Key Word Spamming ซึ่งอาจจะทำให้เว็บไซต์คุณโดนบล็อกไปเลย
8. ขนาดไฟล์ HTML ของหน้าเว็บไซต์ไม่ควรเกิน 32K
ถ้าหน้าเว็บไซต์ของคุณ มีขนาดใหญ่จนเกินไป จะทำให้ Search Engine ไม่สามารถเก็บข้อมูลของหน้าเว็บไซต์คุณได้ ดังนั้นในการออกแบบ ควรไม่ให้มีขนาดไฟล์ HTML ไม่เกิน 32K
9. แลกลิงค์กับเว็บไซต์อื่นๆ
การแลกลิงค์กับเว็บไซต์อื่นๆ และมีเว็บไซต์อื่นๆ ลิงค์มาหาคุณเยอะๆ เป็นการแสดงว่า เว็บไซต์คุณเป็นที่รู้จักจาก ซึ่ง Google จะให้คะแนนของเว็บไซต์คุณ โดยเป็นค่า Page Rank (PR)โดยจะมีการให้คะแนนเอาไว้มีค่าตั้งแต่ 1-10 คะแนน โดยเว็ปเพจใดที่ google เห็นว่าเป็นเว็ปเพจที่ “ สำคัญ ” ซึ่งหากเว็บไซต์คุณมีค่า Page Rank สูงก็จะมีผลต่ออันดับในการแสดงใน google โดยเราสามารถทราบค่า PR ของเว็บไซต์เราได้ โดย download และ install google toolbar (http://toolbar.google.com) หลังจากนั้นคุณจะสามารถดูคะแนน PR ของคุณที่จัดโดย google ได้
10. ทำ Site Map ให้กับเว็บไซต์ของคุณ
Site Map ก็คือแผนที่เว็ปไซด์ของคุณ ว่าเว็ปไซด์คุณมีหน้าเว็ปต่างๆ อยู่ที่ไหนบ้าง หน้าไหน link ไปสู่หน้าไหน เป็นการรองรับให้ทุกๆ หน้าของเว็ปไซด์คุณถูกเข้าถึงได้ทั้งหมด ซึ่งจะทำให้ Google สามารถทราบได้ว่าในเว็บไซต์ของคุณมีหน้าเว็บอะไรบ้างทั้งหมด
จริงๆ แล้วจะมีเทคนิคและรายละเอียดมากกว่านี้เยอะมากครับ แต่ผมสรุปเอาจุดเด่นๆ เอามาให้ผู้ที่มีเว็บไซต์และอยากติดอันดับใน Search Engine ซึ่งหากสนใจ อยากศึกษาเพิ่มเติม หรือมีคำถามอยากสอบถาม ตอนนี้ได้มีกลุ่มผู้ที่ชื่นชอบการทำ Search Engine Optimization (SEO)ได้รวมตัวกัน พูดคุยแลกเปลี่ยนข้อมูลต่างๆ ที่เกี่ยวกับการทำ SEO ที่เว็บไซต์ hxxp://www.SEO.in.th ยังไงก็อยากให้คนที่ทำเว็บไซต์คุณ ไม่ละเลยเรื่องการทำ SEO ให้กับเว็บไซต์คุณนะครับ รีบเริ่มทำซะวันนี้นะครับ หากยิ่งช้าไป เว็บไซต์คุณ อาจจะล้าหลังจากคู่แข่งคุณไปมากนะ
ที่มา: ไอทีเซ็นเตอร์
![]()
Introduction to Web Design
เป็นที่ทราบกันดีอยู่แล้วว่า อินเตอร์เน็ตเป็นระบบการสื่อสารที่ได้รับความนิยมไปทั่วโลก แม้กระทั่งประเทศไทยในปัจจุบันมีการใช้อินเตอร์เน็ตกันอย่างแพร่หลายในหน่วยงานราชการ และหน่วยงานธุรกิจต่าง ๆ โดยได้รับความสนใจเพิ่มมากขึ้นเรื่อย ๆ โดยเฉพาะกลุ่มนักเรียนและนักศึกษา นิยมใช้อินเตอร์เน็ตเพิ่มขึ้นอย่างรวดเร็ว ทำให้หลายหน่วยงานจำเป็นที่จะต้องพัฒนาเว็บไซต์ขึ้นมาอย่างหลีกเลี่ยงไม่ได้ เราจึงเห็นเว็บไซต์ต่างๆ ในทุกวงการเกิดขึ้นมากมาย ทั้งที่มีคุณภาพและไม่มีคุณภาพ ตามความรู้ความสามารถของผู้ออกแบบ การที่จะสร้างเว็บไซต์ขึ้นมาสักแห่งหนึ่งนั้นจะต้องมีเป้าหมายที่แน่นอนไม่ใช่เพราะคนอื่นเค้ามีกันเลยอยากมีเว็บกับเค้าบ้าง หรือจำเป็นต้องสร้างเว็บไซต์ตามคำสั่งผู้บังคับบัญชาโดยไม่มีเป้าหมายที่ชัดเจน ซึ่งทำให้เว็บไซต์นั้นไม่มีประโยชน์อะไรสำหรับผู้ใช้และไม่มีใครเข้ามาใช้บริการ ถ้าคุณสร้างเว็บขึ้นมาแล้วไม่สนใจคอยดูแลปรับปรุงให้ขึ้นอยู่เสมอ เว็บคุณก็จะหมดคุณค่าได้เหมือนกัน แต่ถ้าคุณให้ความสำคัญในการออกแบบไปจนถึงรายละเอียดต่าง ๆ จะเป็นปัจจัยสำคัญที่ช่วยให้เว็บไซต์ของคุณประสบความสำเร็จได้
ความสำคัญของการออกแบบเว็บไซต์ ปัจจุบันนี้มีเว็บไซต์เกิดขึ้นมากมายผู้ใช้จึงมีทางเลือกมากขึ้นที่จะเข้าไปยังเว็บไซต์ต่าง ๆ ที่ให้บริการและจะไม่ทนอยู่กับเว็บที่สับสน จากประสบการณ์ท่องเว็บที่ผ่านมาของคุณความรู้สึกได้รับจากเว็บที่มีความสวยงามและเว็บที่มีข้อมูลอยู่อย่างมากมายดูสับสนวุ่นวายและเสียเวลานานในการเข้าดูคุณต้องการที่จะมีเว็บของคุณในลักษณะใด การออกแบบเว็บไซท์มีส่วนสำคัญในการสร้างความประทับใจให้กับผู้ใช้บริการ และทำให้อยากกลับเข้ามาใช้อีกในอนาคต หรือดึงดูดผู้ใช้ให้อยู่กับเว็บตลอดไปการออกแบบเว็บไซท์นั้นไม่ได้หมายถึงลักษณะหน้าตาของเว็บไซท์เพียงอย่างเดียว แต่เกี่ยวข้อง
- การกำหนดเป้าหมายของเว็บไซต์ - ระบุกลุ่มผู้ใช้
- การจัดระบบข้อมูล - การสร้างระบบวิเกชั่น
- การออกแบบหน้าเว็บ – การใช้กราฟิก
- การเลือกใช้สี และการจัดรูปแบบตัวอักษร – ชนิดและรุ่นของบราวเซอร์
- การคำนึงถึงความแตกต่างของสื่อกลางในการแสดงผลเว็บไซท์ด้วย
- ขนาดของหน้าจอมอมิเตอร์ และความละเอียดของสีในระบบ Plug – in ชนิดต่างๆ
การใช้กราฟิก
เว็บไซท์ที่ดูสวยงามหรือมีลูกเล่นมากมายนั้น อาจจะไม่นับเป็นการออกแบบที่ดีก็ได้ ถ้าความสวยงามหรือลูกเล่นเหล่านั้นไม่เหมาะสมกับลักษณะของเว็บไซท์ การออกแบบของแต่ละเว็บไซท์นั้นแตกต่างกันไป ตามเป้าหมายและลักษณะของเว็บไซท์นั้น เว็บไซท์บางแห่งอาจต้องการความสนุกสนาน บันเทิง ขณะที่เว็บอื่นกลับต้องการความถูกต้อง น่าเชื่อถือเป็นหลัก
แนวทางในการการออกแบบเพื่อความสำเร็จของเว็บไซต์
ความสำเร็จของเว็บไซต์ไม่ได้เกิดจากการที่มีผู้ใช้หน้าใหม่เข้ามาในเว็บจำนวนมาก แต่ถ้าเขาเข้ามาแล้วไม่ย้อนกับมาอีกเลย แม้คุณจะมีการประชาสัมพันธ์ที่ดีเพียงใด แต่ถ้าเว็บเป็นมีผู้ใช้บริการเป็นกลุ่มคนที่มาใช้บริการประจำอย่างต่อเนื่องน่าจะเป็นสิ่งที่แสดงให้เห็น ว่าเว็บไซต์ของคุณประสบความสำเร็จมากกว่า พื้นฐานในการออกแบบเว็บไซต์ที่ดี ต้องคำนึงความต้องการที่ผู้ใช้ทุกคนต้องการจากเว็บไซต์
- มีเนื้อหาที่เป็นประโยชน์ ตรงกับที่ผู้ใช้ต้องการ
- มีการปรับปรุงเนื้อหา และพัฒนาเว็บไซต์อยู่เสมอ
- ใช้เวลาในการดาวน์โหลดน้อย แสดงผลเร็ว
- การใช้งานที่สะดวก เข้าใจง่าย
สำหรับความถี่ในการอัพเดทหรือปรับปรุงเว็บไซต์นั้นจะแตกต่างกันตามแต่ประเภทของเว็บไซต์ที่เราต้องการจะสร้างขึ้นมา ถ้าเป็นเว็บไซต์ของหนังสื่อพิมพ์รายวันหรือ ข้อมูลประชาสัมพันธ์แบบเร่งด่วน แต่ถ้าเป็นเว็บไซต์โครงสร้างหน่วยงานต่าง ๆ เว็บไซต์ส่วนตัว ผู้ออกแบบจะดำเนินการอัพเดทตามความจำเป็นในการนำเสนอข้อมูลแต่ถ้าท่านต้องการให้เว็บไซต์ของท่านเป็นที่น่าสนใจท่านจะต้องมีกลุ่มเป้าหมายที่ชัดเจนในการนำเสนอข้อมูล และมีการค้นหาข้อมูลที่น่าสนใจมานำเสนออยู่อย่าง
สม่ำเสมอ
ค้นหาเป้าหมายในการสร้างเว็บไซต์
• สร้างเว็บทำไม และเพื่ออะไร
• สร้างเว็บไซต์ให้ใคร และใครคือกลุ่มเป้าหมาย
• หาจุดเด่นและจุดด้อยของเว็บไซต์อื่นๆ ที่มีเนื้อหาใกล้เคียง
• กำหนดจุดเด่นและจุดด้อยของเว็บตัวเอง
หลักการออกแบบในเว็บไซต์
แบบเรียงลำดับ (Sequence) เว็บไซต์ที่มีจำนวนเว็บเพจไม่มากนัก หรือที่มีการนำเสนอข้อมูลแบบทีละขั้นตอน
แบบระดับชั้น (Hierarchy) เว็บไซต์ที่มีจำนวนเว็บเพจมากขึ้น พบได้ทั่วไป
แบบผสม (Combination) เว็บไซต์ที่ซับซ้อนเป็นการนำข้อดีของ 2 รูปแบบมาผสมกัน
ขั้นตอนการพัฒนาเว็บไซต์
ออกแบบโครงสร้างและหน้าเว็บเพจ กำหนดว่าเว็บเพจมีกี่หน้า และละหน้าจะแสดงข้อมูลอะไร
การออกแบบเว็บไซต์ให้ดูดีได้อย่างไร
1 สีสัน (Color) จะทำให้ผู้ชมเว็บรับรู้อารมณ์ของเว็บ และเรื่องราวที่นำเสนอได้ ควรเลือกสีให้เหมาะสมกับเนื้อหา แต่ละสีให้ความรู้สึกที่แตกต่างกัน เช่น
– สีฟ้า สีเหลือง ให้ความรู้สึกสดใส และอบอุ่น
– สีแดงให้ความรู้สึกสนุกสนาน ร้อนแรง
– สีน้ำเงิน มั่งคง เข้มแข็ง
2. มีความเป็นเอกลักษณ์ จะทำให้ผู้ชมเว็บไซต์จดจำเว็บได้ง่ายขึ้น โดยอาจใช้โทนสี รูปประกอบ Theme ที่คล้ายๆ กันทุกหน้า
3. ผู้ชมเว็บไซต์ต้องสามารถเข้าถึงเนื้อหาที่เราตั้งใจนำเสนอ หรือสามารถใช้งานเว็บ ค้นหาข้อมูลที่ต้องการได้อย่างสะดวกและรวดเร็วตรงตามความต้องการ
4. แสดงผลได้อย่างรวดเร็วระยะเวลาในการแสดงผลต้องไม่นานจนเกินไป ไม่ทำให้ผู้เข้าชมเว็บรอเลือกใช้ภาพกราฟิกและภาพ Animation ได้อย่างเหมาะสม
รูปแบบการจัดแบ่งพื้นที่หน้า Homepage
• ไม่มีหลักเกณฑ์ตายตัว ขึ้นอยู่กับเนื้อหาและการออกแบบเว็บไซต์
ที่นิยมมี 3-4 แบบ แบ่งพื้นที่ใช้งานออกเป็น 3 ส่วน ,แบ่งพื้นที่ใช้งานออกเป็น 2 ส่วน,แบ่งพื้นที่ใช้งานออกเป็น 1 ส่วน
โปรแกรมหลักที่ใช้ในการสร้างเว็บ
Program ออกแบบเว็บ และเขียน Code
– Macromedia Dreamweaver 8 - Edit Plus / Notepad
• Graphic Design Adobe Photoshop CS - ภาษา Script PHP
• Web Server Appserp / IIS – FTP (Upload) Cute FTP
ภาษาที่ใช้ในการทำเว็บ
• HTML ภาษาหลักใช้เขียน เว็บ ใช้ Taq ควบคุมการแสดงผล ผ่าน Web Browser
• ASP/ASP.Net เป็นภาษาที่ใช้ Syntax ของ VB และ VB Script หรือ C# ทำงานฝั่ง Server และส่งผลไปยัง Web browser
• PHP เป็นภาษา Server Site Script มีพื้นฐาน ภาษา C
ทำงานฝั่ง Server และส่งผลไปยัง Web browser
• Java Script เป็นภาษาเชิงวัตถุ มีความสามารถและลูกเล่นมากมาย ใช้แทรกใน HTML ได้เลย
ศัพท์เบื้องต้นที่ควรรู้
- Search Engine - Free Hosting
- Free Counter – บริการ e-Mail
- บริการ Web board - เว็บไซต์ (Website)
- เว็บเพจ (Webpage) - โฮมเพจ (Homepage)
- URL - Web Browser
- HTML – FTP
- IP Address – Domain Name
- Hosting
องค์ประกอบของการออกแบบเว็บไซท์อย่างมีประสิทธิภาพ
ความเรียบง่าย (Simplicity)
- เว็บจะมีรูปแบบที่เรียบง่าย ไม่ซับซ้อน และใช้งานได้อย่างสะดวก แม้ว่าจะมีข้อมูลอยู่ในเว็บไซท์อยู่มากมาย
- ไม่มีกราฟิกหรือตัวอักษรที่เคลื่อนไหวอยู่ตลอดเวลา ซึ่งจะรบกวนสายตาและสร้างความรำคาญต่อผู้ใช้
- ใช้ชนิดและสีของตัวอักษรไม่มากจนเกินไปให้วุ่นวาย
- ในส่วนเนื้อหา ใช้ตัวอักษรสีดำบนพื้นหลังสีขาวตามปกติ
- ไม่มีการเปลี่ยนแปลงของลิงค์ให้สับสนแต่อย่างใด
ความสม่ำเสมอ (Consistency)
- ใช้รูปแบบเดียวกันตลอดเว็บไซท์ ถ้าลักษณะของแต่ละหน้าในเว็บเดียวกันนั้นแตกต่างกันมาก ผู้ใช้อาจ เกิดความสับสนและไม่แน่ใจว่ากำลังอยู่ในเว็บเดิมหรือไม่
- ดังนั้นรูปแบบของหน้า , สไตล์ของกราฟิก , ระบบเนวิเกชั่น และโทนสีที่ใช้ควรจะมีความคล้ายคลึงกันตลอดเว็บไซท์
ความเป็นเอกลักษณ์ (Identity)
-การออกแบบต้องคำนึงถึงลักษณะขององค์กร เนื่องจากรูปแบบของเว็บไซท์สามารถสะท้อนถึงเอกลักษณ์และลักษณะขององค์กรนั้นได้
- เว็บไซท์ของธนาคารจึงไม่ควรจะดูเหมือนสวนสนุก
- การใช้ชุดสี, ชนิดตัวอักษร, รูปภาพและกราฟิกจะมีผลต่อรูปแบบของเว็บไซท์อย่างมาก จึงต้องเลือกใช้องค์ประกอบเหล่านี้อย่างเหมาะสม
เนื้อหาที่มีประโยชน์ (Useful Content)
- เว็บไซท์ควรจัดเตรียมเนื้อหาและข้อมูลที่ผู้ใช้ต้องการให้ถูกต้องและสมบูรณ์ โดยมีการปรับปรุงและเพิ่มเติมให้ทันต่อเหตุการณ์อยู่เสมอ
- เนื้อหาที่สำคัญที่สุดคือ เนื้อหาที่สร้างขึ้นมาเองโดยทีมงานและไม่ซ้ำกับเว็บอื่น เพราะจะเป็นสิ่งที่ดึงดูดผู้ใช้ให้เข้ามาในเว็บไซท์อยู่เสมอ
ระบบเนวิเกชั่นที่ใช้งานง่าย (User – Friendly Navigation)
- ระบบเนวิเกชั่นควรถูกออกแบบให้ผู้ใช้เข้าใจได้ง่ายและใช้งานสะดวก
- ใช้กราฟิกที่สื่อความหมายร่วมกับคำอธิบายที่ชัดเจน
- มีรูปแบบและลำดับของรายการที่สม่ำเสมอ เช่นวางไว้ในตำแหน่งเดียวกันของทุกๆ หน้า
- ถ้าใช้เนวิเกชั่นแบบกราฟิกในส่วนบนของหน้าแล้ว อาจเพิ่มเนวิเกชั่นที่เป็นตัวอักษรไว้ที่ตอนท้ายของหน้า เพื่อช่วยอำนวยความสะดวกให้กับผู้ที่สั่งให้บราวเซอร์ไม่แสดงรูปกราฟิก
มีลักษณะที่น่าสนใจ (Visual Appeal)
-หน้าตาของเว็บไซท์จะมีความสัมพันธ์กับคุณภาพขององค์ประกอบต่างๆ เช่น คุณภาพของกราฟิกที่จะต้องสมบูรณ์ ไม่มีร่องรอยของความเสียหายเป็นจุดด่างหรือมีขอบเป็นขั้นบันไดให้เห็น การใช้ชนิดตัวอักษรที่อ่านง่าย สบายตา และการใช้โทนสีที่เข้ากันอย่างสวยงาม เป็นต้น
การใช้งานอย่างไม่จำกัด (Compatibility)
- ควรออกแบบเว็บไซท์ให้ผู้ใช้ส่วนใหญ่เข้าถึงได้มากที่สุด โดยไม่มีการบังคับให้ผู้ใช้ต้องติดตั้งโปรแกรมใดๆ เพิ่มเติม หรือต้องเลือกใช้บราวเซอร์ชนิดใดชนิดหนึ่งจึงจะสามารถเข้าถึงเนื้อหาได้
- สามารถแสดงผลได้ในทุกระบบปฏิบัติการและที่ความละเอียดหน้าจอต่างๆ กันอย่างไม่มีปัญหา สิ่งเหล่านี้จะยิ่งมีความสำคัญมากขึ้น สำหรับเว็บที่มีผู้ใช้บริการจำนวนมาก หรือมีกลุ่มเป้าหมายที่หลากหลาย
คุณภาพในการออกแบบ (Design Stability)
- ถ้าอยากให้ผู้ใช้รู้สึกว่าเว็บมีคุณภาพถูกต้อง และเชื่อถือได้ ควรให้ความสำคัญกับการออกแบบเว็บไซท์อย่างมาก
- เช่นเดียวกับสื่อประเภทอื่นที่ต้องออกแบบและเรียบเรียงเนื้อหาอย่างรอบคอบ เว็บที่ทำขึ้นอย่างลวกๆ ไม่มีมาตรฐานการออกแบบและการจัดระบบข้อมูลนั้น เมื่อมีข้อมูลเพิ่มขึ้นเรื่อยๆ ก็จะเกิดปัญหาและไม่สามารถสร้างความน่าเชื่อถือจากผู้ใช้ได้
ระบบการใช้งานที่ถูกต้อง (Functional Stability)
- ระบบการทำงานต่างๆ ในเว็บไซท์จะต้องมีความแน่นอนและทำหน้าที่ได้อย่างถูกต้องเสมอ
- ตัวอย่างเช่น ลิงค์ต่างๆ ที่มีอยู่นั้นจะต้องเชื่อมโยงไปยังหน้าที่มีปรากฏอยู่จริงและถูกต้อง
- การทำให้ระบบเหล่านั้นใช้งานได้ตั้งแต่แรกและยังต้องคอยตรวจเช็คอยู่เสมอเพื่อให้แน่ใจว่าสิ่งเหล่านั้นยังทำงานได้ดี โดยเฉพาะลิงค์ที่เชื่อมโยงไปยังเว็บอื่นซึ่งอาจมีการเปลี่ยนแปลงได้ตลอดเวลาโดย
ดังนั้นถ้าท่านต้องการที่จะออกแบบเว็บไซต์ให้ได้รับความนิยมในระบบอินเตอร์เน็ต มีความน่าสนใจและมีผู้คนเข้ามาเยี่ยมชมอยู่เสมอ จะต้องคำนึงถึงกลุ่มเป้าหมายที่จะนำเสนอข้อมูลในเว็บไซต์เป็นอย่างไรด้วย เช่น เป็นเว็บแนะนำการศึกษา สถานที่สำคัญ ประเพณี และเมื่อจัดทำเว็บไซต์เรียบร้อยจะต้องมีการประชาสัมพันธ์เว็บไซต์ให้คนอื่นรู้จัก การนำเสนอข้อมูลผ่านระบบเครือข่ายจะต้องมีการศึกษาให้ดีเสียก่อน เพราะหากว่าเราสารถที่จัดทำเว็บไซต์ของเราให้เป็นที่รู้จัก ก็จะเป็นเว็บที่มีคุณภาพเว็บหนึ่ง การออกแบบเว็บไซต์ก็ควรที่จะต้องศึกษาถึงขั้นตอนและหลักการออกแบบเว็บไซท์ที่ดีเสียก่อน เพื่อที่จะป้องกันไม่ให้เกิดข้อผิดพลาดในการออกแบบขึ้น ซึ่งนอกจากจะทำให้ผู้ใช้เกิดความสับสนไม่พอใจแล้ว คุณยังต้องกลับมาแก้ไขเว็บเหล่านั้นใหม่อีก และที่แย่ยิ่งกว่านั้นคือ เมื่อผู้ใช้มีความรู้สึกที่ไม่ดีต่อเว็บไซต์ในครั้งแรกแล้ว ก็เป็นเรื่องยากที่พวกเขาจะย้อนกลับมาอีกครั้งในภายหลังแม้ว่าเว็บไซต์คุณจะได้รับการปรับปรุงให้ดีขึ้นแล้วก็ตาม ดังนั้นทางที่ดีคุณควรจะออกแบบเว็บไซต์ให้ดีตั้งแต่ครั้งแรกเพื่อจะได้สร้างความประทับใจให้กับผู้ใช้ตั้งแต่ต้น
![]()
หลักการออกแบบเว็บไซต์
หลักการออกแบบเว็บเพจที่จริงแล้วไม่มีอะไรตายตัวหรอกครับ เพียงแต่เราต้องยึดหลักเกณฑ์เพื่อความเป็นสากลนิยมและความเหมาะสมของเว็บเพจ การออกแบบเว็บเพจนั้นเราจะคำนึงของผู้เยี่ยมชมเป็นหลักว่า เว็บที่เราทำออกมานั้นต้องการดึงดูดคนประเภทไหนเข้ามา เราก็ทำออกมาตามที่คนประเภทนั้นเข้ามาเช่น จะทำเว็บแนววัยรุ่น คนที่จะมาเป็นลูกค้าเราก็คือพวกวัยรุ่น ดังนั้นเราจึงต้องออกแบบให้ ทันสมัย น่ารัก ถูกใจวัยเฮ้วทั้งหลาย แต่การออกแบบนั้นจะทำอย่างไรใช้ สีไหน ต้องมีอะไรบ้าง เราลองมาดูหลักเกณฑ์กันดีกว่าครับ(หลักเกณฑ์นี้ใช้ได้กับทุกเว็บและทุก ประเภทเลยนะครับ)
ต้องอ่านง่ายสบายตา (Read Ability) ตัวหนังสือที่เราใช้นั้นต้องไม่เล็กเกินไปหรือไม่ใหญ่เกินไป (ปัจจุบันมีการใช้ CSS Style เพื่อกำหนดให้กับขนาดหรือสีของตัวอักษรแบบตายตัว)และควรใช้สีที่ตัดกับแบ็ค กราว เช่นแบ็คกราวสีขาวไม่ควรใช้สีเขียวอ่อน,เหลือง หรือสีอื่นที่อ่อนๆจางๆ
โหลดไม่ช้าหน้าไม่ยาว (Fast Load) ส่วนนี้สำคัญนะครับ ถ้าคุณทำเว็บออกมาแล้วโหลดช้ามากก็จะทำให้ลูกค้าหันไปดูเว็บอื่นรอหรือ ร้ายกว่านั้นปิดเว็บของเราไปเลยก็ได้ แต่ก็อย่างว่านะครับ Internet ประเทศไทยยังไม่พัฒนาเลยช้านิดหน่อย ถ้าช้าแบบพอทนได้ก็รอกันต่อไป ส่วนที่ว่าหน้าไม่ยาวนั้นคือ เว็บบางเว็บ(ส่วนใหญ่จะเป็นเว็บพอทอล เช่น hunsa,sanook) จะทำหน้าที่ยาวมาก กว่าจะเลื่อนสกอลบาร์ลงไปถึงเลื่อนเม้าเลื่อกลูกกลิ้งกันจนจะสุดโต๊ะ(เว่อ ไป!..) เอาเป็นว่า จะให้ดีไม่ควรยาวเกิน 3 หน้าจอครับ
อัพเดทข่าวให้บ่อย (Update) ส่วนนี้เป็นจุดเชิดชูของเว็บเลยนะครับ ผมขอร้องเลยครับว่าถ้าทำเว็บแล้วอย่าทำครั้งเดียวทิ้ง ขอให้ทำแล้วทำตลอดไปเรื่อยๆเลยครับ (พวกทำครั้งเดียวแล้วไม่อัพเดทน่าจะเหมาะกับทำเว็บแนวประวัติของตัวเอง มากกว่า) เพราะผมเข้าไปหลายเว็บตามเว็บสมัครเล่นมีประมาณ 60% เลยครับที่ทำแล้วปล่อยทิ้งไว้ไปดูกี่ทีกี่ครั้ง Last Update ก็ยังอยู่ที่ 02/06/1999 เจออย่างงี้ก็น่าเบื่อนะครับ ผมขอแนะนำว่า ถ้าจะให้ดีข้อมูลควร update ทุกๆ 2 – 3 วันต่อครั้ง หรือ 1 อาทิตย์ครั้ง หรือ 15 วันครั้ง หรือถ้าเดือนละครั้งอันนี้ก็ไม่ไหวนะครับ แต่ถ้าท่านไม่มีเวลาจะ update จริงๆ ควรจะเขียนกล่าวไว้ที่หน้าเว็บว่าจะงด update ชั่วคราวเพื่อจะได้ไม่เสีย creadit ของตัวเองครับ และให้ลูกค้าติดตามมาดูบ่อยๆด้วย
อย่าปล่อยให้มีคำผิด (Good Spelling) ถ้าท่านทำเว็บมาแล้วปล่อยให้มีคำผิดขึ้นมายิ่งเป็นข้อความใหญ่ๆแล้วด้วยจะทำ ให้เว็บเราดูด้อยไปเลยครับจะดูเหมือนกับว่า webmaster เว็บนั้นไม่เป็นมือโปรเลย แต่สำหรับคำผิดเล็กๆน้อยๆ ตามบทความถ้าท่านมีเยอะจนไม่สามารถตรวจสอบได้ทุกหน้าก็พออนุโลมได้ครับ
ทุกทิศมีที่ไป (Navigation Bar) การหลงในเว็บเพจหงุดหงิดกว่าการเดินหลงในห้างอีกนะครับ เพราะในเว็บมันไม่มีอะไรให้ดูนอกจากหน้าจอ และก็เสียเวลามากกว่า และรู้สึกว่าตัวเองโง่ไปถนัดตาเลยว่าทำไมกะอีแค่เว็บๆเดียวทำเราวุ่ววายไป หมด ดังนั้นทุกหน้าเราต้องมีเมนูไปกลับหน้าแรกและหน้าอื่นๆติดอยู่เสมอ เพื่อความสะดวกของลูกค้า
เครื่องหมายมีให้ติดตาม (Use Sign) ภาพหนึ่งภาพแทนความหมายได้พันคำ การใช้เครื่องหมายที่ง่ายต่อความเข้าใจ เช่น “ลูกศร” ที่จะนำทางให้คุณคลิ้กเพื่อไปดูรายละเอียดในหน้าถัดไป เครื่องหมาย หรือสัญลักษณ์ใด ๆ ที่สามารถทำให้ลูกค้ารู้ว่า คุณกำลังจะบอกอะไรกับเขา
ทุกคำถามต้องมีคำตอบ (FAQ) แม้คุณจะบอกว่า เว็บไซต์ของคุณ ได้รับการออกแบบมาให้ใช้งานง่ายเท่าใดก็ตาม แต่เชื่อผมเถอะว่าลูกค้ามีคำถามในใจเกิดขึ้นได้ตลอดเวลา ซึ่งถ้าคุณตอบได้ทันที ลูกค้าจะรู้สึกแฮปปี้และประทับใจในบริการของคุณ การใส่ FAQ เข้าไปในไซต์ เพื่อช่วยให้ลูกค้าสามารถค้นหาคำตอบที่ต้องการด้วยตัวเองได้ จะช่วยให้ลูกค้าไม่ลังเล และตัดสินใจเป็นลูกค้าของคุณได้ง่ายดายขึ้น ซึ่งในส่วนของ FAQ นี้ก็จะมีทั้งคำถามคำตอบในเรื่องของการท่องไซต์ เพื่อจะได้เข้าถึงบริการส่วนต่าง ๆ ได้ง่ายขึ้น ยิ่งในเว็บที่เกี่ยวกับ E-commerce
ทุกคำชอบต้องมีโชว์ (Testimonial) คำชมจากลูกค้านั้นมีความหมายและมีความสำคัญมาก มันคือตัวที่แสดงถึงความเชื่อใจ และสร้าง Creadit ให้เราได้มากกว่าการที่เราจะมานั่งชมมตัวเอง ดังนั้นถ้าเป็นไปได้น่าจะเอามาโชว์เพื่อให้ลูกค้าคนอื่นเห็นและเกิดความมั่น ใจ ยิ่งในเว็บที่เกี่ยวกับ E-commerce
เบอร์โทรชัดไม่ขัดตา (Logo, Brand Name & Tel No.) ตัวนี้ไม่ใช่แค่เบอร์โทรอย่างเดียวนะครับ มันรวมไปถึงข้อมูลที่ใช้ติดต่อเราทั้งหมด ไม่ว่าจะ เบอร์โทร E-mail ICQ logo แผนที่ หรืออื่นๆ เราควรจะโชว์ให้ชัดเจนและเป็นจริงที่สุดเพื่อการติดต่อกลับที่สะดวกหรือเป็น ไปได้ให้ติดตั้งสคิ้ปในการติดต่อกลับแบบอัตโนมัติก็จะทำให้ง่ายและรวดเร็ว ขึ้น
เพื่อลูกค้าใช้อ้างอิง (Reference Address) การที่คุณใส่ที่อยู่ที่ติดต่อได้เข้าไปที่ด้านท้ายของทุกเว็บเพจ ช่วยสร้างโอกาสธุรกิจให้กับคุณได้ ทำไมหรือครับ เพราะนอกจากลูกค้าจะจำได้ว่า ที่ติดต่อหรือธุรกิจของคุณอยู่ที่ไหน เขาก็จะไม่ต้องทำได้ทันที นอกจากนี้ เวลาที่ลูกค้าพิมพ์เว็บเพจของคุณออกไป ที่อยู่ที่ติดต่อเหล่านี้ก็จะติดไปด้วย ซึ่งหากเป็นการส่งต่อเอกสารนั้นให้กับผู้อื่น คุณก็จะได้กลุ่มเป้าหมายที่สามารถติดต่อคุณได้ทันทีโดยไม่ต้องออนไลน์ เพื่อค้นหาข้อมูลติดต่อให้วุ่นวายแต่อย่างใด (เช่นเว็บ 2capsule ถ้าท่านต้องการ Print บทความก็จะมี logo และ URL ติดอยู่ เพื่อการโปรโมตไปในตัว) จะเหมาะกับเว็บแนว E-Commerce มากๆ
ทุกอย่างต้องหาได้ (Search) หากเว็บคุณเป็นเว็บขายสินค้าหลายๆประเภทหรือมีบทความหลายๆเรื่องแล้วหละก็ ขาดไม่ได้เลยครับสำหรับเครื่องมือที่ที่ไว้สำหรับ Search ในเว็บของเราเอง เพื่อการค้นหาที่สะดวกขึ้นและ ลดระยะเวลาของลูกค้าไปในตัวด้วย
ทุกอย่างง่ายทำได้เอง (Help) ส่วนนี้จะค้ลายๆกับ FAQ แต่ว่ามันจะเป็นส่วนที่สอนการใช้งานของเว็บของคุณ ยิ่งเว็บของคุณมีระบบเยอะก็จำเป็นที่จะต้องมี Comment หรืคำแนะนำในการใช้ทุกจุด เพื่อความไม่ผิดพลาดของลูกค้า
ท่องไซต์ให้ครื้นเครง (Fun Stuff) การใส่ลูกเล่นที่น่าสนใจ หรือสอดแทรกความสุกสนานบางอย่างเข้าไปในไซต์ ถ้าไม่เหลือบ่ากว่าแรงนัก ผมก็คิดว่า คุณน่าจะสันหามาใส่เข้าไปในไซต์ของคุณ บนอินเทอร์เน็ตจะมีหลายๆ ไซต์ที่ให้บริการ การ์ตูนฟรี เรื่องขำขันฟรี คุณสามารถทำลิงก์เพื่อไปดึงเนื้อหาเหล่านี้มาปรากฎในไซต์ของคุณได้ เพื่อให้ยูสเซอร์ไม่รู้สึกว่าไซต์ของคุณเน้นวิชาการจนเกินไป
ต้องเกรงใจลูกค้าเรา (Friendly Dialog) การเกรงใจในที่นี้หมายถึงการใช้คำพูดในเว็บ ควรใช้ให้เหมาะสม และเป็นกันเองที่สุดหรือสากลที่สุด เพื่อการติดต่อสื่อสารที่ง่าย และเป็นมิตร ยิ่งใน E-Commerce ถ้าลูกค้าเป็นมิตรกับเรา เขาก็ย่อมจะเลือกซื้อสินค้าของเรามากกว่าเว็บอื่นที่ไม่เป็นมิตร
ลดขนาดภาพให้เล็กสวยคงเดิม (Fix Image Size) การลดขนาดของรูปในที่นี้ผมไม่ได้หมายความว่า ให้เอารูปขนาด 500 x 500 มาย่อในโปรแกรมเขียนเว็บให้เลือก 200 x 200 นะครับ เพราะการย่อแบบนั้น มันย่อให้รูปที่เราเปิดดูเล็กลงได้จริงแต่ขนาดหรือ Size นั้นก็ยังเท่าเดิม เวลาโหลดก็โลหดนานเท่าเดิมดังนั้นมันจะไม่ช่วยอะไรขึ้นมาเลย แต่สิ่งที่ผมจะบอกคุณคือ ให้ย่อขนาด หรือลดขนาดของภาพโดยใช้โปรแกรมพวก Photoshop หรือโปรแกรมเกี่ยวกับการแต่งภาพอื่นๆ เพราะการย่อขนาดในนั้นจะช่วยทำให้ภาพของคุณลดขนาดตามไปด้วย แต่การลดขนาดนั้นคุณก็ต้องมีความรู้ทางโปรแกรมกราฟฟิกนั้นไม่น้อยเหมือนกัน เพราะเราต้องลดขนาดรูปให้ได้เยอะที่สุดแต่ยังสวยคงเดิม(คงเคยเห็นนะครับ รูปที่ ขนาด 50KB กับ 45KB สวยเหมือนกัน เพราะคนที่ย่อขนาดนั้นมีความสามารถพอครับ) แต่ปัจจุบันมีโปรแกรมออกมาเพื่อการลดขนาดของรูปโดยเฉพาะ ซึ่งผมจะนำมาให้ download กัน ลองติดตามนะครับ
เรื่องของ Tag เปิดบ่อยๆ (Open tag) Tag ใน HTML นั้น มันจะแสดงออกมาก็ต่อเมื่อมันอ่านเจอ Tag ปิด ดังนั้นให้คุณเขียนเว็บแล้วเปิด ปิด Tag บ่อยๆเพื่อความเร็วในการแสดงผลครับ
Link ผิดต้องอย่าปล่อย (Link Break) เมื่อทำเว็บเสร็จแล้ว พยายามตรวจสอบ link ให้แน่ใจว่าจะไม่ผิดพลาด แต่บางครั้งที่คุณ link ไปเว็บอื่นแล้วเขา ปิดเว็บลงไปแล้วก็ช่วยไม่ได้นะครับ คุณต้องลองติดตามดูบ่อยๆ
ลดขนาด file เว็บเรา ( Fix File Size) ขนาดของ file html นั้นแต่ก่อนไม่ค่อยมีการออกเว็บเท่าไรจึงมีขนาดไม่เกิน 20 -30 kb แต่ปัจจุบันมีการเล่นสคิ้ปและรูปแบบและเนื้อหามากขึ้น ขนาดจึง ไปอยู่ที่ 70 – 150 kb แต่ตามความคิดผมไม่ควรจะเกิน 50 – 80 kb ครับ เพราะยิ่งมากก็ยิ่งช้า เหมือนกับเรากำลัง download file ชนิดหนึ่งที่มีขนาด 100 kb คุณว่านานไหมล่ะ(แค่ตัวหนังสือไม่รวมรูปหรืออื่นๆนะ) แต่ถ้าจำเป็นก็ไม่เป็นไรครับ เพราะปัจจุบัน เรื่องของ Internet เร็วพอสมควร