Front-End Development Programme

This module will introduce you to the world of web and front-end development. You'll gain
insights into the routine of a typical day within a web development project.

Orientation Class
Introduction to the Program and Basics

 Intro to HTML, CSS and JavaScript.

 Developer tools
 Frameworks and libraries
 APIs and services
 What is an IDE?

Module #1

Introduction to HTML AND CSS

Introduction to HTML

Structure
1. Understanding structure
2. Learning about markup
3. Tags and elements

Text
1. Headings and paragraphs
2. Bold, italic, emphasis
3. Structural and semantic markup.

Lists
1. Numbered lists
2. Bullet lists
3. Definition lists

Links
1. Creating links between pages
2. Linking to other sites

Images
1. How to add images to pages
2. Choosing the right format
3. Optimizing images for the web
 Tables
1. How to create tables
2. What information suits tables
3. How to represent complex data in tables

Forms
1. How to collect information f XX rom visitors
2. Different kinds of form controls
3. New HTML5 form controls

Extra Markup
1. Specifying different versions of HTML
2. Identifying and grouping elements
3. Comments, meta information and iframes

Flash, Video & Audio

1. How to add Flash movies into your site
2. How to add video and audio to your site
3. HTML5 <video> and <audio> elements

Introducing CSS
1. What CSS does and how CSS works
2. Rules, properties, and values
3. Box Model

Color

1. How to specify colors

2. Color terminology and contrast
3. Background color
Layout
1. Controlling the position of elements
2. Creating site layouts
3. Designing for different sized screens
Quizes

 Knowledge Check - Getting started with HTML

 Knowledge check: CSS basics
 Module Quiz: Introduction to HTML and CSS

Hands-On Lab: HTML - Creating a Simple Web Page

Assignments
 Creating an HTML Document
 Styling a page
 Create and style a webpage