Become The Perfect Front End Developer With Html5/Css3/Js

Learn how to build responsive websites in HTML and CSS and Wordpress themes using HTML5, CSS3, JS and Boostrap

What you'll learn
develop HTML documents
implement HTML5 feature in front end development
include media in HTML pages
Use CSS to set the style of HTML elements in HTML files
Use CSS3 to format the background of HTML elements
Use CSS3 to do animations in CSS
Develop responsive web pages
Develop web pages with Javascript code
Generate optin forms in web pages
Use the Bootstrap framework to create responsive web pages fast
Develop Wordpress themes
Debug web pages (including HTML, CSS and Javascript)
Upload scripts and their folder structure to a server
Customize HTML pages with CSS
Develop a full web site in HTML5, CSS3 and Javascript
Include special fonts and icons in web pages
Perform @media queries in CSS stylesheets
Requirements
basic knowledge of Microsoft Windows or iOS for MAC
Description
The aim of this course is to give you all the fundamental knowledge to become a front end developer.With front end development I mean the development of web pages. This is done with programs e.g. HTML, CSS and Javascript.You will get familiar with the definitions and properties define in HTML and in particular those relative to the latest HTML5 version.You will know how to embed audios, videos, SVG, Flash and PDF files into your HTML pages.I will show the main CSS properties and functions, focusing also on the latest CSS3 version.You will be then able to set shadows and backgrounds with gradients and even do animations in CSS.You will get acquainted with Javascript and create HTML forms with Javascript validation scripts.I will show you how to create responsive web design so that your web pages will look good also on devices e.g. tables, iPads and smartphones.We will do exercises using the Bootstrap framework to create responsive web pages fast.At the end you will be able to create also Wordpress customized themes.During the course we will go through the W3C recommendations and create valid XHTML pages.I am sure that at the end you will be able to develop your own web sites.

Overview

Section 1: Introduction

Lecture 1 About the author

Lecture 2 Introduction

Lecture 3 Instructions - the structure of each lecture in this course

Lecture 4 Instructions - how to access the resources of a lecture and how to use them

Lecture 5 Why HTML

Lecture 6 The W3C and its recommendations

Lecture 7 Tools to use

Section 2: HTML Basics

Lecture 8 Introduction

Lecture 9 Overview web development

Lecture 10 Overview of an HTML basic file

Lecture 11 XHTML

Lecture 12 HTML tags

Lecture 13 HEAD: How to add a reference to an external javascript file

Lecture 14 HEAD: How to add a reference to an external stylesheet

Lecture 15 HEAD: Include meta tags

Lecture 16 HEAD: How to add an icon to your web page

Lecture 17 HEAD: other META elements

Lecture 18 BODY: Where your content is

Lecture 19 The HEADER

Lecture 20 Headers and Articles

Lecture 21 The FOOTER

Lecture 22 Exercise: Create an HTML document with one article

Section 3: HTML elements

Lecture 23 Introduction

Lecture 24 Layout preparation

Lecture 25 The Table element

Lecture 26 Format an HTML Table

Lecture 27 Format the text of a Table and center it in a DIV block

Lecture 28 Format Text in HTML

Lecture 29 Merge cells in an HTML Table

Lecture 30 The BR element: add a line break to text

Lecture 31 The HR element: add a line to separate sections

Lecture 32 The IFRAME element

Lecture 33 HTML Symbols

Lecture 34 Headlines and Paragraphs

Lecture 35 The DIV element

Lecture 36 The SPAN element

Lecture 37 Sections

Lecture 38 The NAV element

Lecture 39 The Menu and MenuItem elements

Lecture 40 The IMG element

Lecture 41 Lists in an HTML documents

Lecture 42 Links in HTML

Lecture 43 Redirection ways with HTML Links

Lecture 44 Links with images

Lecture 45 Use Links to redirect to content in the same page

Section 4: HTML Forms

Lecture 46 Introduction

Lecture 47 Forms: Overview

Lecture 48 Forms: create our first form

Lecture 49 Forms: The Input type Text

Lecture 50 Forms: Insert and distribute more Input boxes of type text

Lecture 51 Forms: Include default values or help texts to Input boxes of type Text

Lecture 52 Forms: The Select object

Lecture 53 Forms: The select object: interact with the user

Lecture 54 Forms: Dummy and Default items in a Select element

Lecture 55 Forms: Radio buttons

Lecture 56 Forms: Checkboxes

Lecture 57 Forms: Text Area

Lecture 58 Forms: Buttons

Lecture 59 Forms: Submit Buttons

Section 5: Media elements

Lecture 60 Introduction

Lecture 61 Media and Audio in HTML5

Lecture 62 Video objects in HTML5

Lecture 63 Helpers/Plugins: The Object element

Lecture 64 Helpers/Plugins: The Embed element

Lecture 65 Embed a Flash element

Lecture 66 Embed a Youtube Video

Lecture 67 Embed Pdf and SVG files

Lecture 68 Canvas

Lecture 69 SVG elements

Section 6: CSS and CSS3

Lecture 70 Introduction

Lecture 71 Overview of CSS

Lecture 72 Where to specify CSS for an HTML file

Lecture 73 Override styles definitions

Lecture 74 Style vs Class

Lecture 75 Extend classes with inline styles

Lecture 76 Change the default style of the HTML elements

Lecture 77 Define the style to all the elements in an HTML file

Lecture 78 Define the style of HTML elements identified by an id

Lecture 79 Assign more classes to an HTML element

Lecture 80 Use the @font-face function to add fonts to your web page

Lecture 81 The Box Model

Section 7: CSS Properties

Lecture 82 Introduction

Lecture 83 The Border property

Lecture 84 The Border radius property

Lecture 85 The Box Shadow property

Lecture 86 The Border Image property

Lecture 87 The Border Collapse and Border Spacing properties

Lecture 88 The Border Style property

Lecture 89 Set the background color of HTML elements

Lecture 90 Set an image as background to an HTML element

Lecture 91 Customize the image background of an HTML element

Lecture 92 Set transparency to backgrounds and borders

Lecture 93 Set the transparency with the opacity property

Lecture 94 Set the margins of an HTML element

Lecture 95 The Padding property

Lecture 96 The Outline property

Lecture 97 The Clip property

Lecture 98 Exercise: Create an HTML page with a table

Section 8: Format objects

Lecture 99 Format text with CSS

Lecture 100 Format paragraphs

Lecture 101 Format long text in a container

Lecture 102 Add shadow to text

Lecture 103 Format HTML Links

Lecture 104 Format HTML Links using CSS classes

Lecture 105 Turns HTML Links into Buttons

Lecture 106 Format Lists

Lecture 107 Customize the list style

Lecture 108 Applications of HTML lists and classes for lists

Lecture 109 Custom classes and hierarchy

Lecture 110 Customize the default styles for HTML tables and their children (tr, td, ..)

Lecture 111 styles of native child elements of parents with CSS classes

Lecture 112 Subclasses and inheritance of styles

Lecture 113 Style of elements within or after a parent element

Lecture 114 Exercise: Create an HTML document with a list of links

Section 9: Position HTML elements with CSS

Lecture 115 Introduction

Lecture 116 Center HTML elements

Lecture 117 Ditribute HTML elements horizontally

Lecture 118 Position HTML elements vertically in the middle

Lecture 119 Position elements as fixed

Lecture 120 Relative position of HTML elements

Lecture 121 Absolute position of HTML elements

Lecture 122 Overlap HTML elements

Lecture 123 The Overflow property

Lecture 124 Display elements: inline, inline-block, block

Lecture 125 Use the display property to turn a DIV into a table

Lecture 126 Overview of other values for the display property

Lecture 127 Hide and show elements

Lecture 128 Set a background image for the body the attachment property

Lecture 129 Transform elements

Lecture 130 The height of elements: 100% and auto

Lecture 131 Size constraints: Max-width, max-height, min-width, min-height

Lecture 132 The box-sizing property

Lecture 133 Exercise: Create an HTML page with DIV elements

Lecture 134 Exercise: Create an optin form on overlay

Section 10: Create Special Effects with CSS

Lecture 135 Introduction

Lecture 136 Set the background of HTML elements with linear gradients

Lecture 137 Overview of CSS3 gradients

Lecture 138 Animations with CSS3

Lecture 139 Draw diagonal stripes with CSS

Lecture 140 Generate Tooltip Text with CSS

Lecture 141 Use the Abbreviation element to create Tooltip effects with CSS

Lecture 142 Filters for images in CSS

Lecture 143 Create triangles and arrows with CSS

Lecture 144 Application with CSS triangles: create tooltips and baloons

Lecture 145 Exercise: Create an HTML page with DIV elements

Section 11: Format Form elements in CSS

Lecture 146 Introduction

Lecture 147 Format input elements with CSS

Lecture 148 Customize the style when an input element get the focus

Lecture 149 Assign style to input elements with CSS class or by id

Lecture 150 Format select objects

Lecture 151 Format checkboxes and radio buttons

Lecture 152 Special dropdowns

Lecture 153 Exercise: Create an HTML document with customized form

Section 12: CSS Selectors

Lecture 154 Introduction

Lecture 155 The Before and After Selectors

Lecture 156 The Hover Selector

Lecture 157 Selectors for Tables and DIVs

Lecture 158 The Active selector

Lecture 159 The attribute selector

Section 13: Responsive Design

Lecture 160 Introduction

Lecture 161 Responsive Web Design

Lecture 162 The Viewport and the HTML settings

Lecture 163 Recommendations

Lecture 164 Understand the CSS @media function

Lecture 165 Customize styles of text and blocks for different resolutions

Lecture 166 Responsive HTML Tables

Lecture 167 Responsive Images

Lecture 168 Responsive Videos

Lecture 169 Responsive Frameworks

Lecture 170 Exercise: Create a responsive HTML page with a table and media

Section 14: Need To Know

Lecture 171 Introduction

Lecture 172 CSS Units

Lecture 173 Vendor-prefixed properties

Lecture 174 Use conditional comments for Internet Explorer Browser Versions

Lecture 175 Encode URLs and HTML entities

Lecture 176 Charsets

Lecture 177 UTF-8 Icons

Lecture 178 HTTP Messages

Lecture 179 HTTP Methods

Section 15: Applications

Lecture 180 Introduction

Lecture 181 Create your first web page using the Bootstrap framework

Lecture 182 Applications with overlays

Lecture 183 Create an Optiin form

Lecture 184 Display videos on overlay

Lecture 185 Create buttons customizing DIV elements

Lecture 186 Create buttons customizing LINK elements

Lecture 187 Using Bootstrap defined buttons and customize them

Lecture 188 Create an horizontal menu

Lecture 189 Create nice vertical menus

Lecture 190 Put it All together

Lecture 191 Exercise: Do it yourself

Section 16: Application with Wordpress: Create your first Wordpress Theme

Lecture 192 Introduction

Lecture 193 Install Wordpress

Lecture 194 Choose and set the Wordpress Theme

Lecture 195 Customize the body of an existing Theme

Lecture 196 Customize the header of an existing Theme

Lecture 197 Customize the style of a Theme and create your own

Section 17: Fundamental Knowledge of Javascript

Lecture 198 Introduction

Lecture 199 What is Javascript

Lecture 200 Javascript in JS files and in the HTML code as script

Lecture 201 Variables

Lecture 202 Functions

Lecture 203 Use Javascript to display and hide HTML elements

Lecture 204 Use Javascript to get the values of attributes of HTML elements

Lecture 205 Use Javascript to interact with a form

Lecture 206 Example of form validation script

Lecture 207 Manage the events in input elements in a form with Javascript

Lecture 208 Use Javascript to change the CSS style of HTML elements

Lecture 209 Exercise: Add Javascript code to an existing HTML document

Lecture 210 Conclusions

Lecture 211 Last words

Section 18: Special Bonuses

Lecture 212 FireBug: The tool to debug your scripts

Lecture 213 Filezilla - Upload your files

Lecture 214 XHTML Validator

Lecture 215 Where to find nice web fonts

who has basic knowledge of the Inernet,who knows how to use a text editor,who has basic knowledge of Microsoft Windows or iOS for MAC