วิธีดำเนินการตรวจสอบการออกแบบเว็บไซต์ของคุณ
เผยแพร่แล้ว: 2017-06-27เมื่อเว็บไซต์ของคุณเติบโตขึ้น ก็มีโอกาสที่การออกแบบอาจเริ่มดูเก่าไปบ้าง พึงระลึกไว้เสมอว่า เทรนด์การออกแบบมีการพัฒนาอย่างต่อเนื่อง และการสามารถระบุปัญหาเหล่านี้ได้เป็นสิ่งสำคัญ หากคุณต้องการให้ไซต์ของคุณดูทันสมัยและ 'สดใหม่' นอกจากนี้ คุณจะต้องรักษาทุกแง่มุมของการออกแบบของคุณให้ดูเหมือนสม่ำเสมอ (และใช้งานได้) เพื่อมอบประสบการณ์ที่ดี
วิธีที่ดีที่สุดในการระบุและแก้ไขปัญหาเหล่านี้คือการตรวจสอบการออกแบบเว็บไซต์ทั้งหมดของคุณ ในบทความนี้ เราจะสอนคุณว่าการตรวจสอบเหล่านี้คืออะไร และสามารถช่วยคุณได้อย่างไรบ้าง จากนั้นเราจะพูดถึงเครื่องมือบางอย่างที่จะช่วยคุณดำเนินการ ก่อนที่จะแสดงให้คุณเห็นถึงวิธีการทำในสามขั้นตอนง่ายๆ ไปทำงานกันเถอะ!
การตรวจสอบการออกแบบคืออะไร (และจะช่วยคุณได้อย่างไร)
การตรวจสอบการออกแบบคือเมื่อคุณนั่งทบทวนองค์ประกอบการสร้างแบรนด์ที่มองเห็นได้ของเว็บไซต์หรือบริษัทของคุณ ในกรณีส่วนใหญ่ คุณกำลังมองหาความสม่ำเสมอ แต่กระบวนการนี้ยังเป็นโอกาสที่ดีในการตรวจสอบว่าการออกแบบของคุณยังดูใหม่อยู่หรือไม่
พูดตามตรง คำว่า "การตรวจสอบ" ทำให้ทุกอย่างดูน่ากลัวมากกว่าที่เป็นอยู่ ไม่ว่าในกรณีใด การตรวจสอบการออกแบบเว็บไซต์เป็นประจำมีประโยชน์หลายประการ ตัวอย่างเช่น:
- โอกาสในการตรวจสอบการออกแบบของคุณ เมื่อเทรนด์การออกแบบเข้าและออกจากสไตล์ ก็มีแนวโน้มว่าองค์ประกอบภาพของคุณอาจดูไม่จืดชืดไปบ้าง การตรวจสอบการออกแบบสามารถให้การตรวจสอบความเป็นจริงและโอกาสในการอัพเกรดแก่คุณได้
- ตรวจสอบการสร้างแบรนด์ของคุณ เว็บไซต์ส่วนใหญ่มีการสร้างแบรนด์ของตนเองโดยอิงจากองค์ประกอบภาพหลายอย่าง เช่น โลโก้ แท็กไลน์ รูปภาพส่วนหัว และอื่นๆ เมื่อเวลาผ่านไป องค์ประกอบเหล่านี้อาจไม่ตรงกัน ซึ่งอาจส่งผลต่อการรับรู้แบรนด์ของคุณ
- คุณสามารถนำเสนอเป็นบริการให้คำปรึกษา หากคุณมีประสบการณ์ในการดำเนินการตรวจสอบการออกแบบที่ประสบความสำเร็จ คุณสามารถทำการตลาดบริการของคุณกับบริษัทอื่นและช่วยพวกเขาในกระบวนการ ธุรกิจจำนวนมากไม่ทราบถึงประโยชน์ที่พวกเขาเสนอ ดังนั้นโอกาสจะสุกงอมหากคุณสามารถโน้มน้าวพวกเขาได้ว่าพวกเขาต้องการ
ก่อนที่คุณจะออกไปให้บริการของคุณกับเว็บไซต์อื่น ๆ สิ่งสำคัญคือต้องรู้ว่าขั้นตอนพื้นฐานของการตรวจสอบการออกแบบทุกครั้งคืออะไร อย่างที่คุณสามารถจินตนาการได้ คุณจะต้องมีเครื่องมือบางอย่างที่จะช่วยคุณไปตลอดทาง เรามาลองดูตัวเลือกยอดนิยมบางส่วนกัน
3 เครื่องมือที่จะช่วยคุณตรวจสอบการใช้งานการออกแบบเว็บไซต์ของคุณ
หากคุณเป็นนักออกแบบ คุณจะรู้ว่ามีเครื่องมือออนไลน์มากมายที่จะช่วยให้ชีวิตของคุณง่ายขึ้น อย่างไรก็ตาม สำหรับส่วนนี้ เราตัดสินใจที่จะเน้นเฉพาะในส่วนที่สามารถช่วยคุณตรวจสอบองค์ประกอบของไซต์และตรวจสอบข้อบกพร่องในการออกแบบของคุณ ลองมาดูที่ทั้งสามของพวกเขา
1. ไข่บ้า

Crazy Egg เป็นเครื่องมือวิเคราะห์ที่เน้นการช่วยคุณค้นหาส่วนที่มีปัญหาในไซต์ของคุณ โดยใช้เทคโนโลยีแผนที่ความหนาแน่นเพื่อให้คุณเห็นว่าองค์ประกอบใดได้รับความสนใจมากที่สุดในหน้าเว็บของคุณ และองค์ประกอบใดที่ดึงดูดไม่เพียงพอ นอกจากนี้ยังมีฟังก์ชันที่จะช่วยให้คุณทราบว่าผู้ใช้กำลังเลื่อนดูเนื้อหาของคุณหรือไม่ Crazy Egg ยังให้ข้อมูลที่มีค่าแก่คุณเกี่ยวกับที่มาของผู้เข้าชม จากนั้นจึงแบ่งกลุ่มพฤติกรรมตามข้อมูลนั้น
จากมุมมองของการออกแบบ เครื่องมือประเภทนี้มีค่ามาก เนื่องจากช่วยให้คุณสามารถโฟกัสไปที่ส่วนต่างๆ ของการออกแบบที่ต้องการความช่วยเหลือมากที่สุด ตัวอย่างเช่น หากแผนที่ความหนาแน่นของคุณเปิดเผยว่าคำกระตุ้นการตัดสินใจ (CTA) ที่สำคัญไม่ได้รับแรงฉุดมากเท่าที่ควร คุณสามารถจัดลำดับความสำคัญของการวิเคราะห์ในระหว่างการตรวจสอบการออกแบบครั้งต่อไป
คุณสมบัติหลัก:
- ใช้แผนที่ความร้อนบนเว็บไซต์ของคุณ
- ติดตามว่าผู้เยี่ยมชมของคุณเลื่อนดูหน้าเว็บของคุณมากเพียงใด
- จับตาดูแหล่งที่มาของการเข้าชม และแบ่งกลุ่มข้อมูลของผู้ใช้ตามแหล่งที่มา
ราคา: $9 ต่อเดือน ชำระเป็นรายปี | ข้อมูลมากกว่านี้
2. UsabilityTools

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

สุดท้ายแต่ไม่ท้ายสุด เรามี UsabilityHub สิ่งนี้แตกต่างออกไปเล็กน้อย – เป็นแพลตฟอร์มที่รวมเครื่องมือหลายอย่าง ซึ่งจะช่วยให้คุณทำการตรวจสอบการออกแบบของคุณประสบความสำเร็จ
ประกอบด้วยการทดสอบ Five Second ซึ่งกำหนดว่าผู้ใช้สามารถจำการออกแบบเว็บไซต์ของคุณได้หรือไม่ พร้อมกับการทดสอบการคลิกและการนำทางที่วัดความสามารถในการใช้งาน สุดท้าย คุณยังสามารถเข้าถึงแบบสำรวจผู้ชมที่ช่วยให้คุณกำหนดได้ว่าพวกเขาชอบการออกแบบของคุณหรือไม่ และการเปลี่ยนแปลงใดที่พวกเขาอยากเห็น
คุณสมบัติหลัก:
- ใช้การทดสอบหลายครั้งเพื่อวัดความสามารถในการใช้งานไซต์ของคุณและการยอมรับการออกแบบของคุณ
- ผสมผสานและจับคู่การทดสอบใดๆ ที่คุณต้องการเพื่อให้เหมาะกับความต้องการของคุณ
- ปรับแต่งการทดสอบแต่ละรายการเพื่อวัดองค์ประกอบที่คุณสนใจมากที่สุด
ราคา: $2.50 ต่อการตอบกลับการทดสอบของคุณ | ข้อมูลมากกว่านี้
วิธีดำเนินการตรวจสอบการออกแบบเว็บไซต์ของคุณ (ใน 3 ขั้นตอน)
เมื่อเราสำรวจเครื่องมือบางอย่างที่คุณสามารถใช้ได้ ก็ถึงเวลาพูดถึงขั้นตอนในการตรวจสอบการออกแบบที่ประสบความสำเร็จ คุณอาจไม่ได้ใช้เครื่องมือทั้งหมดที่เราพูดถึง ทั้งนี้ขึ้นอยู่กับเว็บไซต์และเป้าหมายของคุณ แต่นั่นก็ขึ้นอยู่กับคุณ ข้ามไปที่ขั้นตอนที่หนึ่ง

ขั้นตอนที่ #1: รวบรวมองค์ประกอบการสร้างแบรนด์ที่มองเห็นได้ทั้งหมดของคุณ

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

กลยุทธ์การสร้างแบรนด์ของ Netflix นั้นเรียบง่ายแต่มีความสม่ำเสมอ – พวกเขาใช้โลโก้ของตนทุกครั้งที่ทำได้
ดังที่เราได้กล่าวไว้ก่อนหน้านี้ ขั้นตอนที่สองคือการดำเนินการผ่านองค์ประกอบการสร้างแบรนด์ที่มองเห็นได้ของคุณ เพื่อค้นหาความไม่สอดคล้องหรือข้อบกพร่องในการออกแบบของคุณ
การออกแบบ (แน่นอน) เป็นอัตวิสัยในหลาย ๆ ด้าน แต่นั่นไม่ได้หมายความว่าสไตล์เว็บไซต์ของคุณไม่สามารถปรับปรุงได้ ตัวอย่างเช่น ทุกธุรกิจควรนำเสนอรูปแบบการออกแบบที่สอดคล้องกัน เพื่อให้ลูกค้าคุ้นเคยกับรูปแบบดังกล่าว และเชื่อมโยงกับผลิตภัณฑ์ของตน เช่นเดียวกับเว็บไซต์ โลโก้ เนื้อหา และรูปภาพของคุณต้องแชร์สไตล์เดียวกันและคงความสม่ำเสมอ
มาดูเคล็ดลับง่ายๆ สองสามข้อเพื่อให้แน่ใจว่าองค์ประกอบภาพของเว็บไซต์ของคุณมีคุณสมบัติตรงตามเป้าหมายในด้านต่างๆ เหล่านี้:
- ตรวจสอบว่าโลโก้ของคุณยังคงสอดคล้องกันในทุกหน้าของคุณหรือไม่ และถ้าไม่ ให้เปลี่ยนหากจำเป็น
- ตรวจสอบให้แน่ใจว่าภาพพื้นหลังของคุณมีลักษณะที่คล้ายคลึงกัน เพื่อไม่ให้การเปลี่ยนแปลงระหว่างหน้าและส่วนต่างๆ ของคุณไม่สั่นคลอน หากคุณพบภาพที่ไม่เข้ากับแม่พิมพ์ ให้เปลี่ยนภาพเหล่านั้น
- ตรวจสอบให้แน่ใจว่าไอคอนของคุณมีลักษณะที่คล้ายคลึงกัน และหากไม่เป็นเช่นนั้น ให้ลองแทนที่ด้วยตัวเลือกอื่นจากตระกูลเดียว เช่น Font Awesome Icons (ซึ่งสามารถรวมเข้ากับ Divi ได้)
จนถึงตอนนี้ เราได้พูดคุยเกี่ยวกับองค์ประกอบออนไลน์เท่านั้น แต่โปรดจำไว้ว่า การตรวจสอบการออกแบบสามารถ – และควร – ยังครอบคลุมองค์ประกอบภาพออฟไลน์ของคุณ หากธุรกิจของคุณมีคู่ค้าทางกายภาพ คุณจะต้องรวบรวมรายการสร้างแบรนด์ที่คุณสามารถรับมือได้ (เช่น โบรชัวร์ เสื้อยืด และบัตรโทรศัพท์) และทำซ้ำขั้นตอนที่หนึ่งและสองสำหรับพวกเขา
ขั้นตอนที่ #3: สร้างคู่มือมาตรฐานการออกแบบสำหรับเว็บไซต์ของคุณ

คู่มือหลักเกณฑ์การใช้แบรนด์ของ Urban Outfitter พูดถึงสิ่งที่ทำให้แบรนด์ของตนมีเอกลักษณ์เฉพาะตัว
ตอนนี้ได้เวลาวางแผนสำหรับอนาคตแล้ว หนึ่งในวิธีที่ดีที่สุดในการทำเช่นนี้คือการสร้างการรวบรวมกฎสำหรับการเปลี่ยนแปลงการออกแบบในอนาคตในไซต์ของคุณ หรือที่เรียกว่าคู่มือมาตรฐานการออกแบบ
วัตถุประสงค์ของเอกสารนี้คือเพื่อให้แน่ใจว่าในอนาคต คุณสามารถจ้างงานออกแบบภายนอกได้โดยไม่ต้องมีการจัดการขนาดเล็ก นอกจากนี้ เมื่อเว็บไซต์ของคุณเติบโตขึ้น คุณอาจเพิ่มสมาชิกในทีมงานของคุณได้ คู่มือมาตรฐานสามารถช่วยให้พวกเขาเข้าใจการสร้างแบรนด์ด้วยภาพของคุณได้ดีขึ้น อันที่จริง นี่เป็นวิธีปฏิบัติที่ชาญฉลาดที่บริษัทชั้นนำมากมายเข้าร่วมด้วย
สำหรับกฎประเภทใดที่จะรวมไว้ในคู่มือของคุณ มาดูแนวคิดสองสามข้อเพื่อเริ่มต้นกัน:
- รวมหลักเกณฑ์เกี่ยวกับวิธีการใช้โลโก้ของคุณและรูปแบบต่างๆ (นี่เป็นแนวทางปฏิบัติทั่วไปเช่นกัน)
- แนบตัวอย่างประเภทของภาพที่ผู้ร่วมให้ข้อมูลควรใช้บนไซต์ของคุณ ตลอดจนกฎเกี่ยวกับวิธีการนำเสนอ และประเภทของเนื้อหาที่พวกเขาควรหลีกเลี่ยง
- อภิปรายแบบอักษรที่คุณควรใช้ทั่วทั้งเว็บไซต์ของคุณหากมีตัวเลือกมากกว่าหนึ่งตัวเลือก และควรใช้ภายใต้สถานการณ์ใด
- ให้ตัวอย่างประเภทปุ่ม ไอคอน และองค์ประกอบอื่นๆ ที่คล้ายกันที่คุณต้องการใช้ในการออกแบบของคุณ
โปรดทราบว่าคู่มือมาตรฐานการออกแบบสองฉบับจะไม่เหมือนกัน คุณอาจต้องเพิ่มกฎเกณฑ์เพิ่มเติมโดยขึ้นอยู่กับองค์ประกอบที่เว็บไซต์ของคุณใช้ และถ้าคุณต้องการพูดคุยเกี่ยวกับการสร้างแบรนด์ออฟไลน์ อย่างไรก็ตาม การเตรียมการตั้งค่านี้ตั้งแต่เนิ่นๆ ไม่เพียงแต่จะทำให้การตรวจสอบการออกแบบในอนาคตดำเนินไปอย่างราบรื่นยิ่งขึ้น แต่ยังช่วยให้คุณฝึกอบรมส่วนเพิ่มเติมใหม่ๆ ให้กับทีมของคุณได้เร็วขึ้นอีกด้วย
บทสรุป
เมื่อเวลาผ่านไป เป็นเรื่องปกติที่เว็บไซต์ส่วนใหญ่จะต้องมีการปรับปรุงเมื่อต้องออกแบบ ตัวอย่างเช่น องค์ประกอบบางอย่างของคุณอาจแสดงผลได้ไม่ดีนัก แต่อาจเป็นเรื่องยากที่จะระบุสิ่งนี้โดยไม่ทำการตรวจสอบการออกแบบอย่างเต็มรูปแบบเป็นระยะ ยิ่งไปกว่านั้น การทำเช่นนี้จะช่วยให้ผู้เยี่ยมชมของคุณได้รับประสบการณ์ที่ยอดเยี่ยมบนไซต์ของคุณต่อไปในอนาคต
ต่อไปนี้คือขั้นตอนพื้นฐานสามขั้นตอนในการดำเนินการตรวจสอบการออกแบบสำหรับเว็บไซต์ของคุณ:
- รวบรวมองค์ประกอบการสร้างแบรนด์ภาพออนไลน์และออฟไลน์ทั้งหมดของคุณ
- วิเคราะห์องค์ประกอบที่คุณรวบรวม
- สร้างคู่มือมาตรฐานการออกแบบสำหรับเว็บไซต์ของคุณ
คุณมีคำถามเกี่ยวกับวิธีดำเนินการตรวจสอบการออกแบบเว็บไซต์ของคุณให้ประสบความสำเร็จหรือไม่? ถามออกไปในส่วนความคิดเห็นด้านล่าง!
ภาพขนาดย่อของบทความโดย Darko 1981 / shutterstock.com
