Transform
Ideas Into Gems

let JindaTheme build platforms for your business

“Above the fold” – ทำไมเราควรเอาสิ่งที่สำคัญไว้ที่ด้านบนของเว็บ?

In: Web development Published: 17/07/2020

ในเชิงเทคนิคแล้ว คนทำเว็บไซต์จะมีศัพท์คำนึงที่เรียกกันว่า “Above the fold” ครับ สำหรับคนที่ไม่เคยได้ยินมาก่อนก็อาจจะสงสัยว่า มันมีความสำคัญอย่างไร แล้วทำไมในฐานะที่เรากำลังจะเป็น (หรือเป็น) เจ้าของเว็บไซต์นั้นจะต้องให้ความสำคัญด้วย เดี๋ยววันนี้เราจะมาคุยกันครับ

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

หรือบางครั้งก็พบว่าผู้ใช้งาน “ไม่รู้” ว่าหน้าเว็บไซต์นั้นสามารถ scroll ลงมาที่ด้านล่างได้ (เหมือนรู้สึกว่าเนื้อหาด้านบนมันจบอยู่แค่นี้) จึงมีคำพูดเชิงเทคนิคเกิดขึ้นมาว่า หากผู้ใช้งานไม่ค่อย scroll ลงมาที่เนื้อหาด้านล่างของเว็บไซต์ เราก็ควรยัดเนื้อหา หรือส่วนที่สำคัญที่สุด หรือส่วนที่บอกได้ว่าเว็บไซต์เรานั้นคืออะไร เกี่ยวกับอะไร หรือขายผลิตภัณฑ์อะไรที่ด้านบนของเว็บไซต์นั่นเองครับ

above-the-fold
พยายามเน้นเนื้อหาสำคัญ หรือ tagline หลักๆเกี่ยวกับผลิตภัณฑ์และบริการของเราที่ด้านบน

ใครที่สนใจอยากหาข้อมูลต่อเกี่ยวกับการเก็บข้อมูล, research ต่างๆ ประกอบว่าทำไมผู้ใช้ไม่ค่อย scroll ลงมาด้านล่าง แนะนำอ่านได้ที่บทวามนี้ครับ Myth #3: People don’t scroll

โอเค เมื่อเรารู้แล้วว่าผู้ใช้งานบางส่วนจะไม่ scroll ลงมาอ่านเนื้อหาที่อยู่ด้านล่าง เพราะฉะนั้นเราก็ควรจะหาทางแก้ไขเผื่อเอาไว้ด้วย ประเด็นแรกคือนำเนื้อหาที่สำคัญไว้ด้านบนของเว็บไซต์ เพื่อให้ผู้ใช้งานที่เข้ามาใหม่ เห็นเนื้อหาเหล่านั้นก่อน ซึ่งส่วนเนื้อหาที่อยู่ด้านบนหรือปรากฏที่จอของผู้ใช้งานโดยที่ยังไม่ต้อง scroll นี้แหละ ที่เราเรียกว่า above the fold และส่วนที่ต้อง scroll ลงไปจะเรียกว่า below the fold ตามลำดับครับ

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

scroll-down-above-the-fold
ปุ่ม scroll down เพื่อช่วยบอกผู้ใช้เป็นนัยๆว่า ยังมีเนื้อหาข้อมูลต่อข้างล่างนะ

นอกจากนั้นการเล่าเรื่อง (หรือ Storytelling) ก็เป็นประเด็นหลักที่ช่วยให้ผู้ใช้ keep scrolling ลงมาได้เรื่อยๆ เช่นเดียวกัน เราอาจจะแบ่งส่วนของเนื้อหาให้เป็นบทสั้นๆ 2-3 ย่อหน้า มีการใส่รูปให้น่าสนใจ ก็จะช่วยให้ผู้ใช้อยู่ที่หน้าเว็บไซต์ของเรานานขึ้น และมีโอกาสเลื่อนลงมาถึงสุดหน้าของเว็บไซต์ได้เหมือนกัน

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

วิธีหลังนี่เราสามารถทำ User Journey ก็จะช่วยได้เยอะเลยล่ะครับ

This might interest you

image

เว็บไซต์จำเป็นไหม? มี Facebook page อย่างเดียวได้หรือเปล่า

ผมเชื่อว่าผู้ประกอบการหลายคนมักจะเกิดคำถามว่า "เราควรจะต้องมีเว็บไซต์ไหม หรือแค่ Facebook page อย... Read more >
image

อยากมีระบบชำระเงินบนเว็บไซต์, แอปฯ ต้องคำนึงถึงอะไรบ้าง?

ช่วงหลังโควิดนี้เป็นช่วงที่อุตสาหกรรมไอทีกลับมาบูมอีกครั้ง หลายธุรกิจมีการเปลี่ยนแปลงทั้งโครงสร้า... Read more >
image

ข้อเสียบางอย่างเมื่อซื้อธีม WordPress มาใช้

WordPress ถือเป็น CMS ที่ได้รับความนิยมในการทำเว็บไซต์อย่างต่อเนื่อง ด้วยการตั้งค่าที่รวดเร็ว มีร... Read more >

Please fill up this form

Our team will estimate the price from your details and send a quotation to your email.

Notifications

Thank you, we have received your message.

preloader

Preparing, please wait a moment.