Individual Web Project Lab
Project Q & A Review Topics and Ideas
Author Archives: thomas.wallace@gmail.com
Out of Classroom Learning Activity
Today I’d like you to continue to explore CSS Grid by reviewing the layout patterns and code samples at https://gridbyexample.com/examples. Please work through the test exercises on this page (It only worked in Firefox for me): https://developer.mozilla.org/en-US/docs/Learn_web_development/Core/CSS_layout/Grid_skills If you haven’t completed CSS Grid Garden or need a refresher please work through the exercises – https://cssgridgarden.com/ In […]
Introduction to HTML5
Codecast Forms Sectioning using HTML5 Structural Elements Semantic and Structural Elements Obsolete and Redefined Elements What is Validation? Create a Repository using these instructions. Publishing your work to Github Be sure to submit your github pages URL.
Microsite Project
Finalizing your page template Duplicating pages for your site Individual Web Project Create your own micro site and post the url to your GitHub me by March 4, 2025. Starter HTML (You do not have to use this, provided for reference) Arkansas State Parks Micro Site Project
CSS Grid
Class Exercise Debrief Introduction to CSS Grid Grid by Example Classroom Example ( Float Based ) In Class Coding Activity Clone (Make a copy) your HTML5 Semantics project from last week. Rename the copied directory css-grid-exercise-1 Add a link to your course homepage Using CSS Grid, Build a page layout using your own custom grid dimensions.
Introduction to HTML5
Codecast Text Level Semantics Inserting Images Tables Forms
Image Optimization and Editing Lab
Raster vs. Vector Graphics 1 | 2 | 3 Tools Overview Adobe Creative Suite – Paid Subscription Adobe Illustrator – Vector Editor Adobe Photoshop – Raster Editor Corel Vector – (Formerly Gravit) – Introductory Tutorials Pixlr Suite – Raster and Vector – Tutorials Photopea – Raster Vectorpea – Vector
Introduction to Grid Principles
A Comprehensive Introduction to Grids in Web Design What is it? | Why Use it? | Resources Generate a Grid Fluid Grids Class Example (960 / 10 Col) Grid Tile (For Visual Reference) Column Dimension Reference (Pixel Reference) Codecast
Introduction to HTML5
Codecast Marking Up Lists Text Level Semantics Special Character Encoding: Details | Reference Block vs. Inline Elements Hyperlinks Inserting Images Tables Forms
Image Creation and Manipulation
Raster vs. Vector Graphics 1 | 2 | 3 Tools Overview Adobe Creative Suite – Paid Subscription Adobe Illustrator – Vector Editor Adobe Photoshop – Raster Editor Corel Vector – (Formerly Gravit) – Introductory Tutorials Pixlr Suite – Raster and Vector – Tutorials In today’s session I would like you to make sure you are familiar with Image editing tools. Many of you […]