Performance Optimisation For Web & Mobile

Performance Optimisation for Web & Mobile Some introductory tips to help you optimise your digital landscape.

What is Performance? Performance = Responsiveness vs Benchmarks We are getting used to the web and mobile as tools for our day-to-day tasks! 500 ms slower = 20% drop in traffic (Google) 400 ms slower = 5-9% drop in (full-page) traffic (Yahoo) 100 ms slower = 1% drop in sales (Amazon)

IT Role as Defined by Business Users

How to make your sites faster today 80-90% of the allocation is on the front-end, focus on the front-end, it's easier! IE8 CPU Usage - Top 100 sites: 84% Layout, rendering, formatting, etc. 16% JavaScript & DOM IE8 CPU Usage - Top 100 AJAX sites: 67% Layout, rendering, formatting, etc. 33% JavaScript & DOM

Most developers are building Web Apps

Complexity and User Expectations

Productivity Equals Performance The key productivity in interactive applications is response time: .1 second is instantaneous 1 second is when a response time is perceived 10 seconds is when users lose focus on the interaction Some basic rules Simple and frequent tasks: 1 second or less Common tasks: 2 to 4 seconds Complex tasks: 8 to12 seconds

"We get much more traffic than them." Industry and Competitor Analysis: What are the competitors doing and what are you not doing?

Industry and Competitor Analysis Example So Bob wants to order a new telephone line... Telkom (Web & Mobile) vs. Neotel (Web) vs. British Telecom (Web)

Optimised Websites and Mobisites = More Customers = Better Profits!

"But it works perfectly on my computer." Technology considerations : Who are your users and what technology do they use (average browser sizes, mobile screen sizes, most popular, etc).

Technology considerations The Problem Interoperability, portability, device diversity and size leads to configuration, deployment and production issues that impact performance. Look at using Web Standards!

Technology considerations Web and the 80/20 rule IE is still the most widely used browser, but is on the decline Windows: IE ±70% and FF ±28% Mobile Mobile page size <25k (uncompressed) Design for 2-3 user agents max!

"We already have a website." Optimising Delivery: If your core offering is services - check that your serving mechanisms are appropriate. If it is content, ensure that your formatting is appropriate for each device based on the learnings from the technology analysis.

Optimising Delivery "Designer have to learn to stop trying to control the display of their pages. They have to accept that forces beyond their control will cause their designs to display differently, sometimes radically, in certain situations." Randal Rust Optimise tasks for mobile use, the mobile web is here - most developers are not ready!

Optimising Delivery Size does matter Text equivalents necessary Resizing (server level) Accessibility: Resizing (page level: fonts) Don't trust fonts! Tables (mobile) Target audience (device support) Minimise text entry (mobile) Clickable is always better than input (mobile) Meet expectations Ensure Readability Test, test, test and test again..

"You just have to click on the little box in the corner." Thinking about Navigation .

Navigation "..it's about creating a complete system, It's about looking for the whole." Clement Mok (on Navigation in building architecture) Navigation is wayfinding. Never treat it as separate to design!

Navigation Conversion Goals Do you have proper goals setup and can users find their way around the site (from start to finish). Does your navigation guide the user in reaching those goals? Information Architecture Steps to optimise site navigation Focus groups with all role players and card-sorting The ergonomics of 2.0 Cognitive ergonomics / Macro ergonomics / Virtual ergonomics

Navigation Mobile: How deep do you go? Ensure clarity in linking Don't link to something you can't get Make access easy Minimise navigation bars on top Main content - first! Browsing time is a factor Easier to scroll than click Everything has to look the same: Consistency in terminology Consistency in visual design Make it familer The key is memorability! Manage your errors!

"We are already on Facebook." Social Optimization : Can your users share content between each other. If not, how can they do this, and is it possible to retro-fit content.

Social Optimisation "The power of social networks-increase business efficiency, energize markets, improve information sharing, streamline business processes and enable collaborative efforts" IBM Social Bookmarking (Sharing) Delcious Digg Muti (African) Amatomu (South African) Afrigator (African) Facebook etc.

Social Optimisation Facebook Connect Trusted authentication Real Identity Friend Linking Dynamic Privacy Social Distribution (Sharing) Google Friend Connect & Twitter & OpenID, etc. Trusted authentication

"Who is Bob and what is he doing on my site?" User Profiling : do you have deep profiles setup and can you mine data from the users? How easy is it for users to setup advanced profiling?

User Profiling Personas "Personas are fictitious characters that are created to represent the different user types within a targeted demographic that might use a site or ..." http://en.wikipedia.org/wiki/Personas Sample Personas: Sally - 14, female teenager. Talks with her friends through FB chat, uploads photos and loves the quiz and fun applications. Generation Y. Advertising target: Fashion Bob - 22, male. University Grad, fluent in English, Afrikaans and Xhosa, looking to network and new job opportunity. Tyring to balance fun personal information with professional information. Tech savvy. Generation Y. Advertising target: Holidays, Further Education, Recruitment David - 50, male professional, interested in business networking, prospective employer researches potential employees. Baby Boomer. Advertising target: Cars, Flights

User Profiling Facebook Profile Targeting LSM - Demographic information Superficial - yet most advanced compared to other platforms Age Country Language Gender Additional Interests Contact Information Work Information The Marketing Funnel

Test, test, test and test again..

Thank you! Any Questions? FormFunction Digital Consultants (Pty) Ltd +27 21 462 0257 www.twitter.com/formfunction www.formfunction.co.za Joey da Silva [email_address] Skype: dasijoe twitter.com/dasijoe facebook.com/joeydasilva

Performance Optimisation For Web & Mobile

More Related Content

What's hot

Similar to Performance Optimisation For Web & Mobile

Recently uploaded

Performance Optimisation For Web & Mobile

Editor's Notes