Mobile First Design and Introduction to Schema
Mobile-First Approach Codecast Microdata Overview Schema vs. JSON-LD https://jsonld.com/ JSON Resume Structured Data Markup Helper
Author Archives: thomas.wallace@gmail.com
Introduction to CSS
Quiz Homework Q&A Validating your HTML Introduction to CSS Adding style to your page: Type, Class, and ID Selectors Creating and attaching a Stylesheet Codecast | Source Color and Typography Understanding Color | Kuler Write down your Color Codes
Project Status Updates and Q&A
Continue working on the Individual Web Project. You should use your class time to ask questions and troubleshoot issues with your classmates.
Introduction to Media Queries
Technical Specifications Explanation | Guide Codecast | Live View Viewport Metatag | Reference BreakPoint Reference by Device Demo Adding Media queries to our Fluid Grid
Setting Up Our Work Environment
Create a Github Account and verify your email address. Create a Repository using these instructions. Login to Gitpod.io with your Github credentials. (Optional) Add the gitpod browser extension to your browser if you want to be able to launch any repository directly form GitHub. In Gitpod, Click New Repository Button and select the repository we created in step […]
Individual Web Project Lab
Today you should wrap up the planning/brainstorming for your class project and begin design work on your project.
Fluid Grids
The Flexible Grid Codecast Converting Static Grids to Responsive Grids The Future of the Grid CSS Grid Spec Explained
Introduction to HTML5
Codecast Forms Sectioning an HTML Document using DIVs Sectioning using HTML5 Structural Elements Semantic and Structural Elements Obsolete and Redefined Elements What is Validation?
Individual Web Project
Finalizing your page template Duplicating pages for your site Individual Web Project Choose one of the two micro-site projects or create your own and post the url to your GitHub me by March 7, 2023. Starter HTML (You do not have to use this, provided for reference) SpaceX Dragon Micro-site Project Segway Centaur Micro-site Project
Grid-Based Design
A Comprehensive Introduction to Grids in Web Design What is it? | Why Use it? | Resources Generate a Grid Class Example (960 / 10 Col) Grid Tile (For Visual Reference) Column Dimension Reference (Pixel Reference) Codecast