Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Introduction to Web Design — Week 1, Dip your toes in

lou suSi
December 31, 2012

Introduction to Web Design — Week 1, Dip your toes in

In Spring of 2011, I taught an 8 week introductory course to web design at Brookline Adult and Community Education. This is the presentation deck from week 1 of the course.

lou suSi

December 31, 2012
Tweet

More Decks by lou suSi

Other Decks in Education

Transcript

  1. what we’ll cover HTML, CSS and some light JavaScript in

    Dreamweaver and Visual Design in Photoshop Designing for the Web as presented in a Browser
  2. what we won’t cover in this class Flash or any

    ‘Multimedia’ Production Designing for All Devices
  3. html { hypertext markup language } <!DOCTYPE html PUBLIC "-//W3C//DTD

    XHTML 1.0 Transitional//EN" <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>. lou suSi . DESIGN . artist, designer, musician + performer .</title> <meta name="description" content="artist, design, musician + performer living + working on the North Shore of Massachusetts"> <meta name="keywords" content="lou, susi, lou susi, loususi, bxos, ... <link rel="stylesheet" type="text/css" media="all" href="styles.css" /> <link href='http://fonts.googleapis.com/css?family=Josefin+Slab:light,regular,bold' rel='stylesheet' type='text/css'> <link href='http://fonts.googleapis.com/css?family=Tangerine' rel='stylesheet' type='text/css'> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> </head> <body> the visible part of the website all goes right here </body> </html> xhtml1-transitional.dtd"> ... of Massachusetts”> ... design, designer, fun"> ... type=”text/css”> ... type=”text/css”>
  4. html { hypertext markup language } <!DOCTYPE html PUBLIC "-//W3C//DTD

    XHTML 1.0 Transitional//EN" <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>. lou suSi . DESIGN . artist, designer, musician + performer .</title> <meta name="description" content="artist, design, musician + performer living + working on the North Shore of Massachusetts"> <meta name="keywords" content="lou, susi, lou susi, loususi, bxos, ... <link rel="stylesheet" type="text/css" media="all" href="styles.css" /> <link href='http://fonts.googleapis.com/css?family=Josefin+Slab:light,regular,bold' rel='stylesheet' type='text/css'> <link href='http://fonts.googleapis.com/css?family=Tangerine' rel='stylesheet' type='text/css'> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> </head> <body> the visible part of the website all goes right here </body> </html> xhtml1-transitional.dtd"> ... of Massachusetts”> ... design, designer, fun"> ... type=”text/css”> ... type=”text/css”>
  5. tags { and the anatomy of } there are really

    2 kinds of tags in this world this kind <p>a brand new website</p> and that kind <img src="images/schwittr.jpg" width="183" height="191">
  6. tags { and the anatomy of } most tags look

    like this, though <p>a brand new website</p> i always think of ripples when i think of tags