Book Image

Mobile First Design with HTML5 and CSS3

By : Jason Gonzales
Book Image

Mobile First Design with HTML5 and CSS3

By: Jason Gonzales

Overview of this book

<p>The mobile first design philosophy aims to develop websites that will be lean and fast on small screens without sacrificing a tablet or desktop experience. Using HTML5, CSS3, and simple, standardized modern web tools you can make one site to rule them all.</p> <p>Mobile First Design with HTML5 and CSS3 will teach you the tools you need to make a modern, standards-based web page that displays beautifully on nearly any web browser—essential knowledge for anyone who makes websites!</p> <p>In this book, you will learn how to set up a project from scratch and quickly get up and running with a full portfolio website that will form the base for making almost any kind of web page. Learn to develop web pages that fit the web conventions we all have to conform to. You will learn how to make responsive image slideshows; image galleries with detail pages; and bold, eye-catching banners and forms. Best of all, you will learn how to make these things fast without compromising quality.</p> <p>This book will walk you through the process step by step with all the code required, as well as the thinking that goes behind planning a mobile first responsive website.</p>
Table of Contents (14 chapters)

Appendix B. Using CSS Preprocessors

If you have already read any part of the book, you already know that I am begging you to use a CSS preprocessor, such as Sass or LESS. I prefer Sass for several reasons, but I won't really go into the details too much. Instead, I prefer to focus on the similarities between the two, and I will leave it to you to decide which framework you prefer. I am not being coy or disingenuous; I honestly find such arguments exhausting, especially when they come down to individual contexts.

I will say for the nth time that I prefer Sass. For me, some of it is the syntax but the differences from LESS are fairly minor. For me, another part of it is that I work mainly with Ruby on Rails, and Rails supports Sass right out of the box. Furthermore, I find the syntax of SCSS (rather than the older Sass that came earlier) to be so similar to CSS, which I've been using for about 25 percent of my life, so I also prefer it because it's less of a cognitive shift from CSS, which I know so well.

I also find some of the syntax of LESS to be confusing. The two main examples are how they use the @ symbol for global variables, as opposed to the $ symbol that Sass uses, and how LESS uses the notation for a CSS class, .(period), to call a mixin, whereas Sass uses the more explicit @include. These are admittedly small quibbles.

But, there, those are my reasons. I hope you find them helpful in figuring out what works best for you.

Now, let's move on to understanding how all of these preprocessors help you work fast and efficiently. Hopefully, this is enough to whet your appetite so you can learn more. I will end the chapter with a list of resources, where you can go to learn more independently.