Search
Expand Article

Last Updated: 4/16/15

Mobile Pages

Note: Creating a mobile section of your site, as described below, is our legacy method of optimizing a site for mobile viewers.

Newer Elexio Website Designs are responsive and no longer require this additional step. As of April 21, Responsive Design is also the best practice for Search Engine Optimization (SEO). We would encourage all our website owners to consider transitioning to a responsive design. For more on this process, see Managing a Responsive Design.


 

As more and more of your site visitors will first see your site on a mobile device like an iPhone or Android phone, you'll want to make sure your site is ready to welcome them. Elexio Website gives you tools to create a simple, effective welcome for mobile users.

Note: Newer Website Dynamic Canvases and custom designs are now implementing "responsive" design features, which allow your regular site pages to flex based on the device being used to view them. If the design on your site is responsive, that may decrease or eliminate your need for separate "mobile" pages. To check your design, view your site page on a device (or window) that is under 600px in width. If the display changes to display more effectively on the small screen, it is responsive.

Planning for your mobile welcome pages

Your mobile pages are not intended to replace your entire web site for mobile device users. The goal is simply to provide the most common information mobile users are looking for in a way that is easy to access on a mobile device.

Before starting, visit some other sites like yours using a mobile device to see what they do and gather ideas. Identify the key content you want to include. Typically that will be something like this:

  • Logo / branding and possibly a brief welcome.
  • Content or links to contact information (phone number, email address), directions, service times or office hours, and a way to get to your regular site.

For most sites, that will be about it. For your mobile pages you want to use large, finger-sized links and keep in mind there's no hover to operate drop-down menus.

Create your mobile page(s)

    1. Create a page for your mobile home page. We recommend using the "Mobile - Default" design, as seen below.

  1. Add your organization name at the top, then add some brief information in the content block beneath, such as a logo and welcome message.
  2. Create a few subsequent mobile pages, also using the "Mobile - Default" design, but resist any urge to re-create your entire site in mobile format.
  3. Use the large menu block beneath the main content area to easily link between your mobile pages.

Set your mobile home page

  1. Go to Site Settings and click on the Sitewide Settings tab.
  2. In the Mobile Home Page field, browse to the page you want your mobile users to land on.
  3. Don't forget to Save your Settings.

Navigate to your site on a mobile device and check out your new page!

Note: In a mobile device web-browser, cookies must be turned on or "accepted" in order to navigate away from the "Mobile-Home" page design to the full-site.

The Blank page design

The "Utility - Blank" page design is included for situations where you want just a blank page with no design elements, or alternately, if you want to create your own unique mobile page. If you choose to use this blank page design for your mobile pages, keep in mind the size of screen that will be used to view it.

  • Text and links should be much larger than usual
  • Images should not be as large as on a normal page. Typical/older iPhone screens (< iPhone 4) are 320 x 480 pixels.
  •  Your mobile page should include a link to your standard home page.
  • You can create a few mobile pages and link between them.
Back to Top