Interactive Design Homework page!

Taylor Sanderson.

Link to weekly sections

Week 2 and 3
Week 4
Week 5
Week 6
Week 7
Week 8
Week 9
Week 10
Week 11
Week 12

Week 1

A title is used in the head with the meta data. Usually this can be used to title the name of the website or it can be used to credit another designer.

P tags are used for paragraphs.

h1 to h6 tags are used for headings and have different levels.

Week 2 and Week 3

White Space helps because it give you space to spread out the tags with out it directly effecting what the site will look like.

Email Taylor

Find us on Social Media: Keysneck Facebook Page

Ocean Header
Image pulled off of site provided.
created gif
Gif I created in Animation Class

Week 4

Tables:

Pet Grooming Schedule
9AM 10AM 11am Noon
Monday Dogs cats tarantulas
Tuesday lizards tarantulas dogs cats
Wednesday cats dogs tarantulas
Thursday dogs lizards
Friday tarantulas
No Weekend Grooming Scheduled

Forms:

Username:

Password:


Please select your favorite food:

Italian Cuban Japanese

Whatcha Want?!


Week 5

Extra mark up

Current Exhibitions

Olafur Eliasson

Olafur Eliasson was born in Copenhagen, Denmark in 1967 to Icelandic parents.

He is known for sculptures and large-scale installationa rt employing elemental materials such as light, water, and air temperature to enhance the viewer's experience.


Flipzco. | New Beginnings on Vimeo.


Week 6

CSS

Create an external CSS style sheet for your website. It should include selectors for:
  • 1. a universal font family
  • 2. H1 and H2
  • 3. b
  • 4. i
  • 5. and one class selector.

    • Week 7

    Color

  • 1. On your CSS style sheet, style:
  • background using rgb code
  • h1 using hex code
  • h2 using a color name
  • h3 using HSLA (opaque)

    • p with a transparent background using rgba (remember to code this using rgb first as a fallback in case the browser doesn't show transparency). Make sure that the contrast between type and background is always high enough to make your type easy to read. The edge of the colored box will look too close to your type, but we'll fix that in a future chapter.

    Think about it: How does HSLA color differ from RGBA color?

    Week 8

    Ocean Header

    Week 9

    Boxes!!!

    The moog company pioneered the commercial manufacture of modular voltage-controlled analog synthesizer system in the early 1950s.

    Week 10

  • 1. Style a bulleted list on your webpage
  • 2. Style the table you created back for chapter 6, alternating background colors in horizontal stripes, and giving the text plenty of room.
  • 3. Style at least one of the form elements you created for chapter 7.

    • Week 11

    Layout Page

    Create a new page called "layout" for playing with some of the layout ideas in this chapter. Use a separate CSS for this to keep it easy -- either put it on the page, or create a CSS page just for this. Create these styles:

  • H1 with relative positioning
  • H2 with absolute positioning
  • H3 with a fixed position AND use the z-index to make it sit on top of the page
  • blockquote that floats right
  • create a two-column layout on one of your pages
  • 6. using a CSS style on the page, make your new "layout" page fixed layout.
  • using a CSS style on the page, make your index page a liquid layout of 90%

    • Week 12

    Layout Page

    Postioned an Image, set the background and a gradient box

    Top