In our first post in the web development journey, we covered the browser. Now we’re taking you ‘under the hood’ with HTML and CSS—the framework languages for the browser. HTML is the content and structure code interpreted in the browser as the web page, CSS is the language that manages the presentation of the HTML elements. Let’s dive deeper.
HTML, HyperText Markup Language, is the language that makes up the content, framework, and structure of a web page. HTML was invented in 1990 by Tim Berners-Lee based off the complex, technical markup language known as SGML, Standard Generalized Markup Language.
CSS, Cascading Style Sheet, is used along-side an HTML file to customize the style of a website. CSS brings the web page to life, displaying colors, backgrounds, font sizes, and more. Before CSS, nearly all of the presentational attributes of HTML documents were contained within the HTML markup. This made documents larger and more complex, error-prone, and difficult to maintain. Håkon Wium Lie, who worked alongside Berners-Lee, proposed CSS in 1994 and officially launched it in 1996. Implementing CSS allowed the separation of presentation from structure, resulting in considerably simpler HTML.
Fitting in the Full Stack
“Once students understand fundamental concepts, they can begin to grasp more advanced concepts like dynamically rendered pages and building more complicated, modular stylesheets,” said Graham McBain, evangelist at Galvanize.
In the Galvanize Web Development immersive course, HTML and CSS are fundamental skills, taught early. Learning these languages gives students a solid foundation in the structure and function of a web page. Once they know the relationship, they can start designing and developing websites, apps, and more.
The best way to learn HTML and CSS is simply by doing it. Codecademy.com will give you a solid overview of both technologies, but for ongoing support, CSStricks.com is a good resource for practical implementation.
Curious how these languages look ‘under the hood?’ Right click anywhere on the page and click ‘View Page Source’ in the menu. Pretty neat! If you’re adventurous, take a deeper dive with How to Use Chrome DevTools for the Absolute Beginner.
“Front end web development is a skill unto itself,” McBain said. “Knowing the basics of HTML and CSS is essential, no matter what path a developer takes.”
Contributions by Graham McBain, Galvanize Evangelist.