CodeHS Web Design Insider: Back-to-School Spotlights, Teaching Cohorts, and Ask AI for Free
🎒 Back to School Course Spotlights
Pick your web course for the semester. All three are below, each with a spotlight project plus links to the course and syllabus.
Web Design
Students learn HTML and CSS, move into Bootstrap and design thinking, and finish with mobile-responsive sites they built themselves.
Spotlight Project: Homepage: Your First Website. Students build a personal homepage early in the course, then keep adding links to it as they finish each project. By June it is a working portfolio.
Web Development
Best for students who already have HTML and CSS. Adds JavaScript, the DOM, jQuery, data storage, APIs, and hosting.
Spotlight Project: Build an Interactive Resume. Students create a single-page animated resume with jQuery, then evaluate layout and design theory against each other's work.
Web Design and Development
The newest of the three, combining both paths into one course. Runs from HTML and CSS through JavaScript, Firebase, APIs, web accessibility, and web security.
Spotlight Project: Challenge: Collecting User Clicks. Students implement the skills they’ve learned from the previous lessons to create a program that tracks the number of times elements are clicked.
💻 Day One: Start with an Hour of Code
The fastest way to hook a new class is to let them build something on the first day, before rosters settle and before anyone opens a textbook.
Hour of Code: Web Design runs about an hour. Students use HTML to add text, images, and color to a page and walk out having made something real. No prerequisites, and it works for both middle and high school.
Students who join your section late in the first week can complete it on their own and catch up without you re-teaching day one.
⚙️ Designing for Everyone: Accessibility Basics
Accessibility is easy to teach early and hard to retrofit later. Introducing it in the first few weeks means students build the habit into every project that follows.
Three rules students can apply immediately:
Write real alt text on every image, describing what the image shows
Use headings in order (h1, then h2, then h3) instead of picking them by size
Check color contrast between text and background before locking in a palette
Classroom Activity: Audit a Real Site
Have students run a site they use every day through the WAVE Accessibility Checker, a free checker from WebAIM. They paste in a URL and WAVE overlays icons directly on the live page, flagging missing alt text, contrast failures, and heading structure problems where they actually occur.
Assign each student a different site, then compare results as a class. Students are usually surprised that big, professional sites fail too, which turns the three rules above into real engineering constraints instead of classroom rules.
🏅 Plan Your Certification Timeline
Now is the time to decide whether your students will sit for a certification, because the practice content works best spread across the year rather than crammed in May.
Both certifications have a dedicated practice course with quizzes broken out by topic:
Web Design Level 1: Intro to the Internet, HTML, CSS, Advanced HTML and CSS
Web Development Level 1: JavaScript and the DOM, jQuery, Data Storage, Web Design and Hosting
Assign each practice section as students finish the matching module. The review lands while the content is still fresh.
🎓 CodeHS Teaching Cohorts
CodeHS is offering professional learning cohorts for the 2026-27 school year, supporting educators with guided learning, classroom strategies, and a collaborative community.
There’s still time to join us! Register before our next round of live sessions, the week of September 14th.
❓ New Ask AI Tool is Free for a Limited Time!
The new Ask AI tool is free for a limited time through September! Tell Ask AI your classroom goals to get personalized course recommendations, compare curriculum options, and discover teaching resources. You can also use Ask AI to assign lessons, answer questions about CodeHS, quickly find helpful support articles, and more.
⌨️ Vibe Coding Built for Your Classroom
Vibe Coding lets students use AI to build and refine projects through natural-language prompts, then refine the results and explore the code to understand how it works. CodeHS Pro teachers can access Vibe Coding directly in the HTML Sandbox — no additional setup needed.
Looking for ideas? Explore the Vibe Coding course and pull projects and materials into your existing classes.
💬 Stay Connected
Chat with fellow teachers in the CodeHS Facebook Group
Explore the CodeHS Web Design Hub
- The CodeHS Team