Login | Register   
LinkedIn
Google+
Twitter
RSS Feed
Download our iPhone app
TODAY'S HEADLINES  |   ARTICLE ARCHIVE  |   FORUMS  |   TIP BANK
Browse DevX
Sign up for e-mail newsletters from DevX


advertisement
 

Optimizing the HTML Code : Page 5

You can do some simple things with your HTML tags to make graphics feel faster and work better for all readers.


advertisement

Storing Image Files
Just as you do with .html files, you need to have a logical file structure for saving and calling your image files, as well as a logical naming convention for the files.

The images themselves aren't physically placed with the Web page that displays them. Instead, the page will call the images by their file name. The images can be called by either a full, exact path, or a relative path.

File Hierarchy
There are no hard-and-fast rules for file structure; HTML is flexible enough to accommodate many different storage schemes.

  • If all of your site's HTML files reside in one directory, and if you have just a handful of image files, store your HTML files and image files in the same directory:

    www
      home
        index.html
        logo.gif
        photo.jpg



    Referencing image files in the above directory setup is simple. For example, to reference logo.gif from index.html, you would enter: <img src="logo.gif">.

  • For any other situation than the above, store all of your image files in a separate image directory:

    www
      home
        index.html
      page1>
        page1.html
        links1.html
      images
        logo.gif
        photo.jpg
        thing.png

    Referencing image files in the above directory setup is just a tad more subtle. To reference logo.gif from page1.html, you would enter: <img src="../images/logo.gif">.

    The .. moves you up one level, from page1 to www. Then, the /images/ moves down from www to the images directory.

Image-File Naming Guidelines
There are no etched-in-stone rules for naming image files. But here are some useful guidelines:

  • Use the 8.3 naming convention. That is, limit the first part of your filename to a maximum of 8 characters and append to this a 3-character extension that describes the file type—gif for a GIF, jpg for a JPEG, and png for a PNG. For example: logo.gif, trees.jpg, alleight.png.

    Why? Because some of your users might be on platforms that do not support long filenames (Windows 3.x, for example).

  • Use all lowercase letters.

    Why? Because some servers (UNIX, for example) are filename case-sensitive and it's all too easy to make an upper/lower-case mistake when entering a filename in your HTML docs.

  • Do not use spaces or punctuation marks, except for underscores _ and dashes - .

    Why? Because some servers might have trouble decoding these special characters.




Comment and Contribute

 

 

 

 

 


(Maximum characters: 1200). You have 1200 characters left.

 

 

Sitemap
Thanks for your registration, follow us on our social networks to keep up-to-date