--- title: adam bien's blog | daily.dev description: The BCE (Boundary-Control-Entity) pattern, typically explained in Java contexts, maps cleanly onto static websites built with only semantic HTML and CSS.... canonical: https://daily.dev/posts/adam-bien-s-blog-jojkeazdg twitter:card: summary_large_image twitter:site: @dailydotdev og:type: website og:site_name: daily.dev og:title: adam bien's blog | daily.dev og:description: The BCE (Boundary-Control-Entity) pattern, typically explained in Java contexts, maps cleanly onto static websites built with only semantic HTML and CSS.... og:url: https://daily.dev/posts/adam-bien-s-blog-jojkeazdg og:image: https://api.daily.dev/og/posts/jojkEAzDG.png og:image:alt: adam bien's blog og:image:width: 1200 og:image:height: 630 og:locale: en --- > ## Documentation Index > Fetch the complete documentation index at: https://daily.dev/llms.txt > Use this file to discover all available pages before exploring further. # adam bien's blog **[Adam Bien](https://daily.dev/sources/adam-bien)** · 2 min read · 0 upvotes · 0 comments ## Summary The BCE (Boundary-Control-Entity) pattern, typically explained in Java contexts, maps cleanly onto static websites built with only semantic HTML and CSS. Boundaries are HTML pages as entry points for users and crawlers, controls are CSS-only interactive behaviors (details/summary, :target modals, :checked tabs), and entities are CSS custom properties acting as design tokens. The directory structure mirrors business component organization, and each component ships its own checks.md for browser-verifiable expectations. ## Full article daily.dev links to this article rather than hosting it. Read it at the original source: ## Questions this post answers ### How can I structure a static HTML and CSS website using the boundary-control-entity pattern? Semantic HTML pages serve as the boundary layer, exposing page views to users, crawlers, and assistive technology through landmarks, heading hierarchy, and labeled forms. CSS-only interactivity, using details/summary, :target, :checked, and :hover/:focus-within selectors, forms the stateless control layer. CSS custom properties defined on :root act as the entity layer, holding design tokens like colors, spacing, and typography that pages reference instead of raw values. _Developers exploring architecture patterns beyond typical frameworks can follow BCE discussions like this on daily.dev._ ### How can I add interactivity to a website without using JavaScript? CSS-only techniques can implement common interactive patterns: the details/summary elements create accordions, the :target pseudo-class enables modals, :checked handles tabs and hamburger menus, and :hover combined with :focus-within powers dropdowns. State lives natively in HTML elements and transitions are pure CSS, resulting in a declarative interaction layer with no failure modes tied to script execution. _Anyone weighing JavaScript-free interactivity against script-based solutions can track patterns like this via daily.dev._ ## Similar posts on daily.dev - [What’s \!important \#15: Boundary-aware CSS, Time-based CSS, Full-bleed CSS, and More](https://daily.dev/posts/what-s-important-15-boundary-aware-css-time-based-css-full-bleed-css-and-more-rzev1shyv) · CSS-Tricks · 5 upvotes · 0 comments - [Web components know about the user, device, variables, layout and more · October 30, 2025](https://daily.dev/posts/web-components-know-about-the-user-device-variables-layout-and-more-october-30-2025-kzodn2mlu) · Adam Argyle · 4 upvotes · 0 comments - [From Java EE to Quarkus and LLMs: Adam Bien’s Playbook for Boring, Future‑Proof Systems](https://daily.dev/posts/from-java-ee-to-quarkus-and-llms-adam-bien-s-playbook-for-boring-future-proof-systems-0metu7xbn) · InfoQ · 16 upvotes · 0 comments - [No, Your Domains and Bounded Contexts Don’t Map 1 on 1](https://daily.dev/posts/no-your-domains-and-bounded-contexts-don-t-map-1-on-1-rh3kxenlx) · Mathias Verraes · 0 upvotes · 0 comments --- Tags: [#architecture](https://daily.dev/tags/architecture), [#css](https://daily.dev/tags/css), [#html](https://daily.dev/tags/html) [View this post on daily.dev](https://daily.dev/posts/adam-bien-s-blog-jojkeazdg) ```json {"@context":"https://schema.org","@graph":[{"@type":"Organization","@id":"https://daily.dev/#organization","name":"daily.dev","url":"https://daily.dev","logo":{"@type":"ImageObject","url":"https://daily.dev/apple-touch-icon.png","width":180,"height":180},"sameAs":["https://twitter.com/dailydotdev","https://github.com/dailydotdev","https://www.linkedin.com/company/daily-dev-ltd"]},{"@type":"WebSite","@id":"https://daily.dev/#website","url":"https://daily.dev","name":"daily.dev","publisher":{"@id":"https://daily.dev/#organization"},"potentialAction":{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https://daily.dev/search?q={search_term_string}"},"query-input":"required name=search_term_string"}}]} {"@context":"https://schema.org","@type":"TechArticle","headline":"adam bien's blog","url":"https://daily.dev/posts/adam-bien-s-blog-jojkeazdg","mainEntityOfPage":{"@type":"WebPage","@id":"https://daily.dev/posts/adam-bien-s-blog-jojkeazdg"},"datePublished":"2026-07-08T13:24:06.192Z","dateModified":"2026-09-14T06:59:35.015Z","description":"The BCE (Boundary-Control-Entity) pattern, typically explained in Java contexts, maps cleanly onto static websites built with only semantic HTML and CSS....","image":"https://media.daily.dev/image/upload/f_auto,q_auto/v1/posts/d365e8cabb5d95ba36aaa092c23f211d?_a=AQAEuop","thumbnailUrl":"https://media.daily.dev/image/upload/f_auto,q_auto/v1/posts/d365e8cabb5d95ba36aaa092c23f211d?_a=AQAEuop","isAccessibleForFree":true,"articleSection":"Adam Bien","inLanguage":"en","publisher":{"@type":"Organization","name":"daily.dev","url":"https://daily.dev","logo":{"@type":"ImageObject","url":"https://daily.dev/apple-touch-icon.png","width":180,"height":180}},"author":{"@type":"Organization","name":"Adam Bien","logo":"https://media.daily.dev/image/upload/s--CInnAL-q--/f_auto,q_auto/v1773644276/logos/adam-bien?_a=BAMAMiiu0","url":"https://daily.dev/sources/adam-bien"},"commentCount":0,"discussionUrl":"https://daily.dev/posts/adam-bien-s-blog-jojkeazdg","interactionStatistic":[{"@type":"InteractionCounter","interactionType":{"@type":"LikeAction"},"userInteractionCount":0},{"@type":"InteractionCounter","interactionType":{"@type":"CommentAction"},"userInteractionCount":0}],"keywords":"architecture,css,html","timeRequired":"PT2M"} {"@context":"https://schema.org","@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https://daily.dev"},{"@type":"ListItem","position":2,"name":"Adam Bien","item":"https://daily.dev/sources/adam-bien"},{"@type":"ListItem","position":3,"name":"adam bien's blog"}]} {"@context":"https://schema.org","@type":"FAQPage","@id":"https://daily.dev/posts/adam-bien-s-blog-jojkeazdg#faq","mainEntity":[{"@type":"Question","name":"How can I structure a static HTML and CSS website using the boundary-control-entity pattern?","acceptedAnswer":{"@type":"Answer","text":"Semantic HTML pages serve as the boundary layer, exposing page views to users, crawlers, and assistive technology through landmarks, heading hierarchy, and labeled forms. CSS-only interactivity, using details/summary, :target, :checked, and :hover/:focus-within selectors, forms the stateless control layer. CSS custom properties defined on :root act as the entity layer, holding design tokens like colors, spacing, and typography that pages reference instead of raw values. Developers exploring architecture patterns beyond typical frameworks can follow BCE discussions like this on daily.dev."}},{"@type":"Question","name":"How can I add interactivity to a website without using JavaScript?","acceptedAnswer":{"@type":"Answer","text":"CSS-only techniques can implement common interactive patterns: the details/summary elements create accordions, the :target pseudo-class enables modals, :checked handles tabs and hamburger menus, and :hover combined with :focus-within powers dropdowns. State lives natively in HTML elements and transitions are pure CSS, resulting in a declarative interaction layer with no failure modes tied to script execution. Anyone weighing JavaScript-free interactivity against script-based solutions can track patterns like this via daily.dev."}}]} ```