CIS195 - Web Development I (OER)

Topic outline

• 

  HTML and CSS

  <meta inst="Instructor Contact">
  <office		.CIS-195 {
  room  = ""		day:   ;
  phone = ""		time:  ;
  email = ""		crn:   ;
  hours = "">		room:  ;
  </office>		}

  • 
    Except where otherwise noted, Web Development I (CIS195) by Frank Lister is licensed under a Creative Commons Attribution 4.0 International License.
    Permissions beyond the scope of this license may be available at Linn-Benton Community College.
  • This is a static, read-only version of CIS 195. It does not have enrolled students or grades. 

    Download this course from CommunityArchive@LBCC.

    For access to instructor-only content, contact the OER Librarian, Michaela Willi Hooper (willihm@linnbenton.edu).

  • w3schools.com URL
  • Syllabus URL
  • Recommended text: Michaud, Thomas. (2014). Foundations of web design: Introduction to HTML & CSS. New Rider. ISBN: 978-0-321-91893-2

  • Schedule URL
  • Final Project
    

  • Final Project Instructions URL
• 

  Topic 1

  Week #1

  Foundations of Web Design (FoWD)

   READ: FoWD - Chapter 1 (pp 6-13)
                            Chapter 2 (pp 16-29)

  Course Intro, study tips, success in my classes, HTML glossary. Tools: text editor, file system, web browser. HTML basic syntax and common top-level elements. Headers, paragraphs, lists, and some supporting or formatting elements.
  

  
  

  • Week 1 Objective URL
  • Lab Assignment

     -- Labs are assigned in class.

  • Lab 1 Instructions URL
  • Lab 2 Instructions URL
  • Quiz and Project

  • Project 1 Instructions URL
• 

  Topic 2

  Week #2

  READ: FoWD - Chapter 3 (pp 32-43)
                            Chapter 4 (pp 46-53)

  Anchors, links, relative and absolute paths, fragment identifiers, images, and videos. Table, row, data cell, border. Table caption, header, body, footer, spanning columns.

  • Week 2 Objective URL
  • Lab Assignment

     -- Labs are assigned in class.

  • Lab 3 Instructions URL
  • Lab 4 Instructions URL
  • Quiz and Project

  • Project 2 Instructions URL
• 

  Topic 3

  Week #3

  READ: FoWD - Chapter 5 (pp 56-77)

  
  

  Basic CSS syntax and glossary. What are selectors: properties, values, declarations, rules, and ways to link to your CSS. Different selectors types: universal, element, groups, combination, class, id, pseudo-class.
  

  • Week 3 Objective URL
  • Lab Assignment

  • Lab 5 Instructions URL
  • Lab 6 Instructions URL
  • Quiz and Project

  • Project 3 Instructions URL
• 

  Topic 4

  Week #4

  READ: FoWD - Chapter 6 (pp 82-95)

  
  

  Class attribute, class selector, id attribute, id selector. Role attribute and CSS attribute selectors.
  

  • Week 4 Objective URL
  • Lab Assignment

  • Lab 7 Instructions URL
  • Lab 8 Instructions URL
  • Quiz and Project 

  • Project 4 Instructions URL
• 

  Topic 5

  Week #5

  READ: FoWD - Chapter 7 (pp 98-115)

  Font properties: font family, font size, pixels, font style, font variant, font weight, font property shorthand. Text properties: text align, text decoration, text indent, text transform, line height, and color.

  • Week 5 Objective URL
  • Lab Assignment

  • Lab 9 Instructions URL
  • Lab 10 Instructions URL
  • Quiz and Project

  • Project 5 Instructions URL
• 

  Topic 6

  Week #6

  Box Model: content, border (width, style, color), padding and margin with shorthand, and background color.
  

  • Week 6 Objective URL
  • Lab Assignment

  • Lab 11 Instructions URL
  • Quiz and Project

  • Project 6 Instructions URL
• 

  Topic 7

  Week #7

  READ: FoWD - Chapter 8 (pp 128-136)
                            Chapter 9 ((pp 140-163)

  Box Model: Width, height, overflow, box sizing. 
  Layout Properties: Float, left, right, inherit, clear, and overflow.

  Final Project Outline due next week, Friday night 
  

  • Week 7 Objective URL
  • Lab Assignment

  • Lab 12 Instructions URL
  • Lab 13 Instructions URL
  • Quiz and Project

  • Project 7 Instructions URL
  • Final Project Outline
    

  • Final Project Outline Example URL
• 

  Topic 8

  Week #8

  READ: FoWD - Chapter 10 (pp 166-191)
                            Chapter 11 (pp 195-213)
  
  

  Layout Page: Fixed-width layouts.
  Fluid responsive layouts.

  • Week 8 Objective URL
  • Lab Assignment

  • Lab 14 Instructions URL
  • Lab 15 Instructions URL
  • Quiz and Project

  • Project 8 Instructions URL
• 

  Topic 9

  Week #9

  READ: FoWD - Chapter 11 (pp 195-213)
  
  

  Navigation: Lists, vertical (left or right), horizontal, and breadcrumbs.
  

  • Week 9 Objective URL
  • Lab Assignment

  • Lab 16 Instructions URL
  • Lab 17 Instructions URL
  • Quiz and Project

• 

  Topic 10

  Week #10

  No weekly quiz or projects this week 

  FINAL PROJECT due Sunday night!

  Week in review, work on final project, early presentations (if any)
  

  • Week 10 Objective URL