Libby A. - Responsive Media in HTML5: Learn effective administration of responsive media within your website or CMS system using practical techniques

Alex Libby has a background in IT support. He has been involved in supporting end users for the last 18 years in a variety of different environments and currently works as a technical analyst, supporting a medium-sized SharePoint estate for an international parts distributor based in the UK. Although he gets to play with different technologies in his day job, his first true love has always been the open source movement, in particular, experimenting with CSS/CSS3 and HTML5. So far, he has written several books for Packt Publishing, including one on HTML5 video and another on the jQuery UI. This is his eighth book.

I'd like to thank family and friends for their help and encouragement and the reviewers for providing lots of constructive commentswithout them, I am sure I wouldn't have been able to produce this book!

Tristan Denyer is a UX designer for web and mobile, including web apps and portals, e-commerce, online video players and widgets, games (online, iPhone, and board), marketing sites, and more. He's also a UI developer and a WordPress theme developer. He is currently leading the UX/UI for the product team at a start-up in San Francisco. He recently wrote A Practical Handbook for WordPress Themes , CreateSpace Independent Publishing Platform to help owners and operators of self-hosted WordPress websites get the most out of their themes.

His passions include prototyping, web security, writing, carpentry, burritos, and maintaining his popular jQuery plugin on GitHub that helps duplicate a section of a form. He can be found on Twitter at @tristandenyer and on GitHub at https://github.com/tristandenyer, and he blogs at http://tristandenyer.com/.

Marija Zaric is a web designer living in Belgrade with a focus on individual and commercial clients who demand websites that are clear, modern, creative, simple, and responsive. She works with clients from the USA and all over the world, helping them present their services in a unique yet professional way.

Years ago, she started experimenting with Dreamweaver, CSS, and XHTML. She became very fond of coding and retro design. This influenced her to create her first website and achieve subsequent successes. Today, she is a relentless learner. What she loves the most about web design is the constant changes in the field, especially its evolution in the last 3 years when she got inspired by its simplicity, great images, typography, and the possibility to optimize a single website for various devices.

She redesigned and incorporated these styles into her own website and called it Creative Simplicity. With the development of HTML5, she made free templates that are used all over the world in order to advertise her work and share the knowledge. She predicts that in 2015, flat and modern web design will be here to stay, supported by nice photography, responsive design, and strong typography. Her projects can be found at http://www.marijazaric.com/ and http://creativesimplicitywebstudio.com/.

www.PacktPub.com

Support files, eBooks, discount offers, and more

For support files and downloads related to your book, please visit www.PacktPub.com.

Did you know that Packt offers eBook versions of every book published, with PDF and ePub files available? You can upgrade to the eBook version at > for more details.

At www.PacktPub.com, you can also read a collection of free technical articles, sign up for a range of free newsletters and receive exclusive discounts and offers on Packt books and eBooks.

https://www2.packtpub.com/books/subscription/packtlib

Do you need instant solutions to your IT questions? PacktLib is Packt's online digital book library. Here, you can search, access, and read Packt's entire library of books.

Why subscribe?

• Fully searchable across every book published by Packt
• Copy and paste, print, and bookmark content
• On demand and accessible via a web browser

Free access for Packt account holders

If you have an account with Packt at www.PacktPub.com, you can use this to access PacktLib today and view 9 entirely free books. Simply use your login credentials for immediate access.

Preface

Web design is responsive design. Responsive web design is web design done right.

-- Andy Clarke, Stuff and Nonsense

Take a straw poll of one hundred users and it is likely you will find that a good proportion have viewed the Internet from a mobile device at some point in the past. Use of these devices to access the Internet has exploded massively over the last few years. This has highlighted the need to design sites that work well on a variety of different devices and platforms.

First coined as a term by Ethan Marcotte back in 2010, responsive web design is the art of designing such sites. A key element of responsive web design is the addition of images and videos. Throughout this book, we're going to take a look at the tips and tricks you need to get ahead in adding responsive media to your sites. We'll see how the lack of a common W3C standard means the field is wide open for different solutions and that catering for different platforms means understanding their limits and making suitable allowances for each type of device.

We'll work through a number of practical examples, with both images and videos, and see the importance of testing both to ensure your content displays as expected on any device. We'll then make use of some of the tips and tricks in several real-world examples, using popular frameworks such as WordPress or Less CSSyou'll see that adding responsive media isn't actually that complicated!