Excerpt from - Coding for designers

Number seven-- many of the differences between web design and print design are in the details. What do I mean? Well, let me explain. Let me first say between print design and web design, visual design is the same. That's not a difference. You still need to be able to practice line, shape, color, balance, texture, contrast, and flow, all the things that make visual design important, these and many others. Whether you're designing an identity across packaging and across print design products and then extending it to a website, the principles of visual design remain the same. Another thing that remains the same between print and web design, if that's the world that you're coming from, is the designer's obsessive attention to detail. If you're obsessive compulsive like me, then you're in good company if you're getting into the web. In print, that obsession comes with making sure that things are speced properly for the printer and making sure that things look perfect, not only close up but far away. On the web, that same attention to detail is necessary. It just looks a little bit different. Instead of caring about inks and trapping, we care about pixel perfect precision, making sure that the layout of your page is speced exactly, precisely, so that the person who's building it, whether that's or whether that's your developer knows exactly where things go and they go there in a consistent manner. The attention to detail remains the same. Another thing that remains the same-- paragraph styles. Attention to detail extends to typography. And typography in web design is very similar to InDesign's paragraph styles. If you don't know about paragraph styles, this is what they look like. So you can spec and say that a particular style for a typography, in this case, is 11 points on 14 points myriad pro. Well, you can do this in print, and you do the same thing on the web, except on the web, it's called CSS. Paragraph styles and InDesign are the same thing as CSS on the web. So if you spec in InDesign a paragraph like this, 11 on 14 myriad, that's regular type, not bold or italics or anything else, this is how you do it in InDesign. You do the same thing in CSS. It's just they don't have these cool, drop down menus in this little window. You have to type it out. This is the same type spec in CSS inside of InDesign. It says that font family is myriad. It's the style is normal, not bold or italics or obliques. It's 11 pixels. It's not points. We actually measure typography, generally speaking, in pixels instead of points. There are other measurements, too, but pixels is a perfectly reasonable valid measurement on the web. There's line height and letter spacing. What's line height? What do you think that is? If you guessed leading, that's right. Line height is leading. It's the same thing. It's just called something different on the web. Actually, it's almost the same thing. There's a little teeny bit of a difference between line height and leading. But for most intents and purposes, they are the same thing. Likewise, letter spacing, what do you think that is? It's tracking. It's consistent spacing between different letters in a chunk of text. So CSS is the same thing as InDesign's paragraph styles. The big stuff is the same, but the details are different. Another place where details are different-- in print, if you want to make sure that a piece is going to look right, you do a press check. On the web, you do a browser check. You make sure that it looks right on a Mac and a PC, you make sure it looks right on the phone and a tablet. And even on those particular computers, you make sure it looks right in different web browsers, like Internet Explorer or Google Chrome or Safari or Firefox. That's the equivalent of a press check. In print, CMYK is how you spec your colors and how you work with color, generally. On the web, same idea, but the detail is different. It's RGB. In print, your units of measurement are points, picas, and inches, depending on the context and what it is you're trying to measure. On the web, generally speaking, it's pixels. There are some other weirder esoteric measurement units on the web, too, but pixels is by and large the biggest and the most popular, especially for layout. So many of the differences between web design and print design are in the details. But a lot of the principles, a lot of the big stuff is the same.