Build Web Pages Workshop, Learn HTML and CSS

Full-Day Workshop

Build Web Pages

Learn HTML and CSS

Get in touch

Overview

In this workshop, you will learn everything necessary to build basic websites. The code of every website is split into three layers: Structural, Presentational and Behavioral. We'll explore two of the three layers: HTML (Structural) and CSS (Presentational), which are critical for any type of web professional.


Prerequisite knowledge

Basic computer skills including using web browsers.


Syllabus

0. Introduction

An intro to the workshop structure and plan, which will train the student in the languages they will use — HTML and CSS — as well as the skills you'll need to build websites. Along the way, the student build real-world projects, including page designs that morph to fit different size devices like a mobile phone, a tablet, or a large monitor. Also, we will introduce them to the program Slack community, to give student developers and program staff a real-time chat environment for discussing the workshop. If they need assistance building a professional profile, creating a resume, or expanding their professional network we have a long list of resources to help them out.

1. My First Web Page (Intro to HTML)

You will customise a personal online profile by adding graphics, formatting text, and improving the look of a web page. Share your finished project on GitHub, a website used by teams of programmers to share and work on programming code.

2. Style my Web Page (Intro to CSS)

CSS is an important language in a Front End Web Developer’s toolbox. It's used by developers to style web pages. Create a style guide that can act as your own personal and custom Bootstrap that you can drop into any of your projects to speed up styling, layout and development in general.

3. Mobile-first Responsive Layout

Designing web pages that look and function well on multiple screen sizes is an essential skill for a web developer. Using HTML, CSS, and responsive design, you'll create a mobile-first web page with a layout that adjusts to fit mobile phones, tablets, and desktop displays.

4. Work with Forms and Tables

Web forms and tables appear everywhere online. Forms allow users to order books, sign up for websites, and post to Facebook. Also, tables allow us to show data on websites. This project challenges you to build a responsive, mobile-first registration form and table using a variety of HTML form elements.

Get in touch