# Coding Workshop for Designers
## Presented by Shift Design Group &amp; Lexington Codes




## Introductions

* Who am I 
* Who are you




## Overview 

* The Internet
* **HTML**: The content and structure of a webpage
* **CSS**: How that page looks 
* **JavaScript**: Making it fancy 




## Client/Server

*




## HTML 

* Structure




## Anatomy of an HTML File

* index.html
*




## HTML Tags




## IDs &amp; Classes

* An ID Uniquely identifies an element 
* You can add a particular class to many elements




## HTML5




## CSS




## Including Your CSS




## The Box Model




## IDs as Selectors




## Classes as selectors




## Descendants




## More Selectors

* [Good Introduction](http://net.tutsplus.com/tutorials/html-css-techniques/the-30-css-selectors-you-must-memorize/)




## Styling Links




## Bootstrap &amp; Co.




## JavaScript

* Has nothing to do with Java
* Include in your HTML file



## Including Your JS




## Variables




## Arrays




## Objects




## Loops




## Functions




## jQuery




## Manipulating the DOM




## jQuery Selectors




## More Advanced Topics

# Coding Workshop for Designers
## Presented by Shift Design Group &amp; Lexington Codes




## Introductions

* Who am I 
* Who are you




## Overview 

* The Internet
* **HTML**: The content and structure of a webpage
* **CSS**: How that page looks 
* **JavaScript**: Making it fancy 




## Client/Server

*




## The File Structure of a Website




## HTML 

* Structure




## Anatomy of an HTML File

*




## HTML Tags




## IDs &amp; Classes

* An ID Uniquely identifies an element 
* You can add a particular class to many elements




## HTML5




## CSS




## Including Your CSS




## The Box Model




## IDs as Selectors




## Classes as selectors




## Descendants




## More Selectors

* [30 Selectors](http://net.tutsplus.com/tutorials/html-css-techniques/the-30-css-selectors-you-must-memorize/)
* Class and ID are the most common though



## Styling Links

* :before
* :after



## Bootstrap &amp; Co.




## JavaScript

* Has nothing to do with Java
* Include in your HTML file



## Including Your JS




## Variables




## Arrays




## Objects




## Loops




## Functions




## jQuery




## Manipulating the DOM




## jQuery Selectors




## More Advanced Topics

Add File system slide; flesh out css selectors a bit
Add File system slide; flesh out css selectors a bit
