การออกแบบเว็บไซต์ให้ทั้งสวย ทั้งเวิร์ค และเข้าใจง่ายใช้สะดวกสำหรับคนส่วนใหญ่นั้น เป็นเรื่องยากท้าทายมาทุกยุคทุกสมัย ทางหนึ่งก็คือดูว่าเว็บอื่นๆที่ประสบความสำเร็จเค้าทำอย่างไรกัน แล้วนำไอเดียมาเป็นแรงบันดาลใจ (ไม่ใช่ก๊อป) ปรับแต่งให้เหมาะสมกับเว็บเรา
การจะไปดูดีไซน์เก่าๆ นั้นก็ไม่เวิร์ค เพราะความพฤติกรรมผู้ใช้เปลี่ยนไปเรื่อยๆ ทางที่ดีควรออกแบบดักหน้าอนาคตใกล้ๆเผื่อไว้จะดีที่สุด … ฉะนั้นลองไปดู 10 เทรนด์การออกแบบที่ TheNextWeb.com ฟันธงว่าเวิร์คแน่สำหรับปีนี้ทั้งปี ซึ่งทาง BrandBuffet เราขอเอามาเรียงใหม่ อธิบายใหม่ ให้เข้าใจง่ายขึ้น
1. Content เด่นที่สุด
เว็บไหนเคยเน้นเมนูหลัก เมนูข้าง เน้นโลโก้ใหญ่ๆ หรือเน้นอะไรอื่นๆ ก็ควรจะกลับมาเน้นเนื้อหาของหน้านั้นๆสำคัญที่สุด เพราะคนที่เข้ามาหน้านั้นจากที่อื่นๆ เช่นโซเชี่ยล หรือกูเกิ้ล จะได้เจอสิ่งที่ต้องการง่ายๆเร็วๆ และอ่านเนื้อหาได้หมด ไม่ใช่เบื่อออกไปซะก่อน
2. เน้นหนัก landing page , เบาๆ homepage
ต่อเนื่องจากข้อแรก ในเมื่อคนเข้าจากที่อื่นๆมากกว่าจากหน้าแรก ฉะนั้นแต่ละหน้าก็ควรออกแบบให้ตอบโจทย์ที่สุด โดยเฉพาะหน้าที่เป็นเป้าหมายจากการเสิร์ชหรือจากโซเชี่ยล ควรทำหน้าที่เป็น landing page ให้ครบถ้วน เช่นหน้าผลิตภัณฑ์นั้นๆ หน้าสั่งซื้อ หรือหน้าสมัครสมาชิก ล้วนสำคัญกว่าหน้าแรกซะอีก
3. เมนูอย่าเยอะ
สืบเนื่องจากข้อแรก เน้นเนื้อหา เน้นสิ่งที่ต้องการสื่อจะดีกว่า เพราะถ้าเมนูใหญ่มากหนักมาก ก็จะไปโผล่รบกวนเนื้อหาหลักของทุกหน้ากันเลยทีเดียว
4.โต้ตอบเสมอ เมื่อเธอสะกิด
ในเมื่อเมนูและองค์ประกอบต่างๆถูกลดทอนให้เล็กและเรียบง่ายแล้ว ก็ควรเพิ่ม interaction ตอบสนองต่างๆเข้าไปในทุกจุดที่ควรมี เช่นเมื่อเลื่อนเม้าส์ผ่านก็เปลี่ยนสีเปลี่ยนทรงให้รู้ว่าคลิกได้ ให้รู้ว่ามีเมนูย่อย หรือมีกรอบแสดงข้อมูลเพิ่มเติมโผล่ขึ้นมา โดยทั้งหมดนี้ไม่ต้องโหลดหน้าใหม่ เพื่อให้สะดวกว่องไวที่สุด
5. พอกันที 4 เหลี่ยม flat
flat design สไตล์ 4 เหลี่ยมดังมากในหลายปีนี้ จากการริเริ่มโดย Windows 8 เป็นต้นมากับดีไซน์ที่เรียกว่า “metro” แต่หลังๆนี้ถูกมองว่าน่าเบื่อเพราะเยอะไปแล้ว
6. ห้าเหลี่ยม หกเหลี่ยม ได้หมดถ้าสดชื่น
ต่อเนื่องจากข้อที่แล้ว เว็บไหนใช้ 5 เหลี่ยม 6 เหลี่ยม ก็จะโดดเด่นสะดุดตาน่าจดจำกว่า แล้วแต่ความเหมาะสม
7. หัวข้อ วางแปลกๆ สะดุดตา
หัวข้อใหญ่ๆสำคัญๆ ถ้าเป็น text ตัวหนา หรือขีดเส้น แบบเดิมๆเท่านั้นก็น่าเบื่อ ลองเปลี่ยนเป็นกราฟฟิกที่เว้นบรรทัดหรือจัดแปลกๆ (แต่อ่านรู้เรื่อง) กันดู
8. ฉากหลัง Gradient ไล่โทนสองสี
ใครใช้ไอโฟนคงชินตากับการไล่สี 2 สีแบบนี้ ซึ่งหากเลือกใช้เป็นฉากหลัง ก็ช่วยขับให้เนื้อหาในนั้นดูโดดเด่นน่าอ่านขึ้นมาได้อย่างมหัศจรรย์
9. ขยับบ้าง สร้างสีสัน
ขยับในที่นี้ห้ามใช้ Flash แบบยุคเก่า เพราะเค้าไม่รองรับกันแล้ว ให้ไปใช้ไฟล์ GIF หรือ HTML5 เพราะเบา โหลดไว และรองรับในแทบทุกระบบ
10. ลายเส้น ลายมือ คือตัวสร้างเอกลักษณ์
มากกว่า 90% ขององค์ประกอบบนเว็บส่วนใหญ่ทุกวันนี้ เป็นกราฟฟิกจากคอมพิวเตอร์และภาพถ่ายสี่เหลี่ยม ฉะนั้นลองใส่ลายเส้นวาดมือ และตัวอักษรลายมือเข้าไปบ้าง จะช่วยสร้างความน่าสนใจ สร้างเอกลักษณ์ ได้โดยไม่ต้องออกแบบอะไรให้วิจิตรพิสดารอะไรมากเลย
และสุดท้ายที่ BrandBuffet ขอแถมและย้ำ คือว่าแม้รูปตัวอย่างในนี้จะเน้นไปที่เว็บเวอร์ชั่น desktop สำหรับคอมพิวเตอร์ โน้ตบุ๊ค แท็บเล็ต ..แต่ก็ต้องอย่าลืมออกแบบให้ใช้ง่ายและดูดีบนจอมือถือเล็กๆ ด้วย ! …อาจจะเป็น “responsive design” คือเปิดต่างอุปกรณ์ก็เห็นต่างองค์ประกอบกัน หรือจะเป็น “mobile first” คือ ออกแบบเพื่อจอมือถือไว้ก่อน ส่วนบนคอมฯ ก็เห็นดีไซน์เดียวกันแต่ใหญ่ขึ้นก็ได้
… ทั้งหมดนี้ อ่านแล้วใครเห็นด้วยหรือเห็นต่างอย่างไร ? แบ่งปันมุมมองกันได้เลย !
Credit :
thenextweb.com/dd/2016/12/22/web-design-trends-can-expect-see-2017
designmodo.com/hand-drawn-elements-web-design
แปลและเรียบเรียงโดย: Somkid Anektaweepon
Credit Photo (ภาพเปิด) : NUMBER 24 – Authorized Shutterstock Partner in Thailand