Thomas Wallace

Lectures and Resources

Web Technologies

Fall 2025 | IFSC 11003

Building an Accessible Content Carousel

Be sure to publish your work to GitHub and add a link to the demo we built to your course homepage.

Assignment

All work is due – Wed. Dec. 10, 2025 by 8:00am. No work submitted after this time will be accepted. No Exceptions!

For this assignment, I ask that you collect feedback from a peer, family member, or a friend on your first attempt at the Dragon or Segway project. Using that feedback, I’d like you to attempt to address any issues or problems pointed out by your potential users. You should provide a link to the revised project (duplicate the project directory in codespaces and then add a link to the revised project). You should also provide several paragraphs reflecting on the learning experience working on this project and your experience during the semester. What were the things you did well? What would you do differently if you had to start over? Also report on the feedback you received and what you did to address those issues or why you chose not to make the recommended changes. This should be posted on your homepage under the progressive enhancement writing assignment.

Your course homepage you include the following assignments by then end of the semester.

(Example)

  • Prototype HTML Assignment
  • CSS Demo
  • Positioning Exercises (These 4 are required but you could do extra for additional credit)
    • Float 1
    • Float 2
    • Absolute 1
    • Absolute 2
  • Flexbox Froggy
  • CSS Diner (Extra Credit)
  • CSS Grid Garden
  • CSS Grid Layout Lab
    • Two Column Left Align
    • Two Column Right Align
    • Two Column Stacked
    • two Column Equal
  • Mars Rover or equivalent project (First Draft)
  • Cycle Lab (Image Slideshow)
  • Mars Rover Revised – Final
  • Progressive Enhancement Writing Assignment (Written on Course homepage)
  • Mars Rover Project Revision and Reflection (Written on Course homepage)

Exploring the functionality of JavaScript Libraries

Assignment

Reminder! We do have class on Tuesday following Thanksgiving and will be completing a graded lab in class.

Your course homepage you include the following assignments by thened of the semester.

  • Prototype HTML Assignment
  • CSS Demo
  • Positioning Exercises (These 4 are required but you could do extra for additional credit)
    • Float 1
    • Float 2
    • Absolute 1
    • Absolute 2
  • Flexbox Froggy
  • CSS Diner (Extra Credit)
  • CSS Grid Garden
  • CSS Grid Layout Lab
    • Two Column Left Align
    • Two Column Right Align
    • Two Column Stacked
    • two Column Equal
  • Mars Rover or equivalent project (First Draft)
  • Cycle Lab (Image Slideshow)
  • Mars Rover Revised – Final
  • Progressive Enhancement Writing Assignment (Written on Course homepage)
  • Mars Rover Project Revision and Reflection (Written on Course homepage)

JavaScript and the Document Object Model

Assignment

Read the following Article on Progressive Enhancement. On your course homepage, create a section below the navigation element that contains the heading “Thoughts on Progressive Enhancement”. Please describe progressive enhancement in your own words and discuss why progressive enhancement is important in modern web development and include a link to another article you found and read relating to the topic.

Web Forms

Assignment

It is not required to have a contact form for your first draft but it will be for the final project so feel free to go ahead an integrate into your draft if you’d like to work ahead.

Final Project Workday

Please spend today working on solidifying your template for your first draft. By next Tuesday you should be close to having a simple page design in place. Next week, I will do a site building demo and show you how to integrate a contact form into your site.

CSS Grid Lab Debrief / Final Project Assignment

Lab Debrief

Bringing it all Together

Final Project

Complete the micro-site project and post url of the First Draft to your course homepage no later than 11/18/2025. You are welcome to complete the siite on any topic you would like provided it meets the technical requirements for the project. There will be two iterations of this project. A first draft due on 11/18/25 and a final revision that will be due on the date of your final. Both are graded assignments. Plan accordingly.

Mars Rovers

CSS Grid Layout Lab

Today we will build out some common page layout patterns using the CSS grid specification we have been learning.

Assignment

Make sure your grid lay labs are loaded and linked from your course homepage. At this point your course homepage should have the following assignments posted and linked:

  • Prototype HTML Assignment
  • CSS Demo
  • Positioning Exercises (These 4 are required but you could do extra for additional credit)
    • Float 1
    • Float 2
    • Absolute 1
    • Absolute 2
  • Flexbox Froggy
  • CSS Diner (Extra Credit)
  • CSS Grid Garden
  • CSS Grid Layout Lab
    • Two Column Left Align
    • Two Column Right Align
    • Two Column Stacked
    • two Column Equal

Positioning Lab Debrief

Assignment

Complete CSS Grid Garden and Post a screenshot of the final exercise – https://cssgridgarden.com/

Make sure your positioning labs are loaded and linked from your course homepage. At this point your course homepage should have the following assignments posted and linked:

  • Prototype HTML Assignment
  • CSS Demo
  • Positioning Exercises (These 4 are required but you could do extra for additional credit)
    • Float 1
    • Float 2
    • Absolute 1
    • Absolute 2
  • Flexbox Froggy
  • CSS Diner (Extra Credit)

Additional Reading

https://developer.mozilla.org/en-US/docs/Learn_web_development/Core/CSS_layout/Grids

 

Out of Class Workday

  • Create and Validate a prototype HTML document that includes examples of all HTML elements covered thus far. For a list of requirements view this page.
  • Use today’s session to work on and complete this assignment. You are welcome to partner with a classmate to work on this but each of you must submit code that you have written. No Copy/Paste!
  • Create a link to this assignment from your course homepage. Name it “Prototype HTML5 Assignment”
  • When complete publish it to your Github account with the Commit Note “Prototype HTML5 Assignment Submission”.
  • As long as you have submitted your github pages URL. I’ll be able to browse those assignments via the URL you submit.
  • Due 9/28/2025

Validation, Naming Conventions, and File Management

HTML5 Assessment

  • Create and Validate a prototype HTML document that includes examples of all HTML elements covered thus far. For a list of requirements view this page.
  • Use today’s session to work on and complete this assignment. You are welcome to partner with a classmate to work on this but each of you must submit code that you have written. No Copy/Paste!
  • Create a link to this assignment from your course homepage. Name it “Prototype HTML5 Assignment”
  • When complete publish it to your Github account with the Commit Note “Prototype HTML5 Assignment Submission”.
  • As long as you have submitted your github pages URL. I’ll be able to browse those assignments via the URL you submit.
  • Due 9/28/2025

Web Terminology

Weekly Lab Session

Be sure to add to your calendar and attend when you need assistance. These are not mandatory.

Weekly Lab Class Fridays
9:00 – 10:00am
Video call link: https://meet.google.com/feg-bdcu-eur

Assignment

Setup an Account at Github. The free account is acceptable for the work we will do in class. Make sure you make note of your credentials and verify your account email address when signing up.

Additional Reading

300 Million Dollar Button

Course Introduction

Course Syllabus

Introduction to the Virtual Classroom

We will be using a broad array of tools to support this course this semester. If you would like to familiarize yourself with these feel free to do so. I will explain and do walkthroughs with the tools when we begin to use them.  You are welcome to go ahead and create your accounts (they are all free) but make sure to keep track of your credentials.

  • Codepen.io – Codecasting Service for Lectures and Reference
  • GitHub (Student Pack) – Code Versioning Repository for submitting assignments
  • Pixlr – Cloud Based Image Editing Tools

Discussion