New: AI & Product Opportunity Sprint to clarify the next decision.Explore the Sprint

Block-theme architecture · 3 min read

Native WordPress blocks vs custom HTML: where to draw the maintainability boundary

Use native blocks for content and repeatable structure. Use a dynamic block when behaviour depends on application logic. Keep custom HTML only for a small, documented class of visual structures whose meaning core blocks cannot preserve.

Written by Ludovic ChennebergPublished Updated

TECHNOCONCEPTION ENGINEERING MODELEXPLANATORY ARTEFACT

Opportunity Sprint evidence path

A short investigation turns uncertainty into a recommendation, boundaries, and a next investment.

InputBusiness valueOutcome · economics · priority
InputWorkflow and peopleTriggers · friction · exceptions
InputData and riskAccess · control · feasibility
EvidenceRecommended decisionBuild · integrate · defer
OutputDelivery pathScope · architecture · stages
Original explanatory model — not product UI or client proof.

Why raw HTML is attractive to AI tools

A model can reproduce a static screenshot quickly by emitting one large HTML fragment with matching class names. The browser renders it, so the task appears complete. WordPress, however, sees an opaque Custom HTML block. Editors cannot understand the structure, reuse the content, or rely on block validation.

The cost appears later: minor copy edits require technical confidence, global style changes fight embedded structure, media replacement becomes fragile, and accessibility fixes must be repeated across fragments.

Use native blocks when the content has a standard meaning

A heading should be a Heading block. A list should be a List block. A photograph and caption should be an Image block. A FAQ should use Details. A group of repeatable cards can use Groups containing headings, paragraphs, links, and images. Native markup gives the editor a usable document tree and lets WordPress apply supported transformations.

Native does not require generic styling. Block classes, style variations, patterns, theme.json presets, and carefully scoped CSS can produce a distinctive system while preserving content semantics.

Use patterns for reusable editorial compositions

Patterns are appropriate when a team repeatedly assembles the same structure but should edit its content: a service introduction, case-study chapter, founder dossier, call-to-action band, or article conclusion. They encode a safe starting point without turning the content into a rigid application component.

Lock only what protects the design or accessibility. Excessive locking makes WordPress feel like a form with hidden rules; no locking invites silent design drift. The right level follows editorial responsibility.

Use dynamic blocks for behaviour and governed data

Navigation derived from the current language, a secure contact workflow, a consent-aware analytics endpoint, or a case module built from structured metadata belongs in application code. A server-rendered dynamic block can enforce validation, permissions, escaping, and consistent output while remaining visible in the editor.

Dynamic blocks are not an excuse to hide ordinary copy. Separate governed behaviour from editable content so each can evolve safely.

Allow custom markup only when it carries specialized semantics

A labelled product screenshot with status chrome, several contextual overlays, and a controlled evidence caption may not map cleanly to core blocks. A system diagram may use relationships that Groups and Columns cannot express. Those are defensible exceptions when the code is centralized and the content boundary is clear.

Document why each exception exists, how it is escaped, how reduced motion and accessibility work, and what would allow it to become native later. Count the boundaries in automated QA so a shortcut cannot multiply unnoticed.

Apply the editor test

Open the page in the Site Editor or block editor and ask a non-developer to change a heading, link, image, process step, FAQ answer, and article card. Observe whether the document tree makes sense and whether the preview resembles production.

The right architecture is not the one with zero custom code. It is the one where custom code protects real behaviour or meaning, while routine publishing stays understandable. See the complete conversion workflow in the AI HTML to block-theme guide.

All insightsRSS feed

Move from advice to implementation

Planning a technical website, platform, or modernization?

TechnoConception connects product judgment, architecture, implementation, security, and production ownership in one senior delivery relationship.

Related insights