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

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

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

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

เราควรจะใช้พวกเขาจริงๆหรือไม่?

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

ใช้ carousels หรือไม่

ข้อเสีย

ต่อไปนี้เป็นอาร์กิวเมนต์ที่พบบ่อยที่สุดเกี่ยวกับ caroussels:

  • โหลดช้า: การเพิ่มแถบเลื่อนและภาพหมุนทำให้เวลาในการโหลดเว็บไซต์ช้าลงซึ่งสามารถปิดผู้เข้าชมได้
  • ไม่ดีสำหรับ SEO : เนื่องจากเนื้อหาจำนวนมากถูกอัดแน่นอยู่ในแถบเลื่อนเดียวจึงเป็นเรื่องยากที่จะเพิ่มประสิทธิภาพหน้าเว็บและ SEO สำหรับเนื้อหาทั้งหมดนั้น
  • สิ่งที่ทำให้ไขว้เขวไม่จำเป็น: การหมุนเคอร์เซอร์ช่วยให้ผู้เข้าชมฟุ้งซ่านจากเนื้อหารอบ ๆ ตัว
  • ใช้งานยาก: หลายสไลด์ทำให้ผู้เข้าชมมีทางเลือกมากเกินไปในการติดตามและมักจะต้องใช้ความพยายามมากเกินไปทำให้เข้าถึงข้อมูลที่ต้องการได้ยาก
  • UX ขัดจังหวะ: สำหรับผู้เยี่ยมชมที่ต้องการเลื่อนเนื้อหาในแนวตั้งอย่างรวดเร็วแถบเลื่อนสามารถมีอิทธิพลต่อความอดทนเนื่องจากต้องนั่งรอ สไลด์ "ลิขิต
  • อัตราการคลิกผ่านที่ไม่ดี: จากการศึกษาบางชิ้นแถบเลื่อนไม่ได้ผลในการโต้ตอบที่ต้องการ (คลิก) ในขณะที่ผู้เยี่ยมชมอาจสนใจที่จะอ่านหนึ่งหรืออาจจะถึงสองสามสไลด์ แต่ส่วนใหญ่ไม่ดำเนินการใด ๆ
  • น่าเกลียด : นักออกแบบหลายคนคิดว่า " เลื่อน » และภาพหมุนก็ดูน่าเกลียด โดยเฉพาะเมื่อคุ้นเคย ส่งเสริม ภาพและข้อความโฆษณาเชิงคาดการณ์ล่วงหน้า

ผลประโยชน์

ตอนนี้เรามาดูข้อโต้แย้งของผู้สนับสนุนแถบเลื่อน:

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

วิธีการ 6 ที่จะช่วยคุณเพิ่มตัวเลื่อน / สไลด์ในบล็อกของคุณ

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

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

# 1: เพิ่มประสิทธิภาพตำแหน่งของคุณ

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

แถบเลื่อน WPmudev

# 2: คิดถึงขนาด

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

# 3: ใช้เนื้อหาที่สำคัญในแถบเลื่อนของคุณ

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

ตัวอย่าง Slider WPMUDEV

# 4: เลือกภาพความละเอียดสูง

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

# 5: เก็บข้อความให้น้อยที่สุด

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

# 6: ให้ความสนใจกับการเลื่อน

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

ตัวอย่างเช่น wpmudev slider

แล้วเราควรทำอย่างไร?

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

ที่บ้านใช้ทำอะไร? คุณมีความชอบหรือไม่? อย่าลังเลที่จะแบ่งปันกับเรา