Book Image

HTML5 Multimedia Development Cookbook

Book Image

HTML5 Multimedia Development Cookbook

Overview of this book

HTML5 is the most significant new advancement the web has seen in many years. HTML5 adds many new features including the video, audio, and canvas elements, as well as the integration of SVG. This cookbook is packed full of recipes that will help you harness HTML5’s next generation multimedia features. HTML5 is the future.Whether you’re a seasoned pro or a total newbie, this book gives you the recipes that will serve as your practical guide to creating semantically rich websites and apps using HTML5. Get ready to perform a quantum leap harnessing HTML5 to create powerful, real world applications. Many of the new key features of HTML5 are covered, with self-contained practical recipes for each topic. Forget hello world. These are practical recipes you can utilize straight away to create immersive, interactive multimedia applications. Create a stylish promo page in HTML5. Use SVG to replace text dynamically. Use CSS3 to control background size and appearance. Use the Canvas to process images dynamically. Apply custom playback controls to your video.
Table of Contents (16 chapters)
HTML5 Multimedia Development Cookbook
Credits
Foreword
About the Authors
About the Reviewers
www.PacktPub.com
Preface

Introduction


"Who dares, wins." - unknown

Don't listen to the naysayers: Many aspects of HTML5 (no space) are here, ready for us to use. Despite what some people might think, there's no far-flung date at which time you can start using this collection of new technologies. The truth is, the next generation of web markup isn't a distant dream on the horizon — it is here now, ready to explore and use.

No website can exist without at least some simple HyperText Markup Language. This open technology is that important. If you've been using HTML to create and publish websites and applications for years, you might feel as though you've mastered the language by now. You already know the benefits of semantic markup, separation of content, presentation and behavior, and are well versed in accessibility concerns. Things might be feeling a bit dull and boring. You're ready for a new challenge.

Or perhaps you're a young developer building your first website and need to know the ins and outs of using the latest and greatest technologies and have an eye to the future of web development.

Either way, your path is clear: Building on your existing HTML and related technology coding abilities, this book will push your skills to the next level and quickly have you creating amazing things HTML was never capable of before.

If you're feeling complacent, read on. The truth is there has never been a more exciting time to be a web developer. Richer interfaces, the ubiquity of the Internet, and the rise of mobile devices are just the kind of new challenges for which you're looking.

Fortunately, HTML5, a liberal helping of Cascading Style Sheets, and a dash of JavaScript, rise to meet those new challenges. The latest innovations in web development make this a new golden age for online publishers. After what was a lull for many of us, we are now quickly discovering that developing for the web is fun again! After all, HTML5 represents evolution — not revolution.

Over the course of several successful high-profile client projects, I've used a custom JavaScript methodology to deploy aspects of HTML5 and still support older browsers, including Microsoft Internet Explorer 6.

In the recipes contained within, you'll learn this powerful methodology and how to use many of the still developing HTML5 standards and features in a real-world, live production environment.

When we develop with HTML5, we take the basic principle of semantic naming (naming things what they are instead of naming things how they appear) to a whole new level. This is the key factor that makes HTML5 different from all of its predecessors. Throughout the course of this book you will find yourself rethinking and optimizing many of your code-naming conventions.

Though the HTML5 proposed recommendation from the Web Hypertext Application Technology Working Group (WHATWG) is not slated for full implementation until 2022, thanks to forward-thinking browser manufacturers, there is no reason you cannot start using it now and reap the benefits of better semantic naming, enhanced accessibility, and much, much more.

So let's get cooking!

In this chapter, we will show you how to set up your development environment including using the appropriate DOCTYPE and which browsers to utilize, and how to use specific new tags including:

  • <header> - a group of introductory or navigational aids

  • <nav> - for navigation lists

  • <section> - to differentiate between areas of a page

  • <aside> - to align specific elements

  • <footer> - the bottommost information on a page or in a section

Finally, we will put all those elements together to create a stylish professional promo page all with HTML5.