Building this website

Business owners need to see whether I can help with their problem. Technical leads need enough detail to judge my contribution. The homepage introduces the offer, Work explains selected projects and tools in context, and About holds the professional background and approach.

Each project separates the purpose of the application from my own contribution. That gives readers concrete evidence to assess, with deeper case studies available when they want to understand the decisions behind the work.

Shared components and design tokens keep typography, spacing and colour consistent across pages. Violet provides identity and hierarchy; turquoise distinguishes links and primary actions. Keyboard focus, mobile navigation and form feedback follow the same visual language.

Motion adds character without becoming necessary to understand the page. Content enters in coherent groups, while a link to another page arrives directly at its destination rather than appearing to scroll within the current page. Content stays readable without animation, and reduced-motion preferences remove decorative movement.

Visitors should not have to rewrite an enquiry after a failed submission. The form checks their input, keeps the message when sending fails and explains what happened. If sending cannot be confirmed, it says so and offers direct email as a fallback.

On the server, validation and spam controls are separate from the Brevo email integration. Tests cover invalid input, delivery errors and timeouts without sending real messages. This separation also keeps a future change of email provider contained.

Next.js and React provide the application structure, with prerendered pages and focused browser-side interactions. Typed page content and Markdown articles live in Git, so I can review content and code changes together. This suits a site I maintain myself; an editorial team could need a different publishing workflow.

English and German have their own URLs, and the language switch leads to the corresponding page. Shared components and publication rules, with translations maintained together, help keep content and behaviour consistent as both versions evolve.

Type checks and unit tests cover content models and application logic. Browser tests exercise navigation, language switching and contact states, alongside automated accessibility checks. I also review layout, motion and keyboard use in the browser. GitHub Actions runs the automated checks; local hooks catch formatting and lint issues before a commit.

AI coding assistance was part of the development process. I directed the requirements and design choices, iterated on the result through code and browser review, and remain responsible for what I ship. Versioned changes and explicit checks keep that work inspectable.

The site is hosted on Netlify under janisschanbacher.com. The rewrite includes canonical URLs, route-specific metadata, structured data and a sitemap limited to published content. Old links have explicit destinations: a redirect where a suitable replacement exists, or a genuine not-found or gone response where content was retired.

The result is a focused website whose content, interface and contact flow can evolve together as new projects and articles are added.