Difference between revisions of "Class:Digital Portfolio 2015/Week 2"
Jump to navigation
Jump to search
(Created page with "== Last Week == * Introductions * Discuss Class * Discuss Wiki * History of the Internet * How the internet works for us == This Week == * Review Last Week * Handy utilitie...") |
|||
| Line 10: | Line 10: | ||
* Review Last Week | * Review Last Week | ||
| − | |||
* Talk about the responsive web stuff that we did not look at last week | * Talk about the responsive web stuff that we did not look at last week | ||
* The "size" of the internet | * The "size" of the internet | ||
Revision as of 18:16, 19 May 2015
Contents
Last Week
- Introductions
- Discuss Class
- Discuss Wiki
- History of the Internet
- How the internet works for us
This Week
- Review Last Week
- Talk about the responsive web stuff that we did not look at last week
- The "size" of the internet
- Prepping Images for the Web
- Tools: Text Editors
- HTML / CSS Review
Open Questions
Notes
The "size" of the web
Optimizing Images for The Web
We covered many aspects/techniques related to optimizing your images for the web.
- Image Format Reference
- I also showed the excellent tool Imageoptim for further compressing your images
Reviewed Text and CSS Editors
We discussed three separate HTML & CSS tools that you should be familiar with for this Semester.
I have created a Text Editors reference page for you here.
Refresher on HTML & CSS
Our first big task is to review HTML & CSS techniques in an effort to get everybody more comfortable hacking away at their websites.
Download the choppingblock / html-css-demos files from github.com here
- We reviewed the basic HTML tags:
- We reviewed the HTML tags used for styling regions of pages:
- I showed csszengarden.com and the possibilities that CSS can bring to your HTML sites.
- I showed how to format a basic page using Espresso.
Video Notes
Section A
- Handy Utilities Overview
- Responsive Websites Overview
- Image Compression for Photographers 101
- Animated GIF's and Cinemagraphs
Section B
- Data Backup Solutions for Photographers
- Handy Utilities Overview
- Responsive Websites Overview
- Image Compression for Photographers 101
Files
- Download the choppingblock / html-css-demos files from github.com here
Assignment
Your task this session is to simply become familiar with the tools and HTML shown in class.
- Download the files
- Look over the HTML in the first few folders
- Download and open up TextMate, install the Bundles if you like.
- Download and open up Sublime text
- Download and open up Espresso, see if you can edit some CSS.
If you can, bring some of your images to class next session.