Optimizing Sites for Mobile Devices

Adjusting the Site Layout and Content

A website will look better on mobile devices if you follow these recommendations:

• Place the navigation menu and search modules at the top of the page.
• Do not use large banners at the top of the page.
• Place the main content closer to the top of the page.
• Do not use sidebars.
• Ensure that the content has a clear structure and distinct headings.
• Do not insert wide pictures and tables in text.
• Do not use images in backgrounds.
• Do not use containers with a fixed (explicitly defined) width.
• Do not use decorations, such as borders, shadows, and corners.
• Try using only Text & Images modules.
• Avoid using second-level and third-level pages.
• Try to keep the size of images as small as possible, both in terms of image dimensions in pixels and file size. 

Switching Mobile Optimizations On and Off

When users access a site from a mobile device, Presence Builder automatically adjusts the layout and navigation of the site to fit smaller screens. It also adds links to the site that enable users to switch between a mobile and a regular site version.

If you want to switch off these automatic optimizations and show the same version of the site regardless of the device used to view it, go to the Settings tab > Advanced, and clear the Enable mobile optimizations checkbox.

Previewing a Site on Mobile Devices

If you want to see how your website might look on a mobile device, open the menu next to the Publish button and select Mobile Preview.

Note that although mobile preview shows password-protected pages without prompting you to specify a username and a password, visitors to the actual mobile site will need to give their details to access protected pages.