Fundamentals of Web Design Copyright ©2004 Department of Computer & Information Science...

Fundamentals of Web Design

Copyright ©2004 Department of Computer & Information Science

Introducing XHTML:Module A: Web Design Basics

Fundamentals of Web DevelopmentCopyright ©2004 Department of Computer & Information Science

Goals

• Understand hyperlinking• Understand how tags are formed• Understand HTML as a markup

language• Understand the role of the W3C


The World Wide Web

• Accessing cross-referenced documents, known as hypertext linking, is probably the most important aspect of the Web because it allows you to quickly open other Web pages


The World Wide Web

• A hypertext link, or hyperlink, contains a reference to a specific Web page that you can click to quickly open that Web page


The World Wide Web

• A document on the Web is called a Web page, identified by a unique address called the Uniform Resource Locator, or URL

• URL commonly referred to as a Web address


The World Wide Web

• A URL is a type of Uniform Resource Identifier (URI), which is a generic term for many types of names and addresses on the World Wide Web


The World Wide Web

• A Web site refers to the location on the Internet of the Web pages and related files (such as graphic files) that belong to a company, organization, or individual


HTML Documents

• Originally, people created Web pages using Hypertext Markup Language

• Hypertext Markup Language (HTML) is a simple language used to create the Web pages that appear on the World Wide Web


HTML Documents

• A markup language is a set of characters or symbols that define a document’s logical structure or how a document should be printed or displayed


HTML Documents

• HTML is based on an older language called Standard Generalized Markup Language, or SGML, which defines the data in a document independently of how the data will be displayed


HTML Documents

• A target output format refers to the medium in which a document will be displayed, such as a Web page or an online help system


Basic HTML Syntax

• HTML documents are text documents that contain:– formatting instructions, called tags

– the text that is to be displayed on a Web page


Basic HTML Syntax

• HTML tags range from formatting commands to controls that allow user input

• Tags are enclosed in brackets (< >), and most consist of a starting tag and an ending tag that surround the text or other items they are formatting or controlling


Common Structure and Formatting HTML Tags


Basic HTML Syntax

• All HTML documents begin with <html> and end with </html>

• Two other important HTML tags are the <head> tag and the <body> tag


Basic HTML Syntax

• The <head> tag contains information that is used by the Web browser, and you place it at the start of an HTML document, after the opening <html> tag


Basic HTML Syntax

• The <head> tag pair and the tags it contains are referred to as the document head

• Following the document head is the <body> tag, which contains the document body


Basic HTML Syntax

• The <body> tag pair and the text and tags it contains are referred to as the document body

• A Web browser’s process of assembling and formatting an HTML document is called parsing or rendering


Basic HTML Syntax

• You use various parameters, called attributes, to configure many HTML tags

• You place an attribute before the closing bracket of the starting tag, and separate it from the tag name or other attributes with a space


Basic HTML Syntax


Web Page Design and Authoring

• Web page design, or Web design, refers to the visual design and creation of the documents that appear on the World Wide Web



• Web page authoring refers to the creation and assembly of the tags, attributes, and data that make up a Web page



• This is a subtle, but important distinction: – A book on Web design teaches the visual and

graphical design aspects of creating Web pages

– A book on XHTML teaches the more basic concepts that you need to get started, such as how to work with tags and attributes


The W3C

• Web page authors began to find it necessary to write slightly different HTML code for each Web browser in which they anticipated their Web page would be opened


The W3C

• To address the growing need for standards, Tim Berners-Lee established the World Wide Web Consortium, or W3C, in 1994 at MIT to oversee the development of Web technology standards


The W3C

• The W3C does not release a version

of a particular technology. Instead, it

issues a formal recommendation for a

technology, which essentially means

that the technology is (or will be) a

recognized industry standard


Web Browsers

• At the time of this writing, Internet Explorer browsers are being used by more than 85% of the market.

• Netscape Navigator also makes up a large part of the browser market.


Web Browsers

• Three additional browsers that are worth noting are:– Amaya (http://w3.org/amaya)– Mozilla (http://www.mozilla.org)– Opera (http://www.opera.com)


Web Browsers

• You must test your Web pages in every browser and browser version in which you anticipate they will be opened.


Questions?

Fundamentals of Web Design Copyright ©2004 Department of Computer & Information Science...

Documents

Transcript of Fundamentals of Web Design Copyright ©2004 Department of Computer & Information Science...