Jamie Marsland สร้างโฮมเพจ WordPress.org ขึ้นมาใหม่ใน 20 นาทีโดยใช้ Block Editor

เพื่อตอบสนองต่อข้อโต้แย้งล่าสุดเกี่ยวกับระยะเวลาที่หน้าแรกใหม่ของ WordPress.org และการออกแบบหน้าดาวน์โหลดควรนำไปใช้ Gutenberg YouTuber Jamie Marsland ตัดสินใจที่จะลองใช้มือของเขาในการสร้างมันขึ้นมาใหม่ด้วยตัวแก้ไขบล็อก

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

“มันเป็นเลย์เอาต์พื้นฐาน มันยากที่จะจินตนาการว่าต้องใช้คนคนเดียวมากกว่าหนึ่งวันใน Squarespace, Wix, Webflow หรือหนึ่งในผู้สร้างเพจ WP” Mullenweg กล่าว

Marsland ตัดสินใจรับความท้าทายโดยใช้ Gutenberg สำหรับแบบฝึกหัดนี้ เขาใช้ธีมเริ่มต้นล่าสุดของ WordPress คือ Twenty Twenty-Two ผลลัพธ์ของเขาไม่เหมือนกับการออกแบบใหม่ของ WordPress แต่ใกล้เคียงกันมาก และเขาสามารถสร้างหน้าแรกขึ้นมาได้ในเวลาประมาณ 20 นาที

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

“ข้อสรุปของฉันคือมันค่อนข้างง่ายที่จะทำให้เสร็จ 95% ของการออกแบบอย่างรวดเร็ว แต่ 5% สุดท้ายที่ใช้เวลามากที่สุดในประสบการณ์ของฉันเสมอ” Marsland กล่าว “ฉันเดาว่ามันเกี่ยวกับกระบวนการภายในที่ทำให้เกิดความล่าช้ามากกว่า แต่หากไม่ได้เกี่ยวข้องก็ยากที่จะพูดได้อย่างแน่นอน ฉันต้องการแสดงให้เห็นว่าไม่ใช่ปัญหาของ Gutenberg ในการสร้างการออกแบบ (ตามที่ Matt Mullenweg กล่าวถึง Wix และ Squarespace และผู้สร้างเพจ WP อื่นๆ)”

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

ในการตอบสนองต่อความพยายามของ Marsland นักพัฒนา WordPress Patrick Boehner ได้ให้ความเห็นเกี่ยวกับรายละเอียดเล็กๆ น้อยๆ ที่ยังคงมีความสำคัญอย่างยิ่ง “คุณสามารถบอกได้อย่างชัดเจนว่าสิ่งใดที่ขับเคลื่อนโดยการออกแบบก่อน เทียบกับการออกแบบในตัวแก้ไข” Boehner กล่าว

ห้าปีหลังจากการเปิดตัวของ Gutenberg ใน WordPress ผู้พัฒนาธีมยังคงถูกท้าทายในการทำให้งานออกแบบที่ไม่ได้สร้างขึ้นมาโดยคำนึงถึงแนวทางแรกในบล็อก

Jon Brown ผู้พัฒนา WordPress กล่าวว่า “ทุกวันนี้ยังคงเป็นเรื่องยากจนเป็นไปไม่ได้เลยที่จะจำลองการออกแบบเพจแบบเดิมๆ และดำเนินการออกแบบนั้นโดยใช้บล็อก "นี่คือปัญหา.

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

“สิ่งที่เคยใช้เวลาหนึ่งวันกับ php หลายสิบบรรทัดและ css หลายสิบบรรทัด ตอนนี้ใช้เวลาหลายสัปดาห์ในการสร้างบล็อกที่กำหนดเอง เนื่องจากบล็อกหลักไม่สามารถปรับแต่งได้อย่างง่ายดายผ่าน hook และขาดการควบคุมพื้นฐานที่จำเป็น”

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

“ฉันสร้างธีม FSE เต็มรูปแบบตั้งแต่เริ่มต้น และรู้สึกประหลาดใจที่การออกแบบของฉันสามารถทำได้สำเร็จด้วยตัวแก้ไข, theme.json และ CSS แบบกำหนดเองขั้นต่ำ” Mike McAlister ผู้พัฒนาธีมรุ่นเก๋ากล่าว . “แน่นอนว่าต้องใช้ความพยายามอย่างมาก แต่ฉันก็ประทับใจ

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

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

McAlister กล่าวว่า "อย่างไรก็ตาม มีคำแนะนำของการปรับปรุงที่กำลังจะเกิดขึ้นสำหรับการตอบสนอง “การพิมพ์แบบไหลและที่หนีบ () ช่วยให้ตรวจสอบการพิมพ์ได้อย่างแน่นอน แต่จะมีสถานการณ์ที่คุณต้องการการควบคุมที่ละเอียดยิ่งขึ้นอยู่เสมอ ผู้สร้างเว็บไซต์รายอื่นๆ ได้แก้ปัญหานี้แล้ว ไม่มีเหตุผลใดที่จะคิดว่า WordPress ทำไม่ได้หรือทำไม่ได้ (ฉันหวังอย่างนั้นอย่างแน่นอน เนื่องจากประมาณ 50-60% ของทราฟฟิกมาจากอุปกรณ์พกพาในทุกวันนี้!)

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

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