Journalism Tech Review: Learn CSS Layout

History

Many of you who have worked with web content management systems or your own personal blog will have a basic understanding of HTML. Just by clicking on the HTML tab or by holding down CTRL+U you can get a grasp of what is going on behind any web page. But CSS can be a mystery as it is rarely placed within HTML (called inline). CSS stands for “Cascading Style Sheet” so instructions should be entered into a separate page within a website’s directory. As Online Journalist Mindy McAdams points out the excellent web-based coding guide Codeacademy often loses people at inline. This online tutorial takes about 20 minutes to run through and very simply explains the fundamentals of CSS.

In practice

I used what I’d learnt to completely change the overall look of a Tumblr website, also to stop to the Footer shooting up to the middle of the page when viewing this website in Internet Explorer.

How it helps you

If you use any website to collect together your stories, build feature ideas or grow an online audience, then knowing the fundamentals of CSS  means you can customise your site to appear more professional. A basic understanding of HTML and CSS is needed if you want to scrape any kind of website, as Classes are often used to mark-up useful information and (as explained in The Data Journalism Handbook) can help convert a web page into a usable spreadsheet format.

Drawbacks

I would have liked more opportunity to try out the code. When you try and apply the CSS there is a missing link which has to be pieced together by reading this tutorial. I realised I needed to select the class by writing and using the correct "selector". As with many of these tutorials, it’s going to slip straight out of your head if you don’t apply it a few times.

Summary

An easy to follow tutorial, which needs further joining up for application.

Rating