针对最近关于 WordPress.org 的新主页和下载页面设计需要多长时间才能实施的争议,Gutenberg YouTuber Jamie Marsland 决定尝试使用块编辑器重新创建它。
Matt Mullenweg 对新设计进入开发阶段的计划发表了评论,称它应该“花费数小时而不是数周来实施”。他最具煽动性的评论引发了随后关于使用块编辑器的现实的对话,引用了 WordPress 的竞争对手。
“这是一个如此基本的布局,很难想象一个人在 Squarespace、Wix、Webflow 或其中一个 WP 页面构建器上花费超过一天的时间,”Mullenweg 说。
Marsland 决定使用古腾堡来迎接挑战。在这个练习中,他使用了 WordPress 最新的默认主题,二十二十二。他的结果与 WordPress 的新设计不同,但非常接近,他能够在大约 20 分钟内启动主页。
Can I re-create the new #wordpress home page in 20 mins? 😅 Here's my attempt on #youtube https://t.co/YeEDv914BF #gutenberg pic.twitter.com/Vy7SB0HYYv
— Jamie Pootlepress – Gutenberg YouTuber and Builder (@pootlepress) August 17, 2022
在视频中,Marsland 介绍了主页每个部分的创建过程。 他是块编辑器的高级用户。 他可以快速移动行、列和组,根据需要调整填充和边距,并为每个部分分配相应的设计颜色。 在这一点上,这不是大多数普通 WordPress 用户可以做的事情,这就是视频在观众中反应如此强烈的原因。 Marsland 的 YouTube 频道专注于帮助用户掌握使用 Gutenberg 构建页面和使用 WooCommerce 的商店。
“我的结论是,快速完成 95% 的设计非常容易,但在我的经验中,最后的 5% 总是花费最多的时间,”Marsland 说。 “我的猜测是,导致延误的更多是内部流程,但如果不参与,很难确定。我真的很想表明,构建设计不是古腾堡的问题(正如马特穆伦韦格提到的 Wix 和 Squarespace 以及其他 WP 页面构建器。)
由 Automattic 赞助的项目贡献者 Alex Shiels 引用了一些与块编辑器无关的项目,这些项目导致了延误,包括努力制定“a11y、响应能力、浏览器兼容性、搜索引擎优化和性能的合理标准”,以及与不同大陆的贡献者合作。
为了回应 Marsland 的尝试,WordPress 开发人员 Patrick Boehner 评论了小细节如何仍然非常重要。 “你绝对可以分辨出什么是设计驱动的,什么是编辑器中设计的,”Boehner 说。
在古腾堡在 WordPress 中首次亮相五年后,主题开发人员仍然面临着将设计变为现实的挑战,而这些设计并不是以块优先的方法创建的。
WordPress 开发人员 Jon Brown 说:“今天,要采用传统的模拟页面设计并使用块执行该设计,从根本上来说仍然是不可能的。” “这是个问题。
“当然,块可以‘在浏览器中设计一个页面’并接受你从块中得到的东西,但块仍然缺乏基于模型生成响应式、可访问、像素完美布局所需的灵活性和控制。 .
“过去需要一天、十几行 php 和十几行 css 的工作,现在需要数周的时间来构建自定义块,因为核心块不能通过钩子轻松调整,并且缺乏必要的基本控制。”
Gutenberg 的贡献者通过引入流畅的排版取得了长足的进步,并正在跟踪与提高设计工具一致性相关的许多问题。与此同时,随着块编辑器的成熟以适应那些希望让他们的设计立即响应的人,主题开发人员正在忍受必要的成长痛苦。
“我一直在从头开始构建一个完整的 FSE 主题,我很惊讶我能够使用编辑器、theme.json 和最小到无自定义 CSS 成功复制我的设计,”资深主题开发人员 Mike McAlister 说. “当然,这需要很多修补,但我仍然印象深刻。
“然而,正如 Jon 所提到的,第二次你需要为更小的屏幕(或者如果你敢在编辑器中尝试移动优先设计,则需要更大的屏幕)进行调整,你就碰壁了。边距、填充和块间隙尤其明显,它们还没有响应式控件。你可以在 .org 的新主题中看到通过 CSS 进行的调整。”
响应性是 Shiels 提到的问题之一,为什么实施设计比简单地在块编辑器中重新创建设计需要更多时间。
“然而,有迹象表明响应能力会有所改进,”麦卡利斯特评论道。 “流畅的排版和clamp() 确实有助于检查排版,但总会有需要更好控制的情况。每个其他网站建设者都解决了这个问题,没有理由认为 WordPress 不能或不会。 (我当然希望如此,因为如今约 50-60% 的流量来自移动设备!)
“克服这些成长痛苦的最佳方法之一是尽可能多地吃狗粮——使用编辑器和 FSE 构建尽可能多的现实生活场景,以发现这些盲点。”
Marsland 的简短练习表明,如果您熟悉块编辑器,您可以在短时间内重新创建 WordPress.org 的设计。他成功地证明了 Gutenberg 页面构建 UI 不是复制在其他应用程序中创建的设计的障碍。相反,开发人员通常必须在编辑器之外解决所有其他相关的清单项目——包括可访问性、响应性和 SEO 考虑因素。 Gutenberg 越能减少与响应性和可访问性相关的额外工作,对于尝试自行制作他们梦想的设计的普通用户来说,就越容易接近。