Level: Introduction Duration: 5 Days
Time: 9:30 AM - 4:30 PM Cost: 997.00
Overview
Fast Track your HTML and CSS Skills
HTML and CSS are the very fundamentals of web design. If you’re looking to launch a career in this area, or you’d simply like the capacity to build your own sites from the ground up, you’ll need a solid education in both of these coding languages. This Fast Track 101 Yellow belt course will give you just this, beginning with basic HTML and
advancing to more complex XHTML and CSS in just five days. Afterwards you’ll be able to create your own professional-standard sites, take control of your own web presence, and be an asset to any company that requires the creation and maintenance of a small to medium site.
Description
This class provides you with the concepts and skills to use HTML, Javascript and CSS 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.
The CSS part of the class provides the web professional with the ability to control the rendering, e.g. fonts, colours, leading, margins, typefaces, and other aspects of style, of a Web document without compromising its structure using Cascading Style Sheets. Using common desktop publishing terminology, Cascading Style Sheets makes it easy for professional as well as untrained designers to make use of its features.
This class is a must for people new to web design.
Who is this course for?
People new to Web design that desire a deeper understanding of HTML and CSS, and the new standards of web design.
Assumed Knowledge
We will assume little or no prior knowledge of HTML and CSS in this course but you should have a basic working knowledge of either the Windows or Mac.
styling for print, styling a press release, making an input form look good, styling an events calendar, creating an online greeting card, bringing hyperlinks to life,
multicolumn layout, how to skin a menu, sneaking out of the box, positioning a better design and fixing your backgrounds.
* Basics of HTML and CSS
* Planning your Web Site
* Formatting
* Images and Styles
* Understanding Properties
* Working with Colours and Background Images
* The DIV Tag
* Layout and building Basic Forms
* Understand the JavaScript language.
* Understand the Document Object Model and how it is used in JavaScript.
* How to detect and respond to user actions
* Alter, show, hide and move objects on a web page
* Check information inputted into a form
* How to use CSS (Cascading Stylesheets)
Outline
• 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 A JAX?
• The W3C
• Web Standards
• Web Accessibility
• Architecture
• Site Architecture
• File & Folder Management
• Site definition
• Naming conventions
• Defining assets
• Browsers
• What is a Browser?
• Browser Statistics
• A Modern Browser
• Cross-Browser compatibility issues
• Internet Explorer 6 issues
• Mobile Browsers
• The Syntax
• Tags
• Self-closing tags
• block and inline
• The <!DOCTYPE>
• The Different DOCTYPE’s
• 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
• Style Tag
• Script Tag
• Document Structure
• Structural Elements
• Headings & Paragraphs
• Semantics
• Lists
• Nested Lists
• Data Types and Definitions
• Special Characters
• The title attribute
• Using the address tag
• cite, dfn, var, abbr
• code, kbd, samp and pre
• Quoting in HTML
• bold, strong, italic and emphasis
• Tables
• Table headers
• Adding Captions
• Merging columns and rows
• Web Images
• GIF, JPEG and PNG
• What format do I choose?
• Image attributes
• Alternate text for Accessibility
• Figure Captioning
• Hyperlinks
• The anchor tag
• Named anchors
• Relative & absolute links
• Linking to an email address
• Forms
• Forms basics
• GET vs. POST
• Text fields
• Setting Accessibility labels
• Text Area
• Check boxes
• Drop-down lists
• Radio buttons
• Radio Groups
• Upload a file
• Fieldset & accessibility
• Submit & Reset buttons
• Publishing
• Buying a Domain
• Buying hosting space
• File transfer Protocol
• Uploading files to a server
• Testing online
• Practical Exercises
• Building a “Hello World” page
• Building a small site*
CSS Introduction
• HTML Structure and Content, CSS Presentation
• Advantages of CSS
• Case, Whitespace and Comments in CSS The CSS Standards
• The Scope of CSS
• Browser Support for CSS
• CSS Hackarounds Writing CSS
• CSS Selectors
• CSS and HTML Structure
• The CSS Box Model
• The IE Box Model
• Absolute Units
• Proportional Units
• Shorthand Syntax
• Margins and Padding
• Negative Margins
• Background Images
• Classes and ID’s
• Descendant Selectors
• Group Selectors
• Block Boxes and Inline Boxes
• Block Box Behaviour
• Inline Box Behaviour Text
• Text Formatting in CSS
• Text Formatting
• Typefaces, Alternatives and Defaults
• Text Size and usability issues
• Internet Explorer Quirks
• Font Characteristics
• Setting and Using Space Within Text
• Formatting Blocks of Text Links
• Undeerstanding Link States
• Styling Link states
• Styling Internal Links
• Styling external Links
• Styling links to documents Stylesheets
• Reset.css
• Using Embedded Styles CSS Positioning
• Choosing the Right CSS
• Technique for Positioning Blocks
• The Position Property
• The Document Flow
• Static Positioning
• Relative Positioning
• Relative Positioning with specified values
• Absolute Positioning
• Fixed Positioning
• The CSS float property
• Clearing Floats
• Page Layout
• Using CSS in the Real World
• Deploying CSS
• Usability
• Readable Pages
• The Proliferation of Screens Deployment
• CSS 2.1
• CSS3
• Browser Support
• Testing
• Using Test Suites and Multiple Browsers
• Cross-platform Testing in Single-platform Environments
• CSS Help and Advice
• Authoritative Sources versus Web Myths and Gossip Practical Exercises
• Styling a simple page
• Styling a small site
