Chapter 18 HTML & CSS Process and Design
Audiance
- Who is the site for?
- Why people visit your site
- What visitors are trying to achieve
- what information your visitors need
- How often people will visit your site
Create a site map or wire frame
Chapter 1 Structure
HTML (Hyper Text Markup Language)
- HTML provides structure to web pages using code/tags
- tags act like containers. They tell you something about the information that lies between the opening and closing tags
- tags plus content in between them = element
Common Tags
- body: consists of everything in the main browser window
- p: paragraph
- h1: Header tags go from 1-6 denoting headings and sub-headings
- head: before the body element contains information about the page but usually isnt seen on the page
-
title: what shows in the browser tab
- tags can also have attributes ex. p lang (attribute name)= “en-us” (attribute vale)
Chrome > View > Developer > View Source (option + command + u) - allows you to view code for websites you are visiting
Chapter 17 HTML Layout
New HTML5 Layout Elements
- before html5 layouts were created by wrapping sections in <div> tags with a description. <div id="header"> now there is a <header> in html5
New Element Tags
- header : Top of the page
- footer : Bottom of the page can contain things like copyright, links to privacy policy etc (site map)
- nav : Navigational blocks
- article : container for any section of a page that could stand alone
- aside : container for content that is related to the entire page unless used within article tag.
- section : groups related content together
- hgroup : group together a set of 1 or more h1 through h6 elements
- figure and figcaption : used to contain any content that is referenced from the main flow of an article
- div : mulitpurpose container when there is no other suitable