Elementor 3.16 - ความเร็วที่เพิ่มขึ้น การออกแบบที่หลากหลาย และการเข้าถึงที่เพิ่มขึ้น

Rifat Oct 16, 2023

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

การปรับปรุงที่สำคัญอย่างหนึ่งในเวอร์ชันนี้คือความแตกต่างที่ชัดเจนระหว่าง Flexbox และวิดเจ็ต Grid Container ภายในแผงวิดเจ็ต ความแตกต่างนี้ส่งผลให้มีวิดเจ็ตแยกกันสำหรับคอนเทนเนอร์แต่ละประเภท ทำให้กระบวนการออกแบบคล่องตัวขึ้น และปรับปรุงประสบการณ์ผู้ใช้โดยรวม

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

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

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

ด้วย Elementor ตัวสร้างหน้าฟรีที่ดีที่สุด

เริ่มเลย

ปลดล็อกอิสระในการออกแบบสูงสุด: การเปิดใช้งานคอนเทนเนอร์ Flexbox สำหรับเว็บไซต์ใหม่

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

นอกจากนี้ Flexbox Containers ยังมาพร้อมกับการรองรับวิดเจ็ตที่ซ้อนกัน ทำให้สามารถวางวิดเจ็ตภายในพื้นที่เนื้อหาของ Carousel, Menu, Tabs และ Accordion Widgets พิจารณาความเป็นไปได้ในการใช้วิดเจ็ต Accordion เพื่อสร้างเลย์เอาต์ที่ซับซ้อน โดยมีแบบฟอร์มการติดต่ออยู่ในรายการหนึ่งและวิดเจ็ต Google Maps ในอีกรายการหนึ่ง

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

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

การควบคุมช่องว่างที่ได้รับการอัพเกรด

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

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

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

วิดเจ็ตคอนเทนเนอร์กริด

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

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

อัตราเร่งเร็วขึ้นด้วย TTFB

การอัปเดตล่าสุดสำหรับ Elementor ตัวสร้างเพจ WordPress ยอดนิยม สัญญาว่าจะปรับปรุงเวลาในการโหลดไซต์อย่างมาก เวอร์ชัน 3.16 เปิดตัวในวันพฤหัสบดีที่ 21 กันยายน 2023 ปรับปรุงเวลาเป็นไบต์แรก (TTFB) 5-20% สำหรับไซต์ที่ใช้ Elementor Core ฟรีและสูงสุด 40% สำหรับไซต์ที่ใช้ Elementor Pro ตามความซับซ้อนของหน้า . การอัปเดตนี้จะมอบประสบการณ์ที่รวดเร็วและราบรื่นยิ่งขึ้นแก่ผู้เยี่ยมชมไซต์ด้วยการนำเสนอเนื้อหาได้เร็วกว่าที่เคยเป็นมา

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

ปรับปรุงการเข้าถึง

Elementor ตัวสร้างเพจ WordPress ยอดนิยมรุ่นล่าสุดมีการปรับปรุงที่โดดเด่นหลายประการในการเข้าถึงเว็บไซต์และการไม่แบ่งแยก ตามประกาศเมื่อวันพฤหัสบดีที่ 21 กันยายน 2023 เวอร์ชัน 3.16 ช่วยให้ผู้เยี่ยมชมที่ใช้โปรแกรมอ่านหน้าจอและเทคโนโลยีช่วยเหลืออื่น ๆ เข้าถึงเนื้อหาของไซต์ได้ง่ายขึ้น

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

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

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

อัปเดตวิดเจ็ตเมนูและแท็บ

Elementor รุ่นล่าสุดมีการปรับปรุงโครงสร้างพื้นฐานที่ขับเคลื่อนวิดเจ็ตเมนูและแท็บ ตามประกาศในวันพฤหัสบดีที่ 21 กันยายน 2023 เวอร์ชัน 3.16 จะอัปเดตวิดเจ็ตเหล่านี้เพื่อสร้างโค้ดแบบรวมสำหรับรายการเมนูและชื่อแท็บในทุกขนาดหน้าจอ

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

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

การปรับปรุงวิดเจ็ตที่ใช้กันทั่วไปเหล่านี้แสดงให้เห็นถึงความมุ่งมั่นของ Elementor ในการรักษาวิดเจ็ตหลักให้ทันสมัยอยู่เสมอ แม้ว่าการเปลี่ยนแปลงอาจทำให้นักพัฒนาต้องตรวจสอบ CSS ที่กำหนดเองอีกครั้ง แต่ก็เป็นการวางรากฐานสำหรับพฤติกรรมการตอบสนองและการเข้าถึงที่ดีขึ้นในอนาคต สำหรับผู้ใช้ส่วนใหญ่ การอัปเดตควรจะราบรื่นและส่งผลให้ได้รับประสบการณ์ที่ดีขึ้นในขนาดหน้าจอ

ห่อ

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

Divi WordPress Theme