Logo

BITM Web Programming I

bitmsemester 3

Web Programming I

Subject Code: IT215

Course Title: Web Programming I

Course No: IT215

Nature of Course: Theory & Practical

Full Marks: 60 + 40

Pass Marks: 30 + 20

Credit Hours: 3

Course Description

Structuring Documents for the Web, Links and Navigation, Images, Audio, and Video, Tables, Forms, Cascading Style Sheets, More Cascading Style Sheets, Page Layout, Design Issues, Learning JavaScript, Working with JavaScript

Course Objective

This course is designed to serve as an ideal beginners guide to writing web pages using XHTML, using CSS to make pages more appealing and add interactivity to pages using JavaScript.

Course Contents

Course Contents Teaching Methodology Teaching Hours
Unit 1: HTML (16 Hrs.)
Structuring Documents for the Web: A Web of Structured Documents, Introducing HTML and XHTML, Tags and Elements, Separating Heads from Bodies, Attributes Tell Us About Elements, Learning from Others by Viewing Their Source Code, Elements for Marking Up Text, The <html> Element, The <head> Element, The <title> Element, The <body> Element Lecture
Basic Text Formatting, Presentational Elements, Phrase Elements: White Space and Flow, Creating Headings Using <hn> Elements, Creating Paragraphs Using the <p> Element, Creating Line Breaks Using the <br /> Element, Creating Preformatted Text Using the <pre> Element, The <b> Element, The <i> Element, The <tt> Element, The <sup> Element, The <sub> Element, The <big> Element, The <small> Element, The <hr /> Element, The <em> Element Adds Emphasis, The <strong> Element Adds Strong Emphasis, The <address> Element Is for Addresses, The <abbr> Element Is for Abbreviations, The <acronym> Element Is for Acronym Use, The <dfn> Element Is for Special Terms, The <blockquote> Element Is for Quoting Text, Using the cite Attribute with the <blockquote> Element, The <q> Element Is for Short Quotations, The <cite> Element Is for Citations, The <code> Element Is for Code, The <kbd> Element Is for Text Typed on a Keyboard, The <var> Element Is for Programming Variables, The <samp> Element Is for a Program Output
Lists: Using the <ul> Element to Create Unordered Lists, Ordered Lists, Definition Lists, Nesting Lists, Comments, Understanding Block and Inline Elements, Grouping Elements with <div> and <span>, The XML Declaration, Document Type Declaration
Understanding Directories and Directory Structures: Understanding URLs, Absolute and Relative URLs, The <base> Element
Creating Links with the <a> Element: Basic Links, Linking to Other Web Pages, Linking to E-mail Addresses, Creating a Source Anchor with the href Attribute, Creating a Destination Anchor Using the name and id Attributes, (Linking to a Specific Part of a Page), The <a> Element's Other Attributes
Images, Audio, and Video, Using Images as Links, Choosing the Right Image Format: Adding Images Using the <img> Element, The src Attribute, The alt Attribute, The height and width Attributes, The ismap and usemap Attributes, The longdesc Attribute, Image Maps, Client-Side Image Maps, Server-Side Image Maps, GIF Images, Animated GIFs, JPEG Images, PNG Images, Keeping File Sizes Small
Adding Flash, Video, and Audio to Your Web Pages: Adding Flash Movies to Your Site, Adding Videos to Your Site, Adding Videos, Using Flash Video Audio to Your Site, Automatically Playing Audio and Video When a Page Loads, A Closer Look at the <object> and <param> Elements, The <param> Element
Tables: Introducing Tables, Basic Table Elements and Attributes, The <table> Element Creates a Table, The <tr> Element Contains Table Rows, The <td> and <th> Elements Represent Table Cells, Adding a <caption> to a Table, Grouping Sections of a Table, Spanning Columns Using the colspan Attribute, Spanning Rows Using the rowspan Attribute, Splitting Up Tables Using a Head, Body, and Foot, Grouping Columns Using the <colgroup> Element, Columns Sharing Styles Using the <col> Element
Forms and Form Controls: Introducing Forms, Creating a Form with the <form> Element, The action Attribute, The method Attribute, The id Attribute, The onsubmit Attribute, The onreset Attribute, The enctype Attribute, The accept-charset Attribute, The accept Attribute, The target Attribute, White Space and the <form> Element, Text Inputs, Buttons, Checkboxes, Radio Buttons, Select Boxes, File Select Boxes, Hidden Controls
Creating Labels for Controls and the <label> Element: Structuring Your Forms with <fieldset> and <legend> Elements, Focus, Tabbing Order, Access Keys, Disabled and Read-Only Controls, Sending Form Data to the Server, HTTP get, HTTP post, Cascading Style Sheets
Unit 2: Introducing CSS (16 Hrs.)
A Basic Example, Inheritance, Where You Can Add CSS Rules, The <link> Element, The <style> Element, Advantages of External CSS Style Sheets, CSS Properties Lecture
Controlling Text: The font-family Property, The font-size Property, The font-weight Property, The font-style Property, The font-variant Property, The font-stretch Property, The font-size-adjust Property
Text Formatting: The color Property, The text-align Property, The vertical-align Property, The text-decoration Property, The text-indent Property, The text-shadow Property, The text-transform Property, The letter-spacing Property, The word-spacing Property, The white-space Property, The direction Property
Selectors: Universal Selector, The Type Selector, The Class Selector, The ID Selector, The Child Selector, The Descendant Selector, The Adjacent Sibling Selector
The General Sibling Selector: Using Child and Sibling Selectors To Reduce Dependence on Classes in Markup, Attribute Selectors
Lengths: Relative Units, Absolute Units, Percentages
Introducing the Box Model: An Example Illustrating the Box Model, The Border Properties, The padding Property, The margin Property, Dimensions of a Box, Internet Explorer Box Model Bug
More Cascading Style Sheets: Links, Backgrounds: The background-color Property, The background-image Property, The background-repeat Property, The background-position Property (for Fixing Position of Backgrounds), The background-attachment Property (for Watermarks), The background Property (the Shorthand)
Lists: The list-style-type Property, The list-style-position Property, The list-style-image Property, The list-style Property (the Shorthand)
Tables: Table-Specific Properties, The border-collapse Property, The border-spacing Property, The empty-cells Property, The caption-side Property, The table-layout Property
Outlines: The outline-width Property, The outline-style Property, The outline-color Property, The outline Property (the Shorthand)
The :focus and :active Pseudo-Classes: Generated Content, The :before and :after Pseudo-Elements, The content Property, The cursor Property, The display Property, The visibility Property
Positioning and Layout with CSS: Normal Flow, The position Property, Box Offset Properties, Relative Positioning, Absolute Positioning, Fixed Positioning, The z-index Property, Floating Using the float Property, The clear Property
Page Layout: Understanding the Site's Audience, Who Will Visit the Site? Why Have They Visited Your Site? What Does a Visitor Need to Achieve a Goal? How Often Will People Want to Visit? Things You Want the Site to Do, Prioritizing Information, Grouping and Categorization, Creating a Site Map, Identifying Key Elements for Each Page, Page Size (and Screen Resolution), Understanding Screen Sizes, Fixed-Width vs. Liquid Designs
Unit 3: Learning JavaScript (16 Hrs.)
What Is Programming About? How to Add a Script to Your Pages, Comments in JavaScript, The <noscript> Element, The Document Object Model, Accessing Values Using Dot Notation, The Document Object, The Forms Collection, Form Elements, Images Collection, Different Types of Objects, A Word About Data Types, Keywords Lecture
Starting to Program with JavaScript: Variables, Assigning a Value to a Variable, Lifetime of a Variable, Operators, Arithmetic Operators, Assignment Operators, Comparison Operators, Logical or Boolean Operators, String Operator (Using + with Strings)
Functions: How to Define a Function, How To Call a Function, The Return Statement
Conditional Statements: if Statements, if . . . else Statements, switch Statement
Looping: While, do . . . while, for, Infinite Loops and the break Statement
Events (Built-in Objects: String, Date, Array, Window)
Form Validation: When to Validate, What You Can Check For, How to Check a Form, Checking Text Fields, Select Box Options, Radio Buttons, Checkboxes

Reference Books

1. Beginning HTML, XHTML, CSS, and JavaScript, Jon Duckett, Wiley, ISBN: 978-0-470-54070-1