What's the better?

Discussion about CSS related issues.
Post Reply
conectart
Rank 0 - Newcomer
Rank 0 - Newcomer
Posts: 1
Joined: Sat Mar 12, 2016 2:09 pm

What's the better?

Post by conectart » Tue Mar 15, 2016 2:39 am

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
Site Admin
Posts: 3453
Joined: Sat Dec 11, 2004 9:23 am
Location: Near Dallas, TX
Contact:

Re: What's the better?

Post by Albert Wiersch » Tue Mar 15, 2016 7:52 am

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.
Image
Albert Wiersch

User avatar
RSteinwand
Rank VI - Professional
Rank VI - Professional
Posts: 600
Joined: Mon Jun 09, 2008 2:12 pm
Location: Fargo, ND
Contact:

Re: What's the better?

Post by RSteinwand » Thu Apr 28, 2016 3:09 pm

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