11 ข้อผิดพลาดทั่วไปในการออกแบบเว็บไซต์ (ความผิดพลาด)

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

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

ในบทความนี้เราอยากจะเน้น 11 การออกแบบเว็บผิดพลาดที่นักพัฒนาและนักออกแบบเว็บไซต์ทำ และข้อเสนอแนะบางประการว่าข้อผิดพลาดเหล่านี้สามารถหลีกเลี่ยงได้ง่าย.

1. ช่องค้นหาอยู่ที่ไหน?

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

ข้อเสนอแนะ:Google Custom Search เป็นวิธีที่เรียบง่ายและมีประสิทธิภาพในการเริ่มต้น ช่วยให้ผู้เข้าชมสามารถค้นหาไซต์ของคุณได้อย่างมีประสิทธิภาพ เพียงแค่คัดลอกโค้ด HTML จากแผงควบคุมและวางลงบนเว็บไซต์ของคุณและvoilà ??  ?? Ã'Âคุณมีฟังก์ชันการค้นหาบนเว็บไซต์ของคุณ.

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

มากกว่า: การออกแบบกล่องค้นหาศักดิ์สิทธิ์: ตัวอย่างและวิธีปฏิบัติที่ดีที่สุด- บทความนี้ให้รายละเอียดแนวทางในการออกแบบช่องค้นหา.

2. การอ่านไม่ดี & อ่านง่าย.

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

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

1. เปรียบเทียบแบบแผนชุดสีของไซต์ส่วนใหญ่และสังเกตว่าสีช่วยให้อ่านง่ายขึ้นหรือไม่ สถานที่ที่ดีในการลองใช้ชุดรูปแบบสีที่แตกต่างกันคือ Adobe Kuler.
2. ใช้ แบบอักษร Sans serif เนื่องจากช่วยให้อ่านง่ายบนเว็บ.

มากกว่า: นี่คือบทความที่ดีที่จะให้คำแนะนำเพิ่มเติมเกี่ยวกับการปรับปรุงความสามารถในการอ่าน - ความสามารถในการอ่าน - ทำให้หน้าเว็บอ่านง่าย.

3. เค้าโครงเนื้อหาที่ไม่มีการรวบรวมกัน.

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

ใช้ชื่อหน้าที่เหมาะสมสำหรับแต่ละหน้าเว็บเพื่อให้ผู้ใช้ทราบว่าพวกเขาอยู่ที่ไหน นักออกแบบบางคนลืมที่จะตั้งชื่อหน้าเว็บ.

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

ข้อเสนอแนะ: จัดระเบียบเนื้อหาบนเว็บไซต์ของคุณโดยใช้ HTML และ CSS ควรใช้เมื่อสร้างการออกแบบหน้าเว็บของคุณ.

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

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

4. การนำทางที่ไม่ดี.

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

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

ข้อเสนอแนะ:

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

โปรดจำไว้ว่าหากผู้ใช้ไม่สามารถค้นหาสิ่งที่ต้องการในเวลาน้อยกว่า 3 คลิกส่วนใหญ่จะออกจากทันที.

มากกว่า: การใช้การนำทางเว็บไซต์อย่างมีประสิทธิภาพ - บทความนี้ให้ข้อมูลเชิงลึกเพิ่มเติมเกี่ยวกับการใช้การนำทางที่มีประสิทธิภาพสำหรับเว็บไซต์ของคุณ.

5. การออกแบบส่วนต่อประสานที่ไม่สอดคล้องกัน.

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

ข้อเสนอแนะ:

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

6. ความละเอียดหน้าจอที่ไม่เป็นมิตร.

ฉันแน่ใจว่าเราได้เยี่ยมชมเว็บไซต์ที่คุณต้องเลื่อนในแนวนอน นี่เป็นสิ่งที่ไม่ต้องสงสัยเลยในการออกแบบเว็บไซต์ที่ทันสมัย นักออกแบบที่ดีจะพัฒนาเว็บไซต์ที่เหมาะสมกับขนาดหน้าจอส่วนใหญ่ เค้าโครงที่ได้รับการปรับปรุงในปัจจุบันสำหรับเว็บไซต์ปัจจุบันคือ 1024 x 768 พิกเซล.

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

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

7. แบบฟอร์มลงทะเบียนที่ซับซ้อน.

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

แบบฟอร์มที่เรียบง่ายของบัตรบางคนทำให้การลงทะเบียนเจ็บปวด.

ข้อเสนอแนะ:เปรียบเทียบแบบฟอร์มการลงทะเบียนในชุมชนต่างๆบนเว็บและเข้าใจว่าข้อมูลพื้นฐานใดบ้างที่ผู้ใช้ต้องการในระหว่างกระบวนการลงทะเบียน.

มากกว่า: 9 ข้อผิดพลาดในการใช้งานทั่วไปในการออกแบบเว็บ - โพสต์บน Smashing Magazine นี้จะพิจารณาแบบลงลึกในแบบฟอร์มการลงทะเบียนท่ามกลางข้อผิดพลาดในการใช้งานอื่น ๆ.

8. การใช้รูปภาพ / แอนิเมชั่นไร้ยางอาย.

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

แอนิเมชั่นยอดเยี่ยมและเป็นสื่อที่ทรงพลัง โดยเฉพาะเมื่อใช้อย่างเหมาะสม เมื่อมันเป็นวัฏจักรหรือมากเกินไปบนหน้าเว็บมันจะเข้าสู่ความกังวลของผู้ใช้ ผู้ใช้ไม่มีความอดทนเวลาหรือทรัพยากรดังนั้นนักออกแบบจะต้องเสนอทางเลือกหรือดีกว่านั้นคือปุ่มข้ามหากเป็นภาพเคลื่อนไหวแบบเต็มหน้า.

มากกว่า: แฟลช: ไม่ดี 99% - ใช้แฟลชอย่างเหมาะสม เป็นเวลาเกือบ 10 ปีแล้วที่จาคอบนีลเส็นตีพิมพ์บทความนี้ แต่ก็ยังมีความเกี่ยวข้องในแง่ของการใช้งานแฟลชโดยเฉพาะ ทำลายความรู้พื้นฐานทางเว็บ ชิ้น.

9. หน้ารก, พื้นที่ว่างมากขึ้น.

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

kylestanding ใช้ประโยชน์จาก whitespace ในการออกแบบของพวกเขา.

นี่เป็นบทความเล็ก ๆ น้อย ๆ ที่จะทำให้คุณมีความคิดที่ดีเกี่ยวกับ ความสำคัญของพื้นที่ว่างในการออกแบบเว็บ:

• การเปรียบเทียบเลย์เอาต์อวกาศสีขาวสี่แบบ
• คุณค่าของพื้นที่สีขาว
• ช่องว่าง

10. ไม่มีดนตรีประกอบโปรด!

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

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

11. ทดสอบทดสอบและทดสอบ.

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

• สามารถดูเว็บไซต์ในสภาพแวดล้อมที่แตกต่างกัน?
• รูปแบบการออกแบบสอดคล้องกันในเบราว์เซอร์ทั้งหมดหรือไม่?
• สามารถดูเว็บไซต์ในการตั้งค่าต่าง ๆ เช่นปิดรูปภาพ, ปิด JavaScript, เป็นต้น?

ข้อเสนอแนะ:W3C มีเครื่องมือสำหรับทดสอบการประกันคุณภาพ เช็คเอาท์ กล่องเครื่องมือการประกันคุณภาพของ W3C และ การตรวจสอบหน้าเว็บ.

สรุป:

ทำให้ง่ายโง่ (K.I.S.S. ) บรรทัดล่างนั่นคือ ถ้ามันง่ายมันใช้งานได้ ในทุกเว็บไซต์ที่ดีทำให้มันง่ายและใช้งานได้ ทำการบ้านของคุณและมันง่ายและเป็นธรรมชาติ.

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

หมายเหตุจากบรรณาธิการ: โพสต์นี้เขียนโดย Brujo Owoh สำหรับ Hongkiat.com Brujo Owoh เป็นปริญญาตรีระบบมัลติมีเดียที่เชี่ยวชาญในการออกแบบเว็บและภาพเคลื่อนไหว 2D เขาสนุกกับการอ่านนิยายออกไปเที่ยวกับเพื่อน ๆ ของเขาและติดตามแนวโน้มการออกแบบบน Twitter เยี่ยมชมบล็อกของ Brujo.