Home » HTML » Images
HTML Images tutorials
Learn how to add a background image to your web page using the body tags background attribute.
Related Tutorials
Fixed Background
Do you have an image in back ground you'd like to stay put? You will need to add a background properties attribute to the body tag where you have put the attribute for your background image. This will give you the illusion of the page contents moving as you scroll over a static or immobile wallpaper.
How To Add Thumbnail Images
Learn how to add thumbnail images to your web page, which when clicked takes your user or visitor to a larger external image.
Displaying a TIFF in a Web Page
This tutorial will show you how to display a TIFF in a web page. Web browsers can display standard image formats such as GIF, JPG, and PNG files. Unfoturnately, web browsers won't display TIFF images.
Adding Background Sound
To add sound as background music on your page, use the <embed src> tag. This tag has a few attributes to it.
Graphics And Pictures
Colors, images, pictures, and graphics bring a lot of flavors to a web page. As you already know, a web page is in fact a text file equipped with HTML tags that a browser is asked to analyze, interpret, and render a result. Unlike in a word processor, a picture cannot be included on a web file. Instead, you tell the browser where the image is located, the browser will try to find it and then display it. This, of course means if you provide the wrong address, I mean if you don't clearly state where the picture is located, or if the browser doesn't find the picture where you said it was, there would be an error on your page.
Basic HTML: Image Tags and alt Attributes
Once you've created the basic structure of your web page and added some text in paragraphs and headers you'll probably want to spice things up with an image or two, and maybe a few links to your favourite websites.
Web Page Forms
This tutorial is intended to supplement my Perl/CGI and JavaScript tutorials. Web page forms were the first interactive capabilities made available to web developers, followed by the use of CGI scripts and more recently by the rise of JavaScript. All three can act in concert to create exciting, but more importantly, useful web pages.
HR Tag Attributes
Well, suppose you wanted to use a horizontal rule on your web page, but you wanted it to match the length of an image, or some text....or maybe have a short line aligned to the left or right of the page. Well, you can! Here is a list of attributes you can use to change the hr tag to your liking:
Create An FavIcon For Your Web Page
Would you like to display your own icon on the browser address bar when visitors view or bookmark your web page?
All About Forms
Forms are the most popular way to make web pages interactive. Like forms on paper, a form on a web page allows the user to enter requested information and submit it for processing. (Fortunately, forms on a web page are processed much faster.)
Designing a Web Page Tutorial
Read this tutorial to learn how to create a simple web page of your own in a fast and easy way!
Images
Learn how to place images in your page and how to align images and add spaces around an image.
HTML Background Music Setup
Using HTML background music is not a complicated task. In this article I will show you how to add background music to your html pages.
How To Change Your Web Pages Background Color
Change your web pages background color using the body tags bgcolor attribute.
How To Add Horizontal Rules
Learn how horizontal rules can separate portions of your web page visually.
Image Attributes
There are main attributes we can add to the image tag which describe or alter the appearance of the image.
Automatic refresh webpage / Set time to redirect
When you need your web page automatic refresh in 5 second or any second, use this meta tag. it's a simple code, put it between HEAD tag in your web page.
Client Side Image Maps
Image maps aren't as bad as they seem, at least if you use a client side image map using HTML rather than a cgi program. I may add a section on using a cgi driven image map later on, but for now, lets look at one that just uses HTML and an image!
Links
Make a link from your page to any other page on the World Wide Web. Learn what is anchor and how to create email, text and images links.
SSI (Server Side Includes)
This page tells you how to include files on your web page using SSI.
Hyperlinking Text and Images
A Hyperlink, link for short, is the basis of web development. It is where you mouse over an image or text, your cursor changes to a hand, you can click it and a new page opens. This is useful for linking a website to all sub pages, to link to new websites, to link to images such as thumbnails that will open full images.
HTML Tutorial For Beginners
In this tutorial, you will learn how to: Create HTML tags and attributes; Add colors and backgrounds; Choose font sizes, faces, styles and colors; Set up links to other web pages or other web sites; Create bulleted and numbered lists; Put your pictures into your page; Create tables; Set up atributes of the table; Align and change the positions of the text and the pictures; Create forms to collect information; Use frames to put multiple pages into a single window; Save your own HTML file.
Links
Web links appear to be one of the strongest features of the Internet. They provide the user with the ability to jump from one web page to another.
HTML Web Page Template
Creating An HTML Web Page Template.
Tables in HTML
Table is much help in performing arrangement of web pages compositions and most assistive in compiling a document in HTML format. Especially for web page construction an its interface graphically.
Add to Favorites Link
Getting repeat users is a common goal amongst almost all webmasters, professional or otherwise. A lot of people like to use links that allow the user to add pages to their bookmarks. If a user bookmarks your page they are far more likely to revisit in the future.
Tables Tricks 'n' Tips
Instead of designing graphic intensive web sites that take ages to load, you can use HTML tables creatively to get a professional looking web page that loads super fast.
Image Maps
Image maps create clickable regions in an image. This is very helpful for a navigation bar. This method is an alternative to slicing up the image into many parts. If you don't want to use Javascript in order to have image rollovers, then image maps is the best route to go.
Backgrounds
When deciding whether you want to use a plain color or an image you should consider the fact that very few of the web's 100 most visited sites use background images.
Linking To Another Web Page
This is what the Web is all about linking from one web page to another.
Graphics Introduction: Part 2
Image size refers both to the height and width of the image in pixels and the file size. Large graphics take a long time to download over the Web and many people will become impatient.
Web design layout 9: sitebuild
Learn how to convert my web design layout #9 into a working one page css template.
Graphics Introduction: Part 1
This tutorial discusses issues and techniques relating to Web graphics. It includes information about creating animated GIFs, clickable image maps, and efficient Web graphics.
Disabling The IE 6 MyImage Tool Bar
IE6+ incorporates a new feature called the MyImage Toolbar, which, if enabled on Tools > Internet Options > Advanced > Enable Image Toolbar, provides the user with a popup menu over images that allows the user to instantly save, print, or email any image in a page.
Internal Targets or Bookmarks
Now we are going to take a look at internal targets. Internal targets are links to another section of your web page. They allow us to specify and navigate through specific parts of a page. We can take you to a certain paragraph, or take you to the top. The Internal target or bookmark is a type of anchor tag that NAMES the location it surrounds.
Image Maps
Learn how to create clickable regions in an image. Image maps create clickable regions in an image. This is very helpful for a navigation bar. This method is an alternative to slicing up the image into many parts. If you don't want to use Javascript in order to have image rollovers, then image maps is the best route to go.
Your PROject Template PSD to HTML
Hello welcome to part 2 of the 5 page template series. Today we’ll be converting our PSD into a one page working CSS template. In part 3 we’ll begin to add our additional pages.
Image Maps
An image map is an image that has been divided into regions, or "hotspots"; when a hotspot is clicked an action occurs, for example a new file opens. The image found at the bottom is an example of an image map.
How To Add Inline Images
Learn what inline images are and how to add them to your web pages in this tutorial.
1 x 1 Images
Here's a great way to cut down on bytes and speed up the loading of your page. Use a 1 x 1 pixel image and shape it just about any way you want.
 
Categories