What's the better?

For general web development questions that are not specifically related to CSS HTML Validator. This includes (but is not limited to) general HTML, CSS, Accessibility, JavaScript, and SEO questions.
Post Reply
conectart
Rank 0 - Newcomer
Posts: 1
Joined: Sat Mar 12, 2016 2:09 pm

What's the better?

Post by conectart »

Hello,
sorry for my english, but I come from Spain.

I would like to know which of these options is better and more effcient:
1:

Code: Select all

 <img src="aaa.jpg" widht="50">
2:

Code: Select all

<style>
.reducir{width:50px;}
</style>
<img src="aaa.jpg" clas="reducir">
The reason is that I have more than 200 images, and I would like that to be reduced KBs



Un saludo,
David
User avatar
Albert Wiersch
Site Admin
Posts: 3783
Joined: Sat Dec 11, 2004 9:23 am
Location: Near Dallas, TX
Contact:

Re: What's the better?

Post by Albert Wiersch »

Hello,

If you want to reduce the size of the image file to reduce the number of KBs (bytes) that are transferred then you will need to reduce the image size of aaa.jpg using an image processing program. Unfortunately, neither one of those options you mentioned would do that.
Albert Wiersch, CSS HTML Validator Developer • Download CSS HTML Validator FREE Trial
User avatar
RSteinwand
Rank VI - Professional
Posts: 596
Joined: Mon Jun 09, 2008 2:12 pm
Location: Fargo, ND
Contact:

Re: What's the better?

Post by RSteinwand »

You always want to specify the width and height of an image to get it to display faster.

Assuming you use html5, you could remove quotes from your some of html.

Code: Select all

<img src="aaa.jpg" width=50 height=100 alt="a picture of aaa">
Some of the quotes have to remain if you have spaces in them. I prefer to leave the quotes for href and src just to be safe.

Check out the <picture> element if you want to use smaller images.
Rick
Post Reply