When you design for mobile devices you have several questions you have to think about.
- Which devices am I designing for?
(Smart Phones, Latest Smart Phones, 4G phones, Feature Phones, etc)
- What speeds will my users access the site at?
- How familiar are the people to using the device to surf on?
- Am I looking for mobile phones, tablets, or both?
These are just some of the design considerations you have to consider. Not to mention, retina displays, and other considerations.
Generally speaking, you want to keep the site very simple, with only a few links per page if possible.
Things you generally can’t do:
- complex animations
- hover effects
- tiny controls (radio, check box, etc)
- Expect wide/large screens
So what can you do?
Think about what the end user really needs to do. Cut, cut, cut your main site, until you are using the 95% of what everyone does on your site, and nothing more.
Ensure that you have a link to a map, so people can easily find you based upon their location (if you are a location-based entity).
Make contact forms easy to use. Don’t require complex date / time pickers, or other controls if not necessary.
Make extra padding on form controls, so they are easy to select.
Fill out defaults in form fields if possible, so users don’t have to change things if they are filling out a standard form (this is a good practice for desktop websites as well).
Page your design so long items are broken down over several pages so they load faster.
Make sure you avoid large complex images, especially with background images.
Use CSS3 features for things like gradients and rounded corners when possible, to avoid using images.