A simple, efficient web tool for viewing upcoming bin collection schedules in Royston. The project focuses on clarity, mobile accessibility, and ease of maintenance while avoiding unnecessary complexity.
Bins – Royston is a minimal web application that displays upcoming bin collection days for households in the Royston area. The goal is to provide a fast-loading, easy-to-read page that works consistently across devices. The site is built with plain HTML, CSS, and lightweight JavaScript where necessary. No frameworks or external libraries are used.
- Clean Layout
- Clear containers display the next collection for each bin type. Information is presented without visual clutter.
- Mobile-Optimised Scaling
- A responsive scaling system enlarges the interface on mobile devices for improved readability. This preserves the desktop layout while enhancing mobile usability.
- Flexible Styling
- All typography and spacing are controlled through CSS variables, allowing quick edits to:
- Color themes
- Lightweight Structure
- The project runs entirely from one HTML file for easy hosting, quick loading, and simple maintenance.
- Easy Maintenance
- Bin dates can be updated by editing a single section of the HTML—no databases or APIs required.
Modify: transform: scale(1.17);
Lower values reduce zoom. Higher values increase it.
The official bin-collection interface is harder to read quickly, inconsistent across devices, and often cluttered.
- Putting all information on one screen
- Removing unnecessary navigation
- Improving readability at a distance
- Using one codebase for all devices
- Loading instantly, even on slow connections
- The design principle: simple, readable, fast.
- Push or email notifications
- Colorblind-friendly theme option
- Automatic date rotation logic
- Export to iCalendar (.ics)
- Keep the single-file structure
- Avoid adding unnecessary dependencies
- Preserve readability and simplicity
- Verify layout on both mobile and desktop
MIT Licance ©Pip Chell 2025