(1) HTML5, CSS, Twitter Bootstrap

(2) HTML5 Will be the new standard New features Drag and Drop and Support for local storage,,,, New input types Removed tags,

(3) Canvas is a container for drawing graphics All the drawing is done with scripts usually JavaScript var c=document.getElementById(“drawing”); var ctx=c.getContext(“2d”); ctx.fillStyle=“#FF0000”; ctx.fillRect(0,0,150,75);

(4) Inline Scalable Vector Graphics Contains XML to describe the graphics SVG graphics are a part of the document, Canvas’ are not

(5) Drag and Drop Drag and Drop is part of the HTML5 standard Requires JavaScript drag(event) is JavaScript function that set the contents of the dragging object drop(event) is JavaScript function that handles the drop, sets the child element

(6) Video and Audio Embed video into your page with element Most browsers support it, but support different formats (MP4, WebM, Ogg) Embed audio into your page with element Most browsers support it, but again the formats differ (MP3, Wave, Ogg) Use multiple elements Browser will use first it recognizes

(7) Local Storage Secure quick replacement for cookies Data is stored locally in the Browser Key, value pairs only accessible by page that stored the data Used by JavaScript Two types localStorage – no expiration date sessionStorage – deleted when when browser window is closed

(8) Semantic Elements and are not semantic elements Used widely in most web pages New semantic elements Have to style them to get them to layout correctly

(9) Input Types Added several new input types color date datetime month number range search url

(10) Cascading Style Sheets Styles define how to display HTML elements Were added to HTML 4.0 to solve a fundamental problem with HTML HTML wasn’t designed to have format tags HTML describes the structure and content of the document HTML 3.2 added some format tags like Styles separate the display from the structure

(11) CSS Structure CSS files are a collection of CSS Rules CSS Rules have two parts Selector - elementtable - #id#cam -.class.fancy - *selects all One or more Declarations - property:value; CSS Comments /* this is a comment */

(12) CSS Selectors SelectorExampleDescription elementpselects all elements element, elementdiv, pselects all and elements element div pselects all in elements element > elementdiv > pselects all whose parent is a element + elementdiv + pselects all immediately after [attribute][target]selects all elements with target attribute [attribute=value][target=foo]selects all elements with target=“foo” [attribute~=value][title~=bar]selects all elements with title containing the word “bar” [attribute|=value][title|=baz]selects all elements with a title starting with “baz”

(13) Inserting CSS External Style Sheet Internal Style Sheet hr {color:red;} p {margin-left:15px;} Inline Styles

(14) Multiple Style Sheets Multiple styles cascade into one style Ordering* 1. Inline 2. In element 3. In external CSS file * If the to external CSS file is after the internal style then it will override the internal style

(15) Twitter Bootstrap Sleek, intuitive, and powerful mobile first front- end framework for faster and easier web development