Miss Et & Balık is a meat and fish restaurant in Kaman, in the Kırşehir province of Turkey. This project combines the restaurant's website and a QR menu that guests open on their phones at the table, in one lightweight build. The aim was to give a small business a digital shop window that guests can use within seconds, without adding maintenance work or monthly software costs.

Context and requirements

The restaurant had three concrete needs. First, a showcase site with photos of the dishes and the venue that works properly on phones. Second, a digital menu guests can scan at the table instead of a printed one, without installing an app. Third, reservation requests had to arrive in the channel the restaurant already used every day: WhatsApp. Learning a separate admin panel or watching another screen for requests was not realistic for the team, so the solution had to fit existing habits.

Solution and scope

Single-page website

The homepage is a single scrolling page. A short loading animation is followed by a welcome section with a parallax background. The about section introduces the venue, and the menu section presents 14 dishes with photos and short descriptions in four categories: meat dishes, fish and seafood, starters, and desserts. Navigation dots on the right edge show where the visitor is on the page and scroll to the matching section when clicked.

Food gallery and full menu

Food photos are collected in a gallery; clicking an image opens a lightbox. The lightbox works with the keyboard as well as the mouse: arrow keys move between images, and Escape or a click outside closes it. Visitors who want to see the whole menu at a glance can open a separate full-menu window.

Forms connected to WhatsApp

The reservation form collects name, phone number, date, time, number of guests and an optional note. On submit, the details are formatted into a tidy message and opened as a ready-to-send WhatsApp message to the restaurant. The contact form and newsletter sign-up work the same way. No personal data is stored on the server, no database or email setup is needed, and requests arrive in the app the restaurant checks all day.

Mobile-first QR menu

The QR menu is a separate, minimal page for guests scanning the code on their table. Tabs for meat, fish, starters and desserts sit at the top; switching tabs opens the category and scrolls smoothly back to the top. Each dish has a short description of how it is prepared. At the bottom, guests find a quick WhatsApp link and a link back to the main site.

Printable QR code page

A dedicated page produces the QR cards the restaurant places on tables and walls. The QR code is generated in the browser and laid out on a print-ready card with the logo and a short scan instruction. The Print / Download button opens a print view containing only the card, so the restaurant can print new cards without a designer.

Management model

No admin panel was built, on purpose. The menu is short and changes rarely; adding a panel, a database and user accounts would have increased both the attack surface and maintenance costs. Menu and content updates are made directly in the static files and go live within minutes. The restaurant's only day-to-day touchpoint is the requests arriving on WhatsApp.

Technical architecture

The site is written in HTML5, CSS3 and plain JavaScript without any framework. Styles are split into 13 files covering global variables, header, menu, forms, gallery, full menu, QR menu and responsive rules; colours and typography are controlled centrally through CSS custom properties. Behaviour lives in six small JavaScript files for the loader, navigation, dot indicator, lightbox, full menu and forms. All code apart from images comes to roughly 105 KB, and there is no build step.

Menu and gallery images are lazy-loaded as they approach the viewport. The typography pairs a handwritten display font with readable body fonts. Layouts use separate breakpoints for desktop, tablet and phone, and the dark restaurant aesthetic holds on every screen. Description and viewport meta tags are set for search engines and mobile display.

Integrations and hosting

• WhatsApp: reservation, contact and newsletter forms via pre-filled message links.
• QR code generation: a lightweight library running in the browser, no server required.
• Nginx and Let's Encrypt: static files served directly over HTTPS.

Outcome

The project was completed in March 2026 and is live at menu.guezelwebdesign.com, with the QR menu running as a separate page on the same domain. The restaurant now has a menu that opens quickly on guests' phones and a website that delivers reservations straight to WhatsApp. Since nothing runs on the server side, maintenance is limited to content updates.