Responsive Mobile

Responsive Mobile sites are ones that have their themes set up so that information shown automatically rearranges itself well for those looking at the site on a mobile device (tablet or smartphone).  

Visit the sites listed below on your desktop/laptop and phone/tablet.  Or just go to these sites with your desktop/laptop and click and drag the lower right corner of your browser window and make it narrower (like a cellphone or tablet width).

Examples of responsive sites VoyageurWeb has created:

A responsive theme is only part of the picture.  When you add information to your website, it's easily possible for you to do it in a way that is not mobile-friendly.

We assist our clients by providing training and tools that make it easy for them to add and update their site in a way that's friendly to mobile devices.

Responsive Tables

One of the biggest challenges with adding or updating content on a site is data that you'd like to present in a table form - with columns and rows.  Cellphones are typically used in a vertical position, while tablets and desktop/laptops are larger horizontally.  Information that looks great on a laptop gets cut off on a cellphone.

Here are three examples of specialized work we have done that our clients can use on their sites.  For all three of these examples, our client can simply use the standard table tool in the content editing area of their site.   *A note: typically only one of these methods is used on a single site.

Example 1 - STACK the data

This is great when you have simple tables of information - contact information for example.  

  becomes mobile view

Example 2 - SWITCH the data

This type of treatment works well if you have moderately sized tables of information - 3 to 5 columns and rows - and each cell of information is either not long or they all are about the same size.  Notice how the cells with lots more info than the others distorts the layout a bit - but still very readable.

Desktop view example 2 becomes mobile view

Example 3 - SQUISH the data

This approach works best if you don't have lots of columns of information or if each cell contains little or simple information.