1. While you are free to lurk, we welcome you to register for a (free) account so that you will be able to participate in forum discussions.

Image optimization..

Discussion in 'Search Engine Optimization' started by eanob, Jan 5, 2015.

  1. Scorp Member

    Scorp

    @ducklord Man, thanks for the information, but honestly, it goes a bit too much into the technicalities of photos for my taste.

    What's the take away from what you wrote? In laymen terms for us lay people? :p

    You're correct, I do consider jpg and png images as more or less the same. Although, for some reason my impression - and my choice for my blogs - is to use jpg images as much as possible. How did I come to that conclusion?

    Well, when I was researching Image SEO type things, I read blogs and forums and places, and I came to the conclusion that most people will recommend against using gif images, and then half of the others will tell you to use jpg's, and the other half to use png's, so I thought to myself, "If half are recommending one thing and the other half a different thing, then there's no consensus, and so it really doesn't make a big enough difference for me to bother with such details."

    I guess maybe the percentage was 60% of what I read recommended jpg's and about 40% png's, so I was left with the impression that jpg's are better.


    But do tell, what do you recommend I do? Which format do you recommend I use? I'm not a photographer or some photo art lover or whatever, and so minor differences in quality really don't mean much to me... I mean, I can appreciate a good-quality picture just like anyone, but that's as far as it goes...

     
  2. ducklord Member

    ducklord

    @Scorp If I had a hammer, a heavy-heavy hammer right now, and you were sitting beside me, you'd have to duck. 'cause I'd throw it towards your head. With rage.

    MAAAAN!

    How simpler can I make it than...

    "Use JPGs for PHOTOs and images depicting stuff that DOESN'T need detail"
    "Use PNGs for images that need TRANSPARENCY - like a logo - and images that NEED detail to be clear"
    "Use PNGs for images that only have FLAT colors - like the logo of Coca Cola"

    That's it!
    I mean, I just wrote that and you replied that "it's too technical"!!! Damn, man, if that's "technical", what would a talk about the proper use of different macroblocks in MPEG4 video encoding be?! :-D

    Here's it, with even less words.

    Photos? JPGs.
    Illustrations? PNGs.
    Transparent logos and icons? PNGs.

    :-D

    I have to sit you down someday and show you even more stuff about the proper optimization of images, like, say, how the removal of metadata and other stuff reduces their size even further (it's one of the things the popular Smush.it plugin for WordPress does among other things).

    P.S.: I'm trying to be funny while giving info, I wouldn't ever hit you on the head with a hammer. But, on the other hand, you're not near me, and I'm not holding a hammer :-D

     
    Scorp and Converse like this.
  3. Scorp Member

    Scorp

    @ducklord haha it's cool. Remember, I grew up among Greek people, so I get the humor, malaka :D

    Okay, well that's a better explanation for us simple people. In the words of George Carlin: "Nothing fancy at our house, we're simple folk." :p

    Now, the thing about images is that I don't care for them very much. I learn by necessity...

    So if I need something, I'll get down to learning it.

    It's like this, from South Park:

    Stan Marsh: You don't even know anything about Christianity fat ass!
    Eric Cartman: I know enough to exploit it.

    Or in our case:

    Ducklord: You don't know anything about images skinny ass!
    Scorp: I know enough to exploit them.

    But it's good, you simplified it for me in your last answer. And I'm sure the more detailed explanation will come in handy at some point, you know, the unconscious knowledge I gained from it or something, hehe...

     
  4. ducklord Member

    ducklord

    Well, that's not "Greek humor", bozo derclownen, that's MY humor - I should copyright it. Other Greeks ALSO look at me like I'm some kind of crazy. It takes a crazy person to understand the humor of another crazy person, so, since "you get me"... Yeah, bad news for your sanity: we're both the same kind of crazy.

    But I guess you've already known that :-D

    The reason for "learning how to properly optimize images" DOES have to do "with SEO" as well, though, since Google pays a lot of attention to page loading times. Pay a visit to my site - unregistered.gr - and look how many images I've thrown on it. And no, they AREN'T as optimized as I'd like, since I'm not a code-wizard (like SimplySidy). But they ARE (optimized) up to a point.

    If they weren't, the page would take two to five (FIVE!) times more time to load. And that would be a disaster SEO-wise. Want to give you a simple example how I could totally bork it? If those images you're looking at were PNGs.

    As I've told you, PNGs DON'T compress as well as JPGs when "what they display is a photo/screenshot/whatever". ONLY if what you're using them for is some kind of drawing OR has a small amount of colors (AND you've "saved it that way, as a PNG with a small amount of colors"). So, I've got about 20 images on my front page. As JPGs. Adding up to, dunno, about 1MB I guess. If they were PNGs, I'd have just 5MBs in images! People would leave running, bored waiting for the page to load.

     
  5. settysanly New Member

    settysanly

    Nice article.

     
  6. OhioTom76 New Member

    OhioTom76

    Are we ruling out GIF's completely at this point? lol

    Seriously though, GIFs, JPGs, SVG's and PNG files all have their individual benefits and should be used accordingly. It also helps to understand the image formats themselves a little better, to have a better understanding of when and where to use what.

    First off, you should evaluate your image to see if it can be replicated via CSS and/or web fonts. Many shapes and symbols can be created with CSS alone. And you can even use services such as Icomoon, to turn your vector shapes into a custom web font, making them even more cross browser friendly than even SVG at this point.

    If you need animation, GIF is the only image format that supports it. But don't rule out using javascript to animate other image formats and HTML, in lieu of making one big animated GIF for a page element. For what it's worth, lets just completely rule out Flash and pretend it doesn't exist any more. GIF also supports transparency, but not alpha transparency - the sections of the image are either 100% opaque or 100% transparent, and it's a hard edge between the two. If you want more subtle semi-transparency, you need to go with PNG. However PNG doesn't support animation at all, and it's compression methods are nowhere near as good as JPG. GIF is also better suited for images with large areas of flat colors, not images with photographic details. It basically reads all the pixels in an image from left to right, top to bottom, and it's able to optimize an image when there are large stretches of pixels that it knows are all the same color - that's less data it needs to store for that portion of the image. So in other words, a GIF image of vertical stripes will literally be a higher file size than a GIF image of horizontal stripes.

    JPEG's are more suited for photographic quality images, and images with gradations and fine details. As a general rule of thumb, flat "posterized" images with large areas of a given color are better suited for GIF's, whereas something like a photo of some trees and a sky full of clouds would be much better suited for a JPEG.

    PNG's biggest selling point is its ability to handle alpha transparency, which lets you easily create image assets with things such as drop shadows, which can easily be placed over top of other elements. This really comes in handy if you are making sliders and other types of HTML/Javascript based animations. Because GIF's only support 100% opaque/transparent, they have hard edges look rough. Plus because GIF's aren't good with photographic quality images, you either have to settle for a posterized looking image to cut down on the file size, or a much larger image size if you want it to look more photographic.

     
    Ray likes this.
  7. Clarke Member

    Clarke

    Image optimization for a site is a part of On Page optimization. In image optimization alt and title is use. Alt is used for crawlers and title is used for users.

     
  8. SLTE New Member

    SLTE

    Actually, as far as I know you can animate with .pngs, or at least you can now. Problem is the functionality of doing so is rather limited, as I doubt a lot of sites / programs / whatever would accept an animated .png. I'd imagine uploading an animated .png would flatten it down to the first layer, and, then, boom, there goes your animation. I'm no expert on the subject, so I suggest looking it up on Wikipedia. (I'm a noob so I can't post a direct link yet. Type in 'animated png' on Google and it should be one of the first search results.)

    The point's kinda moot anyway. I never use .pngs for animation, and I doubt the vast majority of people do either. If it's a technology on the rise, then it's definitely in its infancy.

     
  9. vtech New Member

    vtech

    Test your website on gtmetrix.com, it will automatically provide you with images that need optimization you can download from there. Software you can use to optimize images is Irfanview

     
  10. cwvps New Member

    cwvps

    I know that alt tags are the most important part of image optimization, but I'm a bit confused about whether it's right to put dashe or space between words. What is the difference? How will this affect optimization?

     
  11. Scorp Member

    Scorp

    Look, for the ALT tag you put Spaces. I mean, you can use dashes if you want, but spaces is better.

    However for the Image Name you use dashes. So before you upload your photo, if it's a photo named: cute cat sleeping, rename it to: cute-cat-sleeping.

    And never use underscores _ but use dashes -

    :)

     
    cwvps likes this.
  12. cwvps New Member

    cwvps

    Amazing, thank you for the info!

     
  13. chinomoreno New Member

    chinomoreno

    Given the fact that either jpg or png is the standard format for images.
    Optimizing an image using an alternative tag or also known as alt tag should be the best thing that describes the image.
    Here is the best explanation, http://diythemes.com/thesis/wordpress-seo-image-optimization/

     
  14. kavipriya Member

    kavipriya

    Image optimization is one of the seo off page technique to build backlinks.

     
  15. laxmirai269 New Member

    laxmirai269

    Image optimization is one of the off page technique used to improve popularity in image search result.

     
  16. fastreplies Original Member

    fastreplies

    Original

    Can you put in plain words why do you want to optimize images?
    Are there things that have some powers that you know and we don't?
    Can you share with us what they are?

    fastreplies

     
  17. Scorp Member

    Scorp

    What?

    You optimize images in order to help them get ranked for the correct keywords, in order to hopefully attract traffic and clicks to your site. There are many places that images can rank - Google and Bing and Yahoo Image Search, and others.

    If your image is called - "Pictutre12345" - what would it rank for?

    But if your image is called - "Cute yellow dog eating" - then the image could rank for dog, dog eating, yellow dog eating, etc etc. Then you have the ALT tag, and the TITLE tag on images. All of those should be well optimized.

    The reason is very, very simple. Better optimization = More traffic = More money :)

     
  18. fastreplies Original Member

    fastreplies

    Original

    Point 1
    It would be true only if Google would use the same bot it uses for textual content but...
    images bot is separated (see Google's search for "Images"), you can use 12345 or
    "any shit you want to call it", that image will appear only in Images section of Google
    and not in main SERP.

    Point 2
    If you search for bubble of delusions, you will see a bunch of images used in forum
    www.bubbleofdelusions.com and if you look at images keywords, you'll see that neither
    of them have 'bubbleofdelusions' except in site's URL of cause, which means that
    usual garbage shmirt by Professional SEOs and over "how to make SEO white bread toast"
    is nothing but bullshit to make idiots to pay "money, money, money" for nothing

    :)

    fastreplies

     
  19. Scorp Member

    Scorp

    Well, you obviously know everything.

    Folks, please listen to this guy, and do exactly what he says, and repeat the same stuff everywhere.

    That way, we can make money, and you can be experts.

    I love it! Keep it up Mr Master Of The Universe! :)

     
  20. fastreplies Original Member

    fastreplies

    Original

    Wrong, I know only what is factually proven something idiots are taking for-granted

    No need to repeat, it's already everywhere.
    But then again, if you're some freaking moron, then it wouldn't matter what I say
    and what others have already know for ages and posted all over Internet

    I don't believe YOU will be making any money even if you run water stand in Sahara desert.
    You need brain to make money but you my little fury friend based on your verbal puke post need one.

    Ah, I see, another dickhead with Diploma from Trollsylvanian Troll University.
    So Mister Troll, how would you like to go f*ck yourself or your boyfriend, eh?

    [​IMG]

    fastreplies

     

Share This Page