Workflow Plan

Launcher, prototype, UI Kit and this plan, all reachable from one page. Preview served locally; public preview link to follow once the repository exists.

Done — see AUDIT.md. Found: broken Google Maps on the homepage, tour dates from 2025 still listed as upcoming, no hreflang between the language domains, German pages declaring themselves English, missing sitemap on the English domain, an outdated WordPress core, and a page builder plus six third-party plugins.

Scope, tone, technical approach, quality standards, milestones and open questions — BRIEF.md. Needs client sign-off before Stage 02 starts.

Received and wired into the dashboard's Resources strip: hiking-website-design. This is the main design file — all visual work happens there.

The wireframe reached us as a folder, not a repo link. Also worth asking about: the wireframe's comments reference a German twin file that is not in the materials — either it did not travel with the export, or it has not been built yet.

Private repository at chife-mod/hiking-adventure-preview, deployed to hiking-adventure-preview.pages.dev. Source stays private; the preview is reachable by link and carries noindex on every page.

Which provider, which plan, what the server actually supports. We need to know whether it allows a proper deployment workflow or whether the site should move.

Registrar logins for both domains. Needed at launch for the DNS cutover, and earlier if we set up a staging subdomain.

Needed to export existing content, media and URL structure for migration.

Baseline traffic and ranking data before the rebuild, so the effect of the launch is measurable rather than guessed at. If neither exists yet, set them up.

Autumn homepage, English, with the seasonal palette system — one layout, four colour worlds driven by six variables each.

The English file's comments refer to a shared German counterpart. Track it down or schedule it — the German side is the primary market and cannot be an afterthought.

The homepage is one of several templates. Still to wireframe:

• Tour / package detail page — this is where the "How it works" steps and the guide portrait moved to
• Tour listing with filters by difficulty, region and season
• Custom tours page
• About
• Contact / enquiry
• Impressions gallery
• Know-how articles
• Legal pages — imprint, privacy, terms
• 404 and search results

Our recommendation: consolidate to one domain with /de/ and /en/ — written up on the Stack Analysis page and in the audit.

• Both names are the same brand translated — Wander-Erlebnis is German for "hiking experience", Hiking-Adventure its English twin. Not a personal name.
• Two domains split search authority in half and double every maintenance task, permanently.
• As built today the split actively harms: no hreflang, no x-default, German pages declaring lang="en-US".
• Reasoning points to keeping the German domain — tours run around Zurich, in German-speaking Switzerland — but confirm with Search Console data before committing. If English carries the authority, the answer flips.

Must be settled before design: it shapes navigation, URLs and the redirect map.

Every existing URL in both languages, with a decision each: carries over, gets rewritten, or disappears. This doubles as the source for the redirect map at launch.

Which fields a tour actually has, agreed once and then built once: title, dates, difficulty (T1–T4), region, duration, distance, ascent, group size, price, description, gallery, meeting point, what to bring. Everything the site displays should come from a field, never from hand-formatted text.

Explicit approval of the prototype before visual design starts. Structural changes are cheap here and expensive two stages later.

The existing logo is liked and its typeface stays — we can build on it. The one change requested: remove the underline beneath the letter "E". Deliver a clean vector set (full mark, compact mark, favicon) in light and dark versions.

The brief's most important section, and the thing today's site misses entirely. Every design and copy decision is checked against it:

• Digital detox. Quiet, calm, near-meditative. People come to drop out of the noise.
• The guide knows this nature. Birds, animals, plants, tracks, mountain weather — real knowledge, freely shared. This is what people are buying, so it has to read on the site rather than being a surprise on the trail.
• Local access, not guidebook routes. Quiet paths, places the tour buses never reach, the hour when nobody is there.
• Individual approach as method. A conversation first: fitness, experience, then a route matched to the person or the small group. This is why enquiries — not a buy button — are the right model.
• What it is not: corporate away-days, team-building, group revelry, party-in-the-tent energy. Nothing in the imagery, copy or tone may drift there. If a photograph looks like an advert for group activity holidays, it is wrong.

Design consequence: air rather than density, large calm photography rather than collages, restrained typography, minimal motion. A site about quiet cannot twitch.

Homepage plus a tour detail page — enough to prove the direction without designing the whole site on an unapproved premise.

Spring, summer, autumn and winter each need to hold up against real photography and pass contrast checks — not just look pleasant as swatches. Also decide how a season is chosen: automatically by date, or manually.

The wireframe uses Fraunces and Inter from Google Fonts. Confirm the final pairing, check it against the logo's typeface, and verify licensing for self-hosting — self-hosted fonts avoid a third-party request and the privacy questions that come with it in Switzerland.

Agreed in advance so animation never becomes decoration: what may move, how far, how fast, and what must never move. Reduced-motion support is a requirement, not an extra. If an animation cannot be justified in one sentence, it does not ship.

Project tokens are deliberately reset to neutral greys so nothing carries over from other work. Replace them with the approved colours, type scale and spacing once the direction is signed off.

Approval of the visual direction before the full design begins.

Every template from the prototype list, designed at full width.

Designed, not improvised during the build. A large share of visitors arrive on a phone, so mobile layouts get real design attention rather than being left to the browser.

Hover, focus, active, disabled, loading, empty, error, success. Plus the awkward realities: a tour with no photo, a very long tour title, a season with nothing scheduled, a form that fails to send.

Every text-on-background pair checked against WCAG AA, in all four seasonal palettes — including text sitting over photographs, which is where contrast usually fails.

Which existing photographs are good enough to carry over, what needs reshooting, and what the crop rules are per template. Establish the image sizes the build will generate.

Consolidated revision list, resolved, then approval before the build starts.

Real headings in real order, landmarks, lists that are lists. This is what makes the site readable to search engines, screen readers and AI assistants alike — it is the foundation of the SEO work, not a separate task.

Verified at eight widths from a large desktop down to a phone held sideways, using the studio screenshot harness. Checks for horizontal overflow and console errors at every size, not just eyeballing.

Only what the motion document allows. Every animation respects the operating system's reduced-motion preference, and nothing animates in a way that delays reading or blocks interaction.

Labels tied to fields, inline validation, clear errors, a real confirmation, spam protection that does not punish real people, and delivery that actually reaches the inbox — test it end to end rather than assuming.

Full keyboard navigation with a visible focus ring everywhere, a working skip link, correct alt text, screen-reader check of the main flows, contrast verified in the browser rather than only in the design file.

Core Web Vitals in the green on a mid-range phone over mobile data — not on a desktop over office wifi. Modern image formats, correct sizes, lazy loading below the fold, self-hosted fonts, no render-blocking surprises.

Chrome, Safari, Firefox and Edge on macOS, Windows, iOS and Android. Mobile Safari deserves particular attention — it is where scroll-driven animation and viewport-height layouts usually break first.

Clean HTML and CSS validation, no console errors on any template, no broken links, no missing assets.

Options are laid out on the Stack Analysis page. The current recommendation is WordPress with a purpose-built lightweight theme and structured fields — chosen for handover safety and a small plugin surface. Needs the client's decision before any back-end work starts.

Build tooling, folder structure, coding standards, and the repository set up so every change is reviewable and reversible.

The agreed fields, built as real fields in the admin. Upcoming and past then separate automatically by date — the stale-2025-dates problem stops being possible rather than being fixed by hand.

Filter by difficulty, region and season using the structured fields, replacing the third-party search-and-filter plugin the current site depends on.

Per the domain decision. Either way: correct lang on every page (the German pages currently claim to be English), reciprocal hreflang between language versions, an x-default, and a language switcher that goes to the equivalent page rather than dumping the visitor on the homepage.

• Unique titles and meta descriptions per page, in both languages
• Canonical tags
• Open Graph and social preview images
• Working XML sitemaps — currently 404 on the English domain
• robots.txt rewritten; drop the pointless Crawl-delay: 10
• Clean, readable, stable URLs
• Descriptive image alt text throughout

Machine-readable markup so tours can appear as rich results and so AI assistants can answer questions about them accurately: trip and event data with dates, prices and locations, plus local-business and FAQ markup. Validate with the official testing tools.

The homepage map currently fails with a Google Maps error. Options: fix the API key and billing, switch to an open mapping library with no key and no per-view cost, or replace it with a simple static overview. Decide based on whether an interactive map genuinely helps visitors choose a tour.

All pages, tours, articles and media moved into the new structure in both languages, with every image re-generated at the sizes the new templates need.

Swiss data protection law and GDPR for European visitors. The current banner is a bare notice strip. Needs a real consent mechanism, an honest privacy policy, and as few third-party requests as possible — self-hosting fonts and being careful with the embedded Instagram feed removes most of the problem at the source.

Current core and dependencies, minimal plugin set with each one justified, sensible file permissions, disabled file editing in the admin, strong authentication, rate-limited login, and security headers kept at least as strong as the current server already sends.

Automated backups of database and uploads, stored off the server — and a restore actually performed once, because an untested backup is a guess.

A private copy of the live site where updates and changes are tried before they touch production. Blocked from search engines.

The single most common way a redesign loses search rankings. Every existing address in both languages gets a permanent redirect to its new equivalent, verified after go-live. No silent 404s.

A full pass over the staging site: security review, code review, the responsive harness, accessibility, performance, forms, and proofreading both languages. Everything on this page ticked before the switch is flipped.

DNS and certificates, search-engine blocking removed from production, the old site kept recoverable for a while. Scheduled deliberately — not on a Friday afternoon.

Both language versions verified in Search Console, sitemaps submitted, coverage and hreflang errors watched over the following weeks.

Uptime and certificate-expiry alerts, plus a check that enquiry emails are still arriving — silent form failure is the failure mode nobody notices until a client asks why nobody writes to them any more.

A walkthrough of adding a tour, editing a page and swapping photographs, plus a short written guide. All credentials handed over and recorded. This is what "interchangeable specialists" actually requires in practice.

Who applies updates, how often, who watches for security advisories, and what happens when something breaks. Left undecided, this is exactly how a site drifts back to an outdated core and broken plugins.

Written up in full on the Stack Analysis page — four options with arguments for and against each, a side-by-side comparison, the exact plugin list, and a recommendation.

• WordPress with a custom theme and near-zero plugins — recommended. Widest talent pool for handover, nothing to renew, runs on any host.
• Hosted headless CMS — the honest runner-up. Cleaner architecture and nicer editing, but a smaller talent pool and a permanent subscription.
• Static site with a git-based editor — excellent for sites nobody edits; wrong for one edited every week.
• Keep the page builder — rejected. Preserves every problem we were hired to fix.

Two constraints narrow this: free plugins from the official directory only, and the stack is piloted here to become the studio default, so it must stay universal rather than tuned to one client.

The site currently takes enquiries and answers personally, which suits small guided groups. Online booking with payment is a substantially larger build and brings cancellation terms, refunds and weather-related rescheduling with it. Decide before the tour templates are designed.

Italian or French would be natural given the tours in Ticino and the Alps. Far cheaper to design the structure for it now than to retrofit later, even if the third language never arrives.

The current site embeds it through a third-party plugin — a maintenance burden, a performance cost and a privacy question all at once. Options: keep it with a lighter approach, replace it with a hand-picked gallery, or drop it and simply link out.

Automatically by date, manually by the owner, or by which tours are currently scheduled? Automatic is elegant until it flips on the wrong day; manual is honest but has to be remembered. Also decide what the visitor sees in the gap between seasons.