Logo Webmonster Lab - สอนทำเว็บไซต์ธุรกิจ WordPress, Elementor โดย อ.ยุ้ย กัญญ์ชิตา วริทธิ์ทินานนท์Logo Webmonster Lab - สอนทำเว็บไซต์ธุรกิจ WordPress, Elementor โดย อ.ยุ้ย กัญญ์ชิตา วริทธิ์ทินานนท์Logo Webmonster Lab - สอนทำเว็บไซต์ธุรกิจ WordPress, Elementor โดย อ.ยุ้ย กัญญ์ชิตา วริทธิ์ทินานนท์Logo Webmonster Lab - สอนทำเว็บไซต์ธุรกิจ WordPress, Elementor โดย อ.ยุ้ย กัญญ์ชิตา วริทธิ์ทินานนท์
  • คอร์สเรียน
    • เรียนตัวต่อตัว : WordPress
    • สถานที่เรียน
    • ฝึกอบรมสำหรับองค์กร
    • บรรยายพิเศษมหาวิทยาลัย
  • รีวิว
    • รีวิวจากผู้เรียน
    • ตัวอย่างเว็บไซต์ (ใช้เรียน)
    • ผลงานออกแบบ UX/UI
    • ประวัติการสอน
  • บทความ/ฮาวทู
    • บทความแนะนำ 😊
    • วิดีโอ ฮาวทู 🎥
    • WordPress
    • Design
    • Marketing for SME
    • Tips & Tools
    • ประสบการณ์จากพี่ยุ้ย
  • เกี่ยวกับ
    • เกี่ยวกับ : ยุ้ย กัญญ์ชิตา
    • บทความส่วนตัว
  • ติดต่อ
สอบถามคอร์ส
✕

การออกแบบเว็บไซต์ “ที่ดี” ไม่ใช่ “แค่มี”

Published by พี่ยุ้ย กัญญ์ชิตา
Categories
  • Design
  • แนะนำ
Tags
  • Branding
  • design
  • Digital Marketing
  • UX/UI
  • website
การออกแบบเว็บไซต์ที่ดี ไม่ใช่แค่มี
  • FacebookFacebook
  • XTwitter
  • LINELine

“เว็บไซต์” เป็นเครื่องมือการตลาดออนไลน์ที่ยั่งยืน

และมีประสิทธิผลสูงมาก โดยตัวเราเป็นเจ้าของ 100% ซึ่งส่วนใหญ่เว็บไซต์มักจะถูกพูดถึงในทาง “ดีไซน์สวยงาม และการทำอันดับใน Google”

ความจริงแล้ว …

สิ่งที่นำเสนอในการออกแบบเว็บไซต์ที่มีประสิทธิภาพ เป็นงานที่ซับซ้อนกว่าคำว่า “การออกแบบเว็บไซต์”

web-design-strategy-wireframe

กระบวนการสร้างเว็บไซต์ที่ดี

เป็นกลยุทธ์ที่เริ่มต้นจาก “มุมมองของธุรกิจ” ท้าทายด้วยการเขียนคำโฆษณา การปรับแต่งรูปภาพ การจัดวางองค์ประกอบทางศิลป์ การศึกษาพฤติกรรมผู้ใช้งานเว็บไซต์ ทั้งหมดนี้ผ่าน การคิดเชิงออกแบบ (Design Thinking) อย่างลึกซึ้งในหลากหลายมิติ

เพื่อการสร้างสรรค์ทั้ง “ภาพลักษณ์และความรู้สึก”

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

web-design-strategy-human-centered-design

การทำเว็บไซต์แบบ “แค่ให้มี”

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

ส่วนตัวยุ้ยมองว่า
ภาพลักษณ์ของเว็บไซต์จะถูกเชื่อมโยงไปยังภาพลักษณ์ของธุรกิจเสมอค่ะ (Brand Image)

web-design-strategy-good-vs-badขอบคุณรูปภาพ blog.xola.com

หากคุณลองจินตนาการตาม หรือ คุณอาจจะเคยเห็นเว็บไซต์ประเภทนี้อยู่บ้างแล้ว เช่น

  • ข้อความในเว็บไซต์ อ่านแล้วงงๆ เหมือนไม่ได้ถูกเขียนมาเพื่อให้ “คน” อ่าน (เหมือนสแปมมากว่า)
  • ใช้รูปภาพคุณภาพต่ำ และผิดสัดส่วน เบี้ยวไป เบี้ยวมา
  • สีสันของเว็บ ฉูดฉาดแสบตา (ไม่ได้ทดสอบ Color Contrast ให้อยู่ในช่วงที่มนุษย์อ่านแล้วสบายตา)
  • ใช้จำนวนสีมากเกินไป ข้อความ 7 บรรทัด จัดไปเลย 7 สี อะไรแบบนี้
  • ตัวหนังสือจำนวนมาก และสิ่งอันที่อัดแน่น โดยไม่มีการจัดวางองค์ประกอบเว็บไซต์อย่างเหมาะสม
  • ไม่มีข้อความโฆษณา กระตุ้นให้คนอยากซื้อสินค้า หรือปุ่มติดต่อกลับ (Call-to-Action)
  • ไม่มีพระเอก เพื่อนพระเอก ตัวประกอบ (โดดเด่นเน้นทุกอย่าง ก็จะแย่งซีนกันเอง กลายเป็นไม่มีอะไรเด่น)
  • ภาพรวมเว็บไซต์ไม่สามารถทำให้มั่นใจได้ว่า “ธุรกิจหรือร้านค้านี้ เชื่อถือได้ ไว้ใจได้”

ในทางกลับกัน …

การทำเว็บไซต์แบบมีกลยุทธ์ ออกแบบอย่างดี

ไม่ใช่เพียงแค่ดึงดูดลูกค้าได้ แต่จะดึงดูดบริษัทคู่ค้า partner, supplier และคนทำงานเก่งๆ โดยเฉพาะคนรุ่นใหม่ก็อยากร่วมงานกับบริษัทที่มีภาพลักษณ์ดี ที่ช่วยส่งเสริมโอกาสให้กับพวกเค้าได้

เคยคุยเล่นๆ กับนักศึกษาที่ยุ้ยสอนวิชา Branding ค่ะว่า มีความคิดเห็นหรือรู้สึกยังไงระหว่าง

“เว็บไซต์ที่ดูตั้งใจทำ กับ เว็บไซต์ที่ดูแค่ให้มี”

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

เฉียบนะเนี่ย : )

และนี่คือสิ่งยุ้ยอยากแนะนำสำหรับเว็บไซต์ของคุณค่ะ

  • ให้ความสำคัญกับการออกแบบกลยุทธ์เว็บไซต์
    ทั้งด้านธุรกิจการตลาด เนื้อหา ดีไซน์ ด้านเทคนิค และการจัดการ
  • มีเป้าหมายชัดเจนว่าต้องการให้เว็บไซต์นี้ทำหน้าที่อะไร (Goals) และทำเพื่อใคร (Target Audience)
    เพราะเป้าหมายและกลุ่มผู้ใช้งานที่แตกต่างกัน การออกแบบเว็บไซต์ก็แตกต่างกันด้วยค่ะ
  • ทุกการดีไซน์มีเหตุผลรองรับเสมอ เราจะไม่ทำเพราะความสวยงามอย่างเดียว

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

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

web-design-strategy-bad-good-webmonsterlab

Tips

  • ปกติคนเราทำความเข้าใจกับรูปภาพได้ดีกว่าตัวอักษร
  • และเราก็ไม่ชอบอ่านข้อความยาวๆ พิมพ์ติดๆ กันทั้งหน้า
  • ข้อความจำนวนมาก ให้จัดกลุ่มข้อความ แล้วแบ่งย่อหน้า + ใส่หัวข้อของย่อหน้า
  • เพราะพฤติกรรมของ user จะอ่านแบบพรีวิว สแกนเร็วๆ ไม่ได้อ่านทุกตัวอักษร
  • เมื่อเค้าเจอจุดที่สนใจ จึงจะไปโฟกัสส่วนนั้น “หัวข้อ (heading)” จึงสำคัญ แบบว่า “ต้องถึงกับหยุดดู”
  • หรือใส่ bullet point ก็จะทำให้อ่านสบายตาขึ้นค่ะ
  • ตอนที่เราออกแบบ ให้เราคิดตามไปด้วยว่า …
    “จะทำยังไงนะ ให้ user สะดวกสบายที่สุดในการใช้งานเว็บไซต์ และรู้สึกดีกับแบรนด์ของเรา”

ทั้งหมดนี้อาจจะดูเหมือนเยอะสิ่ง มันเป็นรายละเอียดเล็กๆ น้อยๆ ที่เกิดขึ้นจากการเรียนรู้ การฝึกฝน ผ่านประสบการณ์ลงมือทำ พอเราทำจนชำนาญ อะไรพวกนี้เราจะคิดและออกแบบได้ auto เลยล่ะค่ะ

สำหรับมือใหม่ ไม่เป็นไร ค่อยๆ เรียนรู้ไปทีละเรื่อง นอกจาก UX/UI แล้ว … ถ้าให้พี่ยุ้ยแนะนำตอนนี้ อยากให้พวกเราลองศึกษาเกี่ยวกับ Design Thinking และ Service Design นะคะ สนุกค่ะ 2 ตัวนี้ที่จริงแทบจะเป็นเรื่องเดียวกัน หากเราเข้าใจ จะช่วยให้เราตั้งทรงได้เร็วขึ้นเยอะเลยล่ะ


บทความ : Webmonster Lab | Yui Kanchita
Featured Image: unsplash.com

  • FacebookFacebook
  • XTwitter
  • LINELine
พี่ยุ้ย กัญญ์ชิตา
พี่ยุ้ย กัญญ์ชิตา
ผู้ก่อตั้ง Webmonster Lab, นักออกแบบเว็บไซต์ uxui, วิทยากร อาจารย์, สนุกกับการใช้ WordPress Elementor Figma, รักในพลังแห่งความเรียบง่าย ... ขอบคุณทุกคนที่แวะมานะค้า : ) เรียนตัวต่อตัว

Related posts

การร่างแบบ ออกแบบเว็บไซต์ แอปพลิเคชัน – UI Design
August 13, 2024

การร่างแบบ ออกแบบเว็บไซต์ แอปพลิเคชัน – UI Design


Read more
วิดีโอ สอนวิธีใช้ Elementor ตัวฟรี ออกแบบเว็บไซต์ได้อิสระ
January 24, 2024

[วิดีโอ] วิธีใช้ Elementor ตัวฟรี ออกแบบเว็บไซต์ได้อิสระ


Read more
ทำไมธุรกิจจำเป็นต้องมี Website ในเมื่อใช้ Social ฟรีๆ ได้นี่นะ
January 14, 2020

ทำไมธุรกิจจำเป็นต้องมี Website ในเมื่อใช้ Social ฟรีๆ ได้นี่นะ


Read more
Webmonster Lab พี่ยุ้ย กัญญ์ชิตา
สอนสร้างเว็บไซต์ธุรกิจ ให้ดูโปร!
ช่วยคุณเริ่มต้น-จบงานได้เอง แม้ไม่มีพื้นฐาน

ความรู้ แนวคิด ฮาวทู จากประสบการณ์
การออกแบบเว็บไซต์ 20 ปี

เรียนสด : ตัวต่อตัว

คอร์สตัวต่อตัว WordPress for SME มือใหม่สร้างเว็บไซต์ธุรกิจดึงดูดลูกค้า - อ.ยุ้ย กัญญ์ชิตา วริทธิ์ทินานนท์ Webmonster Lab

เนื้อหาคอร์ส WordPress

เนื้อหาคอร์ส 5 ขั้นตอน การจัดทำเว็บไซต์ WordPress
Logo Webmonster Lab สอนทำเว็บไซต์ WordPress Elementor สำหรับมือใหม่ - อ.ยุ้ย กัญญ์ชิตา
ความรู้ แนวคิด ฮาวทู จากประสบการณ์
การออกแบบเว็บไซต์ 20 ปี
WordPress และ Elementor
ทำให้การสร้างเว็บไซต์เป็นเรื่องง่ายและสนุก
เพียงแค่มีความตั้งใจและเรียนรู้ตามขั้นตอน คุณทำได้ค่ะ 😀
กัญญ์ชิตา วริทธิ์ทินานนท์ (พี่ยุ้ย)
Founder, Designer, Instructor
  • Facebook
  • YouTube
  • LinkedIn

บทความล่าสุด

  • เบื้องหลังการทำคอร์สออนไลน์ (ครั้งแรก) อุปสรรคปัญหา และผลสำเร็จ - อ.ยุ้ย กัญญ์ชิตา Webmonster Lab
    เบื้องหลังการทำคอร์สออนไลน์ (ครั้งแรก) อุปสรรคปัญหา และผลสำเร็จ
    May 30, 2025
  • Low Profile, High Impact แรงบันดาลใจในการสร้างธุรกิจของพี่ยุ้ย
    Low Profile, High Impact – แรงบันดาลใจสร้างธุรกิจของนักออกแบบ
    January 29, 2025
  • วิธีการติดตั้ง WordPress บน Windows Localhost (XAMPP) สอนละเอียดมาก - ยุ้ย กัญญ์ชิตา Webmonster Lab
    วิธีการติดตั้ง WordPress บน Windows Localhost (XAMPP) สอนละเอียดมาก
    January 12, 2025

บทความแนะนำ

  • วิดีโอ สอนวิธีใช้ Elementor ตัวฟรี ออกแบบเว็บไซต์ได้อิสระ
    [วิดีโอ] วิธีใช้ Elementor ตัวฟรี ออกแบบเว็บไซต์ได้อิสระ
    January 24, 2024
  • การออกแบบเว็บไซต์ที่ดี ไม่ใช่แค่มี
    การออกแบบเว็บไซต์ “ที่ดี” ไม่ใช่ “แค่มี”
    July 1, 2023
  • ทำไมธุรกิจจำเป็นต้องมี Website ในเมื่อใช้ Social ฟรีๆ ได้นี่นะ
    ทำไมธุรกิจจำเป็นต้องมี Website ในเมื่อใช้ Social ฟรีๆ ได้นี่นะ
    January 14, 2020
พี่ยุ้ย กัญญ์ชิตา

093-649-5544

LINE ID : yuikanchita

Line QR code yuikanchita 0936495544 ไลน์คิวอาร์ ยุ้ย กัญญ์ชิตา

ห้องเรียนส่วนตัว at แอมพาร์ค จุฬา
รับสอนเดือนละ 4 คิว
โปรดจองล่วงหน้า 1-2 สัปดาห์ นะคะ

ข้อตกลงใช้งานเว็บไซต์ | นโยบายข้อมูลส่วนบุคคล
ตั้งค่าคุกกี้

© 2025 Webmonster Lab. All Rights Reserved.
Created with ❤︎ Kanchita Varitthinanon
สอบถามคอร์ส
การยอมรับคุกกี้
เว็บไซต์นี้ใช้ระบบคุกกี้เพื่อให้คุณได้รับประสบการณ์ที่เกี่ยวข้องกับคุณ คุณสามารถเลือกให้ความยินยอมทั้งหมดหรือเฉพาะบางส่วนได้โดยเข้าไปที่ "Cookie Settings"
ตั้งค่าคุกกี้ ปฏิเสธ ยอมรับทั้งหมด
Manage consent

Privacy Overview

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

Necessary cookies are absolutely essential for the website to function properly. These cookies ensure basic functionalities and security features of the website, anonymously.
CookieDurationDescription
cookielawinfo-checkbox-analytics11 monthsThis cookie is set by GDPR Cookie Consent plugin. The cookie is used to store the user consent for the cookies in the category "Analytics".
cookielawinfo-checkbox-functional11 monthsThe cookie is set by GDPR cookie consent to record the user consent for the cookies in the category "Functional".
cookielawinfo-checkbox-necessary11 monthsThis cookie is set by GDPR Cookie Consent plugin. The cookies is used to store the user consent for the cookies in the category "Necessary".
cookielawinfo-checkbox-others11 monthsThis cookie is set by GDPR Cookie Consent plugin. The cookie is used to store the user consent for the cookies in the category "Other.
cookielawinfo-checkbox-performance11 monthsThis cookie is set by GDPR Cookie Consent plugin. The cookie is used to store the user consent for the cookies in the category "Performance".
viewed_cookie_policy11 monthsThe cookie is set by the GDPR Cookie Consent plugin and is used to store whether or not user has consented to the use of cookies. It does not store any personal data.
คุกกี้ที่ใช้งานฟังก์ชัน
คุกกี้ที่ใช้งานได้ช่วยดำเนินการฟังก์ชันบางอย่าง เช่น การแบ่งปันเนื้อหาของเว็บไซต์บนแพลตฟอร์มโซเชียลมีเดีย รวบรวมคำติชม และคุณสมบัติอื่นๆ ของบุคคลที่สาม

Functional cookies help to perform certain functionalities like sharing the content of the website on social media platforms, collect feedbacks, and other third-party features.
คุกกี้เพื่อประสิทธิภาพ
คุกกี้เพื่อประสิทธิภาพ ใช้เพื่อทำความเข้าใจและวิเคราะห์ดัชนีประสิทธิภาพหลักของเว็บไซต์ซึ่งช่วยในการมอบประสบการณ์ผู้ใช้ที่ดีขึ้นสำหรับผู้เยี่ยมชม

Performance cookies are used to understand and analyze the key performance indexes of the website which helps in delivering a better user experience for the visitors.
คุกกี้เพื่อการวิเคราะห์
คุกกี้เพื่อการวิเคราะห์ ใช้เพื่อทำความเข้าใจว่าผู้เยี่ยมชมโต้ตอบกับเว็บไซต์อย่างไร คุกกี้เหล่านี้ช่วยให้ข้อมูลเกี่ยวกับตัวชี้วัดจำนวนผู้เข้าชม อัตราตีกลับ แหล่งที่มาของการเข้าชม ฯลฯ

Analytical cookies are used to understand how visitors interact with the website. These cookies help provide information on metrics the number of visitors, bounce rate, traffic source, etc.
คุกกี้เพื่อการโฆษณา
คุกกี้เพื่อการโฆษณา ใช้เพื่อจัดเตรียมโฆษณาและแคมเปญการตลาดที่เกี่ยวข้องให้แก่ผู้เยี่ยมชม คุกกี้เหล่านี้ติดตามผู้เยี่ยมชมเว็บไซต์และรวบรวมข้อมูลเพื่อจัดหาโฆษณาที่ปรับแต่งเอง

Advertisement cookies are used to provide visitors with relevant ads and marketing campaigns. These cookies track visitors across websites and collect information to provide customized ads.
คุกกี้ที่ไม่ได้จัดประเภทอื่นๆ
คุกกี้ที่ไม่ได้จัดประเภทอื่นๆ คือคุกกี้ที่กำลังวิเคราะห์และยังไม่ได้จัดประเภทเป็นหมวดหมู่

Other uncategorized cookies are those that are being analyzed and have not been classified into a category as yet.
SAVE & ACCEPT