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, Links, 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 Website Layout Website Layout 19 Model Learn about creating canvas in HTML Html graphics-1 20 page 21 Html graphics -2 Learn about Scalable Vector Graphics 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 javascript 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 & document object model 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.