foto1
Internet & Security
foto1
Learn to build your website
foto1
Try to our Goal!
foto1
Tip & Tricks to use Computer
foto1
Operating System


Our Sponsor

side 1

Easyhome Group

krumontree200x75
isangate com 200x75
ppor 200x75
isangate net 200x75
 e mil

No. of Page View

blood donate

บัญญัติ 10 ประการ ในการออกแบบเว็บเพจ

เทคนิคนี้แม้จะเก่านมนานมาแล้ว แต่ก็ยังนำมาใช้เป็นแนวทางได้เสมอครับ เคยสังเกตกันบ้างไหมครับว่า เว็บไซต์ใดๆ ที่คุณประทับใจเมื่อเข้าไปเยี่ยมชม แบบที่เร็วสุด ๆ แบบที่ภาพแสนสวย แบบที่มีลูกเล่นเยอะๆ จนต้องนั่งคอยกว่า 5 นาที แบบไหนที่ทำให้คุณตรึงใจ อยู่กับที่โดยไม่คลิกหนีไปเสียก่อน

ถ้าคุณคิดจะทำเว็บไซต์ให้ตรึงใจผู้ชม แน่นอนว่า ผู้ชมคนอื่นๆ ก็มีความรู้สึกแบบเดียวกับคุณนั่นแหละ อยากชมเว็บไซต์ที่สวยงามสะดุดตา โหลดได้เร็วสุดๆ มีลูกเล่นแพรวพราว (เอาแต่พองาม) แต่มีเนื้อหาสาระชวนติดตาม มีเนื้อหาใหม่ๆ ทันสมัยมานำเสนอ และแน่นอนคุณอยากเก็บไว้ชมในวันหลัง (Add Bookmark ไว้) เราจะทำได้ไหมนี่ ?

การออกแบบเว็บไซต์อาจไม่ใช่เรื่องยากนัก สำหรับคนที่มีหัวคิดในทางสร้างสรรค์ มีศิลปะ แต่การทำให้ดีนี่ ต้องอาศัยเทคนิคและการเรียนรู้ บัญญัติ 10 ประการ ในการออกแบบเว็บเพจ ต่อไปนี้ จะให้คำแนะนำที่มีประโยชน์ในการออกแบบเว็บไซต์ของคุณ เพื่ออวดสายตาแก่ผู้เล่นอินเทอร์เน็ตจากทั่วทุกมุมโลก ต้องขอขอบคุณผู้เขียนบทความนี้ (คุณทรงศักดิ์ ลิ้มบรรจงมณี : Internet Magazine : April 1998) อย่างยิ่งครับ ที่ทำให้ผมได้ความรู้ ทดลองทำตาม พบข้อจำกัดต่างๆ และนำเอามาเผยแพร่ขยายข้อความต่อ ณ ที่นี้

1. ใช้แบ็กกราวด์สะอาด เรียบง่าย

ฟังดูเป็นเรื่องง่ายๆ แต่ลองทบทวนความจำของคุณดูว่า คุณพบเห็นเว็บไซต์มากมายเท่าไหร่ ที่ใช้แบ็กกราวด์ที่ทำให้คุณต้องเพ่งดู ปรับความสว่างของจอภาพ ฯลฯ เพื่อให้เห็นตัวอักษรที่ซุกซ่อนอยู่ข้างใน ปัญหาของแบ็กกราวด์ คืออะไร

  • ขนาดที่ไม่เหมาะสม มีวิธีการมากมายในการสร้างแบ็กกราวด์แบบไร้รอยต่อ การใช้ภาพมาเป็นแบ็กกราวด์ มักจะมีปัญหาเรื่องรอยต่อของภาพที่ไม่เหมาะสม การใช้ภาพขนาดเล็ก เกินไปมาเรียงต่อกันคุณก็จะได้ฉากหลังที่วุ่นวาย ลายตา อ่านข้อความได้ยาก และยังใช้เวลาในการแสดงผลนานขึ้น (เพราะเสียเวลาในการสร้างภาพเรียงต่อกัน) อีกปัญหาหนึ่งก็คือ การแสดงผลของผู้สร้างเว็บเพจกับผู้ชมตั้งไว้ไม่เหมือนกัน เช่น คุณสร้างงานเพื่อแสดงผล บนขนาดจอ 640 x 480 pixels ภาพแบ็กกราวด์ของคุณดูพอดีในเครื่องตนเอง แต่ผู้ชมที่เซ็ทค่าความละเอียดที่ 800 x 600 pixels จะเห็นภาพขนาดเล็กๆ หลายภาพเรียงต่อกัน แต่ถ้าคุณสร้างงานที่ความละเอียด 1024 x 768 pixels ผู้ชมที่ดูด้วยความละเอียดต่ำกว่านี้ ก็จะเห็นภาพของคุณเพียงแค่บางส่วน
  • หลีกเลี่ยงการใช้ลวดลาย ฟังดูง่ายแต่คุณคงเห็นจากเว็บไซต์ต่างๆ แล้วว่า ลวดลาย เหล่านั้นทำให้คุณต้องเพ่งสายตาอย่างมาก เพื่อจะอ่านมันให้เข้าใจว่ามีข้อความอะไรอยู่ในนั้น
  • เลือกสีที่เหมาะสม ลองคิดถึงตัวอักษรสีน้ำเงินบนพื้นสีน้ำเงิน ฟังดูแปลกๆ แต่ก็มีผู้ทำแบบนี้กันมาก อาจด้วยความพลั้งเผลอก็ได้ โดยเฉพาะสีที่เปลี่ยนไปหลังการคลิก Link พยายามใช้สีที่ดูดี สบายตา พื้นหลังและตัวอักษรมีสีตัดกันไม่รุนแรงนัก หลีกเลี่ยงพื้นแดง อักษรเขียว พื้นส้มอักษรน้ำเงิน การใช้สีพื้นธรรมดาจะทำให้ผู้ชมดูเว็บของคุณได้เร็วกว่า ใช้ภาพเป็นฉากหลังมากนะครับ

2. คิดก่อนใช้เอฟเฟกต์ต่างๆ

มีเทคนิคพิเศษมากมายสำหรับการสร้างภาพ แต่อย่าพยายามใช้มันมากนัก เพราะว่า บางทีผู้ชมอาจคิดว่ากำลังมาดูเว็บไซต์สยองขวัญได้ การให้แสงและเงาแก่ภาพและตัวอักษร ควรเป็นไปในทิศทางเดียวกัน ไม่ขัดแย้งกัน การใช้เอฟเฟกค์อื่นๆ ก็เช่นเดียวกัน ควรใช้แต่น้อยเพื่อเสริมให้เกิดความเด่น แต่ไม่แย่งความสำคัญของเนื้อหาไป เพราะบางเอฟเฟกค์มีผลต่อความเร็วในการโหลดเว็บเพจของคุณเช่นเดียวกัน

3. ใช้ตัวอักษรที่คมชัด

ฟอนต์หรือตัวอักษรที่มีขอบขรุขระเป็นรอยหยักขั้นบันได เมื่อใช้ในโปรแกรมสร้างภาพ เช่น Photoshop สามารถแก้ไขได้โดยการเลือกออปชัน Anti-Aliasing การเลือกฟอนต์ที่แสดงในเว็บเพจ ควรเลือกตัวที่มีรูปแบบครบทั้งตัวปกติ ตัวหนา ตัวเอียง ตัวขีดเส้นใต้ จึงจะสามารถสร้าง ความกลมกลืนในหน้าเว็บเพจได้ดี

4. ออกแบบกราฟิกให้มีขนาดไฟล์เล็กๆ

ภาพกราฟิกที่จะนำมาใช้ในเว็บเพจทั้งที่ได้จากการสแกน และสร้างขึ้นเองควรจะมีขนาดเล็กที่สุด และตรงตามจุดประสงค์ที่สุด ให้คุณจดจำกฎสองข้อนี้ไว้ในใจให้ดี

  • ข้อแรก ทุกๆ ครั้งที่คุณออกแบบและสร้างกราฟิกสำหรับใช้นำไปยังเนื้อหาส่วนอื่นๆ อย่าลืมว่า ในบางกรณีผู้ชมหรือตัวคุณเองก็คลิกบนภาพโดยไม่รอจนภาพแสดงอย่างสมบูรณ์ ดังนั้นอย่าใช้ภาพกราฟิกที่ซับซ้อนสำหรับอิมเมจแม็พ จำไว้เสมอว่าทุกๆ ครั้งที่คุณสร้างกราฟิกสำหรับนำไปยังส่วนอื่นๆ หน้าที่ของภาพคือ "การนำทาง" ดังนั้นภาพควรจะทำความเข้าใจได้ง่าย
  • ข้อสอง สำหรับนักออกแบบเว็บเพจบางคน ขนาดของไฟล์อาจไม่ใช่สิ่งสำคัญมากนักเพราะเทคโนโลยีมีการพัฒนาขึ้นเสมอ ความเร็วในการส่งผ่านข้อมูลทำได้เร็วขึ้น แต่นั่นก็ไม่ได้หมายความว่า การส่งผ่านไฟล์ขนาดใหญ่เป็นเรื่องปกติ คุณควรปรับปรุงขนาดไฟล์ภาพของคุณให้สามารถส่งผ่านโมเด็มที่ใช้งานกันโดยทั่วไปได้อย่างราบรื่น (บางคนยังใช้โมเด็ม 14.4 หรือ 28.8 อยู่สมัยนั้น แม้สมัยนี้จะเร็วขึ้นระดับ 100-200 Mbps ก็ยังมีความจำเป็นอยู่) โดยไม่ทำให้คุณภาพของภาพเสียไป และขนาดของไฟล์ที่เล็กลงก็ทำ ให้คุณบริหารหรือจัดการกับไฟล์ต่างๆ ได้ง่าย สะดวก และเร็วขึ้นอีกด้วย

5. ควบคุมขนาดของเพจให้ดี

เว็บเพจของคุณมีขนาดกว้าง x ยาวเท่าไร และคุณเคยทดสอบการแสดงผลบนเว็บบราวเซอร์ที่ต่างค่ายกัน ต่างขนาดจอหรือไม่ ดังนั้นคุณควรจะ

  • เรียนรู้ข้อจำกัดของผู้ชม อย่าลืมว่าผู้เข้าชมเว็บไซต์ของคุณนั้นอยู่กันทุกมุมโลก แต่ละคน มีอิสระในการกำหนดความละเอียดในการแสดงผล เลือกใช้เว็บบราวเซอร์ที่เขาชอบ และประทับใจ
  • วางรูปแบบโครงร่างที่เหมาะสม การวางโครงร่างของเนื้อหาด้วยขนาดที่ใหญ่เกินไป ไม่เพียงแต่ผู้ชมจะเบื่อหน่ายต่อการเลื่อนแถบเลื่อนไปมา แต่อาจจะพลาดข้อมูลสำคัญที่คุณ ต้องการนำเสนอไปอย่างน่าเสียดาย เพราะอยู่ในตำแหน่งขอบที่ล้นจอออกไป
  • ออกแบบ "เฟรมที่ยืดหยุ่น" ซึ่งสอดคล้องกับการรับชม เมื่อคุณใช้เฟรมหรือตารางใน เว็บเพจของคุณ ควรกำหนดขนาดด้วยค่าเปอร์เซนต์แทนตัวเลขค่าคงที่ เพื่อให้ยืดหยุ่น เหมาะสมกับการแสดงผลของแต่ละคน
  • การแสดงผลที่เหมาะกับหลากหลายอุปกรณ์ ในปัจจุบันการสื่อสารแบบอนไลน์นั้นมีอุปกรณ์ที่มากกว่าคอมพิวเตอร์พีซี หรือโน้ตบุ๊ค แต่ยังมีพวกอุปกรณ์เคลื่อนที่อย่าง แท็ปเล็ต สมาร์ทโฟน ที่มีขนาดจอแตกต่างกัน การออกแบบการแสดงผลที่ดูได้สะดวกกับทุกอุปกรณ์ ที่เรียกว่า Responsive Web Design จึงมีขึ้นเพื่อแก้ปัญหาดังกล่าว โดยใช้ CSS, CSS3 และ JavaScript มาช่วยในการออกแบบ เพื่อให้ข้อมูลบนเว็บไซต์มีการจัดเรียงลำดับและแสดงผลบนหน้าจอที่แตกต่างกันได้โดยอัตโนมัติและมีประสิทธิภาพ

responsive 01

การทำ Responsive Web Design ส่งผลดีต่อคะแนนของ SEO (Search Engine Optimization) ทำให้เว็บไซต์ของเรามีโอกาสจัดอยู่ในลำดับที่ดีขึ้นของหน้า Search Engine อย่าง Google

6. วางแผนและออกแบบก่อนลงมือสร้าง

เมื่อคุณคิดจะออกแบบสร้างเว็บเพจ อย่าวางแผนสร้างเฉพาะหน้าแรก แต่ให้วางแผนตลอดทั้งไซต์ เพื่อให้มีความผสมกลมกลืนกัน นอกจากนี้การเพิ่มแผนที่ของไซต์ (Site Map) ในกรณีที่เว็บเพจของคุณมีความซับซ้อน ทั้งจำนวนไฟล์ HTML, ภาพ, โปรแกรม หรือสิ่งอื่นๆ เพื่อให้ผู้ชมสามารถทำความเข้าใจกับโครงสร้างเว็บเพจของคุณ และในทางกลับกันคุณก็จะบริหารและจัดการกับไซต์ของคุณได้ง่ายขึ้นด้วย

7. ชี้นำผู้ชมด้วยวิธีการง่ายๆ

สิ่งหนึ่งที่มีความสำคัญและคุณไม่ควรลืม นั่นคือ อย่าลืมจุดประสงค์ในการสร้างเว็บไซต์ของคุณ และดำเนินการตามจุดประสงค์นั้น เช่น การเลือกและวางรูปแบบเนื้อหา ออกแบบกราฟิก สำหรับนำทางด้วยวิธีการง่ายๆ และสอดคล้องกับจุดประสงค์ สิ่งเหล่านี้จะสร้างความประทับใจให้กับผู้ชมได้โดยง่าย อย่าทำให้เป็นไซต์แบบรวมมิตรเลยครับ มีสารพัดสิ่งตั้งแต่สากกะเบือยันเรือรบ เพราะคนที่หลงเข้าไปจะไม่มีวันหวนกลับมาอีกแน่

8. อย่าพยายามทำตัวล้ำหน้าเกินไป

ผมไม่ได้ตั้งหัวข้อผิดนะครับ เทคโนโลยีอาจเป็นเพื่อนที่ดีของคุณ แต่ในขณะเดียวกันมันก็หวนมาทิ่มแทงคุณได้ การออกแบบเว็บไซต์จึงจำเป็นต้องคำนึงถึงข้อจำกัดของผู้ชมด้วย

  • อย่าสร้างเว็บไซต์ด้วยเทคโนโลยีล้ำยุค ซึ่งผู้คนส่วนใหญ่ไม่อาจสัมผัสได้ การใช้เทคโนโลยีใหม่ๆ เป็นเรื่องที่ดี แต่นั่นไม่ใช่ทุกสิ่งทุกอย่างที่คุณต้องทำ คุณต้องนึกถึงคนส่วนใหญ่ที่ยังมีเครื่องรุ่นเก่า เว็บบราวเซอร์ที่ไม่สามารถแสดงเทคโนโลยีล้ำยุคได้ เพราะจุดหมายของคุณคือผู้ชมจำนวนมากไม่ใช่หรือ ทางที่ดีควรเดินสายกลาง ฝึกปฏิบัติและเรียนรู้สิ่งใหม่ๆ เพื่อจะได้พร้อมที่จะเสนอเมื่อทุกอย่างลงตัว (เทคโนโลยีอินเตอร์เน็ต พัฒนาเร็วมาก การวิ่งตามสิ่งที่เกิดขึ้นและยังไม่เป็นที่ยอมรับ อาจทำให้คุณเสียเวลาโดยเปล่าประโยชน์)
  • จากมันสมองและสองมือของคุณ การก๊อบปี้ภาพหรือเอกสารรูปแบบ HTML ของคนอื่นๆ มาใช้ทั้งดุ้นนั้น แม้คนอื่นอาจจะไม่รู้ และเจ้าของเดิมก็อาจจะไม่ถือสา แต่แท้ที่จริงแล้ว วิธีการนี้ไม่ถูกต้อง เพราะคุณจะขาดความเข้าใจและไม่สามารถพัฒนาต่อไปได้ อย่างไรก็ตามในอินเทอร์เน็ตก็มีแหล่งของฟรีมากมาย ไม่ว่าจะเป็นไฟล์ตัวอย่าง HTML ภาพกราฟิก แอพเพล็ต ฯลฯ วิธีนี้ง่าย สบายใจและไม่ผิดอีกด้วยครับ และที่สำคัญสิ่งที่คุณเลือกมานั้น มักจะมีคำอธิบายประกอบและใช้งานได้อย่างสมบูรณ์ด้วย อีกทั้งเว็บไซต์บางแห่งยังให้คำปรึกษาแก่คุณอีกด้วย
  • ดำเนินตามมาตรฐานสากล พยายามใช้เทคโนโลยีที่เป็นมาตรฐานสากลที่ผู้คนทั่วไปใช้และปฏิบัติ โดยเฉพาะจุดกึ่งกลางระหว่างเว็บบราวเซอร์ค่ายต่างๆ ที่ยังไม่เป็นมาตรฐานเดียวกัน (อย่าคิดทำหลายๆ เวอร์ชั่นให้ผู้ชมเลือกชม เพราะคุณจะประสาทกินตอนที่ต้อง ปรับปรุงข้อมูล)

9. ง่ายๆ แต่จริงใจ

เว็บไซต์บางคนเรียกโฮมเพจ ดังนั้นมันจึงเหมือนกับเป็นบ้านของคุณ การที่ผู้ชมเข้ามาในเว็บไซต์หน้าแรกแล้วประทับใจ คุณก็มีชัยไปกว่าครึ่งแล้ว สร้างความเชื่อถือ เชื่อมั่นให้เกิดขึ้นในใจของผู้ชม เหมือนกับคุณปฏิบัติต่อแขกที่มาเยี่ยมบ้าน นั่นคือนำเสนอข้อมูลที่ยืดหยุ่น ตรงไป ตรงมา เป็นกันเอง จำไว้ว่า ของดีๆ ไม่จำเป็นต้องยากเสมอไป อย่ากลัวที่จะเพิ่มสิ่งใหม่ๆ ลงในไซต์ของคุณเป็นช่วงๆ เพื่อเพิ่มความน่าสนใจกับผู้ชม

10. อย่าลืมปรับปรุงความสดใส

การนำเสนอสิ่งที่น่าสนใจ จะเป็นการชักชวนให้ผู้ชมแวะเวียนกลับมาครั้งแล้วครั้งเล่า การแสดงวันที่ หรือจำนวนครั้ง ที่ปรับปรุงก็มีส่วนช่วยให้ผู้ชมกลับมาเยี่ยมคุณอีก ลองดูเทคนิคในการปรับปรุงเปลี่ยนแปลงง่ายๆ ต่อไปนี้ดูซิครับ อาจมีประโยชน์กับคุณ

  • จัดสลับลำดับเนื้อหาที่มีอยู่ เสริมเนื้อหาใหม่ๆ สลับกับเนื้อหาเดิมที่มีอยู่ การเพิ่มเนื้อหา และหัวข้อใหม่ๆ จะช่วยเพิ่มความสดใสและน่าสนใจยิ่งขึ้น
  • อย่าละเลยผลตอบรับของผู้ชม สิ่งที่ผู้ชมติติงข้อผิดพลาดควรจะรีบแก้ไขในทันที เพราะนั่นคือมีคนคอยสนใจและตรวจสอบให้แล้ว แน่นอนเขาย่อมกลับมาเยี่ยมชมคุณอีกแน่นอน อย่าลืมอีเมล์ตอบกลับทันทีถ้าทำได้
  • ใส่ตัวเลขนับจำนวนผู้ชมเข้าไปด้วย เพื่อบอกให้ผู้ชมทราบว่า เว็บไซต์ของคุณยอดนิยมแค่ไหน และคุณยังสามารถประเมินเนื้อหาได้ว่าเรื่องใดที่ผู้ชมสนใจมากที่สุด โดยสังเกตจำนวนที่เพิ่มขึ้นเมื่อคุณเปลี่ยนแปลงเนื้อหาใหม่

วันเวลาเปลี่ยนไปเร็วมากครับ บทความนี้ก็ผ่านมาหลายปีแล้ว แต่ก็ยังได้รับความสนใจจากแฟนๆ อยู่ หลายคนได้ข้อคิดจากตรงนี้ หลายคนขอสำเนาไปเผยแพร่ต่อ ก็ต้องขอขอบคุณสำหรับทุกท่านที่นำไปใช้ประโยชน์ช่วยกันเผยแพร่เทคนิคดีๆ เด็ดๆ ต่อๆ ไปช่วยกันเถอะครับ ความรู้ดีๆ หลากหลายที่เป็นภาษาไทยจะได้มีมากขึ้นเพื่อให้คนไทยหลายๆ คนที่เป็นไม้เบื่อไม้เมากับภาษาอังกฤษจะได้สนใจผลิตงานดีๆ ขึ้นมาอีก

สนับสนุนให้ Easyhome อยู่รับใช้ท่านตลอดไป ด้วยการคลิกแบนเนอร์ไปเยี่ยมผู้สนับสนุนของเราด้วยครับ
นโยบายความเป็นส่วนตัว Our Policy

ยินดีต้อนรับทุกท่านสู่เว็บไซต์ Easyhome in Thailand เว็บไซต์ของเรา ใช้คุกกี้ (Cookies) เพื่อให้ท่านได้รับประสบการณ์การใช้งานที่ดียิ่งขึ้น อ่านนโยบายคุ้มครองข้อมูลส่วนบุคคล (Privacy Policy) และนโยบายคุกกี้ (Cookie Policy)