22
Responsive Web Design. Problems and Their Solutions. Aleksey Pashin, Art Director at QuartSoft Email: [email protected] Skype: alex.pashin ©2013. QuartSoft www.quartsoft.com

Responsive Web Design – Reaching out to Mobile Users

Embed Size (px)

DESCRIPTION

Information technologies never stop evolving. As a matter of fact, we are witnessing their extremely rapid development in our digital era. This explosive development of digital technologies has led to increased mobility of Internet users. According to experts, the number of smartphone users will soon surpass the number of those using desktop computers and laptops. This means that more people will browse products in the World Wide Web through mobile devices such as smartphones and tablets. For example, there was the 35% yearly increase in online purchases through mobile devices in the United States in 2012. But the main problem for today’s online businesses is that not all sites are properly optimized for relatively small and diverse screen sizes of mobile phones and tablets. Google's research has revealed that 75% of online buyers prefer using mobile friendly websites, and 61% of web shoppers go to competitors once on a site not properly adapted for mobile devices. In our upcoming webinar we’ll discuss how to solve the responsive web design issue in order to help entrepreneurs keep up with the latest technologies on their way to success. - See more at: http://quartsoft.com/webinars/20130429-responsive-web-design

Citation preview

Page 1: Responsive Web Design – Reaching out to Mobile Users

Responsive Web Design.

Problems and Their Solutions.

Aleksey Pashin,Art Director at QuartSoftEmail: [email protected]: alex.pashin

©2013. QuartSoftwww.quartsoft.com

Page 2: Responsive Web Design – Reaching out to Mobile Users

Rising Mobile Internet Usage

©2013. QuartSoft

Page 3: Responsive Web Design – Reaching out to Mobile Users

Devices and Screen Resolutions

©2013. QuartSoft

Page 4: Responsive Web Design – Reaching out to Mobile Users

Who Needs Responsive Design?

• Users?• Site owners?• App developers?

©2013. QuartSoft

Page 5: Responsive Web Design – Reaching out to Mobile Users

Responsive Web Design (Google)

©2013. QuartSoft

Page 6: Responsive Web Design – Reaching out to Mobile Users

Standalone Mobile Version of a Site(Jakob Nielsen)

©2013. QuartSoft

Page 7: Responsive Web Design – Reaching out to Mobile Users

RESS (Responsive Design + Server Side Components)

©2013. QuartSoft

Page 8: Responsive Web Design – Reaching out to Mobile Users

Responsive Design – the Solution

• Uniform code• Transparent development process • Same URL structure across platforms• Content accessible on all devices • Meeting needs of the ever-changing market

©2013. QuartSoft

Anything that’s fixed and unresponsive isn’t web design anymore, it’s something else. If you don’t embrace the inherent fluidity of the web, you’re not a web designer, you’re something else. Web design is responsive design. Responsive Web Design is web design, done right.

Andy Clarke

Page 9: Responsive Web Design – Reaching out to Mobile Users

It sounds rosy, doesn’t it?

©2013. QuartSoft

Page 10: Responsive Web Design – Reaching out to Mobile Users

But it's not so in reality

©2013. QuartSoft

Page 11: Responsive Web Design – Reaching out to Mobile Users

Common Problems

• Strategic• Technological• Aesthetic

©2013. QuartSoft

Page 12: Responsive Web Design – Reaching out to Mobile Users

Strategic Problems

• Necessity of responsive design • Responsive design vs. Mobile version of a site • Adapting current website • Time• Resources

©2013. QuartSoft

Page 13: Responsive Web Design – Reaching out to Mobile Users

Technological Problems

• Design process• Navigation• Image sizes• Third-party content• Device errors and bugs• IE

©2013. QuartSoft

Page 14: Responsive Web Design – Reaching out to Mobile Users

Aesthetic Problems

Mobile First ?(Luke Wroblewski)

©2013. QuartSoft

Page 15: Responsive Web Design – Reaching out to Mobile Users

©2013. QuartSoft

Page 16: Responsive Web Design – Reaching out to Mobile Users

©2013. QuartSoft

Page 17: Responsive Web Design – Reaching out to Mobile Users

©2013. QuartSoft

Page 18: Responsive Web Design – Reaching out to Mobile Users

©2013. QuartSoft

Page 19: Responsive Web Design – Reaching out to Mobile Users

©2013. QuartSoft

Page 20: Responsive Web Design – Reaching out to Mobile Users

Solutions and Conclusions

• Analyzing necessity• Allowing user to choose • Keeping abreast of innovations in the industry • Optimizing • Keeping content in mind• Progressive enhancement + RESS (Responsive

Design + Server Side Components) • Trend is nothing but a word

©2013. QuartSoft

Page 21: Responsive Web Design – Reaching out to Mobile Users

And What Is Design?

Design is not only layout– Typography– Colors– Graphics– Interactivity– Textures– Atmosphere– and more.

©2013. QuartSoft

Page 22: Responsive Web Design – Reaching out to Mobile Users

©2013. QuartSoft

Aleksey PashinArt Director at QuartSoft

Email: [email protected]: alex.pashinwww.quartsoft.com