A lightweight marketing site for the Pokoje Borowa guesthouse — room overview, contact details, local attractions, and a direct link to the booking system. Built in plain HTML, CSS, and minimal JavaScript because the right tool for a static info page is a static info page.

The Brief

Before the full management system was built, the guesthouse needed a web presence. Guests were searching online and finding nothing. The requirement was simple: a fast, mobile-friendly site that looks good, loads quickly on rural Polish mobile connections, and does not require any CMS or maintenance overhead.

Why No Framework

This is a deliberate constraint, not a limitation. A marketing site for a guesthouse does not need React. It needs:

Fast first paint — critical for SEO and mobile users on slower connections
Zero JavaScript dependency — if a script fails to load, the page still works
Minimal maintenance surface — no node_modules, no build pipeline to update
Easy deployment — drag the folder to any hosting provider and it works

Plain HTML and CSS with a handful of vanilla JavaScript interactions delivers all of these. A Next.js or Astro site would have been comfortable to build but would have added complexity with zero benefit for this use case.

Performance Focus

The site targets a Lighthouse score above 95 across all four categories. The main levers were:

Images — served as WebP with explicit width/height attributes to eliminate layout shift. Lazy loading on below-fold images. Responsive srcset for different screen sizes.
CSS — single stylesheet, no external dependencies, critical styles inlined in the head for above-fold content.
Fonts — system font stack with a single Google Fonts family loaded with font-display: swap and preconnect hints.
JavaScript — under 4KB total, deferred, handles only the mobile menu toggle and a simple image gallery lightbox.

The Photo Gallery

The gallery is the only interactive piece. Clicking a room photo opens a lightbox — a full-screen overlay with the image, previous/next navigation, and keyboard support. Implemented in roughly 60 lines of vanilla JavaScript without a library:

// Keyboard navigation
document.addEventListener('keydown', (e) => {
  if (!lightbox.classList.contains('open')) return;
  if (e.key === 'ArrowRight') showNext();
  if (e.key === 'ArrowLeft') showPrev();
  if (e.key === 'Escape') closeLightbox();
});

SEO Fundamentals

The site targets specific local search terms: accommodation in the region, guesthouse near specific landmarks, and the guesthouse name itself. Each page has a unique title, meta description, and canonical URL. Schema.org markup for LodgingBusiness provides structured data for Google's local knowledge panel.

{
  "@context": "https://schema.org",
  "@type": "LodgingBusiness",
  "name": "Pokoje Borowa",
  "address": { ... },
  "telephone": "...",
  "priceRange": "$$",
  "starRating": { "@type": "Rating", "ratingValue": 4 }
}

What I Learned

Working without a framework makes you notice how much framework code exists to solve problems that plain HTML and CSS already handle — responsive layouts, form validation, anchor navigation. The constraint was clarifying.

The hardest part was the photo optimisation pipeline. The owner provided photos directly from a camera — 5-8MB JPEG files. Converting them to appropriately sized WebP variants, writing the responsive srcset markup, and verifying there was no layout shift required more iteration than any of the JavaScript.

Status

The site is in active development alongside the management system. The home page, rooms, and contact pages are complete. The local attractions section and integration with the booking system's availability API are in progress.