Let me tell you about report.fondpr.ru, the public annual report of a charity that helps children. The site is small, but it contains several decisions that are useful in any project with data and a client who isn't technical.
The task. The charity needs a report that opens by a link rather than a fifty-page PDF: the year's figures, the programmes, where the money went, where the children live. And the staff should be able to change texts and photos themselves instead of writing to a developer about every detail.
A static page plus one edits file. The page is essentially static: a ready HTML template with a small script that applies the edits on top. There's no heavy CMS and no database, so the site opens fast, there's almost nothing to break, and the hosting is ordinary.
A regional map built from addresses. The charity's children live all over the country, and a map of Russia shows that best. Addresses are turned into region names using an open geographic names dataset, and the borders come from open data. Moscow and its region are merged, as are Saint Petersburg with the Leningrad region, and Crimea with Sevastopol. Only regions and the number of children reach the site, and the addresses themselves are never published. There are tabs for "2025" and "All years". Charity programmes that don't belong to a specific child are left out of the count, otherwise the figures would be inflated.
Figures and finances. Cards with the key numbers: how many pieces of equipment were handed over, how many children were helped, how much went on medicines. The numbers count up smoothly when the page opens. Spending is shown in ring charts drawn by the site itself, with no external libraries. I also made a version with 3D pie charts, but in the end we went back to the plain rings because they read more honestly. I kept the 3D version in case it's needed again.
Real photographs. For the programme cards I took actual pictures from the official PDF report, extracting the embedded images straight from the file. A real photo earns more trust than a stock image, and for a charity trust is everything.
An editor right on the page. The team signs in to a private area with a password, clicks a text or a photo on the page itself, changes it and presses "Save". The edits sit in one file on top of the template, uploaded photos are automatically resized to a sensible size, and the last sixty backups make it possible to roll back any change. The counters, the charts and the map aren't edited through the editor: they're built from data, so they can't be broken by accident.
What went wrong. Once I reverted the old charts on the server only and didn't update my local copy, and the next update brought the 3D charts back by accident. Now the rule is simple: after any edit made directly on the server, I first download the current file and only then work with the local copy. A small thing, but that's exactly how unpleasant surprises are born.
The result. A one-page site, but with a map built from data, live figures and an editor run by someone who isn't a developer. If you need a report, a data page or a similar site, let's work out the task: kovalev.trade/websites
#webdevelopment #charity #annualreport #datavisualization #casestudy