The Council of the European Union (EU) is one of the three governing bodies of the European Union, along with the European Parliament and the European Commission. A team of 6 developers and 3 designers took the tough job of replacing the institution’s outdated CMS to one that: would allow editors an immediate publishing of new content and institution’s 800 (!) translators - to translate the site with their existing translation tools into 24 official EU languages, spending the least time possible. But how? You will see in this amazing Umbraco CMS case study told to you by Simone Chiaretta, Team Lead and Web Architect at The Council of the European Union:
- Content creation
- Public sector & charity
How we started out
Our previous website needed to be replaced for various reasons, both technical and contractual. After a lengthy phase where we consulted CMS experts and developed proof of concepts with a few CMSs, we decided to use Umbraco for the rewrite of our public website.
The actual development of the site started toward the end of 2016 and was completed with the launch of the website on the 26th of October of 2017. So, roughly 10-11 months of development of a team of 6 developers and 3 designers.
The challenges to tackle...
✔️ Reimplementation of everything that was available before: the project didn't include any redesign or restructuring of the contents or navigation, but it included the rewrite of the whole HTML/CSS, server-side and obviously all the workflows and content management screens in the back-end.
✔️ The biggest challenge was solving the main issues that afflicted the previous system. So the new system had to allow immediate publishing of new content, allow editors to create rich, reusable content which included images, videos, and links to either internal page and external sites without leaving the main editing screen (before they had to create all the "accessories" before and then go and assemble the page).
✔️ Multilingualism: the European Union has 24 official languages and every content of the site needs to be translated in all the languages. The Council of European Union employs almost 800 translators which already translate all legislation in all the languages.
They have their own translation tools and they needed to be able to translate the site with them, spending the least time possible. So we needed to build an automatic import and export of the content, from Umbraco to Xliff, the industry standard for inter-exchange of translations.
✔️ The need of a fast and responsive website, that could cope with peaks of traffic.
The access and views of The Council of the European Union website are dependent on the events and meetings happening. Typically the site has a stable number of users which can duplicate or triplicate when important meetings (like the Summits of the head of governments) happen.
✔️ Finally there was a need of a full text search on the site, that worked more efficiently and improved the findability of information stored on the site.
"Umbraco was an invaluable help for the good outcome of the project. Many challenges were solved "gratis" just by using Umbraco, and for the ones that were not directly addressed, the openness and easiness of extendibility of Umbraco allowed the development of a lot of custom solutions to address our challenges,"
...and how we tackled them using Umbraco
On the technical side, a big challenge was allowing the team of 9 developers/designers working together on the same project.
We made extensive use of the grid component in Umbraco, to let editors design their page with the maximum flexibility possible. We also enhanced the grid with the use of the Doc Type Grid editor package, to have more structured components inside the grid.
The multilingualism has been addressed by using a customized version of Vorto that also works inside the grid and by developing a custom component to replace the built-in translation section of Umbraco.
Finally we used Elastic Search for the full-text search and Varnish to act as cache in front of the site. The first allows users to search on the site like if it was indexed by Google: the page is indexed for its text, no matter how the document is structured in Umbraco.
Varnish caches all pages, so when a user searches for a page, it returns it directly, serving it from its cache not bothering the servers where Umbraco resides. This means that the website itself is shielded from possible peaks in the access. And to avoid serving outdated content, whenever a page is changed, the cache for that specific URL is purged.
The new website today
After 2 months of using the new system, we can say that the project is successful. Editors can create content much more quicker than before, they can publish immediately and have it displayed on the site which is accessible even during heavy load.
This allows editors to focus more on the quality of content instead of the technicalities of editing the document in the CMS, and as a result the content is more accurate, re-usable and timely than before, and of better quality.
Meanwhile translators can easily translate content faster, because they have one file per page instead of hundreds of decontextualized files to translate.
Overall we can say that the rewriting of the CMS with Umbraco achieved its goal, and thanks to Umbraco the visitors of the website have access to better managed content, published in a timely fashion with an improved translation flow ensuring all content can be communicated easily in the visitor’s preferred language.
"Thanks to Umbraco the visitors of the website have access to better content, translated in more languages and published in a timely fashion. Redesigning the Council’s website with Umbraco we fully achieved what we’ve planned!"