PicsAndLinks - 2-6-06

Make a webpage with the html format (html, head, body, etc)
Save the Webpage in your directory as "YourName_PicsandLinks.html"
You should create a directory called "pics" or "images" then save all your pictures into that directory
Use as many of the tags listed in these sections as possible on one web page.
Capitalize your html tags, it will make them easier to find
Save it into your directory at the same level as your index page.
When you are done, print the code and the display of the page, staple them together and hand them in.

In the Head

<TITLE> "Yourname Pictures and Links" </TITLE>

In the Body

  • A link to your index <A HREF="Index.html"> My Index </A>
  • A display heading <H2>Yourname Pictures and links </H2>
On this page you are going to make a bunch of links, and you will also experiment with some photos

Pictures and the IMG tag:

Pictures 'should add interest" to your page, and 'should not be too distracting' from the content. Not everybody has a fast network connection, some people still rely on dialup to access the web. The picture file should not be too large, or it will take forever for the page to load.

For this photo, use the samples linked below. The photos were taken at Biosphere 2 in 200If you use a photo from online, you should pay attention to the copyright of the image. If the page or image is copyrighted, you should know that the image is not "yours" and treat it as if it belonged to somebody else. You should be aware of Copyright and Creative  Commons Flickr statement on Creative Commons
Thumbnail - medium size - full size Right click on the link, choose "save link as" and save it into your directory.
Try these tags on your photo. http://www.htmlcodetutorial.com/images/_IMG.html Feel free to add multiple photos if you need to.

* SRC: where to get the picture
* ALT: text to show if you don't show the picture
* NAME
* LONGDESC: URL of a long description of the image
* WIDTH: how wide is the picture
* HEIGHT: how tall is the picture
* ALIGN: how text should flow around the picture
* BORDER: border around the picture
* HSPACE: horizontal distance between the picture and the text
* VSPACE: vertical distance between the picture and the text
* DYNSRC: play a movie file
* CONTROLS: show the buttons which control the movie
* LOOP: how many times to loop the movie
* START: when to start playing the movie
* SUPPRESS: Don't show icons of images that haven't downloaded yet

Links:

Try all of these link techniques:
http://www.htmlcodetutorial.com/linking/_A.html

* HREF: URL you are linking to
* NAME: name a section of the page
* TARGET: which window the document should go in
* TITLE: suggested title for the document to be opened
* display the address
* make a photo into a link

Background Sound

If you have a sound clip, try the background sound tag
http://www.htmlcodetutorial.com/sounds/_BGSOUND.html


Page Information

  • 2 years ago [history]
  • View page source
  • You're not logged in
  • No tags yet learn more

Wiki Information

Recent PBwiki Blog Posts