Intro to Web Design
For the OAT Program @ BCIT
This 10-day course was designed to introduce you to the fundamentals of web design. Recently, there’s been a boom in people wanting to learn how to code. They don’t necessarily want to become programmers, they just want to understand how the digital pieces fit together – how the whole thing works. To understand the web, after all, is fundamental to understanding how people live and think. Plus, it’s a lot of fun.
You’ll begin by learning some basic Hypertext Markup Language (HTML) and Cascading Style Sheets (CSS) – the two essential languages of the web. Through labs and assignments, you’ll build a variety of elements and page structures, then you’ll put it all together by creating a small website.
Since most organizations today use a Content Management System (CMS) to maintain their websites, you’ll also learn the most popular CMS, WordPress, which powers 35% of all sites on the planet.
Using WordPress, you’ll build a number of local sites based on themes, both basic and premium. Then, you’ll be given a live site that you’ll use to build your final project. This will be your creation in WordPress – you’ll use a page builder along with your CSS knowledge to design a professional-looking, multi-page website. At the end of the program, you’ll present your live WordPress site plus the one-page site that you coded earlier in HTML and CSS.
1. LEARN THE BASICS
- Use Brackets as a text editor to code web pages
- Organize and name files and folders according to web standards
- Create and link HTML pages using basic tags
- Style basic HTML tags with CSS
- Use Photoshop Elements to optimize photos for the web
2. ADD STYLES AND INTERACTIVITY
- Code and style more complex web page elements, such as grids, forms and tables
- Design and implement navigation bars
- Use CSS transitions and transforms to tastefully enhance user experience
- Design and hand-code a two-page website
- Optimize your site according to accepted principles of SEO
3. CREATE A PROFESSIONAL WEBSITE
- Explore and utilize popular features in WordPress 5.3
- Set-up Local by Flywheel – a local development environment for WordPress
- Review various WordPress themes and plugins
- Create a number of sites using basic and premium themes
- Develop one live WordPress site using custom CSS and a page builder for final presentation
Stuck on something?
Need an answer?
Check out the Resources page.
Once you learn how to ask the question, finding the answer becomes easy
Course Due Dates
Lab Assignments (5) - 20%
Santorini Project - 30%
HTML/CSS Website - 25%
WordPress Website - 25%
Lab Assignments - due noon Monday Feb 10, 2020
Santorini Project - due noon Monday Feb 10, 2020
HTML/CSS Website - due 1:00 Thursday Feb 06, 2020
WordPress Website - due 1:00 Thursday Feb 06, 2020
Materials will be distributed to you through the Learning Hub and you can use the same system to upload your assignments and projects for marking, (except for your WordPress site).
Your grades will be emailed to you by Monday, February 24, 2020
Debra Williams: email@example.com or use the form