Post on 26-May-2015
description
3. Almost all the ambitious/impressive HTML5 samples are built for only one browser. 4. Do we have to choose one or the other? Introduction 5. Desktop Websites on Mobile Devices
6. Even on mobile devices that run Flash consideration must be made to usability. 7. Mobile Sites on Desktops
8. Users expect a more rich and compelling experience 9. Possible Solutions
10. Ignore lesser devices and focus only on the best possible experience 11. Make multiple versions of your site, at least one standard and one optimized for mobile 12. Or... 13. Progressive Enhancement
14. Focuses on handling different browsers with varying capabilities. 15. Was a departure from Graceful Degradation, which was the leading philosophy on the issue. 16. Has caught on in theory but in practice older or less capable browsers are an afterthought, with one notable exception. 17. Progressive Enhancement vs. Graceful Degradation
18. Add styling as supported 19. Add features as supported 20. Utilizes available technology
21. Fix broken styling 22. Fix broken features 23. Built expectingcertain technology. 24. Some Real Life Examples
25. Swfobject can be a progressive enhancement but is usually not 26. Demo 1: Simple HTML and Javascript Enhancement
27. CSS that styles the HTML without requiring special HTML or Javascript. 28. Javascript that improves the experience and visual presentation if available. 29. Design and Development Together
30. Prioritize what is important (already doing this) 31. Accept that the site may not look exactly the same in all browsers (important!) 32. Designers are already thinking about content in a way that can be translated to basic browsers 33. Developers have to understand the experience and make smart recommendations 34. Demo 2: Adding Flash Enhancements
35. Blends together video and interactivity 36. Multiple animation techniques (frame-based, tweenlite, tweenmax, gtween, etc...) 37. Powerful 3D framework in Papervision 38. Existing HTML content can act as content XML 39. Challenges
40. May not achieve as specialized an experience as having a custom site for each category of devices/browsers. 41. You may end up writing functionality that you hope to never use. 42. Benefits
43. Allows the site to be experienced with all browsers/devices without building multiple versions. 44. Too many browsers/devices to target. 45. In many ways the experience will be more consistent across browsers/devices since it's essentially the same site. 46. Summary
47. Rather than going lowest common denominator or all or nothing, Progressive Enhancements allows your work to grow with the browser/device capabilities. 48. Q&A 49. The End
50. Credits: http://accessites.org/site/2007/02/graceful-degradation-progressive-enhancement/2/ 51. http://blog.deconcept.com/2006/02/27/using-alternate-content-flash/