About Alder
Alder is a five-page website template for a small consultancy, advisory practice, or professional service business. The layout combines a large opening statement, local architectural photography, numbered service sections, an explanation of the working process, and a clear contact route. It is available in two editions built from the same source: ready-to-edit HTML and a standalone Astro project.
Best suited to: Consultants, independent advisers, and small service businesses that need a brochure website rather than a store, directory, or application.
Desktop and mobile screenshots
Captured from version 1.0.0 on 29 October 2026. Open a screenshot to inspect the full page.
Choose your download
Both ZIPs contain the same five-page design. Neither requires an account, subscription, or license key.
| Edition | Included files and requirements |
|---|---|
| Plain HTML ZIP 1.48 MiB |
Five HTML files, CSS, vanilla JavaScript, responsive images, local fonts, a manifest, and license/setup notes. Requires: No Node.js or build tools. Edit the files and upload the complete folder to a static host. |
| Standalone Astro source ZIP 1.53 MiB |
Editable Astro pages, shared layouts, site configuration, CSS tokens, a vendored template kit, package-lock.json, assets, and documentation. Requires: Node.js 22.23.4 or newer and npm 9.6.5 or newer. No workspace packages or cloud account needed. |
What’s in the design
- Five responsive pages with shared navigation and footer.
- Home: a business introduction, three service links, working-process steps, and contact calls to action.
- About: a business introduction, principles, and a clearly identified fictional demo identity.
- Services: three anchored service sections with use cases, process explanations, deliverables, and native expandable FAQs.
- Contact: labeled fields, browser validation, service preselection, and an explicit email-draft workflow.
- All fonts, photos, styles, and scripts are local. No analytics or remote font service is required.
Verified page layouts
These five pages are included in both archives. Each link opens the live preview.
- Home
index.html - About
about.html - Services
services.html - Contact
contact.html - 404 / page not found
404.html
How the contact form works
The form validates required fields and prepares a visible email-draft link. It does not send or store messages. Visitors choose to open the draft in their email app, review it, and send it themselves. Without JavaScript, a direct email link remains available.
The default address, [email protected], is reserved example data and cannot receive mail. Replace it before launch. For direct form submissions, connect and test a delivery service, add server-side validation and spam protection, and update the privacy explanation. No Sendy connection is included in the template.
Set up the Astro edition
Extract the source ZIP and run these commands from its folder:
npm ci
npm run dev
npm run check
npm run buildThe build produces a dist/ folder for static hosting. The source includes its shared template kit under vendor/template-kit, so it builds independently of our development workspace. Astro 7.4.4 and the Astro checker 0.9.12 are pinned; TypeScript 6.0.3 is the latest supported by that checker’s declared peer range.
Before you launch
- Replace the fictional Alder identity, service descriptions, email address, and business claims with your own accurate information.
- Choose the HTML edition for direct file editing, or the Astro edition to update shared layouts and metadata from one source.
- Set PUBLIC_SITE_URL to your final published URL, including the folder and trailing slash, when building the Astro edition. This generates canonical/social URLs, robots.txt, and sitemap.xml.
- Replace the reserved [email protected] recipient in src/site.ts (Astro) or the form data-recipient and mailto links (HTML). It is not a working mailbox.
- Configure your host to serve 404.html with an HTTP 404 status for unknown paths. The file itself does not configure your web server.
This is a static brochure site. It includes no CMS, dashboard, shopping cart, hosting account, newsletter connection, or contact-delivery backend. The form prepares a mailto draft and requires a configured email app. A direct form service must be connected separately if you want messages delivered without an email app.
License and assets
The original template code is released under the included MIT license. It permits personal and commercial use; retain the license notice when redistributing the code. Visible footer attribution is optional.
Photography is by Simone Hutsch, FlippingBook, and Andrii Solok under the Unsplash License. Instrument Sans and Instrument Serif use the SIL Open Font License. Both archives include ASSETS.md with photo sources and local font license notices. The code license does not replace those asset licenses.
Release verification
Both archives were inspected, and the public downloads matched their SHA-256 checksums. The standalone source passed a clean npm ci, Astro type-check, and production build outside our workspace. Local Lighthouse tests scored 99–100 for performance and 100 for automated accessibility on the tested pages and devices. These laboratory results are not a guarantee of performance or complete accessibility after customization.
Version 1.0.0, reviewed 29 October 2026. Live preview. Plain HTML checksum. Standalone Astro source checksum. Alder is a fictional business used to demonstrate the template.
