When discussing the Cascading Style Sheet (CSS) scripting language, it is only natural to discuss HTML. HTML5, the latest iteration of HTML, has been strengthened semantically and while presentational coding is still possible to some degree, it is highly discouraged by the type of changes HTML5 has introduced. CSS is the presentational language i.e. it is the manner with which more presentational aesthetics are introduced. CSS is therefore the language used to write your style sheet [a document containing your website style specifications]. It is an essential language to know in web development because of its dynamic capabilities for presentation. With HTML5 being semantic rather than presentational, you will need to create a style sheet assigning certain features to the various aspects of your website. What are some capabilities of CSS and why is it an essential language to know in Web development?
It is easy to apply styles across all webpages if you create an external style sheet. Style sheets involve the "use of colors, font faces, font sizes, spacing, justification, placement, file formats, graphic sizes, design conventions, and design principles" (Baehr). Below are some capabilities of CSS that make it easy to develop the website of your dreams aesthetically.
Example 1
If you want all images to have certain aesthetic features such as a border, dashed or otherwise, make the border a certain color, you can apply this style across all images if you write it into your style sheet. Here’s an example: You can create a class selector [selector: it determines which elements the formatting will be applied to) in your style sheet to indicate changes to any kind of element that the class is assigned to.
Example 2
Notice the stylistic differences between the above lines compared to the other lines, this is the power of CSS. Using CSS, I could stylistically match up the above to the rest of the page. See below;
With CSS, you can;
You can isolate certain aspects of your web page to present it in the manner you image.
You can specify heading styles (h1 – h6) with fonts, sizes, color etc.
You can make the first paragraph or second paragraph or both of all the web pages look a certain way.
You can adjust margins in a table and format and style the headings of all tables on the website at once.
You can make the first letter or first line look how you want it to e.g. if you want a drop cap effect for example.
You can define the styles of links that have been visited, hovered upon, focused upon (such as with the tab keys for those using accessibility tools), are linked to pages outside your website etc.
Imagine if you had to write all of these presentational codes as singular lines using HTML every time you needed them, writing several lines of these HTML semantic codes in a way that made it look close to the way you wanted them to or relying on whatever defaults browsers have programmed? Would the vision be yours or theirs? It is essential to learn CSS if you want to develop websites that are what you want you want them to look like.
Images and information from the book, HTML & CSS (8thedition) by Elizabeth Castro and Bruce Hyslop.
Comments