Category Archives: mobile web design

Copy Your Site Again, and Again, and Again and…

You can now copy any site, using an existing mobile site inside your account.  This feature has been in beta, but is now ready for all your site duplication needs, and is perfect for …

…creating mobile sites that have a similar look and feel
…launching identical ad landing pages for campaign testing
…easily building out multiple full mobile sites from an original “template”  you have created
…rapidly deploying mobile sites, for example micro sites attached to a directory listing

What Copies Over (almost everything):

  • Site Logo (unless you override this by uploading a new logo on this page)
  • All CSS
  • Forms
  • Elements, exactly as they are laid out on your mobile site
  • RSS feed settings (GUI and post settings)
  • MoFuse Social Sharing settings (Twitter, FaceBook, Email a Friend)
  • Site Settings features
    • Custom text on fixed link navigation
    • Search setting
    • Copyright
  • Google features including Google Analytics tags, WebMaster verification, & Google Mobile Checkout ID

What Doesn’t Copy Over: Ad tags, because you probably want this to be unique for each site.

How to Use the Site Duplication Feature:

  1. When launching a new site, fill in the blanks as usual.
  2. At the bottom of this page, just before clicking “Launch” , choose an existing mobile website in your account from the “Duplicate a Site” drop down menu.
  3. Simply replace or change anything that has been copied over as desired, such as Copyright, Elements, GA tags, etc.

* A quick update here! We’ve heard you loud and clear on Google’s duplicate content rules. We couldn’t agree more that you should publish unique content on all of your mobile websites.

The key idea behind the copy-a-site feature is that you can easily duplicate the format of one mobile site and carry it over to a brand new mobile site. We allow you to duplicate your content as well, but it’s crucial to ensure that the content is, overall, unique from site to site so that your mobile sites get indexed appropriately.

Adding Videos is Easy!

It’s easy to add videos to your mobile site.

All you need to do is grab the URL for the video, and insert the video URL to your MoFuse site in the appropriate field of an Image element or a content page or block.

Make sure you grab the correct link for your video:  On YouTube, for example, click “Share” to grab the URL of the video you want to add to your mobile site.  (Don’t use the URL for entire YouTube web page.)

You can even add a YouTube channel to your mobile site in the same way. To see an example of this in action, visit the mobile site of Martha’s Vineyard Radio: http://mvyradio.prohost.mobi

The great thing about using YouTube is not just that it is free, but YouTube also will detect mobile visitors accessing your video and display the mobile version for their device.

Jump! It's a New Site Feature

Jump! It’s a New Site Feature

Do you have many pages on your site? If so, you might want to add a Jump Menu.

By adding this new feature to your site, your mobile site visitors can easily navigate, or jump, to pages of the mobile site, using a drop down Jump Menu.

This is a great option if you have a lot of pages on the site, or specific content like lead gen forms that you want your users to easily get to, without having to scroll through layers of text and links.

Adding a Jump Menu to your site is easy! Just like our Site Layout tool, you can drag-and-drop elements that you want to place in the Jump Menu from the left to the right column. Users also have the option of changing the color scheme and adding a search box.

This feature is a natural fit for anyone with a deep mobile site. Try and tell us what you think!


Make Your Image Clickable

There are now two easy ways to make an image “clickable” on your mobile site:

  1. If your image is in a static content page or block element, simply select the image in the editor and then add a url to it using the hyperlink icon on the editor toolbar.
  2. If you are uploading an image from your desktop (“Image” element), there is now a field below the image upload where you can enter the url for that image.

We’ve already seen a variety of good uses for clickable images. Here are a few examples:

  • making a sponsor’s logo click to their landing page or site
  • a product image that clicks to purchase that item on Amazon mobile
  • clicking on the give-away image to navigate directly to contest or event registration pages (form builder)
  • using images to navigate within pages of the same mobile site, or to other mobile sites

Getting the Most Out of Forms

When we converted to Forms 2.0 this weekend, we noticed a few best practices we thought worth sharing.

The best way to generate responses to your forms has to do with placement of the form. Sites that placed a link to their form and/or the actual form fields “above the fold” generated significantly higher response rates than those that required scrolling.

A recurring design issue we saw was that many mobile sites seemed to follow their website too closely, by including text on the forms page, above the actual data capture fields. Although this works fine on the website where you can view both text and data fields on the same screen (no scrolling) this doesn’t work well on the small screen where even just a few sentences requires visitors to scroll one or more times to get to the actual data capture fields.

If this sounds like your site, we recommend moving the sign-up right to the top of whatever page it appears, and placing descriptive copy below the data capture fields.

ferrari

Another simple solution is to place just a link above the form fields (e.g. “Rules” or “Contest Details”) that sends users to a separate mobile page in case they do want to read more before entering information.  (If you do this, don’t forget to link back to your form from this page!)

Our final recommendation is to nest the form under a Page Title element that makes it easy for visitors to jump directly to the form.

Wondering how other mobile sites are using Forms? Here are some of the different ways we saw forms being used across our network:

  • Case of the Day: Medical case studies, followed by a multiple choice question. Visitors can visit the mobile site the next day to read the answer to the medical case.
  • Sponsor surveys: sponsors pick 3-5 questions they want from the publisher’s mobile readers
  • Ticket requests for events
  • Event, conference, & contest registration requests
  • Email & newsletter sign-ups