Learn the essential features and functions of the popular JavaScript framework for building mobile, desktop and web applications.
Image optimization
Hi all.
I have this page: www.grupopiccolo.com/Main/
The site doesn't seem slow nor in my laptop nor in my mobile devices, but some client's firend told it is very slow. I think this could be because the images are not optimized enough, so I'm looking for best optimization tecniques.
This is an example of the images (576 Kb)
The original size exceeded 5 Mb. To optimize the image I used Photoshop. I've tried jpegtran also but the result isn't different: to keep a decent quality which allow to display the image full screen I'm not able to decrease the image size enough.
Any suggestion?
Thank you in advance
I have this page: www.grupopiccolo.com/Main/
The site doesn't seem slow nor in my laptop nor in my mobile devices, but some client's firend told it is very slow. I think this could be because the images are not optimized enough, so I'm looking for best optimization tecniques.
This is an example of the images (576 Kb)
The original size exceeded 5 Mb. To optimize the image I used Photoshop. I've tried jpegtran also but the result isn't different: to keep a decent quality which allow to display the image full screen I'm not able to decrease the image size enough.Any suggestion?
Thank you in advance
Do more with
EXPERT OFFICE® is a registered trademark of EXPERTS EXCHANGE®
Not an answer as such but if that person has a slow connection and / or an old slow browser, you can't fix it for them. Before you spend any time on this, find out what browser and the speed of the connection that the person has. The 'Net' tab in Firebug says it takes about 20 seconds for that page to fully load on my 10Mbps connection but it is rendering along the way.
Hi Dave.
Interesting: a hard refresh in Ffx gives me 8,88 sec, in Chrome 12,37 sec. In fact I never got the impression it were unreasonably (does this word exist or do I've just invented it?) slow.
My problem now is that tell my clients about old software or slow connection can make me look as a bad guy. Because of another issue (http://www.experts-exchange.com/questions/28697011/Javascript-doesn't-work-on-smartphones-and-iPad.html#a40880526) my client has not still accessed the site except from its iphone, so the statement the site is slow comes from his friends.
What I'd like to know is: generally speaking, are 500 kb images too big to be used as a slideshow background? I0m missing something about best practices?
Or I really have to solve before the other issue and then ask to my client if he think the site is slow?
Interesting: a hard refresh in Ffx gives me 8,88 sec, in Chrome 12,37 sec. In fact I never got the impression it were unreasonably (does this word exist or do I've just invented it?) slow.
My problem now is that tell my clients about old software or slow connection can make me look as a bad guy. Because of another issue (http://www.experts-exchange.com/questions/28697011/Javascript-doesn't-work-on-smartphones-and-iPad.html#a40880526) my client has not still accessed the site except from its iphone, so the statement the site is slow comes from his friends.
What I'd like to know is: generally speaking, are 500 kb images too big to be used as a slideshow background? I0m missing something about best practices?
Or I really have to solve before the other issue and then ask to my client if he think the site is slow?
Sorry but there are a lot of people that are trying to hang on to old browsers and slow internet connections. There is nothing you can do to 'fix' them until they upgrade their browser and internet connection. Developers all over the world are having this conversation with their cheap customers.
As the internet changes to newer and more secure technology, those who refuse to adapt will be left behind. A shining example is the change in 'https' SSL/TLS certificates. Current standards require TLS 1.2. IE8 does not and never will support that so there are some sites that you can't go to with IE8.
As the internet changes to newer and more secure technology, those who refuse to adapt will be left behind. A shining example is the change in 'https' SSL/TLS certificates. Current standards require TLS 1.2. IE8 does not and never will support that so there are some sites that you can't go to with IE8.
The images themselves are optimized perfectly as it is. That means, if you choose this is really the resolution you wanted, it IS optimized. If you compress more, the sharper details, for instance, the chairs, will start showing pixelation that are noticeable (since the sharp edges will give it away more easily).
So here are just a few things for slower connections:
The main page has 5 pictures that are high quality. Replace them with the correct thumbnail size (while granted, it's less then 250KB per picture, it's still not necessary and even 50KB or less will do).
When you click on any of the links, the 0% through 100% will always be around 10 seconds. It INCLUDED the loading of ALL the slideshow pictures. You might want to consider loading one only, and loading the rest later when the pages has been rendered fully already.
Also, maybe you can design a page where a full sized 2000x1000 pixel picture is not necessary. Sure it looks good, but can you challenge yourself to make something look just as good with other tricks?
So here are just a few things for slower connections:
The main page has 5 pictures that are high quality. Replace them with the correct thumbnail size (while granted, it's less then 250KB per picture, it's still not necessary and even 50KB or less will do).
When you click on any of the links, the 0% through 100% will always be around 10 seconds. It INCLUDED the loading of ALL the slideshow pictures. You might want to consider loading one only, and loading the rest later when the pages has been rendered fully already.
Also, maybe you can design a page where a full sized 2000x1000 pixel picture is not necessary. Sure it looks good, but can you challenge yourself to make something look just as good with other tricks?
Thank you Kimputer: you gave me some interesting thing to work on. I''ll try your suggestions tomorrow.
Can you tell me exactly how I have to split the images' preloading? The first one can be loaded with the actual code, but the rest? It's obvious I can't use the plugin because I don0t have to show the progress bar when I load the remaining images and it's not clear to me how to load the image without slowing down the background switching...
Can you tell me exactly how I have to split the images' preloading? The first one can be loaded with the actual code, but the rest? It's obvious I can't use the plugin because I don0t have to show the progress bar when I load the remaining images and it's not clear to me how to load the image without slowing down the background switching...
I did not pick apart the code (nor will I be able to in a in a short time anyway), but I think you should submit another question to include javascript experts.
It could be something with a timeout (start loading next pics after 5 or 10 seconds or so, since you only preload one, the load time is already shortened)
It could be something with a timeout (start loading next pics after 5 or 10 seconds or so, since you only preload one, the load time is already shortened)
Premium Content
You need an Expert Office subscription to comment.Start Free Trial