Lesson Details:

I: Introduction

A: Introduction to programming coding languages

I. A Brief History & Overview of Programming Languages

When you were in elementary school, you may have learned how to do some basic math through the use of flashcards, drills, and other memorization techniques. Once you got older, you probably learned how to use a calculator to perform the same calculations much quicker than you could by hand. You may have also used other computers or software to complete assignments for you. Today, computers are ubiquitous in our society. We use them not only to solve math problems, but also to watch movies, listen to music, play games, and access just about any kind of information online. More importantly, we use these computers for all kinds of work including creating websites, writing articles, accounting, designing buildings, analyzing data, and much more.

Computers are able to do so many different things because they are programmed with instructions written in one or more programming languages. These programming languages are akin to the calculators that you used when you were younger. They are designed to take care of the heavy lifting involved in performing large tasks that would be too time consuming or tedious for us humans to do by hand. There are many different types of programming languages available today, but this article will focus on the most common programming language used in web development: HTML & CSS.

1. A Brief History of HTML & CSS

One of the oldest languages still in use today is known as Hypertext Markup Language (HTML). It was invented in 1990 by Tim Berners-Lee while he was working at CERN in Switzerland. He created it as a way to document his research in physics. The language was originally named “Mosaic” after the program that he developed to view his documents on a computer screen. In 1993, an American company called Netscape acquired Mosaic and renamed the language “Netscape Navigator”. In 1994 Netscape released “Navigator 2.0” which included support for HTML. This was a huge milestone for HTML since it enabled anyone with a web browser to view web pages on their computer or mobile devices. While HTML has been around for more than two decades now, it has undergone a number of changes over the years. The most recent version is HTML5 which is supported by all modern browsers including Internet Explorer 11, Chrome, Firefox, Edge, Safari, and Opera.

While HTML was being developed by Tim Berners-Lee, another programmer named Håkon Wium Lie developed a similar language called Cascading Style Sheets (CSS). CSS was developed as a way to define the appearance of a web page independent of its content. For example, a web page can have a headline written in bold text, a list of links organized into categories, and a box at the bottom with a sitemap without any of those elements being controlled by the HTML code on the page. While CSS doesn’t actually do anything directly (like Javascript), it is used as a guidebook for how HTML should be interpreted by everyone using your website. Without CSS, you would be limited to formatting your website with plain old HTML tags such as

,

,

,

,
, and . With CSS however, you can format your text and create lists with custom fonts and colors as well as image based graphics like buttons and banners. There are many resources available online to help you learn both HTML and CSS if you want to give them a try yourself.

2. Several Programming Languages Used in Web Development

There are several programming languages used in web development besides HTML and CSS including C++, Python, PHP, Perl, Ruby, and Java. They all have their own pros and cons that make them useful for specific situations. This article will focus on HTML & CSS since they are the most commonly used languages by web developers and designers today. They are also relatively easy to learn and understand since they don’t require any programming experience before getting started. To give you an idea of what these two languages look like when used together on a web page, we’ve included some sample code below. Feel free to modify the code or create your own examples using different HTML tags or CSS styles!

HTML Code Sample:



Heading

This is an example of an h1 tag.

• List item 1
• List item 2
• List item 3

Subheading

This is an example of an h2 tag.

This is an example of using multiple classes.

Learn more here

CSS Code Sample:

html { background-color: #ffffff; } h1 { color: blue; font-size: 50px; } p { color: black; font-style: italic; } li { list-style-type: square; } h2 { color: red; font-size: 100px; } p.bigboldbold { font-size: 150px; font-weight: bold; font-family: "Times New Roman"; } a { color: green; text-decoration: none; }

II: Body

A: Web app demo

III: Conclusion