Push your HTML and CSS skills to the limit and build professional grade, responsive websites
About This Book
- Take your RWD skills to the next level with HTML5 and CSS3 best practices that will give you a solid foundation to build out from
- Harness the power of the CSS pre-processor Sass to speed up the creation of your CSS
- Each chapter dives deep in to different aspects of RWD and is designed to get you up to speed with the latest developments in professional web design
Who This Book Is For
If you're already building responsive designs and are looking to level up your skills, then Mastering Responsive Web Design is the book for you. Regardless of whether you're a web designer, or web developer, you'll find something here to help you in your responsive design journey.
What You Will Learn
- Install and use Sass with SCSS syntax to create your CSS
- Use HTML5 tags the right way, for the right type of content
- Enhance the experience of users with assistive technology with ARIA roles
- Design with a desktop-first approach, but implement with mobile-first methodology
- Master your layouts by creating your own scalable CSS grid, or using Flexbox for total layout ‘flexibility'
- Retrofit your old web sites with your new responsive design skills
- Deal with legacy browsers, and learn how to keep your designs consistent
- Implement widely used responsive patterns, such as the drawer navigation , the off-canvas and the flexbox-based navigation patterns
- Find the best way to serve the right type of image and how to make videos responsive
- Build custom responsive emails to ensure the message gets across regardless of the device
Building powerful and accessible websites and apps using HTML5 and CSS3 is a must if we want to create memorable experiences for our users. In the ever-changing world of web design and development, being proficient in responsive web design is no longer an option: it is mandatory.
Each chapter will take you one step closer to becoming an expert in RWD. Right from the start your skills will be pushed as we introduce you to the power of Sass, the CSS preprocessor, to increase the speed of writing repetitive CSS tasks. We'll then use simple but meaningful HTML examples, and add ARIA roles to increase accessibility. We'll also cover when desktop-first or mobile-first approaches are ideal, and strategies to implement a mobile-first approach in your HTML builds.
After this we will learn how to use an easily scalable CSS grid or, if you prefer, how to use Flexbox instead. We also cover how to implement images and video in both responsive and responsible ways. Finally, we build a solid and elegant typographic scale, and make sure your messages and communications display correctly with responsive emails.
Style and approach
Designing and developing for the web should be fun, and that's the tone used in the book. This book is written in a step-by-step format with clean-cut examples. You will also find tips and notes all over the book to help clarify those small and simple details most books and tutorials assume you already know.
- Amazon Sales Rank: #1079537 in Books
- Published on: 2015-08-24
- Released on: 2015-08-24
- Original language:
- Number of items: 1
- Dimensions: 9.25" h x
.76" w x
- Binding: Paperback
- 334 pages
About the Author
Ricardo Zea, originally from Medellin, Colombia, is a passionate and seasoned full-stack designer now located in Dayton, OH (USA). He is always looking for ways to level up his skills and of those around him. Constantly wondering how things are made on the Web, how they work, and why they work the way they do have made Ricardo a very technical designer, allowing him to explain to others the intricacies of design and the technicalities of the Web in ways that are very easy to understand and assimilate. With a master's degree in publicity and advertising and having a deep passion for understanding human behavior complemented with a fierce competitive PC gaming hunger have allowed Ricardo to "switch" from the creative side of the brain to the rational side very easily. This has allowed him to visualize and create technically sound web and mobile designs that are responsive, perform well, and convey the proper message through design. Ricardo is the organizer of the CodePen Dayton meetup group. He's a member of the Dayton Web Developers and UX Dayton meetup groups. He's also one of the first members of SitePoint's Ambassadors program. He is the author of the monthly Web Design & Development, Level Up! Newsletter. He was also a technical reviewer for the books Sass and Compass, Designers Cookbook and Sass Essentials by Packt Publishing. He is a real-time, live one-on-one expert advisor on https://wizpert.com/. For several years, he was also a Flash and CorelDRAW professor at different universities in his home country, Colombia. Ricardo has 15 years of experience in web design and 20 years of experience in visual and graphic design. You can contact Ricardo through the following links: Personal website: https://ricardozea.design Twitter: @ricardozea (https://twitter.com/ricardozea) Wizpert: https://wizpert.com/ricardozea
Most helpful customer reviews
1 of 1 people found the following review helpful.
Great book, the title should say "mastering responsive design ...
By yehuda hassine
Great book, the title should say "mastering responsive design with sass"
5 of 5 people found the following review helpful.
Empower your web design to a new level
This book takes responsive web design to a new level, a true professional level far away from myths and speculations. It is a complete walk through all steps you need in order to achieve true responsive design using best techniques available today. From using SASS to develop powerful CSS styles to adopting grid or flex frameworks to lay out all elements and get a pretty looking design no matter which device is used to watch the site. There are plenty of examples and code along the book that you can copy paste and test or use in your own work. The chapter I found most useful is the one about images and video, that gives you smart tricks to deal with heavy media files and reduce their size without compromising the overall quality. Some basic web developing knowledge is advised to get the most out of this book.
3 of 3 people found the following review helpful.
See all 6 customer reviews...
A great resource for anyone making websites that will be used ...
By Allen May
A great resource for anyone making websites that will be used on mobile devices.
It is obvious that Ricardo has put a lot of time and research into this book. Each chapter explores concepts in detail, provides coded examples and links to even more detail. Ricardo writes in a very "conversational" way. You feel like he's talking you through each concept.
In chapter 1 he explores concepts that go into a responsive web design.
In chapter 2 he dives into new tools in HTML5 that help make a mobile friendly design possible.
In chapter 3 he provides a detail comparison of mobile-first to desktop-first concepts.
In chapter 4 he takes a deep look at grids, frameworks, UI kits and flexbox.
In chapter 5 he talks about designing websites for small screens
In chapter 6 he does a fantastic job detailing a process to get the best out of images, using the