Relaunch of "Bodensee Schiffsbetriebe" Personalization and performance for different users.

Bodensee Schiffsbetriebe (BSB) runs a fleet of 13 passenger ships and ferries on Germany's largest lake and is a unique provider of local public transport. For the relaunch of its website, BSB was looking for a professional partner who was able to provide the technical expertise for the implementation of a modern, mobile-optimised website and who also had a great experience in online marketing.
 

Challenges

Technical challenges:
* Integration of ElasticSearch and ReactiveSearch for both full-text search and events-search
* Progressive Route-Plan web-app built with React
* Performance optimization for website
* Deep integration with Stackpath CDN (new module contributed)

The search frontend was implemented with React, more precisely the ReactiveSearch library.
Since searching for ferries is the main service offered on the website, we used ElasticSearch on the backend in order to speed it up, and also to enable smart search functions such as "did you mean" (similar to Google search) and predictive search suggestions.

This allows the website visitor to change the search results at any time without having to reload the search results page. This is done with the help of facets or changes in the search query. The result is a very fast, error-tolerant search function that always returns the best results.

The Event Search is available at https://www.bsb.de/de/alle-erlebnisse, the full text search is available on all pages.

The timetable search was redesigned as part of the relaunch. The backend of the search has not been changed. Instead, the search interfaces were implemented as REST-endpoints.

The search itself was then implemented with React. Beside all this an animated map was implemented to display the different routes and travel times.

To achieve good rankings in search engines, modern websites need to have very good performance both on desktop solutions and mobile devices.
The BSB website works with large, engaging images and these should be displayed in the browser as quickly as possible.
By implementing progressive rendering, lower-resolution images are first loaded and then replaced with higher-resolution versions - this allows visitors to start using the website without any interruption. Prefetching happens with Google's quicklink technology to load content from other pages linked to the current page in the background before the visitor switches to those pages. This speeds up the page load process for website visitors.

In order to deliver content from as fast as possible from the nearest servers (edge), Stackpath CDN was integrated. In order to fully exploit the functionality a new module was created by 1xINTERNET to integrate Drupal with the Stackpath.