html-css

Session on HTML and CSS, markup languages used for creating websites.

View the Project on GitHub dhsouthbend/html-css

«<Back Next»>

Introduction

Websites seem like these magical things that appear when we open our web browser (i.e. Chrome, Firefox, Safari). We know that websites are hypertext, meaning that we can click between links, travelling from page to page until we find what we need. What may be less obvious about websites is that, fundamentally websites are plain text documents, usually written in HTML or another web-based markup language, such as XML or XHTML.

Fun fact: Nearly 80% of all websites (whose markup language we know) use HTML. (w3techs.com)

Hypertext Markup Language (HTML)

HTML is a markup language used to write web-based documents. It enables us to provide web browsers with information about the content of a document. We can, for example, indicate that some part of our document is a paragraph, image, heading, or link. The browser uses this information when displaying the document for users.

Markup language vs. programming language

HTML is a markup language, not a programming language. Programming languages are used to transform data, by creating scripts that organize an output of data based on a particular input of data. A markup language is used to control the presentation of data.

For a practical example of this difference, we can think about tables. A programming language can help you search through a table, understand the kinds of data the table includes, find particular data points, or transform its content into other kinds of data, such as frequencies. A markup language would instead determine the content, layout, and visual presentation of the table.

NOTE - Markup vs Markdown: You may have heard of Markdown. Like HTML, it is a markup language; “Markdown” is a play on words. Markup languages help format content.

Cascading Style Sheets (CSS)

CSS is usually used in conjunction with HTML. HTML tells the browser what the different parts of a document are. CSS tells the browser what the parts of the document should look like. It is essentially a set of rules that are applied when rendering an HTML document. Its name – Cascading Style Sheets – refers to the fact that there is an order of precedence in how the browswer applies CSS rules to a document. More specific rules overwrite less specific rules.

Where does the internet come in?

Together, these languages can be used to write and style a website using a text editor (such as VS Code) directly from your computer. No internet access needed.

However, internet access is necessary if you plan on making your website available to the public. At the end of this workshop, we will briefly discuss how to get your website from your local computer onto the internet.

«<Back Next»>