Bus119A Web Page Design John Wang, Diana Chou and Greg Windt Presented By.

Bus119A

Web Page Design

John Wang, Diana Chou and Greg Windt

Presented By

• How many people have HTML experience ?

• How many people have their own Web Site ?

• Frames

• Graphics

• Audio/Video

Bus119A

HTML Basic Elements

Presented By John Wang

The Basic HTML Document Skeleton

Your basic document will look something like this:

<HTML>

<HEAD>

<TITLE>Bus 119A</TITLE>

</HEAD>

<BODY>

<H1>WebWorks HomePage</H1>

This Paragraph will explain our Summary . . . 

This Paragraph will teach the HTML Basics . . . 

This Paragraph will discuss our slide show . . . 

</BODY>

</HTML>

<HTML>

<HEAD> <TITLE>WebWorks' Main Page </TITLE>

</HEAD>



<BODY Text="#000000" Bgcolor="skyblue" Link="#0000FF" Vlink="#800080" Alink="#FF0000">

<H1>Welcome to WebWorks' Home Page</H1><H6>This page is under CONSTRUCTION.</H6>

This is regular text

This is BOLD textThis is italic text

AAAAAAAThis is font size 1 in blueThis is font size 7 in HOT PINK

Use the Big tag <BIG>to make things bigger</BIG> and the small tag to makethings teeny

Use subscripts and superscripts to create mathematicalexpressions like a2+b2=c2,or for chemical expressions like H2O

<STRIKE>This a strike through</STRIKE>

This is underlined

</BODY>

</HTML>

Bus119A

Text Formatting and Tables

Presented By Diana Chou

<HTML><HEAD>

<TITLE>Formatting & Tables</TITLE></HEAD>

<BODY Text="#000000" Bgcolor="skyblue" Link="#0000FF" Vlink="#800080" Alink="#FF0000">

<CENTER>This is regular text</CENTER>

This is BOLD text This is Italic text

<OL> <LI>First item </LI> <LI>Second item </LI></OL>

<UL> <LI>Point 1</LI> <LI>Point 2</LI></UL>

<TABLE Border="3" Cellpadding="15"><TH Align="center" Colspan="2"> Table </TH> <TR> <TD><A HREF="www.geocities.com">www.geocities.com</A></TD> <TD>Personal Page</TD> </TR> <TR> <TD><A HREF="www.tripod.com">www.tripod.com</A></TD> <TD Align="center">Personal Page</TD> </TR> <TR> <TD><A HREF="www.angelfire.com">www.angelfire.com</A></TD> <TD>Business or Personal Page</TD> </TR></TABLE>

</BODY></HTML>

Bus119A

Images, Links and Frames

Presented By Greg Windt

<HTML><HEAD>

<TITLE>Links & Images</TITLE></HEAD>

<BODY Text="#000000" Background="satin1.jpg" " Link="#0000FF" Vlink="#800080" Alink="#FF0000"><CENTER><A HREF="mailto:[email protected]"><IMG Src="mailbox.gif" Border="0" Align="middle" Alt="email"> Email Webworks</A>

<HR Width="100%">

<A HREF="http://www.angelfire.com/ms/webworks"><IMG Src=lb_di.gif Border="0" Align="middle" Alt="home page">WebWorks</A><A HREF=“summary.html”><IMG Src=lb_di.gif Border=“0” Align=“middle” Alt=“summary”> Summary</A></CENTER>

</BODY></HTML>

<HTML><HEAD>

<TITLE>Frame</TITLE></HEAD>

 <FRAMESET Cols=“30%,*" Border=0 Frameborder=0 > <NOFRAMES>If you are viewing this, your browser does not support frame documents.Don't worry! We've thought ahead and built our site to be navigational with non-frame browsers.Here's the link to our <A HREF=noframes.html">Home Page</A></NOFRAMES> <FRAMES Src="greg.html" Name="nav" Scrolling=“auto”> <FRAMES Src="diana.html" Name="main" Scrolling=“auto”> </FRAMESET>

</HTML>

Bus119A

Presented By Greg Windt

Angelfire URL

http://www.angelfire.com/ms/webworks/index.html

Angelfire’s Images

<BODY Background = “/bg2/CLOUD.JPG”><IMG Src = “/images/animate/handbox.gif”>

Your Images

<BODY Background = “images/space01.gif”><IMG Src = “images/WEBWORKSLOGO.GIF”>

Powerpoint Slides

<A HREF="images/119aPresentation.ppt">Slides</a>

Bus119A Web Page Design John Wang, Diana Chou and Greg Windt Presented By.

Documents

Transcript of Bus119A Web Page Design John Wang, Diana Chou and Greg Windt Presented By.