Tripod: Homepage Building Tips

Search:The WebTripod


Tripod's HTML Tips Overview Basic Page Setup Meta & Header Tags Colors and Body Tags Formatting Links Graphical Elements Text Forms Tables Frames Filenames Sound, Movies and Midis Managing Subdirectories FTP or Uploading Files File and Mime Types Image Maps Send in my tip	Graphical Elements 12.) Putting images on Web pages The HTML tag for placing images on your page is as follows: <IMG SRC="location of graphic"> If you would like to link to a graphic elsewhere on the Web, it's important to check with the page owner. The use of copyrighted material without the permission of the owner is strictly against Tripod's Terms of Service. Furthermore, some sites have limitations on bandwidth and their owners can get charged every time your page loads their image. Another disadvantage of linking to graphics on other sites: You are subject to the traffic of the Internet and the load on the particular server that you are linking to. In other words, the images on your page might load slowly. Aligning images on Web pages The HTML for aligning an image is as follows: <img src="NAME" align=?> Aligns an image where ? is left, right, center; bottom, top, middle. <img src="name" border=?> Sets size of border around an image <hr> Inserts a horizontal rule <hr size=?> Sets size (height) of rule <hr width=?> Sets width of rule, in percentage or absolute value <hr noshade> Creates a rule without a shadow
13.) Images as a background To use a picture as a background, specify the filename of the picture you want to use within the BODY tag in your HTML file. For instance, <BODY BACKGROUND="myimage.gif"> The picture will repeat itself over and over until it fills the background of your browser window, an effect which is called tiling. 14.) Borders on pages The quick and easy way to put a border on your page is to get a GIF or JPG file that has a border you like and use it as a background for your page. To do that simply, you'd use HTML commands something like the following (remember that BACKGROUND is part of the tag): <BODY BACKGROUND="my_border.jpg"> You can experiment with using tables and invisible spacing JPEGs to create a precise alignment and borders. There are many beautiful borders available free on the Web. Take a look at Border Bonanza. At that site there is more information about how to put borders on your page. You might also want to see the related help section called "Fancy Borders." 15.) Expanding background images to the entire screen If you want to have a background that fills the entire window, rather than tiling, you'll have to create an image large enough so that the browser will not be able to repeat it, such as 600 by 800 pixels. An image that large is likely to take a lot longer to download than smaller images. Use this HTML to place it into your page: <BODY BACKGROUND="my_background.jpg"> 16.) Banners Banners are GIF files, so you would place them just like placing any other image on your Web page with an <IMG SRC="my_file"> tag. To create a linkable banner, just surround the tag that calls up your image, such as <IMG SRC="my_file"> tag, with a link tag, like this: <A HREF><IMG SRC="my_file" border=0></A> 17.) Graphics Problems If you are having problems with graphics uploaded to your directory, 90% of the time, the graphic has been broken during upload. This situation is particularly likely if Netscape was used to upload the files, which tends to eat graphic files, although it treats text files okay. Other reasons for a broken or missing graphic might be that the graphic file is inappropriately named. For example, your file may be named cat.gif when it should be cat.jpeg. Or the name might be misspelled. If your image does not load as above, more than likely there's a problem with the filename. Check to make sure you are linking to the correct graphic. Please note that a filename is CASE sensitive so make sure that you are using the correct filename. For example, MyPicture.gif is a different file than mypicture.gif. If you are certain that the location and filename are corrent, it is possible that the image is corrupted somehow. Make sure you uploaded them in 'binary' or 'raw data' mode. 18.) Odd-looking graphics You may be using a color palette that doesn't work well with the browser you're using. For instance, graphics created on a Windows machine sometimes look "funny" when viewed on a Macintosh. Be sure to use the "safe palette." You can find an example of this at http://www.lynda.com. 19.) Image Scaling If you have an image that is 100x100 pixels and you specify its HEIGHT=200 and WIDTH=400, it will, when displayed in the browser window, get scaled 200% vertically and 400% horizontally. The HTML would look like this: <IMG SRC="My_file.gif" HEIGHT=200 WIDTH=400> 20.) Animation If you have a gif animation program you're two thirds of the way there; if not check out http://www.tucows.com for some shareware and freeware that will get you rolling. Once you have created an animation, use this HTML to put it on your Web page: <IMG SRC="My_animation.gif"> 21.) GIF file A graphic file of a specific format: the Graphic Interchange Format. This format was developed by Compuserve and has become an Internet standard for exchanging files across multiple platforms. All graphical Web browsers will load and place valid GIF files.
Previous Page Next Page