An image can be used in a webpage for two regions,
1) Image = for content use, on the other hand, tend to change frequently. New images are uploaded often, users change their profile images and photo galleries, etc.
2) Background Image = for design. I.e. logos, button images, links with images, etc. tend to stay the same. They’re only changed if designer want to redesign.
The way I tend to think about this is, do I want the image to appear on all screen sizes, on all devices, with CSS turned either on or off? Do I want the image to be “indexed” by Google and Facebook. If the answer is yes to all or any of these questions, then usually the image is “content” and you should use an IMG tag.
If you want a different image to display at different screen sizes (or no image at all on certain devices), or if you’re happy for the image to not appear on a print out, or you’re happy for the image to not appear if CSS is turned off, then usually the image is “design” and you should use a background image.
Note: If an HTML file contains ten images – eleven files are required to display the page right. Loading images takes time, so my best advice is: Use images carefully.
Note: When a web page is loaded, it is the browser, at that moment, that actually gets the image from a web server and inserts it into the page. Therefore, make sure that the images actually stay in the same spot in relation to the web page, otherwise your visitors will get a broken link icon. The broken link icon is shown if the browser cannot find the image. read more @ http://www.css-jquery-design.com/…
Proper uses of IMG & Background-image
Use IMG if you intend to have people print your page and you want the image to be included by default.
Use IMG (with alt text) when the image has an important semantic meaning, such as a warning icon. This ensures that the meaning of the image can be communicated in all user-agents, including screen readers.
Hi guys! Today we are going to see another great example of analog clock using the power of CSS3 and most advanced library jQuery. We will start by creating a very cool and realistic analog wall clock with pure CSS3 properties, and add a little smooth rotation for giving the clock handles a rotating effect. read more @ http://www.css-jquery-design.com/…
As we mentioned before, this technology is developed with jQuery so it is supported by almost all major browsers. it is possible that the syntax and behavior can be changed in future versions of browsers. For today, it is supported by next browsers: read more @ http://www.css-jquery-design.com/…