Program Name : Computer Engineering Program Group Program Code: COICMVIFICW ‘Semester 2 Second ‘Course Title Web Page Designing With HTML ‘Course Code 1. RATIONALE Wiebste desian is abroad term that encompasses a wide variety of tasks, al involved in the formation of web pages. There are essentially two types of web design approaches, which are dynamic and stale design. Stuic web design is typically based on basic HTML code. I is ‘essential for diploma student to leam HTML since the task of static website design is Performed by using HTML coding. Even in dynamic websites, the task of presentation of ‘Content is handled through) HML coding, This course introduce web page design using HTMLS and also give emphasis on learning Cascading Style Sheets (CSS) which is syle sheet language used for deserbing the presestation of a document written in markup language for formatting and sting of content, This leaming enables students o design static wwe ies and host om Internet nen. 2. COMPETENCY ‘The aim of this course isto help the student to atain the following industry identified “competency though various teaching learning experiences: ‘+ Develop static interactive web-s 3. COURSE OUTCOMES (COs) “The theory, practical experiences and relevant sof skills sociated with his course are tobe taught snd snplemenied. so thatthe stadent demonstrates the following industry oriented (COs associated with the above mentioned competency: Use look love formating ags fo present content on web page Use rex level formating tags to present content on eb page. Spply hyperlinking on wc page (Organize the content using table end ames, Apply presentation schemes on content using CSS. Publish websites on Invamet or Intranet, 4. TEACHING AND EXAMINATION SCHEME Teties ‘Exaratin Scheme 1 reat Thee Pace | sn [in | [| io | a ES () For the practical only courses, she PA has two components under prac sssessinen of practcals (seen in section 6) has a weightage of 60% (ie 30 marks) NITE Fra Coy Be SOTO Page arF Legends: L-Lecture; T ~ Tuorial/Teocher Guided Theory Practice: P ~ Practical: C ~ (Credit ESE - End Semester Examination, PA - Progressive Assessment S_ COURSE MAP (with sample COs, P:Os, UOs, ADOs and opis) “This course mapilusats an overview ofthe low and linkages ofthe topics 2 various levels ‘of outcomes (details in subsequent sections to be atigned by the student by the end ofthe ours, in all domains of learning in terms of the ndustylemplayer identified competsncy epicte athe cenre ofthis map. Figure 1= Course Map 6. _ SUGGESTED PRACTICALS! EXERCISES. “The practcals inthis section are PrOs (ie. sub-components of the COs) tobe developed and assessed in the student forthe attainment ofthe competency. 5 Unit | Approw ms Practical Outcomes (PrOs) We |e SHE Fa ay BOTT Fara FiRequind Greate web page sing Sucre age to diplay imple message, 02 2 | Greate a web paye for displaying a paragraph asin Block level |, | pe tags, HR tags (Pare), 3 Greta webpage fo dling spurapaph wing Woke || gy HR tags (Patt, : Ty Cees Web Page ving Tew tea ga and Spcal Caen —| | 02 5 Create a web pag for implementing diferent types of Lists. TO (© Create a web pag to ink- fs) A dierent web page of sane site b) A diferent ioeation on the same web page my} @ .©)_A specific location on different web paze of same site 7 [iy Create a web page to link 4a) An external page of diferen web sc . ) Ton email ID cn iy Write aps to change coors of Finks (3 Insert images os web pase using various awibures_ pare ‘9 "Implement image asa button and set image as backaround M_| 02 (CID Create a webpage to implement Frame tes iv | 0 TT Greate a web page to implement Table tags wo [12 Create a web page for demonstration of CSS By applying niemal | VJ 02] sie TE” Create a web page for demonsvation of CSS by applying Exemal | V2 styl. (Createa web page Tor demonstaton OF CSS by applying ating —V) 02 syle (C15 lnstal'a web gener and publish «website on Intranet. v9 TS Puslish a website on Internet by acquiring space on fee hosting VI 02 site L | tat Te} Nate A suggestive list of PrOs is given inthe above rable. More such PrOs can be add 10 ltuan the COs and competeney, A judicial mix of pracical need tobe performed. out of ‘which, the practcals marked as '*’ are compulsory, s0 that the student reaches the “Applying Level’ of Blooms's Cognitive Domain Taxonomy’ as generally required by the nds i The ‘Process’ ana Product’ relted skills associoted with each PrO are to be assessed cording 0 a suggested sample gwen below. SNe Performance Indicators Weightage in. 3 Dabunging abil 20. Quality oF ostpat achieved (Produey — — co Complete ite practicl in stipulated time 1 (Answer to sample questions 20 ‘= Submitrepor in time | Tota “The above P1Os also comprise of the following socal skillslattiudes which are AMfestive Donisin Outcomes (ADOS) that are best developed chvough the laborstery/field bused experiences ‘4 Follow safety practices > Practice good housckeeping © Demonstrate working us aleaderfs team merber Follow ethical practices. ‘The ADOs are not specific to any one PrO, but are embedded in many PrOs, Hence. che acquisition of the ADOs takes place gradually inthe student when she undertakes & series of practial experiences over a period of time. Moreover, the level of achievement of the ADOs sccording to Krathwohl's"Affective Domain Taxonomy” should gradually increase as planned bev ‘Valuing Level ia year + Organising Level in 2" year + -Charactensing Leven 3° year, 7. MAJOR EQUIPMENT INSTRUMENTS REQUIRED ‘The major equipment with broad specification mentioned here will usher in unify in ‘conduct of experiments, a well a id fo procure equipment by authorities concerned. fa ‘Equipment Name vith Broad Specifications Bes | [1 npaar Wa text et and bowser at] [2 Sannee= Ad size, soponing sage 7 “Computer system with intemet connection 2 = Web server. i 8. _ UNDERPINNING THEORY COMPONENTS The following topiessubtopis are 10 be taught ard assessed in order to develop UOS for achieving the COS to aan the idented competency Unit Unit Outcomes (UO) “Topics wad Subtopics {in cogritive domain) | Unit—1 Ta Differentiate characteristics oF | 11 Fundamentals af World Wale Basis of | the given typeof web sits, Webs): Informition about Web [HTML 1b, Describe structure ofthe piven | Browsers, Web Servers and types of HTML page sites. Static vs, dynamic web sts le Explain use oF head tag and body tag in the given web ove 1d, Describe the procedure of using the given bloc level tag fon web page Web page structure: DOCTYPS, head, body, vile and other mete tags | vith stribites 1.2 Block Level Tags And Horizontal Rules: Headings. Pararophs, Bros, Divisiors, Centered Text Block ‘Quotes, Prermated eX pes oF Adress, HR tag Describe wse oF the given special characters in creat BA Text Level Fag And Special Characters: Bold, Hale. Teletype ‘WSBTE Fat Copy B30 TOOT Pada e NSBTE Foal Coy Or TORT Panett Hr2e. Explain use ofthe given type flit in WebPages, | 24 Describe the procedure of sing the give ext level ngs increaine a Web Pose Tait Tait Outcomes (UO) Topics and Sub-topies {in cognitive domaia) Teed ‘Wee Page, Tnderine, Siaeinrough, Superson Tags and 2 Use relevant wpto display the | Subseript, DIV tag, displaying List given special chareciers special characters 22 Lists: Ordered Lists, Unordered Lists, Definition Liss, Nested Lists Ta: Devorbe feature ofthe given URL And typeof URL. Images 3b, Describe the given image szumbute on avveb page. 3e. Explain process of using the given colorsienages as page background eva Web Page, 3d. Describe the procedure for creating the given type of hyperlinking 3.4 URL And Anchor Tag:URL - Types of URLS, Absolute URLs, Relate URLs, pros and cons of relative and absolute URLS, Anchor Tag: Linking various documents for intersal and extemal links. 3.2 Images, Colors And Backgrounds: Inserting. Images, formatting image for sizing, alignment. Border and using other aceibues with TMG tag Inserting image as page background Creating solid" color page background Unit Vda Explain the given table | atibutes organize data on & web page Frames 4b, Use the given table tribute to change defaut able serting 4. Desenbe the iven ype of ‘ame’ with examples 44 Describe the rocedure to organize display as per given | [__sesttayontsng tes Deserbe CSS code forthe scaling | ghen typeof emating ona Sole ‘web page sheets | Sb. Describe che given style sheet |. properties Se Explain teen oneny of a, Deseribe the ocedue 19 ‘create CSS fer applying the _iven presentation scheme on ae page, ‘HSGTE Fon Copp Br 003017 Paper “Z1 Table: Table ap with atribates, ‘TABLE, TR, TH, TD tags. Border, call spacing, cell padding width, align, bgcolor attributes, 42 Frames Types of Frames wih their suibutes, Creating frames! FRAMESET tag —rows cols srenbutes, "31 Cascading Sie Sheets: Diferent types of Sivle Sheets, Benefis of using CSS. Adding sie tothe dcurment: Linking to style sheets, Embedding stylesheets, Using inline style, Selectors: CLASS rules, ID ‘ules ‘82 Style sheet properties: Font text tox, color and background properties: (Creating and Using a simple external CSS file; Using the interal and inline (CSS; backgyound and color gradients jn CSS Setting font and textm syle sheet using table yout, Unit Unit Outcomes (UOs) Topies and Sub-topies in cognitive domain) | TWaievd [a Describe the procedure tol Website Hosting? Website |” configure a webserver. ‘Concept of Intemet and Intrenet, Hosting | 60. Diferenite hosting Publishing website on lnranet requirement on Internet and Tsing and configuring web sewer, fnuanet ‘uploading files on intranet site, access Ge, Describe the procedure for intranet based websites Publishing hosting the ven website ‘website ste on Itemet, hiring Web 6, Explain process ofuploading | Space uploading Mies wsing FTP, the given files on 2 website ‘Viral Hosting, access internet Based website Rie To as ie CO al Compete, OE Led OS wea ead TE the “Application Level of Bloons ‘Cognitive Domain Taxonomy 9, SUGGESTED SPECIFICATION TABLE FOR QUESTION PAPER DESIGN = Not Applicabie- 10, SUGGESTED STUDENT ACTIVITIES (ther tan the classroom and laboratory learning, following sre the suggested student elated co-curricular activities which can be undertaken to accelerate the atamment of the various bvtcomes inthis course: '. Prepare journals based on practical performed in laboratory. . Browse and Observe features of different types of website ©. entity different host servers for hosting state website 11, SUGGESTED SPECIAL INSTRUCTIONAL STRATEGIES (ifaay) ‘These are sample strategies, which the teacher can use 0 accelerate he altaiment oF the ‘various learn outcomes inthis course '. Massive open online courses (MOOCS) may be used 10 teach various topicsisub topics b. ‘L"in item No 4 does not mean orly the traditional lecture method, but different types of teaching methods and media that are to be employed to develop the outcomes ©. About 15-20% of the toplessub-tpics which is tlatively simpler or descriptive in nature is to be given to the students for selfatirected learning and assess the evelopment of the COs through classroom presentations (see implementation ‘guideline for deals) ‘With respect to item No.0, teachers need w ensure (9 create opportunities and provisions for co-curricular activites ‘Guide students) in undertaking micro-projects, DDemonsrate students thoroughly before they stare doing the practice [Encourage students to refer diferent websites to have deeper understanding of the subject. ‘Observe continuously and monitor the performance of students in Lab “The practical exercises as listed in point no, 6 above may be undertaken keeping in mind to develop a sample web site as final output Some sermple topis/domains are suggested belo 12, SUGGESTED MICRO-PROJECTS.‘Only one micro-project is planned to be undertaken by @stdent assigned to hime inthe beginning ofthe semester. S/he ought fo submit it by the end of the semester to develop the industry oriented COs. Each micro-project shoulé encompass two oF mare COs which sein fact an integration of 10s, UOs and ADOs, The misro-project could be industry application based, intemetbased, workshop-based, Inboraory-based oF fel-based. Each student will iain dated work diary consisting of individual contribution in the projet werk ion of it before submission. The total duration of the micro have to ms and give a seminar presents project should not be less than 16 (sixteen) suet engagement hours during the couse. Inthe {ist four semesters, the micro-project could be group-based. However, in higher Senvesters, it should be intvidually undertaken fo bulé up the skill and confidence in every student io become problem solver so that s/he contributes tothe projects ofthe industry. Suggestive ist is given here. Sila micro-projects could be added bythe concerned faculty Create sample website wih minimum ten web pages Containing ext, mages, coors & background, frames, bls, an CSS ith suitabe ype inking Website or Unversites or Colleges Web ste oc book stops, rocery soe others, Web sit for any Vehele Showroom, ‘Website For Hospital faites ‘Web site for Travel and Tourism Ager Web ste related to any Sports (EX Cricket, Tet ‘Any other sugested tpi by subject eacher, nis.) 1 SUGGESTED LEARNING RESOURCES 5) tiworon | _ nator rants _*| TCE STRIC = — Fone aS awe 2 Meters ‘Thoas | Batya san erro 2 Tesh We begs Rasbas OR. Cane DOE [Sas Bars Teg ogaaT RTH —SAn —— orn Sc an EGieinselaw Deis ome r = Hint Seat nd — Baia aa Mahe hen New ar &s SoU UN Ines TNL SHE ——" prea — ret ae, ow Soacandeatiny [niga | AN Shoatoas 14, SOFTWARE/LEARNING WEBSITES pwn. schools com btm nape: tm ne? inp. 2ereateawebsite com hnpwebdesign about com ‘WSTE Fin Copy Be 30 10007 Paseo