Anatomy of a Webpage 1
In this class we'll talk a little about webpages; including basic network architecture, history, syntax and tools to deconstruct other webpages as open source.
Basic Terminology
- HTML = HyperText Markup Language
HTML is used to create the structure of a web page.
- CSS = Cascading Style Sheets
CSS provides the styling for one or more web pages.
- JS = JavaScript (no relation to Java)
JavaScript provides the actions or functionality for one or more webpages.
- Browser = Software which renders/displays webpages.
The browser is software which takes these three languages, and interprets them. (called rendering)
- Client = End-user device, running browser software.
Clients are devices (or software) which connect to a server. Any internet-connected device can be considered a client.
- Server = Powerful computers running application software and/or providing [HTML] files.
Servers are (often powerful) computers running server software. They run applications (such as CMS) and provide files. (such as HTML/CSS/JS and images)
All Web Pages Are Created Equal
First things first. CSS and JavaScript are exciting things, but without HTML they have nothing to do. Peanut butter and jelly, but no bread.
HTML
- head
- body
- a, img
- divs
- tables, and why they're deprecated
CSS
- class and ID
- selectors
- media queries (?)
- LESS (?)
JavaScript
- The DOM
- jQuery. 'nuff said.
WebKit Inspector / Firebug
- Live editing. Ain't it cool?