A while ago, myself and @kellychoffman started working on the redesign of the Gutenberg landing page on WordPress.orgWordPress.org The community site where WordPress code is created and shared by the users. This is where you can download the source code for WordPress core, plugins and themes as well as the central location for community conversations and organization. https://wordpress.org/. The current page is slightly outdated, both its visuals and content.

Now that GutenbergGutenberg The Gutenberg project is the new Editor Interface for WordPress. The editor improves the process and experience of creating new content, making writing rich content much simpler. It uses ‘blocks’ to add richness rather than shortcodes, custom HTML etc. https://wordpress.org/gutenberg/ has been a part of WordPress for a few years, it makes sense to update it, shifting the message from what used to be the new post editor to the editor that can power all parts of your site.

I’ll share a proposal that myself and @pablohoneyhoney worked on, with some inputs and suggestions from @juanmaguitar and @annezazu.

Proposed updates

In these iterations, we grabbed many ideas from patterns in the Pattern Directory, ending up with an interesting collection of different blockBlock Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience. patterns. We kept copy and visual elements rather minimal, exploring three typographic alternatives: two sans-serif fonts, Inter and SF, and an elegant serif font, EB Garamond.

We also explored both light and dark modes.

---

It is intentional that the page looks more like a landing page rather than an open canvas “playground” page. While it can still be interactive, allowing people to click around and explore, it shows what is possible to achieve with the editor, remaining ultimately informative.

Structurally, there are a few proposed changes:

• Highlighting Blocks and Patterns separately
• Adding accessibilityAccessibility Accessibility (commonly shortened to a11y) refers to the design of products, devices, services, or environments for people with disabilities. The concept of accessible design ensures both “direct access” (i.e. unassisted) and “indirect access” meaning compatibility with a person’s assistive technology (for example, computer screen readers). (https://en.wikipedia.org/wiki/Accessibility) info and improvements  to the “Gutenberg loves everyone” section
• Adding a section for new users, linking to Learn WordPress and highlighting a few key courses
• Creating a section with some more helpful content and links to dig deeper about Gutenberg

You can see proposed links highlighted in pink in this prototype.

What’s next?

This is a proposal, which means there’s space for iterating! I’d like to open this up for feedback through November 5th, at which point I’ll return to work on refining the content and details. All feedback is welcome, either here or in the Trac ticket, where previous iterations have been shared.