CSE1304 Lecture 9 Web pages

Web pages - where do I start?

Back to cse1304 notes index | Next Page: Where do I start?

Copyright © Monash University, Semester 1 2005

CSE1304 Where do I start??

Where do I start??

Start with the information (not the technology)
- What are you trying to say?
- Who are you trying to reach?
- How will a stranger use this page?
Use the source, Luke!

Back to cse1304 notes index | Previous Page | Next Page: Basic HTML

Copyright ©; Monash University, Semester 1, 2005

CSE1304 Basic HTML

Basic HTML

A page:

<html>

</html>

Back to cse1304 notes index | Previous Page | Next Page: Basic HTML part 2

Copyright ©; Monash University, Semester 1 2005

CSE1304 - Basic HTML part 2

Basic HTML part 2

<title> This is the page title </title>

<H1> This is the Heading </H1>

<H2> This is a second level Heading </H2>

<p> This is a short paragraph </p>

<ul>

<li> This is the start of a bulleted (unnumbered) list
<li> This is the second point of a bulleted list

</ul>

<a href="http://www.csse.monash.edu.au/courseware/cse1304/"> This is a link to the courseware page </a>

Back to cse1304 notes index | Previous Page | Next Page: Usability

Copyright ©; Monash University, Semester 1 2005

CSE1304 Lecture 9 Slide 5 - Usability and Accessibility

Usability and Accessibility

Focus on getting your information across
What technology does your page require?
What knowledge does your page require?
What skills does your page require?
Examples:

Back to cse1304 notes index | Previous Page | Next Page: Images on the web

Copyright ©; Monash University, Semester 1 2005

CSE1304 Images on the web

Images on the web

Back to cse1304 notes index | Previous Page | Next Slide: Animation

Animation on the web.

What effect does Animation have?
- Example: CSSE Animated Images collection
  - Catch the eye
  - Hold the attention
  - Distract from static elements of the page
So animation is bad?
- Not at all - in fact, it can be amazingly useful!
- Example: Satellite images

Back to cse1304 notes index | Prvious Page | Next Page: Static Images

CSE1304 Static Images on the web

Static Images on the web

What can images be used for?
- As buttons/links
  - Examples: Comics: For Better Or Worse
  - Examples: Monash Library Catalogue
  - Examples: CSSE Image collection

Back to cse1304 notes index | Previous Page | Next Page: Inline Images

CSE1304 Inline images

Inline images

What does "inline" mean?
- Images as part of the page
- Next to , or surrounded by, text
- Potentially slowing the loading of the page
- But sometimes necessary, and loading problems can be minimised
Use of the ALT tag
- Text as alternative to image
- Useful for the blind
- Useful for slow modems
- Useful for speed
How do we speed things up?
- Shrink the image
- (The size of the image file, not how big it looks on screen!)

Back to cse1304 notes index | Previous Page

Web pages - where do I start?

Copyright © Monash University, Semester 1 2005

Where do I start??

Copyright ©; Monash University, Semester 1, 2005

Basic HTML

Copyright ©; Monash University, Semester 1 2005

Basic HTML part 2

Copyright ©; Monash University, Semester 1 2005

Usability and Accessibility

Copyright ©; Monash University, Semester 1 2005

Images on the web

Copyright ©; Monash University, Semester 1 2005 CSE1304 Animation on the web

Animation on the web.

Copyright ©; Monash University, Semester 1 2005

Static Images on the web

Copyright ©; Monash University, Semester 1 2005

Inline images

Copyright ©; Monash University, Semester 1 2005