Developing Large Web Applications- P8:This book presents a number of techniques for applying established practices of good software engineering to web development—that is, development primarily using the disparate technologies of HTML, CSS, JavaScript, and server-side scripting languages. Whereas there are many books on how to use languages, how to use libraries, and how to approach software engineering, this is the first book to codify many of the techniques it presents. These techniques will make the components of your own web applications more reusable, maintainable, and reliable | CHAPTER 4 Large-Scale CSS In Chapter 3 you saw how a good information architecture based on well-constructed HTML provides a solid foundation on which we can layer other capabilities for modules within a large web application. In this chapter we explore techniques for adding a layer of presentation. The purpose of the presentation layer is to enhance usability and provide an aesthetic user experience by applying principles of good visual design. At its best a good presentation plays a principal role in making a large web application more usable and appealing. At its worst a poorly executed presentation can render an otherwise useful and meaningful information architecture completely worthless. In web development a well-defined presentation layer is implemented using CSS. This in fact was the original purpose of CSS when it first came on the scene in the late 1990s it allowed for clear separation of a web application s underlying information architecture from its presentation. However this separation hasn t necessarily guaranteed modularity. Our goal in developing large web applications is defined in the CSS-related tenet from Chapter 1 Tenet 4 Large-scale CSS forms a layer of presentation that is separate from the information architecture applied in a modular fashion and free of side effects as we reuse modules in various contexts. In this chapter we begin by looking at the tradeoffs between the various ways to include CSS. We explore important techniques with selectors standard module formats and CSS scoping that help you apply CSS in a modular way. Next we view some useful methods by which we can position elements outside the normal document flow. These are especially important in the creation of layouts and containers which are reusable enclosures that allow you to organize modules across a large web application. Finally we examine a few examples of layouts and containers and discuss some practices to provide a clean consistent slate on which to layer a .
