6 ขั้นตอนสร้างสรรค์ layout website ให้สวยงามสมบูรณ์แบบ

6 ขั้นตอนสร้างสรรค์ layout website ให้สวยงามสมบูรณ์แบบ

1. Sketch ภาพในหัวของคุณลงบนกระดาษ   

         

                         

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

   

2. สร้างระบบ grid

             

   

    อีกหนึ่งเครื่องมือที่ต้องคำนึงถึงก่อนการออกแบบคือ การวางระบบ grid ที่ช่วยให้การจัดวางเลย์เอาท์ได้สัดส่วนสวยงามและมั่นใจได้ว่าการออกแบบนั้นจะออกมาดูดีแน่นอน

  

3. เลือกตัวอักษรให้เข้ากับ concept ของ website

  

             

  

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

  

4. เลือก theme สี

  

              

  

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

  

5. แบ่ง layout

  

             

  

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

  

6. ใส่ใจทุกรายละเอียด

  

            

  

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

  

Credit : http://www.creativebloq.com/web-design/steps-perfect-website-layout-812625/2

โดย :
 11659
ผู้เข้าชม

บทความที่เกี่ยวข้อง

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

Feature SoGoodWeb

SoGoodWeb มีระบบรับชำระเงินแบบใหม่ผ่าน Pay Solution รองรับทุกธนาคารชั้นนำ ทำให้การจ่ายเงินผ่านช่องทางออนไลน์เป็นเรื่องง่าย ช่วยให้ลูกค้าจ่ายเงินออนไลน์ได้อย่างสะดวก
LINE Notify คือ บริการที่คุณสามารถได้รับข้อความแจ้งเตือนจากเว็บเซอร์วิสต่างๆ ที่คุณสนใจได้ทาง LINE โดยหลังเสร็จสิ้นการเชื่อมต่อกับทางเว็บเซอร์วิสแล้ว คุณจะได้รับการแจ้งเตือนจากบัญชีทางการของ “LINE Notify” ซึ่งให้บริการโดย LINE นั่นเอง
เหมาะสำหรับลูกค้าที่เปิดธุรกิจทัวร์ - ทัวร์ท่องเที่ยว ทั้งที่เป็นเจ้าของเอง หรือเป็นรายย่อย เป็นระบบจองทัวร์ ที่ช่วยทำให้การจัดการธุรกิจทัวร์ - ทัวร์ท่องเที่ยว ให้เป็นเรื่องง่าย
สร้างเว็บไซต์สำเร็จรูปฟรี ร้านค้าออนไลน์