Announcing mobile friendly websites
June 1, 2015
Jean
Here we go : we are very happy to announce that UGAL is now able to produce mobile friendly websites. Using Responsive Web Design techniques, the display of your website is automatically optimized for the screensize of the visitor's device.
Our default theme, Red, has been upgrated to be responsive and the most used standard themes will be upgrated in the coming weeks. Custom themes can easily be upgraded to be responsive.
Responsive Web Design
Wikipedia says it well : responsive web design is a web design approach that aims at providing an optimal website viewing experience across a wide range of devices, from wide desktop screens to narrow smartphones. The term responsive web design was coined 5 years ago by Ethan Marcotte in an A List Apart article. The quote at the top of the article captures very well the spirit behind the responsive approach:
The control which designers know in the print medium, and often desire in the web medium, is simply a function of the limitation of the printed page. We should embrace the fact that the web doesn’t have the same constraints, and design for this flexibility. But first, we must 'accept the ebb and flow of things'.
Because CCS3 media queries are now widely supported by modern browsers, responsive web design has become the approach of choice to address the needs of mobile devices.
What changes for your website ?
If you use a standard theme, nothing changes. We have started the process of upgrading our custom themes to be responsive with the Red theme. The migration process includes making a copy of the standard, non-responsive theme as a custom theme of each website that uses it. The copy is made before the theme is updated to be responsive, so that your website is not affected by the change in the standard theme.
So, if you want to use the responsive version of the Red theme (which we encourage you to do!), go to the design tab of your website and select it from there.
More standard themes will be updated in the coming weeks, we will follow the same process for them.
If you use a custom theme and do not have the need for a responsive theme, there is nothing to do, your theme will continue to work as today.
If you use a custom theme and would like to migrate to a responsive theme, you need to update the CSS files of your theme. We have written a migration guide, based on our experiences migrating our standard themes. It is a more or less straightforward process, depending on the complexity of your theme and the HTML markup you are using for your pages.
A few markup changes
We took advantage of this new devs to make a few changes to the HTML markup generated by UGAL. None of them should break anything on your website, but please contact us if you experience any issue.
- A number of inline CSS instructions have been removed from our markup, specially on form fields. Such instructions should really be in CSS files, and we are glad to finally be able to address this shortcoming.
- The markup for the contact page and the login form has been modified.
- A responsive only version of the shopping cart and the entire checkout process is in place.
- For greater flexibility, our default payment icons have been removed from the payment selection interface. You should instead add the icons of your choice in the payment method description field.
- The in-page login functionality has been removed from the checkout pages. Instead, visitors are now redirected to the standard login page. Once logged in, they are redirected to the checkout, pre-populated with their last order information.
For more details on those changes, please consult our migration guide.
In case those changes create issues on your website, please contact us as soon as possible so we can provide a fix.
Photos, slideshows and zooms
We believe that we have addressed (mostly with HTML markup changes) most of the concerns related to migrating to responsive themes. One remaining issue is with the slideshow and zoom display of photos uploaded from the "Photos" tab of your pages. So for now, and until we have found a suitable solution, we recommend that you stick with the static photos display mode. We did not want this issue to delay too much the launch of the support for responsive themes.