Oud-Utrecht Historical Society

The website of Oud Utrecht, the historical society of Utrecht, in the Netherlands, looked kind of antique itself. The site was fully up to date, but it was dark and, to be honest, a bit gloomy. They needed a full restyling to fresh up their image and attract a bigger (and maybe younger) audience.
Oud Utrechts designer Jeroen created a detailed design with interesting challenges, such as a news block on home with three different styling possibilities for the articles, and a header with a scrolling vertical slideshow menu plus a random photo or the full text image of the article.

Jeroen had also made a flow chart for the site’s structure. We got a bit dizzy just from looking at it, so we arranged a meeting to find out what the ideas were, what they thought was important, what they could do themselves and what the usability criteria would be.

This meeting was a great start. We had definitely a click with Jeroen and Martijn, the people from Oud Utrecht, went over the flow chart and the design, asked questions, answered questions, drank gallons of tea, ate tons of stroopwafels, and after the meeting we felt sufficiently equipped to start working.

In the following weeks we adjusted the structure of the site according to the flow chart. In Helix Ultimate, our favourite framework, we created a template based on the design. For every page type we created its own layout. The biggest challenge were the multiple-article pages. For this we used Regular Labs Articles Anywhere. This extension enables you to show (parts of) articles in various ways, anywhere on your website. That made it a lot easier to follow the design for those pages.

The home page shows a news block with twelve news items. For each news item, the content managers can choose from three layouts by clicking one of the options in a custom field. If they don’t like the layout, they can change it just as easy.

The photo header on each page loads the full text image from the article (when it’s a single article page) or a random image from a folder. Next to the photo is a dynamic scrolling menu with links to the most important parts of the website. To achieve this, we created an override where everything is loaded correctly.

All in all this has been a very interesting project, with a great result.
4th of December, 2020


Be the first to review and rate this site!