- 01Content & templatesVerified copy, shared components, local generation.
- 02Static outputHTML, CSS, and small browser enhancements.
- 03Static hostingHost-specific output for GitHub Pages or Vercel.
Demonstrations run in the browser. Enquiries open an email draft. No application server is required.
Match the architecture to the job
This website introduces a lab, explains product direction, publishes notes, and helps someone begin a conversation. Its content does not require an application server, visitor accounts, or a database.
The implementation uses generated HTML, a shared stylesheet, and browser enhancements. The default output can be served directly by GitHub Pages; a separate Vercel build creates a root-domain deployment artifact. This is a choice for this company website, not a prescription for the products the lab might build.
Make the baseline useful
Product descriptions, article text, team-status information, and navigation are rendered as HTML. Without JavaScript, the narrow-screen navigation remains a visible list and the product study can still be read.
JavaScript adds focus-area selection, local concept demonstrations, journal filtering, and email-draft preparation. Those interactions improve the experience without turning the site into a single-page application or changing its direct routes.
Respect the project base path
A GitHub project site lives under /ElpidaLabs/. A link that assumes the server root can work locally and fail after publication. Internal page links and asset references therefore stay relative to the current document.
The 404 document is a special case: a host can serve it at an arbitrary missing nested URL. Its base must match the deployment: /ElpidaLabs/ for GitHub Pages and / for the root-domain Vercel build. Canonical URLs, share images, and the sitemap use the selected deployment’s public address.
Keep interactions bounded
The Elpida study edits a sample project description in the current page. The Chaos Engine explainer draws deterministic synthetic data. Neither connects a wallet, submits a transaction, or contacts infrastructure.
The contact flow prepares an email draft for the visitor to review and send in their own app. It does not claim to have delivered a message. These boundaries make the behavior legible and keep the static architecture aligned with what the interface actually promises.
Let checks carry the decisions forward
The repository contains link, accessibility, interaction, responsive, and safe-area checks. A GitHub Actions workflow is prepared to run them when changes are pushed or reviewed. Its actual hosted run is only verifiable after the workflow is committed and pushed.
Browser-specific enhancements such as page transitions remain optional and respect reduced motion. The site should remain understandable when a browser omits an enhancement, a network is slow, or a visitor prefers a quieter interface.