HTML Fundamentals — A 3 day course
Synopsis
This class provides you with the concepts and skills to use HTML effectively. You get hands-on practice working with basic through advanced techniques to get the most out of your experience.
You will learn the basics of coding for web design, beginning with HTML and advancing to more complex XHTML and CSS fundamentals.
Objectives
Upon successful completion of this course you'll have learnt:
- Basics of HTML and CSS
- Planning your Web Site
- Formatting
- Images and Styles
- Understanding Properties
- Working with Colors and Background Images
- The DIV Tag and Layout
- Building Basic Forms
Suitable For
People new to Web design that desire a deeper understanding of HTML, and the new standards of web design.
Prerequisites
We will assume little or no prior knowledge of HTML and CSS in this course. Before attending this course you should have:
- Basic working knowledge of using Windows or Mac
Publicly scheduled dates, locations, and prices
A schedule of dates for this subject is not currently available. Please call 0333 210 0140 or use our contact form to enquire about places and availability.
Contents
Introduction
- The World Wide Web
- Client Side vs. Server Side
- The web technologies
- Evolution of the World Wide Web
- What is Web 2.0
- Workings of HTTP
- The fundamentals of the web
- What is AJAX?
- The W3C
- Web Standards
- Web Accessibility
Browsers
- What is a Browser?
- Browser Wars
- Netscape to Chrome
- Browser Statistics
- A Modern Browser
- Cross-Browser compatibility issues
- Internet Explorer 6 issues
- Mobile Browsers
The Syntax
- A self-closing tag
- block vs. inline
- Site Architecture
- File & Folder Management
- Site definition
- Naming conventions
- Defining assets
The DOCTYPE
- The Different DOCTYPEs
- What is a DOCTYPE
- HTML5 DOCTYPE
- The DTD
- XML declaration issue
- XHTMLising your code
- Document Object Model
- HTML5 Default options
The HEAD
- Adding Meta tags
- Keywords, Descriptions and Refresh
- The Character Set
- HTML Comments
- Script Tag
The CSS in HTML
- Deprecated Style tags
- Linking to CSS
- Defining Media type
The BODY
- HTML tags & elements
- Deprecated tags
- Semantics in the language
- Page Structure
- Headings & Paragraphs
Semantic Tags
- Ordered & Un-Ordered Lists
- Nested Lists
- Data Types and Definitions
- Special Characters
- adding title attribute
- using cite, dfn, var, abbr
- using code, kbd, samp and pre
- Quoting in HTML
- bold, strong, italic and emphasis
Tables
- Table headers
- Accessibility in Tables
- Nesting Tables
- Adding Captions
- Merging columns and rows
Web Images
- GIF vs JPEG vs PNG
- What the future holds
- SVG and Canvas
- When to use what image format?
- Image attributes
- Alternate text for Accessibility
- Figure Captioning
Hyperlinks
- The anchor tag
- Jump links to an ID
- relative & absolute links
- server side relative linking
- open new tabs
- Linking to an email address
Forms
- GET vs. POST
- action method
- Text fields
- Setting Accessibility labels
- Text Area
- Check boxes
- Drop-down lists
- Radio buttons
- Radio Groups
- Upload a file
- Fieldset & accessibility
- Submit & Reset buttons
- Javascript form onclear
HTML5 in Forms
- email, url, date, week input types
- time, datetime, month input types
- number, range and search input types
- tel & color input type
- list, autofocus and required attributes
- multiple, pattern and autocomplete
- min, max and step
HTML5 Video
- Browser Codecs
- encoding in H264
- encoding in Ogg Theora
- encoding in VP8
- Using the tag
- A Fallback system for legacy browsers
Publishing
- Buying a Domain
- Buying hosting space
- File transfer Protocol
- Uploading files to a server
- Testing online