Website Designing Course Online

Website Designing Course Description – Join Now

The Skill Pedia’s Website Designing Course introduces HTML5, CSS3 and responsive web design to web designers and developers. Attendees learn the HTML, CSS and JQuery skills needed to create professional looking web pages that will render on any screen, laptop, phone, tablet or desktop.

HTML5 and CSS3 is the next big thing in the world of web development. HTML5 has risen to the status of a core markup language due to a number of new attributes and elements that are apt for use in professional websites.

Website Designing Course Objectives

All students will learn how to:

  • Use HTML5 & CSS3 to design responsive websites that render well on all devices and browsers.
  • Work with images, including thumbnails, rollovers, and image maps
  • Create and format tables
  • Create and Validate Forms using HTML5
  • Add audio and video to your web pages
  • Use embedded fonts from third party website like google fonts
  • Format web pages for printing
  • Use advanced CSS3 features to enhance & beautify the web page.
  • Use JavaScript and jQuery to enhance web pages

Detailed Course Contents – Join Now

Introduction to WEB

  • W3C and W3C Members
  • Why WHATWG?
  • What is Web? 

HTML Basics

  • Introduction
  • Parts in HTML Document
  • Attributes
  • Headings
  • Paragraphs
  • Formatting
  • Links
  • Head
  • CSS
  • Images
  • Tables
  • JavaScript
  • HTML XHTML
  • HTML4 Drawbacks 

HTML5 Introduction

  • New Features and groups
  • Backward Compatibility
  • Why HTML5?
  • Common Terms in HTML5 

HTML5 Syntax

  • The DOCTYPE:
  • Character Encoding: 

HTML5 New Elements

  • New Semantic/Structural Elements
  • <article>
  • <aside>
  • <bdi>
  • <command>
  • <details>
  • <dialog>
  • <summary>
  • <figure>
  • <figcaption>
  • <footer>
  • <header>
  • <mark>
  • <meter>
  • <nav>
  • <progress>
  • <ruby>
  • <rt>
  • <rp>
  • <section>
  • <time>
  • <wbr>   

HTML5 Canvas

  • What is Canvas?
  • Create a Canvas
  • Canvas Coordinates, Paths, Text, Gradients and Images 

HTML5 SVG

  • What is SVG?
  • SVG Advantages
  • Differences Between SVG and Canvas
  • Comparison of Canvas and SVG 

HTML5 Drag/Drop

  • Introduction
  • Make an Element Dragable
  • What to Drag? Where to Drop? 

HTML5 Geo location

  • Introduction
  • Locate the User’s Position+
  • Handling Errors and Rejections
  • The getCurrentPosition()
  • Geolocation object 

HTML5 Video

  • Introduction
  • Video on the Web
  • How It Works?
  • Video Formats and Browser Support
  • HTML5 Video Tags 

HTML5 Audio

  • Introduction
  • Audio on the Web
  • How It Works?
  • Audio Formats and Browser Support
  • HTML5 Audio Tags 

HTML5 Input Types

  • Introduction
  • color
  • date
  • datetime
  • datetime-local
  • email
  • month
  • number
  • range
  • search
  • tel
  • time
  • url
  • week 

HTML5 Form Elements

  • <datalist>
  • <keygen>
  • <output>  

HTML5 Form Attributes

  • New attributes for <form> and <input>New attributes for <form>:
  • autocomplete
  • novalidate 

New attributes for <input>

  • autocomplete
  • autofocus
  • form, formaction
  • formenctype,formmethod
  • formnovalidate
  • formtarget
  • height and width
  • list, min and max
  • multiple
  • pattern (regexp)
  • placeholder
  • required, step 

HTML5 Semantic

  • Introduction
  • What are Semantic Elements?
  • non-semantic elements: <div> and <span>
  • semantic elements: <form>, <table>, and <img>
  • New Semantic Elements in HTML5
  • <header>
  • <nav>
  • <section>
  • <article>
  • <aside>
  • <figcaption>
  • <figure>
  • <footer> 

HTML5 Web Storage

  • What is HTML5 Web Storage?
  • Browser Support
  • The localStorage Object
  • The sessionStorage Object 

HTML5 App Cache

  • What is Application Cache?
  • Cache Manifest Basics
  • HTML5 Cache Manifest 

HTML5 Web Workers

  • What is a Web Worker?
  • Check Web Worker Support
  • Create a Web Worker File
  • Terminate a Web Worker 

HTML5 SSE

  • One Way Messaging
  • Browser Support
  • The EventSource Object 

HTML Media

  • New Media Elements
  • <audio>
  • <video>
  • <source>
  • <embed>
  • <track>  

HTML Multimedia

  • What is Multimedia?
  • Browser Support
  • Multimedia Formats
  • Video Formats
  • Sound Formats 

HTML5 – MathML

  • Introduction
  • Using MathML Characters
  • Matrix Presentation
  • Math Formulas 

CSS3

  • Introduction
  • CSS3 Modules
  • Selectors
  • Box Model
  • Backgrounds and Borders
  • Text Effects
  • 2D/3D Transformations
  • Animations
  • Multiple Column Layout
  • User Interface 

Borders

  • border-radius
  • box-shadow
  • border-image 

CSS3 Backgrounds

  • background-size
  • background-origin 

CSS3 Text Effects

  • text-shadow
  • word-wrap 

CSS3 Fonts

  • @font-face Rule
  • font-stretch
  • font-weight 

CSS3  Transforms

  • How Does it Work?
  • Browser Support
  • 2D Transforms
  • translate(), rotate(), scale() and
  • skew()
  • matrix() 
  • rotateX(), rotateY() 

CSS3 Transitions and Animations

  • How does it work?
  • transition-property, duration and delay 
  • CSS3 @keyframes Rule
  • Browser Support
  • Animation, animation-duration 

CSS3 Multiple Columns

  • column-count, column-gap and column-rule 

CSS3 User Interface

  • resize
  • box-sizing
  • outline-offset

JavaScript

  • The Email List application in JavaScript
  • Introduction to jQuery
  • The Email List application in jQuery
  • How to use jQuery as a non-programmer

Join Now

January 24, 2019

0 responses on "Website Designing Course Online"

Leave a Message

Featured Testimonial

I would like to mention a new feature "Interactive Video". You can't simply watch the video. You have to actually get involved. It will pause suddenly and ask question. If you are not able to answer the question you have to watch it all over again. Hence a real learning is guaranteed.Read more

Indiana Jones

Co-Founder Director

Certificate Code

Become an Instructor

top
Designed by  © Alliance Softech Pvt Ltd. All rights reserved.
WhatsApp chat
X