Always be aware what will display first on your page as device sizes shrink. Looking at A in the diagram above, the slimmer left hand content which usually holds items such as images, latest news, adverts etc. will show up first on mobile devices, you need to ensure that your mobile phone visitors aren't endless scrolling to get to the main content - they will lose interest in what they were looking for. This is why B is often a better layout for responsive websites as it ensures the main content is displayed first on all sizes of device, the danger here is if all your images, embedded content and additional information is in the right hand slimmer column the page can appear very text heavy. C the full-width page is great if you are comfortable using the text editor in your CMS to work out the layout yourself although even then this can be fidgety and time consuming. Each of these layouts have their benefits and downfalls but the important thing is to consider your layout when deciding on your content for new pages.
Ensure the images you want to use are suitable for all device sizes. The last thing you want on your website is squashed or stretched images, when your website was completed your website company should have let you know the sizes of all your main types of images - if they haven't ask them! Resizing images may seem a bit daunting if you aren't that comfortable using photo editing packages but there are some handy tutorials online and practice makes perfect.
As we suggested in tip one, people don't want to scroll through text heavy content when they are on mobile devices, but at the same time you don't want the desktop page to look empty. Judging the amount and type of content can be tricky but if you ensure anything you are putting on your website is clear and relevant then you can't go far wrong - that's why previewing pages before you publish is essential imagine yourself as the reader... would you keep scrolling?
While an additional top menu item might fit on your desktop website, when you move down to tablet size it might jump down and additional line - this makes your website instantly look cluttered. Does your new page have to fit on the top line of the menu or could it be a subpage? If it does need to be on the top is there anything else you can move down to the second level?
Embedded content such as youtube and vimeo are great but you have to make sure they aren't breaking your page as the device size changes. If nothing has been put in place by your website company so ensure that embedded content always responds, then sizing the embedded content to around 320px should mean it doesn't break the page on a mobile. People can always hit the full screen to view a bigger version. Also ensure what you are embedding works on all devices for example Vimeo's hubnut looks great on desktop websites but as it is currently flash based so it won't work on apple devices.
If you would like to talk to us about organising some training or for some information on our website administration options please get in touch