Institut français

Responsive Web Design & Project Management on a large-scale website

The Institut français in London is a French culture and language centre that aims to spread French culture through its cinema, library, French courses and various cultural events.

Several observations urged us into adapting our website to mobile devices:

By its structure and the diversity of its offer, the website of the Institut is large and we needed to find some solutions to display such an amount of content on small screens while keeping a clear and smooth browsing.

We worked hard

We worked hard

Solutions

Navigation

The Institut website features three levels of menus, each with a large number of items. We chose not to hide these menus behind a hamburger button as they are the core of our website navigation, but it was also impossible to display them fully on mobile screens. We developed a “hybrid” solution, using the power of touch gesture on mobile screens and a breadcrumb.

Swipe right to scroll the menu, use the breadcrumb to browse back

Swipe right to scroll the menu, use the breadcrumb to browse back

Contents

Several techniques were used to fit the content on small screens.

Load time was improved by

Some improvements unrelated to the responsive website were integrated at the same time:

Responsive homepage with latest news

Responsive homepage with latest news

 

Spread the word!

Spread the word!

Results

The website was presented to the team of the Institut and feedback was collected over the next days, before the website went live in time, in June 2015.

The responsive website, paired with the new ticketing system, made the process of booking tickets fast-forward for our mobile customers.
Load time (on the home page with a hard reload) fell from 2.72s to 1.38s.
Overall, the feedback received was overwhelming positive, both from the team and the public.

Visit the website