Pro HTML5 and CSS3 Design Patterns
Copyright 2011 by Michael Bowers, Dionysios Synodinos, and Victor Sumner
All rights reserved. No part of this work may be reproduced or transmitted in any form or by any means, electronic or mechanical, including photocopying, recording, or by any information storage or retrieval system, without the prior written permission of the copyright owner and the publisher.
ISBN-13 (pbk): 978-1-4302-3780-8
ISBN-13 (electronic): 978-1-4302-3781-5
Trademarked names, logos, and images may appear in this book. Rather than use a trademark symbol with every occurrence of a trademarked name, logo, or image we use the names, logos, and images only in an editorial fashion and to the benefit of the trademark owner, with no intention of infringement of the trademark.
The use in this publication of trade names, trademarks, service marks, and similar terms, even if they are not identified as such, is not to be taken as an expression of opinion as to whether or not they are subject to proprietary rights.
President and Publisher: Paul Manning
Lead Editor: Ben Renow-Clarke
Technical Reviewer: Andrew Zack
Editorial Board: Steve Anglin, Mark Beckner, Ewan Buckingham, Gary Cornell, Morgan Ertel,
Jonathan Gennick, Jonathan Hassell, Robert Hutchinson, Michelle Lowman, James
Markham, Matthew Moodie, Jeff Olson, Jeffrey Pepper, Douglas Pundick, Ben Renow
Clarke, Dominic Shakeshaft, Gwenan Spearing, Matt Wade, Tom Welsh
Coordinating Editor: Jennifer L. Blackwell
Copy Editors: Mary Ann Fugate and Tiffany Taylor
Compositor: Apress Production (Christine Ricketts)
Indexer: BiM Proofreading & Indexing Services
Cover Designer: Anna Ishchenko
Distributed to the book trade worldwide by Springer Science+Business Media NY., 233 Spring Street, 6th Floor, New York, NY 10013. Phone 1-800-SPRINGER, fax (201) 348-4505, e-mail orders-ny@springer-sbm.com
, or visit www.springeronline.com
.
For information on translations, please e-mail rights@apress.com
, or visit www.apress.com
.
Apress and friends of ED books may be purchased in bulk for academic, corporate, or promotional use. eBook versions and licenses are also available for most titles. For more information, reference our Special Bulk SaleseBook Licensing web page at www.apress.com/bulk-sales
.
The information in this book is distributed on an as is basis, without warranty. Although every precaution has been taken in the preparation of this work, neither the author(s) nor Apress shall have any liability to any person or entity with respect to any loss or damage caused or alleged to be caused directly or indirectly by the information contained in this work.
Any source code or other supplementary materials referenced by the author in this text is available to readers at www.apress.com
. For detailed information about how to locate your book's source code, go to http://www.apress.com/source-code/
.
dedicate this book to my wonderful family.
To my loving mother, Aggeliki
To my beautiful wife, Elisa
To my precious daughter, Aggeliki
You make me feel like the luckiest person alive.
Dionysios Synodinos
This book is dedicated to my wife, Alicia, with love.
Victor Sumner
Contents at a Glance
Contents
About the Authors
Michael Bowers has been writing software professionally for over 22 years. He taught himself to program when he was 14 and hasn't stopped since.
He is currently a principal engineer and enterprise information architect. He has been a software developer, architect, and modeler for many projects, ranging from web sites to application frameworks to database systems. He has built web applications, integrated enterprise systems, automated factories with robotics, developed a language, interpreter, and compiler, and managed teams. His favorite languages include CSS, HTML, XML, C#, C++, Visual Basic, Java, JavaScript, SQL, and XQuery.
Michael is also an accomplished pianist, with a bachelor's degree in music composition, a master's degree in music theory, and an ABD PhD in music theory. In his spare time, he loves to improvise, arrange, and compose music.
Dionysios Synodinos is a senior web developer at NTUA and a freelance consultant, focusing on rich Internet applications, web application security, mobile web, and web services.
He's also an editor for InfoQ, where he focuses on HTML5, JavaScript, and the JVM platform.
Going back and forth between server-side programming and UI design for more than a decade, he has been involved in diverse software projects and contributed to different technical publications.
Victor Sumner is a senior software engineer at LookSmart, LTD. As a self-taught web applications developer, he has had many roles in the web application life cycle, from database administrator to web designer, and all aspects in between. He enjoys working on and solving problems that are outside his comfort zone.
When not at the office, Victor has a number of hobbies, including photography, horseback riding, and gaming. He lives in Ontario, Canada with his wife, Alicia.
About the Technical Reviewer
Andrew Zack is the CEO of ZTMC, Inc. (ztmc.com
), specializing in search engine optimization (SEO) and Internet marketing strategies. His project background includes almost 20 years of site development and project management experience and over 15 years as an SEO and Internet marketing expert.
He has also been very active in the publishing industry, having co-authored Flash 5 studio and served as a technical reviewer on over ten books and industry publications.
Having started working on the Internet close to its inception, Andrew continually focuses on the cutting edge and beyond, focusing on new platforms and technology to continually stay in the forefront of the industry.
Acknowledgments
I feel blessed having had friends, mentors, and colleagues like Panagiotis Astithas, Christos Stathis, Kostas Troulos, Fotis Stamatelopoulos, Floyd Marinescu, Ryan Slobojan, Werner Schuster, Panagiotis Christias, and Georgia Rouni.
Also I would like to thank the Apress team for all their great work and especially our coordinating editor, Jennifer L. Blackwell, and our editor, Ben Renow-Clarke, for making this a fun experience!
Dionysios Synodinos
Introduction
This is a solutions book for styling HTML5 with CSS3. It contains more than 350 design patterns you can put to use right away. Each design pattern is modular and customizable, and you can combine patterns to create an unlimited number of designs.
Each design pattern has been thoroughly tested and proven to work in all major web browsers including Chrome, Firefox, Internet Explorer, Opera, and Safari. All the content in this book is usable and practical. You won't waste time reading about things that don't work! With this book, you will no longer have to use hacks, tricks, endless testing, and constant tweaking in multiple browsers to get something to work.
Using a design pattern is as easy as copying and pasting it into your code and tweaking a few values. You will immediately see which values you can modify and how they affect the result so you can create the exact style and layout you wantwithout worrying whether it will work.
This is more than a cookbook. It systematically covers several usable features of CSS and combines these features with HTML to create reusable patterns. Each pattern has an intuitive name to make it easy to find, remember, and talk about. Accessibility and best practices are carefully engineered into each design pattern, example, and source code.