HTML and CSS: two languages for creating a website
To create a website, you must give instructions to the computer. It is not enough simply to type the text that will appear in the site (as you would in a word processor Word, for example), we must also show where the text, insert images, create links between pages , etc..
The roles of HTML and CSS
To explain the computer what you want to do, he will have to use a language he understands. And that's when things get tough, because he'll have to learn two languages!
Why create two languages? One would have sufficed, no?
You must handle two languages that will be twice as complex and twice as long to learn ... but it's not the case! I assure you, if there are two languages is, instead, to make things easier. We will be dealing with two languages that are complementary because they have different roles:
HTML (HyperText Markup Language): it first appeared in 1991 at the launch of the Web. Its role is to manage and organize content. So in HTML you write what needs to be displayed on the page: text, links, images ... You might say: "This is my title, this is my menu, here is the main text of the page , here's an image to display, etc.. ".
CSS (Cascading Style Sheets, also known as Style Sheets): CSS's role is to manage the look of the website (layout, positioning, design, colors, text size ...). This language has complemented the HTML in 1996.
You may have also heard of XHTML. This is a variant of HTML that is more rigorous and that is a little trickier to handle.
Simply put, HTML became the first in 1991. In early 2000, the W3C launched the XHTML indicating that it would be the future ... but did not pierce XHTML as hoped. Back to Basics in 2009: W3C XHTML abandoned and decides to return the HTML to make it evolve.
There is much confusion around these languages, as they are very similar. None is really better than another, it's two ways of doing things. In this course we will work on the latest version of HTML (HTML5) is now the language of the future that everyone is encouraged to use.
You can very well create a website only to HTML, but it will not be very beautiful: the information will appear "rough". This is why the CSS is always complete.
To give you an idea, the following figure shows how looks the same page without CSS and the CSS.
|with and without css|
HTML defines the content (as you can see, it's rough around the edges!). The CSS allows him to arrange the content and define the presentation: color, background image, margins, text size ...
As you can imagine, the CSS needs an HTML page to run. This is why we will first learn the basics of HTML before you take care of the decoration in CSS.
Your first pages will not be the most aesthetically pleasing, but who cares! This will not last long.
The different versions of HTML and CSS
Over time, HTML and CSS have evolved. In the first version of HTML (HTML 1.0) it was not even possible to display images!
Here is a very brief history of these languages for your general knowledge.
Versions of HTML
-HTML 1: this is the first version created by Tim Berners-Lee in 1991.
-HTML 2: the second version of HTML will appear in 1994 and ended in 1996 with the appearance of -HTML 3.0. This is the version that will lay the groundwork done in the following versions of HTML. The rules and operation of this version are given by the W3C (while the first version was created by one man).
-HTML 3: appeared in 1996, this new version of HTML adds many possibilities to language as tables, applets, scripts, text flow around images, etc..
-HTML 4: This is the most common version of HTML (specifically, it is HTML 4.01). It appears for the first time in 1998 and proposes the use of frames (which cut a web page into multiple parts), more complex tables, improvements on the forms, etc.. More importantly, this version allows for the first time to use style sheets, our famous CSS!
-HTML 5: it is THE latest version. Still not very widespread, it makes a lot of attention because it brings many improvements like the ability to easily include videos, a better layout of content, new features for forms, etc.. This is the version that we will discover together.
Versions of CSS
-CSS a: in 1996, it has the first version of CSS. It lays the foundations of this language which allows to present his web page, such as colors, margins, fonts, etc..
-CSS 2: appeared in 1999 and completed by CSS 2.1, this new version of CSS adds numerous options. We can now use very precise positioning techniques that allow us to display items where desired on the page.
-CSS 3: this is the latest version, which adds features eagerly awaited as the rounded borders, gradients, shadows, etc..
Note that HTML5 and CSS3 are not yet completely finalized versions of the W3C. However, even though there may be minor changes in these languages, I highly recommend you start today with these new versions. Their contributions are numerous and worth every penny. Moreover, many professional web sites today are built on recent versions.