Taza Chocolate Rebuilds with Taza Dollar
A/V on the Web – What it Means for Content Producers
Hey, it's the new Silverscape website!
We gave some tips for designing websites that are smartphone friendly in a recent blog post. While smartphone browsers have gained in features and functionality, there are still a few things to consider when developing sites with mobile devices in mind.
Simplified mobile versions of websites are no longer necessary , nor are the antiquated technologies (like WAP) used to build them. The sites we build are accessible on mobile devices and full size PCs alike.
- Optimize, optimize, optimize
Data transfer speeds over cellular signals have increased dramatically but they are still not as fast as the broadband connections you have at home or at work. Compress images, make use of sprites, and break off your CSS and Javascript into separate files, only pulling them into pages where they will be used. Javascript will run considerably slower compared to desktop browsers because mobile devices have slower CPUs and less RAM to utilize. If you are using a Javascript framework like JQuery, know which operations are more intensive than others and try to simplify it. It certainly won’t hurt performance on the desktop.
- Use Web Standards and stick to them
The more closely you conform to web standards and properly marked up XHTML and CSS, the better your chances are that your site will look the same across ALL browsers, including mobile ones. Use the W3’s validator to ensure your code meets standards.
- Know natural limitations
Touchscreen based phones make up a large majority of the mobile browser market. Without a cursor, or a cursor used in conjunction with a keyboard, we are limited in some interactivity. You cannot control/command click multiple items in dropdowns for selections, you cannot hover over elements, and you can not drag elements around in applications. Research alternative methods of interaction development that accommodate touchscreen devices.
- Brainstorm alternate techniques for where you might use Flash.
The current mobile browser market has very little Flash support. Despite Flash being the most reliable method of delivering video online for desktop browsers, embedding video as mpegs or QuickTime will give mobile users a supported alternative. Use Javascript for interactive navigation and menus. Many of the conventional uses of Flash for animation and interactivity can be accomplished with Javascript and CSS.
- Know specific device features and make use of them.
Make use of features specific to the browser for enhancement, but be sure they don’t conflict with each other. iPhones by default will zoom or scale a site to fit within its viewport. You can better fill the screen at load-time by using a meta viewport tag and define the width of the site to automatically scale it to the screen.
http://furbo.org/ makes use of this feature.
Have any other tips or thoughts? Leave us a note on Twitter
