Designing for Web Using Markup Language and Style Sheets

Size: px

Start display at page:

Download "Designing for Web Using Markup Language and Style Sheets"

Elijah May
5 years ago
Views:

1 Module Presenter s Manual Designing for Web Using Markup Language and Style Sheets Effective from: July 2014 Ver. 1.0

2 Amendment Record Version No. Effective Date Change Replaced Pages 1.0 July 2014 New - Presenter s Manual Aptech Limited Page 2

3 TABLE OF CONTENTS INTRODUCTION DESIGNING FOR WEB USING MARKUP LANGUAGE AND STYLE SHEETS... 4 MODULE - SESSION ALLOCATION... 6 MODULE DELIVERABLES... 7 WEEK WISE SCHEDULE... 9 SESSION COVERAGE...10 Presenter s Manual Aptech Limited Page 3

4 Introduction Designing for Web Using Markup Language and Style Sheets At the end of this module, the student will be able to: Explain the evolution of the Internet Explain the history of HTML, features of HTML 5, its layout on a Web page, and its different elements Describe CSS and its functioning Explain the importance of HTML5 in mobile applications Apply headings using hrgroup element in HTML Apply background properties such as colors and images using HTML coding Apply hyperlinks to an address and other types of content Apply hyperlinks using the anchor element in an HTML document List the CSS modules Explain the CSS syntax Explain various CSS length measurement units Explain and apply different types of style sheets an selectors Apply styles to hyperlinks Use and apply text and font styles Use and apply properties of inline elements Use and apply border styles and various shorthand properties Explain the important characteristics defining a graphic format Explain the various graphic formats recommended for the Web Insert various elements related to graphics in HTML Use and apply image sizing and padding properties for graphics Use and apply thumbnails for graphics Use and apply CSS transitions and animation into HTML Explain semantic tags and the elements of a semantic layout Explain the navigation bars and use image maps Explain divisions and its positioning and formatting Create tables using HTML coding Use formatting elements such as table headings, colspan attribute, rowspan attribute. Alignments, margins, and caption Change the table size and width of a column Apply the Merge Cells feature Apply borders to a table Presenter s Manual Aptech Limited Page 4

5 Use and apply new features in HTML 5 Work with forms in HTML 5 Apply the audio elements in HTML 5 Apply the various tags and attributes in the audio element Use the video element in HTML 5 Use various attributes in the video element Convert video files into the required format Classify browsers that support the video element Explain different types of mobile devices Explain various mobile platforms Explain the various design aspects of mobile Website Explain architectural aspects while designing a Website for mobiles Presenter s Manual Aptech Limited Page 5

6 Module - Session Allocation Module Duration Skill Book Code Name Theory Lab Total Code Code Name Designing for Designing for Web Using Web Using Markup Markup Language Language and Style and Style DML Sheets OV-DML0001 Sheets Grand Total Tool HTML5 and CSS3 Presenter s Manual Aptech Limited Page 6

7 Module Deliverables This module deliverables are available on OnlineVarsity To aid the teaching process, following are the deliverables Faculty Deliverables: 1. Presenter Manual (PM) To aid the learning process, following are the deliverables Student Deliverables: 1. (ebook) Resources available on OnlineVarsity for Students: Icons Feature - Description / Functionality Availability Download Book - Student has the option to download Available the subject related e-book and read offline Glossary - Student can access a list of subject related specialized words with their definitions. Available FAQ - Student can access frequently asked questions and their answers Available Show Me How - Student can view a step-wise simulation / demonstration of the module related topics. Not Applicable - Student can solve scenario based lab assignments (Hands-on). The faculty will evaluate and give their feedbacks. Available Presenter s Manual Aptech Limited Page 7

Available Feedback - Student can provide feedback on the course material Available Ask to Learn Student can submit

8 Download Source code / Files Student can download courseware related source files. Not Applicable References - Student can access additional subject related material for reading. Available Feedback - Student can provide feedback on the course material Available Ask to Learn Student can submit subject related technical queries. Queries submitted will be directed to the particular course coordinator/head. Available Presenter s Manual Aptech Limited Page 8

9 Week wise Schedule Theory vs. Lab Coverage (2 hrs a day/ 3 days a week) Weeks / Modules DML D1 D2 D3 DML O11- O12 O1-O10 Designing for Web using Markup Language and Style Sheets T Theory session; L Lab session; O Online session Presenter s Manual Aptech Limited Page 9

10 Session Coverage Session No. Session Details 1. Session Topic: Introduction to Web Designing and HTML 5 Introduction Introduction to HTML 5 Cascading Style Sheets Browser support JavaScript HTML5 and Mobile Devices 2. Session Topic: Formatting Text Using Tags and Creating Hyperlinks and Anchors Introduction Headings Background Hyperlinks and Anchors 3. Session Topic: Introduction to CSS3 Introduction Cascading Style Sheets Types of Style Sheets Selectors Styles to Hyperlinks 4. Session Topic: Introduction to Formatting Using Style Sheets Introduction Text and Font Styles Inline Span Border Deliverables Mapping Presenter s Manual Aptech Limited Page 10

11 5. Session Topic: Displaying Graphics Introduction Graphic formats Thumbnail graphics 6 Session Topic: Working with CSS3 Transitions and Animations CSS3 Transitions CSS3 Animations 7. Session Topic: Creating Navigational Aids and Division- Based Layouts Introduction HTML5 Semantic Tags HTML5 Semantic Layouts Navigation Bar Image Maps Divisions 8 Session Topic: Creating Tables Introduction Creating and Formatting Tables Table Size and Width of a Column Merging Table Cells Apply Borders by Using Styles Presenter s Manual Aptech Limited Page 11

12 9 Session Topic: HTML Forms Introduction Introduction to HTML5 forms New Features in HTML5 Forms Working with New Input Types New Form Attributes New Form Elements 10 Session Topic: HTML 5 Audio Introduction Multimedia in HTML 5 Supported Media Types in Audio and Video Audio Elements in HTML 5 11 Session Topic: HTML 5 Video Video elements in HTML 5 12 Session Topic: Building a Mobile Web Application Introduction Mobile Application Environment Presenter s Manual Aptech Limited Page 12

Essentials of Web Designing

Essentials of Web Designing Module Presenter s Manual Effective from: July 2014 Ver. 1.0 Amendment Record Version No. Effective Date Change Replaced Pages 1.0 July 2014 New - Presenter s Manual Aptech Limited Page 2 TABLE OF CONTENTS