แนวโน้มการออกแบบเว็บไซต์ปี 2016 ที่ต้องพิจารณาก่อนสร้างเว็บไซต์ของคุณ

dk new media ไซต์ 1

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

  1. นิเมชั่น

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

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

เว็บไซต์ Beagle Animated

คลิกเพื่อดูภาพเคลื่อนไหว JavaScript และ CSS ที่น่าทึ่งของ Beagle เมื่อคุณเลื่อนลงไปที่ไซต์

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

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

  1. การออกแบบวัสดุ

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

การออกแบบวัสดุใช้เงาการเคลื่อนไหวและความลึกเพื่อมอบความสวยงามที่สะอาดตาและทันสมัยโดยมุ่งเน้นไปที่การปรับ UX ให้เหมาะสมโดยไม่ต้องมีเสียงระฆังและเสียงนกหวีดมากเกินไป

ตัวอย่างอื่น ๆ ของการออกแบบวัสดุ ได้แก่ ภาพจากขอบจรดขอบตัวอักษรขนาดใหญ่และพื้นที่สีขาวโดยเจตนา

แนวคิดการออกแบบวัสดุ Youtube Android ใหม่

  1. การออกแบบแบบแบน

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

ตึก Space Needle

ตามหลักการของพื้นที่สีขาวขอบที่กำหนดสีที่สดใสและ 2 มิติหรือ "แบน" - ภาพประกอบการออกแบบแบนมีรูปแบบที่หลากหลายซึ่งมักใช้เทคนิคต่างๆเช่นรูปสัญลักษณ์เส้นและเงายาว

Lander

  1. แยกหน้าจอ

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

แยกหน้าจอ

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

แยกหน้าจอมหาสมุทร

  1. การทิ้ง Chrome

นอกจากกันชนโครเมียมและการตกแต่งบนรถคลาสสิกแล้ว“ โครเมี่ยม” หมายถึงคอนเทนเนอร์ของเว็บไซต์ซึ่ง ได้แก่ เมนูส่วนหัวท้ายกระดาษและเส้นขอบที่ห่อหุ้มเนื้อหาหลัก

เวลาโครเมี่ยม

สิ่งนี้อาจทำให้เสียสมาธิและหลาย บริษัท เลือกที่จะหลุดพ้นจากคอนเทนเนอร์และสร้างเลย์เอาต์แบบขอบจรดขอบโดยไม่มีขอบส่วนหัวหรือส่วนท้าย

โครเมี่ยมไปข้างหน้า

 

  1. ลืมพับ

"ครึ่งหน้าบน" คือศัพท์แสงในหนังสือพิมพ์สำหรับครึ่งบนของหน้าแรกของหนังสือพิมพ์ เนื่องจากหนังสือพิมพ์มักจะพับและวางไว้ในกล่องและจอแสดงผลเนื้อหาที่น่าสนใจที่สุดจึงอยู่ในครึ่งหน้าบนเพื่อให้พวกเขามีโอกาสที่ดีที่สุดในการดึงดูดผู้อ่านที่มีศักยภาพ (และกระเป๋าสตางค์ของพวกเขา)

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

เมล็ดพืช

  1. วิดีโอแบบเต็มหน้าจอ

วิดีโอเป็นวิธีที่ดีในการดึงดูดความสนใจของผู้เข้าชมและมักจะมีประสิทธิภาพมากกว่าทั้งภาพหรือข้อความ การเล่นวิดีโอแบบวนซ้ำเช่นที่ Apple ใช้สำหรับ Apple Watch เป็นวิธีพิเศษในการกำหนดโทนเสียงและดึงผู้เข้าชมเข้ามา

Highbridge

คลิกเพื่อดู Highbridgeวิดีโอในหน้าแรกของพวกเขา

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

คุณคิดอย่างไร?

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