KSW Marks 100 Years with a Custom WordPress Platform Relaunch

Kantonsspital Winterthur (KSW) is the 8th largest hospital in Switzerland. With a staff of about 3500 doctors and nurses and 500 beds, KSW ensures basic medical care in the Winterthur region, provides specialized care services for surrounding hospitals and treats over 270 000 patients annually.

To mark the 100th anniversary since the founding of the hospital, KSW wanted to relaunch their website to be in line with the institution’s new corporate identity and design. Much has changed since 1917, but their approach and values remain the same, namely central focus on patients and outstanding holistic care.

Technical Details

Content Management System: WordPress
Features: Responsive Design, Modular Structure, Image Mapping, Custom Importer

Dream Production Services

KSW wanted a modern and robust solution that could be integrated in a fluid design and allow content managers to easily navigate through the vast amount of data that had to be organized and made available for their website visitors. Given the project brief, we knew WordPress would be the perfect CMS choice.

In order to provide KSW with the solution they needed and to help them in their rebranding efforts, we provided an end-to-end solution, taking care of everything, from designing the website templates, to the actual implementation, while also handling all the content management work that had to be done.

The first important requirement we had to fulfil was that of providing an enhanced yet structured and simple interface for content editors to navigate through. Given the degree of flexibility expected from the CMS interface, the implementation of a custom layout builder quickly emerged as the most efficient approach for providing a good experience for content editing.

As a result, the KSW website is built on a set of 25+ modules which are on one hand purpose-specific and on the other hand allow enough room for further configuration. We designed modules for each specific content type (eg: visual elements, images, text, video, etc.) which can be used to build any given page structure. The modular structure was also designed to handle edge cases in which several sets of modules can be grouped together and used as “modules within modules”.

Specifically, we implemented “Title”, “Lead Text” and “Content” modules, which are basically the buildings blocks for any page the editing team wants to build. We have a “Video” module that allows editors to upload YouTube / Vimeo videos, as well as an image and a quote, a “Team Members Listing” module that allows content managers to easily add and group members of a clinic together, a “Baby Gallery” module that displays all newborns in the hospital, and many other specific modules.

Another important requirement was to also provide a responsive, pixel perfect design, that was in line with KSW’s corporate brand identity as well as being optimized for mobile devices. We implemented several media queries, where a particular image format can be served depending on the user’s screen resolution, thus optimizing content delivery. WordPress generates different image sizes for various resolutions and for widths lower than 1024 pixels we have a tablet layout of the website, while above that resolution mark we have a full desktop experience.

Overall, we had some interesting challenges that we had to deal with. First of all, we did not want to manually migrate all of the content from the previous website implementation, so we generated XML and CSV files that we could use in our importer. It is used to import team members and babies. This approach based on the WP All Import plugin which helps content managers to move faster and reduces the risk of mishandling the original data. We also developed a custom importer for .xls and .xlsx tables. It stores data and maps it on the WYSIWYG interface so that content editors can assign the correct style just by using simple configuration options.

Another challenge was related to creating an interactive map of the hospital buildings and clinics. It was an interesting request for us to handle and a crucial one for KSW, as the hospital compound has multiple buildings and a wide range of clinics. We started with Image Map Pro, on top of which we wrote custom JavaScript / jQuery code. We’re very happy with the result and if you go on the website you can try out this interactive map.

We also put our SEO expertise to good use as it was key to KSW’s brand awareness goals, since the 8th largest hospital in Switzerland also needed to rank accordingly on search engines.

Due to the high number of modules and the vast amount of content, KSW was an interesting project for us to work on and we are really happy with the end result. This project really highlights our approach as a company, providing end-to-end solutions for our clients, which include design, frontend and backend development, content management and continuous support. Maintaining a close contact with the client at all times, turning their requirements into features, while consulting them along the way, insures great quality and translates into a positive experience on both sides. Give us a call if you think this approach can help in meeting your online business needs.

Want to join our team?

We’re looking for talented and dedicated people that can make a difference through their professional experience and personal wit.

Apply now