SURF.nl, aanjagen van vernieuwing in onderwijs

Organisation
LimoenGroen
The case
Category
Onderwijs
Client
SURF
Summary
SURF facilitates education- and research institutions by sharing digital opportunities and innovations. The new corporate website supports the renewed branding strategy and facilitates several smaller websites with over 2500 content pages. The entire information structure and navigation was redesigned and is now sustainable for further optimization.
Project description
SURF gradually moved towards one large cooperation and the cooperation members asked for a clear, single brand strategy and presence.
The target groups had different user goals, which all needed to be addressed in content, site structure and better usability.
The amount of content lacked structure, both for editors and for visitors.

The new website needed to be sustainable; it needed to enable growth in content without having to redesign the entire information structure again.
The website needed to project innovation (inspire) and collaboration (education, research) in a way that would make all the target groups happy
The CMS had to be easy to use and flexible

The goals (KPI’s) that have been set were documented in a large list of call to actions per section. It contains measurable indicators like number of downloads, contacts, newsletter registrations, video views, participation in projects, activities, and taking part in events. It’s too early to produce numbers yet.

We reworked the site structure from organization chart to user friendly structure by using data and user research to match user goals and needs (top tasks) to demand driven user flows (navigation).

The website was created by PUURPXL and LimoenGroen in conjunction with SURF.
Challenges
Drupal offers a lot of out-of-the-box functionality we could use to construct the new website. Editors required many building blocks (paragraphs) that were added to an assets library containing all design elements.

In addition to embedding YouTube and Vimeo, the CMS was linked with Mediamission, SURF’s very own streaming service to make live video streaming possible (for events for example) and easy to implement. This was done by writing an extra provider for the Video Embed Field module.

The Video Embed Field module offers support for lazy loading, where only a “still” image from the video is visible. Clicking on the still loads an ‘iframe’ containing the video. We have extended our cookie module, so a cookie alert will only be visible after clicking the still, so a user can then accept cookies. This will make a video page much more attractive.

The site is multilingual; menu’s, paragraphs and webforms can be set up multilingual by the editors.

It also offers an extensive editor workflow. Revisions are part of the workflow, so it’s easy to go back to older versions of content if necessary. The combination of multilinguality, workflow and revisions had not been entirely developed in Drupal 8. Several adjustments have been done to make this possible.

Offer and event pages consist of 1 or more pages with their own menu bars. These pages can simply be added to the structure by editors through inline references on the main overview page of the offer or event. Combined with the module entity references this makes it easier for a developer to go from a subpage to information on the main page.

We have laid out a roadmap for future additions to the website to incorporate subsites and services. In the near future we will incorporate SURFspace and SURFblog. Single sign-on with SURFconext for SURF cloudservices is the next thing on the agenda. The editors have also asked for a module that will show dead links and linked content, so the editors can easily check with which other pages within the website a specific page has been linked.

This is the way we expect to keep on improving the website now that the foundation is solid and sustainable.
Community contributions
During the project we wrote two contributions. We wrote the Paragraph Image module, which is used to re-use image in paragraphs in an accessible way. We also wrote the MediaMission module, to integrate MediaMission with the Media Library in Drupal. Both modules will be shared with the community within the next few weeks - during on of our Sustainable Thursdays (Duurzame Donderdag).
Screenshot
Video