Make your non-responsive mono site responsive

Most sites are born responsive - but if you already have a site which is non-responsive you can activate the responsive feature on your existing site under MY ACCOUNT > RESPONSIVE

Be aware that there are two pre-requisites you need in order to create a responsive site: 1) Your site needs to have a D4 design skin. 2) You need to have the proper subscription(s) in place.

If these prerequisites are fulfilled you just need to check the checkbox and click apply/save. Your site is now responsive!

If you had an existing and separate mobile site that site will no longer be visible for your visitors. Instead they will see the responsive version of your site. You may switch back to displaying your old mobile site by deactivating the responsive feature (same place as where you activated it) at any time.

Activating mono Responsive design is completely risk-free. For 90% of websites, responsive design is a much more effective way to manage the mobile experience and will save you a lot of time in maintaining your site but don’t take our word for it, try it for yourself and let us know how it goes!

What to be aware of when you change a non-responsive mono site to responsive

There are several things you need to check when changing an existing non-responsive site to a repsonsive site. Most importantly: Go through your pages to make sure that they are built in a way that fits 1:1 in  both the desktop and mobile view of the site. If you have a large site with a complex page structure, concider if all pages are relevant on mobile view. If not, you may hide the irrelevant pages for users accessing your site on mobile devices.

Are the current templates optimal for responsive?


Before you convert your site to be responsive you ought to go through all your pages carefully. Make sure that the layout and content on each page is mobile friendly.

If you have been using different modules that are not 'full width', then check that they 'stack' correctly in the mobile view. If the modules don´t break correctly on the mobile page - either replace the module with another module or remove it from the mobile view.

Check also that the modules are displayed in the right order.

 

Are the current templates optimal for responsive?


If your site is extensive with a lot of pages, you should consider to hide some of the pages and content for user´s accessing your site from mobile devices. Too much text and too many navigation links are not mobile friendly and therefore likely to annoy or confuse mobile users.

You should also consider to hide pages that contain "heavy" content - e.g. lots of images. Such pages would take a long time to load for mobile users.

Differentiate your content


A big advantage with responsive design is that you only have to update your site content once. Changes and updates will automatically be visible on both desktop users and mobile users.

That said though, not all types of content are equally relevant or friendly on both big and small screens. You´ll quickly learn that not all content works well on a small screens.  On each module you therefore have the ability to decide whether the content should be visible on all devices. You can choose between three settings: 

1) Show on both mobile and desktop (DEFAULT SETTING)
2) Show on desktop only
3) Show on mobile only.

The example below shows an "ABOUT"-page with contact information. In the desktop version the illustration is visible but in mobile view this module has been hidden to avoid that the "ABOUT"-text is not pushed too far down on the page on the much more narrow mobile screen.