<<

INTRODUCTION TO WEB DEVELOPMENT CURRICULUM

SESSION DESCRIPTION OF SESSION OBJECTIVES What is HTML? Basic document structure of HTML, Introduction to HTML Anatomy of elements of HTML, 01 Heading and its types in HTML, How to create Paragraphs, Learn to style in HTML

Learn to format HTML text: Create Bold, Italic, Underlined, 02 HTML formatting Strikethrough, Superscript, Subscript, Inserted and Deleted text, Monospace font

Play with the HTML text some more and create: larger text, smaller text, HTML Text 03 emphasized text, Marked text. Learn the concept of grouping content.

Create an HTML page/doc keeping in mind: HTML tags, choose a suitable font size for heading, subheading and the content. 04 Mini Project - 1 Use the paragraph tag to structure your content. Use different formatting tags to make your HTML page appealing.

Strong text, Text abbreviation, acronym element, text direction, special terms, HTML Phrase tags 05 quoting text, short quotations, text citations

HTML Images & Tables Inserting images, set image width/ 06 height, , tables, list, blocks

Creating story book: Use HTML table tag to create a structure of the book. 07 Mini Project - 2 Using image and phrase tags to create a storyline. Use HTML formatting text and font tags to elaborate your story.

Overview of CSS Getting familiar with Syntax, type 08 CSS-1 selectors, descendant selectors, universal selectors, class selectors, ID selectors, attribute selectors and child selectors in CSS.

Inline styling, internal CSS, external CSS, 09 CSS-2 introduction store style and link elements,Imported CSS

CSS color property,background, text CSS -3 10 font property,margin , padding.

Story Book Editing Give it a border line, margin and padding 11 Mini project-3 using CSS style sheets. Optional - also you can add some images (like logo for your page

Explore the various Form elements Input element, 12 Html forms-1 Text input, And Buttons types- radio button input, submit button,

Learn the various attribute types in a form - 13 Html forms - 2 Action attribute, Target attribute, Method attribute

Uses of GET and POST, 14 Html forms - 3 Name Attribute, grouping the form data with field set

Create a subscription form for your Mini project - 4 15 storybook page

16 FlexBox CSS FlexBox Layout Module

Learn about using background gradients Background Gradients and Favicon 17 and favicon

Learn about using IFrames and Opacity IFrames and Opacity/Hover Effects 18 /Hover Effects

Learn about creating Layout Website Layout 19 Model

Learn about creating canvas in HTML Html graphics-1 20 page

21 Html graphics -2 Learn about

Learn about adding Html media , audio, Html Media 22 videos

Geolocation (GPS), drag & drop, web Html API 23 storage

Discussing debugging. Debugging tips & Emendation 24 Emendation

Minor Project 1 Student’s initiative under teacher’s 25 guidance project

Student’s initiative under teacher’s Quiz on HTML and CSS 26 guidance project

Making a form -using radio buttons Project -2 27 -adding submit button -text and password input

-Setting the background sound using the Interactive elements, Working with audio element 28 -Using the video element Multimedia -Embedding a video file from other website

-Incorporating Javascript in the head and body elements Overview of Javascript 29 - Introduction to use an external file

-Working with functions 30 Javascript Functions, Events -Working with on click, onload, mouse and on submit event

31 Image Maps -Working with image maps

32 Animations -Working with animations

33 Javascript Objects-I -Working with tempelates of an Object

-Working with String, Boolean, Number, Javascript Objects-II 34 Array, Date and Math Object

Working with browser and document -Working with Window, Navigator, 35 objects & History, Screen and Location Object

Create a simple multiplication table 36 Project -2 asking the user the number of rows and columns he/she wants

- Validating forms -Using regular expressions to validate Validation, Errors, Debugging 37 email address, mobile number, card number, etc

-Handling exceptions using try-catch 38 Exception Handling and security statement -Using onerror event

-Create a sample form program which collects first_name, last_name, email, 39 user_id, and password and confirms password from the user -All the inputs are mandatory and email Project-3 should be in correct format -Also, the values entered in the password and confirm password textboxes should be the same -Also display proper error message if there is any error

40 Mini project-1 -Showing a popup message using EVENT

-Working with display and visibility Displaying and Positioning of an property 41 element -Working with element

42 Floating an element -Fixing positions of the element

-Using the UI Element States, Structural Pseudo classes 43 and Negation pseudo classes

-Using first-line, first-letter, before and Pseudo elements 44 after pseudo element

45 Project -4 -Making the clumsy bird game

-Hosting the webpage 46 Web Hosting -Basics of server -Free website hosting

47 Self Made Project

48 Self Made Project