Courses
HTML and CSS - a History
October 20, 2016
October 20, 2016
Why learn HTML and CSS? Well, they are the building blocks of the World Wide Web. Any page that you see on the Web uses these two core languages. You just can’t make a webpage without them! I don’t really need to say any more, but for your reading enjoyment, here are the ABC’s of these two indispensable technologies for the web developer cadet.
HTML – Where It All Began
Even if you’re not tech savvy, chances are you’ve heard the term HTML. The acronym stands for HyperText Markup Language, and it is used to specify and organize the content of any and every webpage.
When you use a word processor like Microsoft Word, the text that you type in is easily formatted into paragraphs, specific fonts, headings, lists, and tables at the click of a button or the tap of a key. Microsoft Word is what you would call a wysiwyg (what-you-see-is-what-you-get) editor – a program that presents the content you’re writing as it would appear in published form.
When publishing a webpage, the formatting of your text doesn’t happen automatically. This is where HTML comes in. HTML uses special tags, which are typed in around your text to tell the web browser how to display that text. Similarly, you can do this with images, audio, and video. Having said that, there are some wysiwyg editors for HTML/CSS, such as Wix and Weebly, which take the coding out of making a website. These are great for basic layouts, but if you want the freedom to craft a custom-made magnum opus, the likes of which the world has never seen, you need to learn how to code. If that sounds exciting, there’s another very special feature of HTML – one that changed the very way we live our lives.
<h1>Example of a heading</h1>
<p>This is one paragaph.
<p>This is another paragraph.
To give you an idea of this amazing development, I should define for you hypertext (the ‘H’ in ‘HTML’). The concept of digital hypertext has been around since the 1960’s, when Ted Nelson and Douglas Engelbart developed a way for digital text to be linked to other associated text. Of course at that point, these links were limited to text which was stored on the same computer. An ambitious computer scientist at CERN (the European Organization for Nuclear Research) in 1989 freed the world from this oppression by inventing a way for researchers to collaborate remotely, sharing information across multiple computers around the world using the Internet! The system he created became the World Wide Web*, and over a billion people worldwide – including you right now – have benefited by it in some way. HTML was the coding language Berners-Lee invented to publish pages on the Web, and link them together using hypertext. Hosted by CERN, the first ever website went live in 1990, and is still up for viewing today! Click on this link to take a look: http://info.cern.ch/hypertext/WWW/TheProject.html (did you notice that you just experienced an example of hypertext in action?)
As the web experienced wider use, the future of HTML underwent much debate. Computer companies made new HTML tags to be used with their web browsers. This meant that a web developer had the hassle of writing multiple versions of one webpage in order for their work to be compatible with multiple browsers. Luckily for everyone, the World Wide Web Consortium (W3C – an organization dedicated to the positive development of the Web) instituted the Editorial Review Board (ERB) in 1995 to standardize HTML across the industry.
Yes, in case you were wondering, the Internet and the World Wide Web are two different things. To put it briefly, the Internet is like a highway for packets of digital data. A webpage is like a destination for a packet, where the data can be accessed. The World Wide Web is the collection of all these webpages.
Coding Like It’s Going Out of Style
I mentioned the W3C just before. We owe a lot of thanks to them for making our web-browsing and code-writing lives easier. Before 1996, adding ‘style’ to web content was a bit of a pain. Adding colors, fancy fonts, groovy backgrounds and the like were all done using HTML tags, and it meant that developers had to tediously style each webpage of a website separately. I guess it’s kind of like handwriting multiple copies of the same book (well, maybe not that dramatic). The W3C gave us much needed relief in 1996 when it deployed CSS – a new coding language that separated the HTML content from the code that styles the content.
CSS stands for Cascading Style Sheets. With CSS, you can write up a ‘style sheet’ of instructions for how your HTML code should be presented in the web browser. For instance, you can write some CSS code that will give your background a color gradient, or make a heading glow when hovered over. You can give your images crazy (or subtle) shadow effects and ensure that your webpage responds to any sized browser window or device screen size. The style sheet or style sheets are then linked to the HTML content they correspond to. As one style sheet can link to multiple webpages, it makes for much less work than having to style each individual page – that’s like using a printing press to print multiple books at once (hence my analogy before).
In the Frontier of HTML and CSS
Since coming onto the scene in 1991, HTML has undergone a series of makeovers. The story is the same for CSS since its debut in 1996. We’re currently in the era of HTML version 5 and CSS3, and the two latest incarnations deliver more functionality than ever before. For instance, HTML5 offers a series of new elements that make it easier for developers to write code, and for web users to enjoy a site. These include 22 new elements which give greater semantic meaning to code. In other s, new tags like <header>, <footer>, and <section> make it much easier for coders to organize their code. Other new elements make it easier to collect information from users (form handling), and new media tags assist in handling sound, video, and external plug-ins. On the other hand, CSS3’s new visual and animated effects, along with greater code flexibility, open up countless possibilities for web design.
Where We Come In
In the early 90’s, big computer companies didn’t think that the Internet would amount to commercial success. If you look around you today, you won’t have to look long until you see a device that’s connected to the internet. It has become such an intrinsic part of many people’s lives that everyday activities are now commonly carried out online – like shopping, banking, and even chatting face to face. And behind everything you see on the Web is HTML and CSS.
By now, you’re probably chomping at the bit to get coding and write up your very own website. Code Avengers has developed a fantastic code editor for you to learn on, complete with a code reference and a way to see your website as it comes to life!
Click on the link below to start your journey toward becoming a coding professional with Code Avengers!
Close-up of sticker: photo by Robert Scoble 2008, edited. Licensed under Creative Commons Attribution 2.0 Generic, https://www.flickr.com/photos/scobleizer/2251820987
Sir Tim Berners-Lee: http://worldwebforum.ch/display/B2/Tim+Berners+Lee