Reference:
Web Development
Course Description:
Students will learn the fundamentals of web development by designing and creating responsive websites using HTML and CSS. Through authentic projects, students will develop technical skills while strengthening the BC Core Competencies of Communication, Creative Thinking, and Critical & Reflective Thinking.
Big Ideas
Communication
Digital technologies provide opportunities to communicate information, ideas, and experiences to diverse audiences.
Creative Thinking
Design thinking and creativity are essential for developing engaging and effective web experiences
Critical & Reflective Thinking
Web developers use problem-solving, testing, and reflection to improve digital products and user experiences.
Module 1: Introduction to Web Development (Week 1)
Topics
-
What is web development?
-
How websites work
-
Front-end vs. back-end development
-
Digital citizenship and online ethics
BC Competency Focus
Communication
Assessment
-
Career exploration activity
-
Digital citizenship reflection
Module 2: HTML Fundamentals (Week 2)
Topics
-
Structure of a webpage
-
Headings, paragraphs, lists
-
Images and hyperlinks
-
Semantic HTML
BC Competency Focus
Communication
Assessment
-
Personal profile webpage
Module 3: Website Planning and Design (Week 3)
Topics
-
Design process
-
Target audience
-
Wireframing
-
Layout principles
BC Competency Focus
Creative Thinking
Assessment
-
Website proposal and wireframe
Module 4: CSS Styling Basics (Week 4)
Topics
-
CSS syntax
-
Colors and typography
-
Backgrounds and borders
-
Visual hierarchy
BC Competency Focus
Creative Thinking
Assessment
-
Styled personal webpage
Module 5: Layout and Responsive Design (Week 5)
Topics
-
Flexbox
-
Responsive layouts
-
Mobile-friendly design
-
Media queries
BC Competency Focus
Critical Thinking
Assessment
-
Responsive webpage challenge
Module 6: Accessibility and User Experience (Week 6)
Topics
-
Inclusive design
-
Accessibility guidelines
-
Navigation design
-
User testing
BC Competency Focus
Communication & Critical Thinking
Assessment
-
Accessibility audit
Module 7: Introduction to JavaScript (Week 7)
Topics
-
Variables
-
Functions
-
Events
-
Interactive web elements
BC Competency Focus
Critical Thinking
Assessment
-
Interactive webpage activity
Module 8: Multimedia and Content Development (Week 8)
Topics
-
Images and optimization
-
Video and audio embedding
-
Copyright and attribution
-
Effective web content
BC Competency Focus
Communication & Creative Thinking
Assessment
-
Multimedia webpage
Module 9: Website Development Project (Weeks 9–10)
Topics
-
Project planning
-
Coding and implementation
-
Testing and debugging
-
Peer feedback
BC Competency Focus
All Three Competencies
Assessment
-
Development checkpoints
-
Peer review
Module 10: Final Presentation and Reflection (Week 11–12)
Topics
-
Website showcase
-
Reflection on learning
-
Portfolio development
BC Competency Focus
Communication, Creative Thinking, Critical & Reflective Thinking
Assessment
-
Final website project
-
Presentation
-
Self-assessment reflection
Suggested Assessment Breakdown
Assessment Category
Weight
Coding Exercises & Labs
25%
Design Activities
20%
Quizzes & Reflections
15%
Final Website Project
30%
Presentation & Portfolio Reflection
10%
Final Capstone Project
Students design and develop a multi-page responsive website that:
-
Uses HTML and CSS correctly
-
Demonstrates accessibility principles
-
Targets a specific audience and purpose
-
Includes original content and media
-
Is presented to classmates with a reflection on design decisions and learning growth