Making a site responsive

What is a responsive site?

In simple terms, a “responsive” site is a website that can be viewed in a readable and ergonomic manner on various screen sizes (desktop to smartphone).

WaFx solves this problem by proposing to the webmaster to define the pages of his site with components whose geometric properties will depend on the visitor’s screen.

How do I use responsive?

Tip

It is advisable to put only 2 working screens (1 desktop + mobile), your site will be easier to modify

You have created your site in computer format and you want to make it accessible on a smartphone (without the visitor having to zoom in to see the elements of your site).

  1. Activate the mobile format in the general site properties (choose 2 layouts).

    ../../../_images/icon_props_website1.png
    ../../../_images/screen_settings1.png
  2. On your workspace, select the icon corresponding to the mobile format.

    ../../../_images/screen_selection_mobile.png
  3. Your page will be shown as “reduced”, it is not yet in mobile format.

  4. Then you have to arrange each element (enlarge most of them) to have a readable mobile rendering.

  5. Publish, your site is now responsive

General advice

  • Using the zoom

    Do not hesitate to activate the zoom (top left) to easily locate your elements.

  • Using element masking

    You can refine your layout by hiding certain elements depending on the screen or language

    ../../../_images/button_hide_show.png