On a previous post we mentioned that when we revamped the mobile version of our website we decided that its navigation and content should be as simple as possible, even minimalist. But how do you go about doing that using the Your Web Department content manager system (CMS)? Here are a few useful tips for you.
Hiding/showing pages
Unless your website is really small, you should hide most of your pages from the mobile version. People are not likely to spend time navigating through lots of pages (let alone sub-pages) on their tiny phone screens anyway.
You can turn “off” pages on the mobile very easily in YWD. All you need to do is click to edit the page properties and select “Computers only” in the “Devices” list. Conversely, you can create pages specifically for mobile.
Now, the Home page is a bit of a special situation, since you need it for all devices. But you can customize the content blocks within the Home page – just like you can do for any page. See below.
Hiding/showing content blocks
Even if a page is to be displayed on both computers and mobile, it may have some content that’s not suitable for both. For instance, you may have a big image gallery or content sliders that should only be seen on computers.
Simple: you just edit the content block and in the “Display options” select “Computers/tablets only”. You can also select “Mobile only”, of course (as well as other combinations).
This allows you to have to have an image gallery with a more computer-friendly display style – e.g. a lightbox launched by thumbnails – and the same gallery, on a separate content block, using a gesture-based, full-screen style that works best on mobile.
The same technique can also be used for forms – with a simpler version of the same form being used for mobile – and other types of content.
Hiding/showing layout elements globally
YWD Designer can also play an important role in customizing your mobile content. In Mobile devices / Smartphones / Banner & content you can hide/show which elements of the page layout should be displayed on mobile. Here’s a list of the options currently available:
| Option |
Notes |
Left column content
|
Because the mobile screen is so narrow, there is no room for a left column. YWD Designer lets you choose whether you'd like to simply hide the left column content or display it below the regular (main column) content. |
Right column content
|
Because the mobile screen is so narrow, there is no room for a right column. YWD Designer™ lets you choose whether you'd like to simply hide the right column content or display it below the regular (main column) content. |
| Content area images |
You may choose to simply hide all the images in the content area of all pages. You may use this option if you'd like to have a "text-only" version of your website just for mobiles. |
| Background images |
Typically you don't want the background images – for the hole page, a watermark for the content area, the header or footer areas – to be displayed on the mobile. This option will hide them (the default) or you can choose to show them if you want. |
| Embedded content |
Who needs Flash these days? Certainly not people's iPhones. If the computer version of your website must include some Flash movie, you can still hide it from mobile devices. |
Floating tabs,
left side |
Floating tabs may take up too much real estate on mobiles. You may hide or show them using this option. |
Floating tabs,
right side
|
Floating tabs may take up too much real estate on mobiles. You may hide or show them using this option. |
| “Home” button |
By default, the mobile will always display a button on the main navigation, linked to the website's Home page (even if you hide the Home page from the website's navigation in the page properties). But you can hide the button using this option. |
| Breadcrumbs |
Even if your website uses breadcrumbs as an auxiliar navigation system, they're probably not necessary on mobile. The default is to hide them. |
| Social media buttons |
The social networks that you select will be displayed on the mobile by default, but you can hide them if you want. |
| “Full version” button |
By default, YWD displays a “Full version” button at the bottom of the mobile version of the website, allowing people to toggle between the 2 versions. You can hide that button if you want, especially if your website has been designed exclusively for mobile devices. |
Need someone to do it all for you?
The folks at Your Web Department can build your mobile website entirely for you. With packages starting at just $300 it's a great deal for small businesses who understand the benefits of attracting a growing mobile audience. You can get more info on this page of the YWD website.
Request our Mobile setup package for $500.00 package
Not a YWD client? Try LiveBuild™ - We design & build your website for free and ready in 1hour
yourwebdepartment.com/LiveBuild
Related posts:
It's easy to create a mobile version of your blog
On revamping our mobile website
How to submit a Google XML Sitemap file for your website and get more traffic
Don't have a Your Web Department website? Get yours at www.yourwebdepartment.com
|