การเขียนเค้าโครงหน้าเว็บที่ดีขึ้น

เคล็ดลับการจัดวางหน้าเว็บ

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

01 จาก 07

จัดเรียงองค์ประกอบทั้งหมดด้วยเส้นใยอื่นหรือกริด

Getty Images / Reggie Casagrande

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

02 จาก 07

เลือกภาพเดี่ยวหรือสร้างการเชื่อมต่อภาพที่แข็งแกร่ง

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

03 จาก 07

เก็บส่วนที่ไม่พึงประสงค์หรือแม้กระทั่งในยอดคงเหลือ

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

04 จาก 07

แบ่งหน้าออกเป็นสามส่วน

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

  1. องค์ประกอบที่สำคัญที่สุดมีระยะห่างกันมากหรือน้อยเท่ากันภายในแนวตั้งหรือแนวนอนที่สาม
  2. องค์ประกอบที่สำคัญที่สุดเน้นที่ด้านบนหรือด้านล่างของหน้า
  3. องค์ประกอบที่สำคัญที่สุดอยู่กึ่งกลางจุดหนึ่งที่จุดตัดกันหลังจากแบ่งสายตาออกเป็นสามส่วนตามแนวนอนและแนวตั้ง

05 จาก 07

เพิ่มพื้นที่สีขาวในสถานที่ที่เหมาะสม

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

06 จาก 07

ใช้องค์ประกอบการออกแบบเดียวกันสองชิ้นหรือมากกว่า

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

07 จาก 07

เน้นความแตกต่างระหว่างองค์ประกอบของการออกแบบ

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