systematic-css

The presentation now works in every contemporary graphical browser, and it looks even betterin browsers that support the border-image property.Progressive enhancement of a web design like this is the least fussy way of developing andmaintaining front-end codebases. No CSS hacks. No browser detection scripts. No conditionalcomments for legacy editions of IE. Just standard CSS.The mobile-first, progressive enhancement approach to web design brings a whole bunchof other benefits. It means that smaller devices – which typically have the slowest processors -have only to render the simplest versions of our web pages. Mobile devices can ignore a wholebunch of stuff in our CSS files. Mobile-first design also forces us to place content in its logicalorder in the HTML document and not have the source order dictated by the desire to achievea particular layout on big screens. This improves accessibility. And the additional constraintsof mobile devices – screen size, processing power, bandwidth – require that we focus on thestuff that really matters: content, performance, usability and accessibility. Visual pyrotechnicsshould be at the bottom of our list of priorities, actually.* * *These are the software design principles that have most influenced how I write CSS. My ownweb design methodology has evolved organically over time as I have tried to develop bestpractices for adhering to these design principles.My web design methodology is described in the remaining chapters of this book, startingwith my preferred class naming system.The principles of good CSS 25