WordPress Explorations: Pages & Layers  ## Metadata - Author: [[Rich Tabor]] - Full Title: WordPress Explorations: Pages & Layers - Category: #articles - Document Note: --- tags: [WordPress, UX, Editor] author: Rich Tabor source: rich.blog reference: [https://rich.blog/pages-and-layers/] date created: 2025-11-11 00:00 --- # 🏷️ Title: WordPress Explorations: Pages & Layers ## 🧭 Table of Contents - [📝 Summary](#-summary) - [📖 Main Content](#-main-content) - [🗒️ Notes](#️-notes) - [📚 References](#-references) - [🗣️ Paraphrase](#️-paraphrase) - [📰 Newsletter](#-newsletter) - [✅ Action Items](#-action-items) - [🧪 Hypotheses](#-hypotheses) - [📊 Methodology](#-methodology) - [❓ Questions](#-questions) - [🔮 Future Research](#-future-research) - [💡 Implications](#-implications) - [🧠 Learning Styles Assessment](#-learning-styles-assessment) - [📊 Accessibility Assessment](#-accessibility-assessment) - [🌍 DEIB Assessment](#-deib-assessment) - [✅ Logical Validity](#-logical-validity) - [🛡️ DARVO Analysis](#-darvo-analysis) - [🎯 Conclusion](#-conclusion) ### 🔗 References - Include links cited in or relevant to the article. ## 📝 Summary - What happened: Proposes a persistent editor sidebar with Pages and Layers to navigate and create pages without leaving the editor. - Why it matters: Reduces mental load and context switching in WordPress editing. - Key stakeholders: Site builders, editors, plugin/theme authors, WordPress core UX. - Risks and tradeoffs: Added UI complexity, potential redundancy with existing List View and Pages table. - Bottom line: A unified, in-flow page management model inside the editor. ## 📖 Main Content - Core arguments: - Users expect the prominent “add” affordance to create pages, but it adds blocks/patterns, not pages. - Navigating between pages currently requires leaving the editor. - A persistent sidebar (“new List View”) with tabs: Pages (search, switch, add) and Layers (structure). - Context/definitions: - Layers ~ document structure (blocks hierarchy). - Pages ~ site-level navigation and creation. - Uncertainties: - How this integrates with existing List View and Site Editor navigation. - Performance on large sites. - Access control and bulk operations overlap. ### 🗒️ Notes - “They want to add a page while editing another and have no idea how to do it.” - “Most will see the big plus button… But… they get blocks, patterns, and media. No pages.” - “You can’t easily move between pages to make changes… The interface doesn’t make this fundamental action particularly obvious.” - “A persistent sidebar… with tabs for Pages and Layers.” - “No diving in-and-out of the editor. Just one experience.” - “I expect this to reduce the mental load… Pages become as available as content itself.” ## 📚 References - WordPress Site Editor overview (https://wordpress.org/documentation/article/site-editor/) - Gutenberg List View (https://developer.wordpress.org/block-editor/reference-guides/components/list-view/) ## 🗣️ Paraphrase - Paragraph A: Users try to add pages from the editor but only find block-level inserts; page navigation requires leaving the editing flow. - Paragraph B: A persistent sidebar with Pages and Layers keeps navigation and creation in-editor, preserving flow and reducing confusion. ## 📰 Newsletter - This week in WordPress UX: Rich Tabor explores a Pages & Layers sidebar to make page creation and switching instant—no more hopping in and out of the editor. If adopted, this could streamline editorial workflows and lower onboarding friction. Explore List View tips and Site Editor docs above, and consider how your themes/plugins might surface page-level actions in-context. ## ✅ Action Items #### DevRel - Ship a demo plugin of “Pages & Layers” for user testing. - Record a 5-min walkthrough; gather feedback via GitHub Discussions. - Add examples to docs on editor-embedded navigation patterns. #### OSPO - Draft UX proposal process and decision log template. - Review licensing and contribution guidelines for prototype assets. #### Community - Run usability testing sessions with new WordPress users. - Create “first-issue” tasks around sidebar IA and search. #### WordPress - Core: Open exploration issue for persistent sidebar tabs. - Design: Map IA for Pages vs Layers; define empty states. - Documentation: Update editor navigation guides with alternatives. - Accessibility: Specify keyboard flows and landmarks for the sidebar. - Performance: Test on 1k+ pages; set interaction budgets. #### The WPCC - Fund user research sprints and prototype maintenance. - Publish impact report on editor discoverability improvements. ### FAIR - Publish provenance for prototypes; define sunset clause if not merged. ## 🧪 Hypotheses - A persistent Pages tab reduces time-to-switch-page by ≥40%. - New users will correctly create a page from the editor ≥80% of the time. - Editor abandonment due to navigation confusion drops by ≥30%. - Large-site performance remains within 100ms P95 for sidebar interactions. ### 📊 Methodology - A/B test current editor vs. prototype; measure task time and success. - SUS and NASA-TLX surveys post-task. - Telemetry on page-switch and create-page events. - Load tests with 10, 100, 1k, 10k pages. ### ❓ Questions - Where should bulk actions live vs. in-editor actions? - How do roles/capabilities affect Pages tab visibility? - What’s the minimal IA to avoid redundancy with List View? ### 🔮 Future Research - Unifying posts, pages, and templates in the same sidebar. - Offline-first flows and undo/redo across page switches. - Mobile editor ergonomics for Pages & Layers. ### 💡 Implications - Practice: Faster editorial workflows; fewer context switches. - Policy: Clear capability gates for page ops inside editor. - Security: Guardrails for destructive actions in the sidebar. - Funding: Prioritize research on editor discoverability. ### 🧠 Learning Styles Assessment - Reading level: ~10th grade (Flesch-Kincaid ~10–11). #### 👀 Visual learners - Present: Conceptual UI described. - Improve: Mockups of Pages/Layers; flow diagrams. #### 🔊 Aural learners - Improve: Short audio/podcast summary. #### 🗣️ Verbal learners - Present: Clear comparisons and definitions. - Improve: Glossary (Pages vs Layers vs List View). #### 🧩 Kinesthetic learners - Improve: Clickable prototype; step-by-step tasks. #### 🧠 Logical learners - Present: Problem→Solution structure. - Improve: Decision trees for navigation paths. #### 🧑‍🤝‍🧑 Social learners - Present: Invite comments/X discussion. - Improve: Guided group tests, moderated Q&A. #### 🧘‍♀️ Solitary learners - Improve: Self-check checklist for common tasks. #### 🌿 Naturalistic learners - N/A; improve with ecosystem analogies (site as habitat layers). ### 📊 Accessibility Assessment #### Screen reader semantics - Improve: Landmark for sidebar; headings for tabs; aria-controls. #### Keyboard navigation - Present: Intent; Improve: Full tab/arrow model, roving tabindex. #### Contrast and readability - Improve: Ensure ≥4.5:1; focus state visibility. #### Text resizing and reflow - Improve: Test 200% zoom; prefers-reduced-motion. #### Media and captions - Improve: Add captions if demo videos are published. #### Forms and interactions - Improve: Labels, inline validation, 44px targets. #### Standards reference - Map to WCAG 2.2 AA: 1.4.*, 2.1.*, 2.4.*, 4.1.* ### 🌍 DEIB Assessment - Cultural breadth: Improve with multilingual examples. - Inclusive language: Good; reduce jargon with tooltips. - Neurodiversity: Improve chunking, consistent patterns, icon+text. - Representation: Use inclusive imagery in demos. - Psychological safety: Add contribution guidelines and CoC links. ### ✅ Logical Validity #### Strong reasoning - Inductive: Observed user confusion → propose in-flow navigation; plausible, experience-based. #### Fallacies - Potential hasty generalization: small observations → broad solution. Mitigate with user studies. #### Tone of voice - Exploratory, pragmatic, inviting feedback. ### 🛡️ DARVO Analysis - No denial/attack/reversal present; tone is collaborative and non-defensive. ## 🎯 Conclusion - Bottom line: A persistent Pages & Layers sidebar could cut cognitive load and keep users in flow by enabling page creation and navigation inside the editor. - Next steps: Prototype, test with new users and large sites, iterate IA and accessibility, the - Summary: This is part of my WordPress Explorations series where I'm exploring new, far out, ideas about WordPress. See the full series→ Pages… - URL: https://rich.blog/pages-and-layers/ This is part of my WordPress Explorations series where I’m exploring new, far out, ideas about WordPress. #### Pages & Layers Almost every time I watch someone unfamiliar with WordPress using it, I see the same thing: they want to add a page while editing another and have no idea how to do it. Most will see the big plus button at the top. Makes sense—it’s prominent, it signals “add something.” But when they select it, they get blocks, patterns, and media. No pages. So where are pages? To view your other pages, you have two options, depending on where you are in WordPress. From a single page editor view, you need to leave the editor entirely and go back to WordPress Admin. Or if you’re editing from the site editor, you close the editing canvas and navigate to the Pages view, then re-enter the editor from one of those, like this: Some content could not be imported from the original document. [View content ↗](https://videopress.com/embed/J4ClDQHk?cover=1&autoPlay=0&controls=1&loop=0&muted=0&persistVolume=1&playsinline=0&preloadContent=metadata&useAverageColor=1&hd=0) You can’t easily move between pages to make changes, and you can’t clearly add new ones. The interface doesn’t make this fundamental action particularly obvious. #### The Exploration Some content could not be imported from the original document. [View content ↗](https://videopress.com/embed/2WFk31BG?cover=1&autoPlay=0&controls=1&loop=0&muted=0&persistVolume=1&playsinline=0&preloadContent=metadata&useAverageColor=1&hd=0) By having sidebars that are constantly in-and-out of view, WordPress creates a frame-of-reference problem. When you lose track of where you are, it’s surprisingly hard to get back. This exploration centers on a persistent sidebar in the editor—a new kind of “List View”—with tabs for Pages and Layers. You can search and navigate between pages to start editing right off, or add new ones. No diving in-and-out of the editor. Just one experience.  I imagine there would still be a table view of all pages higher up in the WordPress navigational hierarchy—useful for bulk actions, filtering, or managing pages at scale. But for the day-to-day work of editing and moving between pages, this keeps you in flow. #### Why This Matters I expect this to reduce the mental load of using WordPress. Pages become as available as content itself. You never lose your place, and you can add new pages right off. Thoughts? Leave a comment or [join the conversation on X](https://rich.blog/pages-and-layers/link-to-post). You may have noticed there are other ideas baked into this that I’m still exploring—I’ll share more as I work through them. Again, consider this “thinking out loud”, not a formal proposal. Check out the [WordPress Explorations series](https://rich.blog/wordpress-explorations/) to see what else I’m thinking about., WordPress Explorations: Pages & Layers, Rich Tabor, 01k9r3w4bfhe8jyj66meccpgqk.