Web Development CSE2WD Final Examination June (a) Which organisation is primarily responsible for HTML, CSS and DOM standards?

Size: px
Start display at page:

Download "Web Development CSE2WD Final Examination June 2012. (a) Which organisation is primarily responsible for HTML, CSS and DOM standards?"

Transcription

1 Question 1. (a) Which organisation is primarily responsible for HTML, CSS and DOM standards? (b) Briefly identify the primary purpose of the flowing inside the body section of an HTML document: (i) HTML elements and (ii) Element attributes. (c) What is the primary role of Cascading Style Sheets with respect to HTML elements? (d) What is the primary purpose of the <head> section of a XHTML document? (e) What is the primary purpose of the <body> section of a XHTML document? (f) Briefly explain the purpose of the HTML elements given here: (i) <title>cse2wd Exam</title> (ii) <link rel="stylesheet" type="text/css" href="mycssrules.css" /> (iii) <meta http-equiv="content-type" content="text/html; charset=utf-8"/> (iv) <script type="text/javascript" src="myjavascript.js"></script> (g) Elements that can appear in the body section of an HTML document are classified as either inline or block elements. Define what is meant by an inline element and a block element. Give an example of an inline element and a block element other than div and span elements. (h) With respect to rendering a XHTML document by a Web browser, how does the browser determine which rendering mode to use? (i) Apart from validation, how is the DOCTYPE information used by a modern Web browser? (j) Supply two (2) reasons briefly explaining why is it important to consider the profiles (characteristics) of the target audience when designing a new Web site. (k) Why can't the following html document be served by the Apache web server from your public_html folder with the following permissions? -rw jabloggs student 270 Apr 19 12:46 index.html a b c d e f g h i j k. ( = 20 marks) (Page 2 of 9)

2 Question 2. Carefully examine the following code: 01 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 02 " 03 <html xmlns=" 04 <head> 05 <meta name="author" content="k.baxter" > 06 <link rel = "stylesheet" type="text/css" href="mycssdefs.css" /> 07 <style type=text/css /> 08.catLink = { font-size: 24px 09 color: # } 11 </style>; 12 </head> 13 <Body> 14 <h1>brilliant Kitchen Designs Inc<h1/> <p>our expert sales staff</p> 17 <IMG href = "salespeople.jpg" longdesc="headoffice staff.html /> 18 <br> 19 <p> 20 Browse our 21 <span id="catlink"><a src ="Catalogue.html"></a>Catalogue</span> 22 for great deals. 22 </Body> (a) Identify the name and version of the HTML being used. (b) HTML code can be well formed without being valid. The code above is not valid. Is the code well formed? (c) Identify all the errors in the <head> section of the document. (d) Rewrite the code for the <body> section to make it valid. ( = 20 marks) (Page 3 of 9)

3 Question 3. /* use this CSS file named: "mystyles.css" when answering parts (a), (b) and (c) */ p { color: green; font-size: 12px} h1 { font-size: 32px; text-align: left ; color: purple} h2 { font-size: 24px; text-align: center ; color: lime} #content { font-family: sans-serif; color: #000; font-size: 16px }.plain { font-family: monospace; font-style: normal; color: black} div.plain h2, h1 { font-size: 16px; color: blue } (a) In what order are the rules defined by the tag selector, id selector and class selector applied to an element that uses all three of these CSS selectors? eg. <p id="content" class="plain"> (b) In what colour will each of the heading element contents be displayed in the following code: (i) (ii) (iii) (iv) (v) <div><h2>hello World!</h2></div> <div id="content"><h2>hello World!</h2></div> <div class="plain"><h2>hello World!</h2></div> <div><h1>hello World!</h1></div> <div id="content"><h1>hello World!</h1></div> (c) Describe how the text in the paragraph element will appear when rendered and list the final value for each style property that is applied to the p element when it is rendered. <html> <head> <link rel="stylesheet" type="text/css" href="mystyles.css" media="screen" /> <style type="text/css">.box { background-color:yellow; border:thin dashed black; margin:1em; } #content { color: red; background-color:silver;} p { color:yellow; font-size: 16px; background-color:black; } </style> </head> <body> <p id="content" class="box" style="color:olive;"> Style sheets are for presentation </p> </body> </html> (Page 4 of 9)

4 (d) The box model is used by Cascading Style Sheets to define the regions occupied by some XHTML elements such as the div element. The box model uses padding, border and margin CSS properties. Use a clearly labelled diagram to explain what each of the padding, border and margin properties define with respect to the content being displayed for the element. (e) Briefly outline the cascading order in which style rules are assigned when conflicting style rules from different style sheets are applied to an element in an HTML document. Consider a mixture of inline, embedded and multiple external style sheets being applied in your answer. ( = 20 marks) (Page 5 of 9)

5 Question 4. (a) Is the code for the table element in figure 4.2 valid according to the definitions given in figure 4.1? (b) If the code is not valid then explain why it is invalid in terms of the rules given in the DTD. (c) Is the code well formed? The following DTD fragment is based upon the XHTML version 1.0 DTD for the table element figure 4.1 <!ELEMENT table(caption?, (col* colgroup*), thead?, tfoot?, (tbody+ tr+))> <!ELEMENT caption %inline;> <!ELEMENT thead (tr)+> <!ELEMENT tfoot (tr)+> <!ELEMENT tbody (tr)+> <!ELEMENT colgroup (col)*> <!ELEMENT col EMPTY> <!ELEMENT tr (th td)+> <!ELEMENT th %Flow;> <!ELEMENT td %Flow;> <!-- %Flow; mixes block and inline --> <!ENTITY % Flow "(#PCDATA %block; %inline; )*"> figure 4.2 <body> <table> <thead> <caption>exam 2012</caption> </thead> <tbody> <tr><td>hello</td><p>world!</p></tr> <tr></tr> </tbody> </table> </body> ( = 10 marks) (Page 6 of 9)

6 Question 5. (a) Briefly identify the primary purpose of the Document Object Model (DOM). (b) Examine the following JavaScript and draw a picture to show the output as it would be rendered by a Web browser. You can assume that no style sheets are applied to this page. <body> <div id="mydiv"></div> <script type="text/javascript"> //<![CDATA[ var namelist = new Array("Apple", "Orange","Peach", "Mango"); var mylistitemelement; var textnode; var fruit; var mylist = document.createelement('ol'); for ( var i=0; i<namelist.length; i++){ li = document.createelement('li'); fruit = namelist[i]; text = document.createtextnode(fruit); } li.appendchild(text); mylist.appendchild(li); var mydivelement = document.getelementbyid("mydiv"); mydivelement.appendchild(mylist); //]]> </script> </body> Question 5 continues next page -- (Page 7 of 9)

7 (c) Supply the equivalent HTML code fragment that would produce the following DOM tree structure for an unordered list with an id of "rootnode": ul id="rootnode" li li li p window roof p door floor Represents a text Node Represents an element Node (d) Write the necessary Javascript code to append a heading 1 (h1) with a child text Node containing "wall" to the second list item. ( = 30 marks) (Page 8 of 9)

8 Question 6. (a) Give two (2) advantages of using an external file for storing Javascript functions. Include an example of the opening HTML script tag that would be used to reference an external Javascript (.js) file. (b) What is the type and value of the variables b and d after the following Javascript code is executed? <script type="text/javascript"> var a = 2; var b = 1; var c = 2; var d = 2; var fruitarray = new Array(); fruitarray[0] = "lemon"; fruitarray[1] = "banana"; fruitarray[2] = "apple"; fruitarray[3] = "orange"; fruitarray[4] = "straberry"; fruitarray[5] = "plum"; if( b <= a ){ d = c*(a b) + 1; b = fruitarray[d]; }else{ d = a; b = fruitarray[c]; } alert( "b now contains: " + b + " and d contains: " + d); </script> (c) Write javascript code to including a for loop, an array and document.write() statements to generate a simple table including column headings that displays each of the whole day numbers from 1 to 7 in the first column and the corresponding day of the week in the second column as shown below: Number DayName 1 Sunday 2 Monday Saturday ( ie. 1=Sunday, 2=Monday, 3=Tuesday, 4=Wednesday, 5=Thursday, 6=Friday, 7=Saturday) ( (2+2) = 20 marks) (Page 9 of 9)

ITNP43: HTML Lecture 4

ITNP43: HTML Lecture 4 ITNP43: HTML Lecture 4 1 Style versus Content HTML purists insist that style should be separate from content and structure HTML was only designed to specify the structure and content of a document Style

More information

CIS 467/602-01: Data Visualization

CIS 467/602-01: Data Visualization CIS 467/602-01: Data Visualization HTML, CSS, SVG, (& JavaScript) Dr. David Koop Assignment 1 Posted on the course web site Due Friday, Feb. 13 Get started soon! Submission information will be posted Useful

More information

Outline of CSS: Cascading Style Sheets

Outline of CSS: Cascading Style Sheets Outline of CSS: Cascading Style Sheets nigelbuckner 2014 This is an introduction to CSS showing how styles are written, types of style sheets, CSS selectors, the cascade, grouping styles and how styles

More information

Web Design Basics. Cindy Royal, Ph.D. Associate Professor Texas State University

Web Design Basics. Cindy Royal, Ph.D. Associate Professor Texas State University Web Design Basics Cindy Royal, Ph.D. Associate Professor Texas State University HTML and CSS HTML stands for Hypertext Markup Language. It is the main language of the Web. While there are other languages

More information

Web Development 1 A4 Project Description Web Architecture

Web Development 1 A4 Project Description Web Architecture Web Development 1 Introduction to A4, Architecture, Core Technologies A4 Project Description 2 Web Architecture 3 Web Service Web Service Web Service Browser Javascript Database Javascript Other Stuff:

More information

Web Design Revision. AQA AS-Level Computing COMP2. 39 minutes. 39 marks. Page 1 of 17

Web Design Revision. AQA AS-Level Computing COMP2. 39 minutes. 39 marks. Page 1 of 17 Web Design Revision AQA AS-Level Computing COMP2 204 39 minutes 39 marks Page of 7 Q. (a) (i) What does HTML stand for?... () (ii) What does CSS stand for?... () (b) Figure shows a web page that has been

More information

Web Design and Databases WD: Class 7: HTML and CSS Part 3

Web Design and Databases WD: Class 7: HTML and CSS Part 3 Web Design and Databases WD: Class 7: HTML and CSS Part 3 Dr Helen Hastie Dept of Computer Science Heriot-Watt University Some contributions from Head First HTML with CSS and XHTML, O Reilly Recap! HTML

More information

Web Building Blocks. Joseph Gilbert User Experience Web Developer University of Virginia Library joe.gilbert@virginia.

Web Building Blocks. Joseph Gilbert User Experience Web Developer University of Virginia Library joe.gilbert@virginia. Web Building Blocks Core Concepts for HTML & CSS Joseph Gilbert User Experience Web Developer University of Virginia Library joe.gilbert@virginia.edu @joegilbert Why Learn the Building Blocks? The idea

More information

Script Handbook for Interactive Scientific Website Building

Script Handbook for Interactive Scientific Website Building Script Handbook for Interactive Scientific Website Building Version: 173205 Released: March 25, 2014 Chung-Lin Shan Contents 1 Basic Structures 1 11 Preparation 2 12 form 4 13 switch for the further step

More information

Website Planning Checklist

Website Planning Checklist Website Planning Checklist The following checklist will help clarify your needs and goals when creating a website you ll be surprised at how many decisions must be made before any production begins! Even

More information

HTML CSS Basic Structure. HTML Structure [Source Code] CSS Structure [Cascading Styles] DIV or ID Tags and Classes. The BOX MODEL

HTML CSS Basic Structure. HTML Structure [Source Code] CSS Structure [Cascading Styles] DIV or ID Tags and Classes. The BOX MODEL HTML CSS Basic Structure HTML [Hypertext Markup Language] is the code read by a browser and defines the overall page structure. The HTML file or web page [.html] is made up of a head and a body. The head

More information

What is CSS? Official W3C standard for controlling presentation Style sheets rely on underlying markup structure

What is CSS? Official W3C standard for controlling presentation Style sheets rely on underlying markup structure CSS Peter Cho 161A Notes from Jennifer Niederst: Web Design in a Nutshell and Thomas A. Powell: HTML & XHTML, Fourth Edition Based on a tutorials by Prof. Daniel Sauter / Prof. Casey Reas What is CSS?

More information

Interactive Data Visualization for the Web Scott Murray

Interactive Data Visualization for the Web Scott Murray Interactive Data Visualization for the Web Scott Murray Technology Foundations Web technologies HTML CSS SVG Javascript HTML (Hypertext Markup Language) Used to mark up the content of a web page by adding

More information

Create Webpages using HTML and CSS

Create Webpages using HTML and CSS KS2 Create Webpages using HTML and CSS 1 Contents Learning Objectives... 3 What is HTML and CSS?... 4 The heading can improve Search Engine results... 4 E-safety Webpage... 5 Creating a Webpage... 6 Creating

More information

Cascading Style Sheets (CSS)

Cascading Style Sheets (CSS) Cascading Style Sheets (CSS) W3C standard for defining presentation of web documents (way documents are displayed or delivered to users typography, colours, layout etc) Presentation separated from content

More information

Web Development. Owen Sacco. ICS2205/ICS2230 Web Intelligence

Web Development. Owen Sacco. ICS2205/ICS2230 Web Intelligence Web Development Owen Sacco ICS2205/ICS2230 Web Intelligence Introduction Client-Side scripting involves using programming technologies to build web pages and applications that are run on the client (i.e.

More information

Using Style Sheets for Consistency

Using Style Sheets for Consistency Cascading Style Sheets enable you to easily maintain a consistent look across all the pages of a web site. In addition, they extend the power of HTML. For example, style sheets permit specifying point

More information

Web Publishing Basics 2

Web Publishing Basics 2 Web Publishing Basics 2 HTML and CSS Coding Jeff Pankin pankin@mit.edu Information Services and Technology Contents Course Objectives... 2 Creating a Web Page with HTML... 3 What is Dreamweaver?... 3 What

More information

CHAPTER 10. When you complete this chapter, you will be able to:

CHAPTER 10. When you complete this chapter, you will be able to: Data Tables CHAPTER 10 When you complete this chapter, you will be able to: Use table elements Use table headers and footers Group columns Style table borders Apply padding, margins, and fl oats to tables

More information

Introduction to Web Design Curriculum Sample

Introduction to Web Design Curriculum Sample Introduction to Web Design Curriculum Sample Thank you for evaluating our curriculum pack for your school! We have assembled what we believe to be the finest collection of materials anywhere to teach basic

More information

Advanced Web Design. Zac Van Note. www.design-link.org

Advanced Web Design. Zac Van Note. www.design-link.org Advanced Web Design Zac Van Note www.design-link.org COURSE ID: CP 341F90033T COURSE TITLE: Advanced Web Design COURSE DESCRIPTION: 2/21/04 Sat 9:00:00 AM - 4:00:00 PM 1 day Recommended Text: HTML for

More information

How to code, test, and validate a web page

How to code, test, and validate a web page Chapter 2 How to code, test, and validate a web page Slide 1 Objectives Applied 1. Use a text editor like Aptana Studio 3 to create and edit HTML and CSS files. 2. Test an HTML document that s stored on

More information

Style & Layout in the web: CSS and Bootstrap

Style & Layout in the web: CSS and Bootstrap Style & Layout in the web: CSS and Bootstrap Ambient intelligence: technology and design Fulvio Corno Politecnico di Torino, 2014/2015 Goal Styling web content Advanced layout in web pages Responsive layouts

More information

FETAC Certificate in Multimedia Production. IBaT College Swords. FETAC Certificate in Multimedia Production Web Authoring Dreamweaver 3

FETAC Certificate in Multimedia Production. IBaT College Swords. FETAC Certificate in Multimedia Production Web Authoring Dreamweaver 3 IBaT College Swords FETAC Certificate in Multimedia Production Web Authoring Dreamweaver 3 Lecturer: Cara Martin M.Sc. Lecturer contact details: cmartin@ibat.ie IBaT 2009 Page 1 Cascading Style Sheets

More information

Dreamweaver CS4 Day 2 Creating a Website using Div Tags, CSS, and Templates

Dreamweaver CS4 Day 2 Creating a Website using Div Tags, CSS, and Templates Dreamweaver CS4 Day 2 Creating a Website using Div Tags, CSS, and Templates What is a DIV tag? First, let s recall that HTML is a markup language. Markup provides structure and order to a page. For example,

More information

JavaScript By: A. Mousavi & P. Broomhead SERG, School of Engineering Design, Brunel University, UK

JavaScript By: A. Mousavi & P. Broomhead SERG, School of Engineering Design, Brunel University, UK Programming for Digital Media EE1707 JavaScript By: A. Mousavi & P. Broomhead SERG, School of Engineering Design, Brunel University, UK 1 References and Sources 1. DOM Scripting, Web Design with JavaScript

More information

Short notes on webpage programming languages

Short notes on webpage programming languages Short notes on webpage programming languages What is HTML? HTML is a language for describing web pages. HTML stands for Hyper Text Markup Language HTML is a markup language A markup language is a set of

More information

Essential HTML & CSS for WordPress. Mark Raymond Luminys, Inc. 949-654-3890 mraymond@luminys.com www.luminys.com

Essential HTML & CSS for WordPress. Mark Raymond Luminys, Inc. 949-654-3890 mraymond@luminys.com www.luminys.com Essential HTML & CSS for WordPress Mark Raymond Luminys, Inc. 949-654-3890 mraymond@luminys.com www.luminys.com HTML: Hypertext Markup Language HTML is a specification that defines how pages are created

More information

Selectors in Action LESSON 3

Selectors in Action LESSON 3 LESSON 3 Selectors in Action In this lesson, you will learn about the different types of selectors and how to use them. Setting Up the HTML Code Selectors are one of the most important aspects of CSS because

More information

Web Design with CSS and CSS3. Dr. Jan Stelovsky

Web Design with CSS and CSS3. Dr. Jan Stelovsky Web Design with CSS and CSS3 Dr. Jan Stelovsky CSS Cascading Style Sheets Separate the formatting from the structure Best practice external CSS in a separate file link to a styles from numerous pages Style

More information

Basics of HTML (some repetition) Cascading Style Sheets (some repetition) Web Design

Basics of HTML (some repetition) Cascading Style Sheets (some repetition) Web Design Basics of HTML (some repetition) Cascading Style Sheets (some repetition) Web Design Contents HTML Quiz Design CSS basics CSS examples CV update What, why, who? Before you start to create a site, it s

More information

PLAYER DEVELOPER GUIDE

PLAYER DEVELOPER GUIDE PLAYER DEVELOPER GUIDE CONTENTS CREATING AND BRANDING A PLAYER IN BACKLOT 5 Player Platform and Browser Support 5 How Player Works 6 Setting up Players Using the Backlot API 6 Creating a Player Using the

More information

Web Authoring CSS. www.fetac.ie. Module Descriptor

Web Authoring CSS. www.fetac.ie. Module Descriptor The Further Education and Training Awards Council (FETAC) was set up as a statutory body on 11 June 2001 by the Minister for Education and Science. Under the Qualifications (Education & Training) Act,

More information

CREATING A NEWSLETTER IN ADOBE DREAMWEAVER CS5 (step-by-step directions)

CREATING A NEWSLETTER IN ADOBE DREAMWEAVER CS5 (step-by-step directions) CREATING A NEWSLETTER IN ADOBE DREAMWEAVER CS5 (step-by-step directions) Step 1 - DEFINE A NEW WEB SITE - 5 POINTS 1. From the welcome window that opens select the Dreamweaver Site... or from the main

More information

1 of 8 9/14/2011 5:40 PM

1 of 8 9/14/2011 5:40 PM file:///z:/sites/gemini/public_html/westbendmarketingfirm.htm 1 of 8 9/14/2011 5:40 PM

More information

Web Design and Databases WD: Class 5: HTML and CSS Part 2

Web Design and Databases WD: Class 5: HTML and CSS Part 2 Web Design and Databases WD: Class 5: HTML and CSS Part 2 Dr Helen Hastie Dept of Computer Science Heriot-Watt University Some contributions from Head First HTML with CSS and XHTML, O Reilly Hmm I need

More information

LAB MANUAL CS-322364(22): Web Technology

LAB MANUAL CS-322364(22): Web Technology RUNGTA COLLEGE OF ENGINEERING & TECHNOLOGY (Approved by AICTE, New Delhi & Affiliated to CSVTU, Bhilai) Kohka Kurud Road Bhilai [C.G.] LAB MANUAL CS-322364(22): Web Technology Department of COMPUTER SCIENCE

More information

Website Login Integration

Website Login Integration SSO Widget Website Login Integration October 2015 Table of Contents Introduction... 3 Getting Started... 5 Creating your Login Form... 5 Full code for the example (including CSS and JavaScript):... 7 2

More information

{color:blue; font-size: 12px;}

{color:blue; font-size: 12px;} CSS stands for cascading style sheets. Styles define how to display a web page. Styles remove the formatting of a document from the content of the document. There are 3 ways that styles can be applied:

More information

COMMONWEALTH OF PENNSYLVANIA DEPARTMENT S OF Human Services, INSURANCE, AND AGING

COMMONWEALTH OF PENNSYLVANIA DEPARTMENT S OF Human Services, INSURANCE, AND AGING COMMONWEALTH OF PENNSYLVANIA DEPARTMENT S OF Human Services, INSURANCE, AND AGING INFORMATION TECHNOLOGY GUIDELINE Name Of Guideline: Domain: Application Date Issued: 03/18/2014 Date Revised: 02/17/2016

More information

Programming the Web 06CS73 SAMPLE QUESTIONS

Programming the Web 06CS73 SAMPLE QUESTIONS Programming the Web 06CS73 SAMPLE QUESTIONS Q1a. Explain standard XHTML Document structure Q1b. What is web server? Name any three web servers Q2. What is hypertext protocol? Explain the request phase

More information

CSS 101. CSS CODE The code in a style sheet is made up of rules of the following types

CSS 101. CSS CODE The code in a style sheet is made up of rules of the following types CSS 101 WHY CSS? A consistent system was needed to apply stylistic values to HTML elements. What CSS does is provide a way to attach styling like color:red to HTML elements like . It does this by defining

More information

Yandex.Widgets Quick start

Yandex.Widgets Quick start 17.09.2013 .. Version 2 Document build date: 17.09.2013. This volume is a part of Yandex technical documentation. Yandex helpdesk site: http://help.yandex.ru 2008 2013 Yandex LLC. All rights reserved.

More information

Professional & Workgroup Editions

Professional & Workgroup Editions Professional & Workgroup Editions Add a popup window for scheduling appointments on your own web page using HTML Date: August 2, 2011 Page 1 Overview This document describes how to insert a popup window

More information

Course Information Course Number: IWT 1229 Course Name: Web Development and Design Foundation

Course Information Course Number: IWT 1229 Course Name: Web Development and Design Foundation Course Information Course Number: IWT 1229 Course Name: Web Development and Design Foundation Credit-By-Assessment (CBA) Competency List Written Assessment Competency List Introduction to the Internet

More information

HTML Tables. IT 3203 Introduction to Web Development

HTML Tables. IT 3203 Introduction to Web Development IT 3203 Introduction to Web Development Tables and Forms September 3 HTML Tables Tables are your friend: Data in rows and columns Positioning of information (But you should use style sheets for this) Slicing

More information

Chapter 2 HTML Basics Key Concepts. Copyright 2013 Terry Ann Morris, Ed.D

Chapter 2 HTML Basics Key Concepts. Copyright 2013 Terry Ann Morris, Ed.D Chapter 2 HTML Basics Key Concepts Copyright 2013 Terry Ann Morris, Ed.D 1 First Web Page an opening tag... page info goes here a closing tag Head & Body Sections Head Section

More information

Using an external style sheet with Dreamweaver (CS6)

Using an external style sheet with Dreamweaver (CS6) Using an external style sheet with Dreamweaver (CS6) nigelbuckner.com 2012 This handout explains how to create an external style sheet, the purpose of selector types and how to create styles. It does not

More information

ART 379 Web Design. HTML, XHTML & CSS: Introduction, 1-2

ART 379 Web Design. HTML, XHTML & CSS: Introduction, 1-2 HTML, XHTML & CSS: Introduction, 1-2 History: 90s browsers (netscape & internet explorer) only read their own specific set of html. made designing web pages difficult! (this is why you would see disclaimers

More information

Last week we talked about creating your own tags: div tags and span tags. A div tag goes around other tags, e.g.,:

Last week we talked about creating your own tags: div tags and span tags. A div tag goes around other tags, e.g.,: CSS Tutorial Part 2: Last week we talked about creating your own tags: div tags and span tags. A div tag goes around other tags, e.g.,: animals A paragraph about animals goes here

More information

Introduction to XHTML. 2010, Robert K. Moniot 1

Introduction to XHTML. 2010, Robert K. Moniot 1 Chapter 4 Introduction to XHTML 2010, Robert K. Moniot 1 OBJECTIVES In this chapter, you will learn: Characteristics of XHTML vs. older HTML. How to write XHTML to create web pages: Controlling document

More information

Building Your Website

Building Your Website Building Your Website HTML & CSS This guide is primarily aimed at people building their first web site and those who have tried in the past but struggled with some of the technical terms and processes.

More information

A send-a-friend application with ASP Smart Mailer

A send-a-friend application with ASP Smart Mailer A send-a-friend application with ASP Smart Mailer Every site likes more visitors. One of the ways that big sites do this is using a simple form that allows people to send their friends a quick email about

More information

Appendix IX. Codes written for developing the revised search tool in HTML

Appendix IX. Codes written for developing the revised search tool in HTML Appendix IX Codes written for developing the revised search tool in HTML 1

More information

Fast track to HTML & CSS 101 (Web Design)

Fast track to HTML & CSS 101 (Web Design) Fast track to HTML & CSS 101 (Web Design) Level: Introduction Duration: 5 Days Time: 9:30 AM - 4:30 PM Cost: 997.00 Overview Fast Track your HTML and CSS Skills HTML and CSS are the very fundamentals of

More information

Web Design and Development ACS-1809. Chapter 9. Page Structure

Web Design and Development ACS-1809. Chapter 9. Page Structure Web Design and Development ACS-1809 Chapter 9 Page Structure 1 Chapter 9: Page Structure Organize Sections of Text Format Paragraphs and Page Elements 2 Identifying Natural Divisions It is normal for a

More information

How To Create A Web Page On A Windows 7.1.1 (For Free) With A Notepad) On A Macintosh (For A Freebie) Or Macintosh Web Browser (For Cheap) On Your Computer Or Macbook (

How To Create A Web Page On A Windows 7.1.1 (For Free) With A Notepad) On A Macintosh (For A Freebie) Or Macintosh Web Browser (For Cheap) On Your Computer Or Macbook ( CREATING WEB PAGE WITH NOTEPAD USING HTML AND CSS The following exercises illustrate the process of creating and publishing Web pages with Notepad, which is the plain text editor that ships as part of

More information

Creating the Surf Shop website Part3 REVISED

Creating the Surf Shop website Part3 REVISED Creating the Surf Shop website Part3 REVISED Part 2 Recap: You should have the navigation completed for the website before starting Part 3. 1)Create a new DIV in index.html. It should come after banner

More information

JJY s Joomla 1.5 Template Design Tutorial:

JJY s Joomla 1.5 Template Design Tutorial: JJY s Joomla 1.5 Template Design Tutorial: Joomla 1.5 templates are relatively simple to construct, once you know a few details on how Joomla manages them. This tutorial assumes that you have a good understanding

More information

Embedding a Data View dynamic report into an existing web-page

Embedding a Data View dynamic report into an existing web-page Embedding a Data View dynamic report into an existing web-page Author: GeoWise User Support Released: 23/11/2011 Version: 6.4.4 Embedding a Data View dynamic report into an existing web-page Table of Contents

More information

HTML, CSS, XML, and XSL

HTML, CSS, XML, and XSL APPENDIX C HTML, CSS, XML, and XSL T his appendix is a very brief introduction to two markup languages and their style counterparts. The appendix is intended to give a high-level introduction to these

More information

HTML5 and CSS3 Part 1: Using HTML and CSS to Create a Website Layout

HTML5 and CSS3 Part 1: Using HTML and CSS to Create a Website Layout CALIFORNIA STATE UNIVERSITY, LOS ANGELES INFORMATION TECHNOLOGY SERVICES HTML5 and CSS3 Part 1: Using HTML and CSS to Create a Website Layout Fall 2011, Version 1.0 Table of Contents Introduction...3 Downloading

More information

Contents. Downloading the Data Files... 2. Centering Page Elements... 6

Contents. Downloading the Data Files... 2. Centering Page Elements... 6 Creating a Web Page Using HTML Part 1: Creating the Basic Structure of the Web Site INFORMATION TECHNOLOGY SERVICES California State University, Los Angeles Version 2.0 Winter 2010 Contents Introduction...

More information

With mobile devices and tablets becoming popular for browsing the web, an increasing number of websites are turning to responsive designs to

With mobile devices and tablets becoming popular for browsing the web, an increasing number of websites are turning to responsive designs to With mobile devices and tablets becoming popular for browsing the web, an increasing number of websites are turning to responsive designs to seamlessly adapt to any screen resolution. Introduction... 2

More information

WEB DESIGN LAB PART- A HTML LABORATORY MANUAL FOR 3 RD SEM IS AND CS (2011-2012)

WEB DESIGN LAB PART- A HTML LABORATORY MANUAL FOR 3 RD SEM IS AND CS (2011-2012) WEB DESIGN LAB PART- A HTML LABORATORY MANUAL FOR 3 RD SEM IS AND CS (2011-2012) BY MISS. SAVITHA R LECTURER INFORMATION SCIENCE DEPTATMENT GOVERNMENT POLYTECHNIC GULBARGA FOR ANY FEEDBACK CONTACT TO EMAIL:

More information

Inspiring Creative Fun Ysbrydoledig Creadigol Hwyl. Web Design in Nvu Workbook 2

Inspiring Creative Fun Ysbrydoledig Creadigol Hwyl. Web Design in Nvu Workbook 2 Inspiring Creative Fun Ysbrydoledig Creadigol Hwyl Web Design in Nvu Workbook 2 CSS stands for Cascading Style Sheets, these allow you to specify the look and feel of your website. It also helps with consistency.

More information

Instructions for Embedding a Kudos Display within Your Website

Instructions for Embedding a Kudos Display within Your Website Instructions for Embedding a Kudos Display within Your Website You may use either of two technologies for this embedment. A. You may directly insert the underlying PHP code; or B. You may insert some JavaScript

More information

CSS - Cascading Style Sheets

CSS - Cascading Style Sheets CSS - Cascading Style Sheets From http://www.csstutorial.net/ http://www.w3schools.com/css/default.asp What is CSS? CSS stands for Cascading Style Sheets Styles define how to display HTML elements External

More information

JavaScript: Arrays. 2008 Pearson Education, Inc. All rights reserved.

JavaScript: Arrays. 2008 Pearson Education, Inc. All rights reserved. 1 10 JavaScript: Arrays 2 With sobs and tears he sorted out Those of the largest size... Lewis Carroll Attempt the end, and never stand to doubt; Nothing s so hard, but search will find it out. Robert

More information

ANGULAR JS SOFTWARE ENGINEERING FOR WEB SERVICES HASAN FAIZAL K APRIL,2014

ANGULAR JS SOFTWARE ENGINEERING FOR WEB SERVICES HASAN FAIZAL K APRIL,2014 ANGULAR JS SOFTWARE ENGINEERING FOR WEB SERVICES HASAN FAIZAL K APRIL,2014 What is Angular Js? Open Source JavaScript framework for dynamic web apps. Developed in 2009 by Miško Hevery and Adam Abrons.

More information

ICE: HTML, CSS, and Validation

ICE: HTML, CSS, and Validation ICE: HTML, CSS, and Validation Formatting a Recipe NAME: Overview Today you will be given an existing HTML page that already has significant content, in this case, a recipe. Your tasks are to: mark it

More information

c. Write a JavaScript statement to print out as an alert box the value of the third Radio button (whether or not selected) in the second form.

c. Write a JavaScript statement to print out as an alert box the value of the third Radio button (whether or not selected) in the second form. Practice Problems: These problems are intended to clarify some of the basic concepts related to access to some of the form controls. In the process you should enter the problems in the computer and run

More information

Creating a Resume Webpage with

Creating a Resume Webpage with Creating a Resume Webpage with 6 Cascading Style Sheet Code In this chapter, we will learn the following to World Class CAD standards: Using a Storyboard to Create a Resume Webpage Starting a HTML Resume

More information

jquery Tutorial for Beginners: Nothing But the Goods

jquery Tutorial for Beginners: Nothing But the Goods jquery Tutorial for Beginners: Nothing But the Goods Not too long ago I wrote an article for Six Revisions called Getting Started with jquery that covered some important things (concept-wise) that beginning

More information

MCH Strategic Data Best Practices Review

MCH Strategic Data Best Practices Review MCH Strategic Data Best Practices Review Presenters Alex Bardoff Manager, Creative Services abardoff@whatcounts.com Lindsey McFadden Manager, Campaign Production Services lmcfadden@whatcounts.com 2 Creative

More information

Entrance exam for PBA in Web Development

Entrance exam for PBA in Web Development Entrance exam for PBA in Web Development Fill out your personal details below. Full name: CPR-number: E-mail address: 1 PART I: Overall knowledge In this test you will find 35 questions covering different

More information

Introduction to web development and JavaScript

Introduction to web development and JavaScript Objectives Chapter 1 Introduction to web development and JavaScript Applied Load a web page from the Internet or an intranet into a web browser. View the source code for a web page in a web browser. Knowledge

More information

AJAX The Future of Web Development?

AJAX The Future of Web Development? AJAX The Future of Web Development? Anders Moberg (dit02amg), David Mörtsell (dit01dml) and David Södermark (dv02sdd). Assignment 2 in New Media D, Department of Computing Science, Umeå University. 2006-04-28

More information

HTML and CSS. Elliot Davies. April 10th, 2013. ed37@st-andrews.ac.uk

HTML and CSS. Elliot Davies. April 10th, 2013. ed37@st-andrews.ac.uk HTML and CSS Elliot Davies ed37@st-andrews.ac.uk April 10th, 2013 In this talk An introduction to HTML, the language of web development Using HTML to create simple web pages Styling web pages using CSS

More information

JavaScript and Dreamweaver Examples

JavaScript and Dreamweaver Examples JavaScript and Dreamweaver Examples CSC 103 October 15, 2007 Overview The World is Flat discussion JavaScript Examples Using Dreamweaver HTML in Dreamweaver JavaScript Homework 3 (due Friday) 1 JavaScript

More information

CST 150 Web Design I CSS Review - In-Class Lab

CST 150 Web Design I CSS Review - In-Class Lab CST 150 Web Design I CSS Review - In-Class Lab The purpose of this lab assignment is to review utilizing Cascading Style Sheets (CSS) to enhance the layout and formatting of web pages. For Parts 1 and

More information

How to Properly Compose E-Mail HTML Code : 1

How to Properly Compose E-Mail HTML Code : 1 How to Properly Compose E-Mail HTML Code : 1 For any successful business, creating and sending great looking e-mail is essential to project a professional image. With the proliferation of numerous e-mail

More information

EUROPEAN COMPUTER DRIVING LICENCE / INTERNATIONAL COMPUTER DRIVING LICENCE WEB EDITING

EUROPEAN COMPUTER DRIVING LICENCE / INTERNATIONAL COMPUTER DRIVING LICENCE WEB EDITING EUROPEAN COMPUTER DRIVING LICENCE / INTERNATIONAL COMPUTER DRIVING LICENCE WEB EDITING The European Computer Driving Licence Foundation Ltd. Portview House Thorncastle Street Dublin 4 Ireland Tel: + 353

More information

In this chapter, you will learn how to...

In this chapter, you will learn how to... LEARNING OUTCOMES In this chapter, you will learn how to... Create a table on a web page Apply attributes to format tables, table rows, and table cells Increase the accessibility of a table Style an HTML

More information

WHITEPAPER. Skinning Guide. Let s chat. 800.9.Velaro www.velaro.com info@velaro.com. 2012 by Velaro

WHITEPAPER. Skinning Guide. Let s chat. 800.9.Velaro www.velaro.com info@velaro.com. 2012 by Velaro WHITEPAPER Skinning Guide Let s chat. 2012 by Velaro 800.9.Velaro www.velaro.com info@velaro.com INTRODUCTION Throughout the course of a chat conversation, there are a number of different web pages that

More information

8 STEPS TO CODE KILLER RESPONSIVE EMAILS

8 STEPS TO CODE KILLER RESPONSIVE EMAILS 8 STEPS TO CODE KILLER RESPONSIVE EMAILS THAT WILL MAKE YOUR EMAILS BEAUTIFUL 3 BUILD RESPONSIVE EMAIL STEP BY STEP Steps to create a simple responsive email template. (fluid image, main content, two

More information

Introduction to Adobe Dreamweaver CC

Introduction to Adobe Dreamweaver CC Introduction to Adobe Dreamweaver CC What is Dreamweaver? Dreamweaver is the program that we will be programming our websites into all semester. We will be slicing our designs out of Fireworks and assembling

More information

Cascading Style Sheet (CSS) Tutorial Using Notepad. Step by step instructions with full color screen shots

Cascading Style Sheet (CSS) Tutorial Using Notepad. Step by step instructions with full color screen shots Updated version September 2015 All Creative Designs Cascading Style Sheet (CSS) Tutorial Using Notepad Step by step instructions with full color screen shots What is (CSS) Cascading Style Sheets and why

More information

Designing HTML Emails for Use in the Advanced Editor

Designing HTML Emails for Use in the Advanced Editor Designing HTML Emails for Use in the Advanced Editor For years, we at Swiftpage have heard a recurring request from our customers: wouldn t it be great if you could create an HTML document, import it into

More information

Responsive Web Design: Media Types/Media Queries/Fluid Images

Responsive Web Design: Media Types/Media Queries/Fluid Images HTML Media Types Responsive Web Design: Media Types/Media Queries/Fluid Images Mr Kruyer s list of HTML Media Types to deliver CSS to different devices. Important note: Only the first three are well supported.

More information

Website Development. 2 Text. 2.1 Fonts. Terry Marris September 2007. We see how to format text and separate structure from content.

Website Development. 2 Text. 2.1 Fonts. Terry Marris September 2007. We see how to format text and separate structure from content. Terry Marris September 2007 Website Development 2 Text We see how to format text and separate structure from content. 2.1 Fonts Professionally written websites, such as those by Google and Microsoft, use

More information

Mobile Web Applications. Gary Dubuque IT Research Architect Department of Revenue

Mobile Web Applications. Gary Dubuque IT Research Architect Department of Revenue Mobile Web Applications Gary Dubuque IT Research Architect Department of Revenue Summary Times are approximate 10:15am 10:25am 10:35am 10:45am Evolution of Web Applications How they got replaced by native

More information

Searching the Internet

Searching the Internet Searching the Internet Looking for information How are websites connected with each other How does search work 10-06-09 Any problems? Susen Rabold Looking for information Before: Libraries, encyclopaedias

More information

We automatically generate the HTML for this as seen below. Provide the above components for the teaser.txt file.

We automatically generate the HTML for this as seen below. Provide the above components for the teaser.txt file. Creative Specs Gmail Sponsored Promotions Overview The GSP creative asset will be a ZIP folder, containing four components: 1. Teaser text file 2. Teaser logo image 3. HTML file with the fully expanded

More information

WEB DEVELOPMENT IA & IB (893 & 894)

WEB DEVELOPMENT IA & IB (893 & 894) DESCRIPTION Web Development is a course designed to guide students in a project-based environment in the development of up-to-date concepts and skills that are used in the development of today s websites.

More information

Introduction to Web Technologies

Introduction to Web Technologies Introduction to Web Technologies Tara Murphy 17th February, 2011 The Internet CGI Web services HTML and CSS 2 The Internet is a network of networks ˆ The Internet is the descendant of ARPANET (Advanced

More information

So we're set? Have your text-editor ready. Be sure you use NotePad, NOT Word or even WordPad. Great, let's get going.

So we're set? Have your text-editor ready. Be sure you use NotePad, NOT Word or even WordPad. Great, let's get going. Web Design 1A First Website Intro to Basic HTML So we're set? Have your text-editor ready. Be sure you use NotePad, NOT Word or even WordPad. Great, let's get going. Ok, let's just go through the steps

More information

HTML TIPS FOR DESIGNING

HTML TIPS FOR DESIGNING This is the first column. Look at me, I m the second column.

More information