Course Title Course Code WEB DESIGNING TECHNOLOGIES DCE311 Lecture : 3 Course Credit Practical : Tutorial : 0 Total : 5 Course Learning Outcomes At end of the course, students will be able to: Understand different Web controls. Be able to understand and write basic HTML and CSS code Create a full functioning website Understand how to upload websites to a web server Be able to program interactive JavaScript in a web page Detailed Syllabus Module No. 1 3 Topics SECTION I INTRODUCTION TO WEB TECHNOLOGY Introduction to Web Technology How a Website works? Client and Server Scripting languages Types of Websites Web Standards and W3C recommendations INTRODUCTION TO HTML What is Markup Language Basic structure of HTML Head Section and Elements of Head Section Meta Tags External Link Tags HTML TAGS HTML Attributes Header Tags Paragraph, Span and pre tags Anchor tag, Marquee tag Image tag, Object tag, Iframe tag List tag HTML comments No. of Sessions 5
5 6 7 8 9 Working with HTML Forms - Text Input, Text area, Checkbox, Radio button, Submit button, Reset button, file upload and hidden fields. HTML STRUCTURE TAGS Table tag Div tag Frames INTRODUCTION TO HTML 5 Introduction to HTML 5 What s new in HTML 5? HTML 5 DocType HTML 5 Structure Tags- nav, section, article, aside, header, footer HTML 5 Form Elements- Search, tel, url, email, number and range HTML 5 Media tags- Audio and video SECTION II INTRODUCTION TO CASCADING STYLESHEET Introduction to CSS Importance of CSS Building a CSS rule Attaching CSS to HTML using selectors Applying styles using CSS properties Types of CSS SPECIFIC HTML TARGETING WITH CSS SELECTORS Using HTML classes and IDs CSS pseudo-classes Combining selectors Layout and positioning-the basics of layout, Floating elements, Relative positioning INTRODUCTION TO JAVASCRIPT Introduction to JS Importance of JS Basic Syntax of JS- Statements, Comments, Variables Data types, JS Operators- Arithmetic, logical, comparison JS conditional statements JS loops ADVANCED JAVASCRIPT JS Events JS Objects - String Functions, JS Math Functions, JS Date Functions, JS Array Functions and Property JS User Defined Functions JS Validations using Object Functions JS Validations using Regular Expressions JS Document Object Model Introduction, DOM HTML, DOM CSS, DOM Events JS Browser Object Model - JS Cookies, JS Window, JS Location, JS Popups, JS 6 9
10 Time WEB HOSTING Hosting Website on Free Domains. Reference Books 1. Kogent Learning solutions Inc., HTML 5: Covers CSS3, JavaScript, XML, XHTML AJAX, PHP & JQuery: Black Book, Dreamtech Press.. Bangia Ramesh, Web Technology: Including HTML, CSS, XML, ASP, Java Script, VB Script, Firewall Media. 3. Julie C. Melone, HTML, CSS and Javascript, Pearson Education.. Schmitt Christopher, CSS Cookbook, Shroff Publishers. 5. Microsoft A., Dynamic HTML Reference and Software Development Kit, WP Publishers. List of Experiments 1. Write a HTML page to print Hello World.. Create a web page illustrating text formatting tags available in HTML. 3. Prepare a sample code to illustrate three types of lists in HTML.. Create a HTML file which displays 3 images at LEFT, RIGHT and CENTER respectively in the browser. 5. Create the below given table. 6. Using Frames Divide the web page as follows
7. Create a student registration form using the following tags <form>, <input>, <textarea>, <button>, <select>, <option>the registration form must consist of following information :First Name, Middle Name, Last Name, Gender (use radio button), Address, Phone No., email id, Hobbies (use checkbox), City, State, Country, College Name (use dropdown menu) 8. CSS - provide inline, internal and external style sheet for the student registration form. 9. Write a CSS program to set an image as the background. That is selected by user using a checkbox. 10. Write HTML/CSS code to create table with 5 rows and 3 columns. Even no. of rows display in green color and odd no. of rows display in white color. 11. Develop and demonstrate a HTML document that illustrates the use external style sheet, ordered list, table, borders, padding, color, and the <span> tag. 1. Create a CSS style sheet and use it to display the document. The information must include USN, Name and Name of the College, Branch, Year of Joining, and e-mail id. Make up sample data for 3 students. 13. Format your Profile Page Using Different CSS Elements (Note: e.g. CSS Background, Text, Font, Tables, Links, Images, Margin ) 1. Design the following layout using table tag,div tag and frames. 15. Design the layout in Q.1 using div tag and frames. 16. Design the layout in Q-1 using frames.
17. Write JavaScript to perform the following operations: a. to calculate sum of 1 to n b. to check whether given number is prime or not c. to check whether given number is Armstrong or not d. to check whether given number is palindrome or not e. to find roots of quadratic equation f. to calculate factorial of n g. to find highest from given three values h. to print any triangle form for given n i. to find all primes which are lies between a given range. 18. Write JavaScript to perform validation of following fields. a) mobile number(only 10 digits) b) email address(example@asw.com) c) password(must contain special symbol, lowercase and upper case letter, number) d) Re-type Password(password and confirm password must be same)