I would like thank wholeheartedly all who helped me with the problems I ran into while building my photo site…
among others, PaulOB, TechnoBear, ralphm, SamA74, RyanReese, John_Betong, Mittineague, Pullo, ronpat, Jasmin_A, spaceshiptrooper… sorry if I missed any names; I’m grateful to absolutely everyone who helped, your help was truly invaluable to me… there really were problems I could not have solved without you…
I would be grateful to anyone who can visit the site and review (and “kick the tires” – click on links, etc… you know the drill…;~)) and post any comments here… I would appreciate viewings in as many different browsers and devices as possible…
I am away from home at the moment and the site was extremely slow to load. It started to display a sepia photo of a Hibiscus flower. It got most of the way there and suddenly jumped to a index page. I do not know what caused that.
[quote=“Rubble, post:2, topic:258197”]the site was extremely slow to load. It started to display a sepia photo of a Hibiscus flower. It got most of the way there and suddenly jumped to a index page
[/quote]
I can second all of that. Well, except the “got most of the way there”:
I guess for a photo site, optimizing images to improve transfer at the expense of quality is a catch 22.
One thing I suggest is changing the gallery from time based to complete. What may be an acceptable change rate for you, with images coming from a cache, could be too fast for others not having cached images.
I also recommend having slightly lower quality thumbnails as a default page so that if a heavier higher quality image was desired a visitor might decide it was worth any wait that might be involved. It might even be a good idea to call them “high quality” and indicate their size near any links to them.
I can’t speak for everyone, but I’m more willing to wait when I know ahead of time what to expect.
I’m in Chile… I have a feeling w/my web hosting the site loads slower if users are outside Chile… not good…;-(
(I know years ago they had this “feature” – I sent them an email this afternoon asking if this is still the case (and what if all web hostings here in Chile have the same thing – yikes…)
this is a site in which I’m trying to sell photos… am aiming mostly for the local market, word of mouth, etc (if anyone outside my area wants to purchase a photo it would have to be digital version only, no print…)
now as for optimizing the images: images are low resolution (72 dpi) and 600 px across, their size on average is about 200 kb… thumbnails are about 70 kb… ‘real’ photo I would ultimately print/send to people when somebody purchases (a) photo(s) is 300 dpi and over 4,000 px across…) also, there’s always only one photo per page (when nav to next/previous photo, page loads again w/a diff photo-no. in query string…)
ok, I guess main issue is I need to find out from my web hosting if site loads slower outside Chile by design… yikes…
thank you all for your responses… keep the comments/feedback coming!! :~)))
well… actually, not quite… I just figured out something I can do to make the images smaller… I will reprocess all images in one page and post here again (either later tonight or tomorrow), and then if you could look again I would appreciate it very much…
ok, Mittineague, I have now re-optimized all imgs and thumbnails for this page:
(I guess if you’re on a mobile device it’s harder to tell where a page ends and the next one begins…;~) on a desktop it’s easier… you’ll see if you look on a desktop… at any rate this page has 19 photos… so it’s from the url I just posted up to here,
all imgs are substantially smaller than they were, i.e., less than half the size they were previously…
if you could review and let me know how it went I would appreciate it very much…
Mittineague, here you’re talking about the “slide show” function, right?
“from time based to complete”… you mean that the photo should finish loading before the next one loads, yes?
how would I do that? I use jQuery, here’s my slide-show code:
// run slideshow
$('#runSlideShow').click(function(e) {
e.preventDefault();
doSlideShow();
});
// once ss has started, nav to next photo
if (loc.indexOf('ss') != -1) {
$.doTimeout(8000, function() {
doSlideShow();
});
}
make sense? (I guess not…;~)))
so how do I do it so it doesn’t nav to the next photo after the current photo has completely loaded (and then stays for a few seconds…)
Much better. A few were noticeably “progressive” - top part, micro second delay, bottom part - but they all loaded before the swap. Not anything that would make me think the site was broken or be so painful that it would make me leave the site.
I was about to mention only seeing one image per page load but found your grid button. I’m not a huge fan of that. I would rather see that the grid is the default. If you prefer to display single images at larger sizes, display them with a lightbox script. Loading the entire page for one image can be a waste of resources. Or you can see it this way, loading all your images first will cut down load times as users browse other pages.
It’s cool that hovering over those images highlights their index up top.
I’m seeing a PHP error display Notice: Undefined index: HTTP_REFERER in /pub/web/www.fotoartepuertovaras.cl/d/inc_top.php on line 95
Your contact page doesn’t display your navigation links as the other pages do.
I fixed that error… I had been testing something and forgot to remove some testing code… yikes…
“lightbox script”??
this is actually a design I created over 10 years ago (I mean desktop… only mobile design is new… this is why mobile & desktop designs are so different, I rather like the orig desktop design and wanted to keep it… (and yes, I also like the photo-nos. on top and that it highlights the photo-no when you hover over a photo… thank you for mentioning that… I can’t do any of that on mobile… no room for the nos on top, and of course no hover…;~)
so back to the issue: at first, years ago, I did do what you mention: all imgs loaded first and then I had a javascript to nav from photo to photo, but it was too slow, and some folks online who helped me years ago suggested I switch to this method…
when I need to do “lightbox” stuff I use jQuery cycle plugin… it’s really good, have you used it? but I just thought loading only one img when the page loads would make things move faster… oh man… well, I will leave it like it is for now, maybe when I have time I’ll do a 2nd version this other way, and test and compare…
thank you very much for your comments and feedback…
(by the way, did you also look in a mobile device? or only desktop? I especially need help testing on Android devices… the other day I looked at it on someone’s Android phone, and it didn’t look right… I’ve had very little opportunities to test on Android devices… certainly I have never tested on an Android tablet… I worked extensively with the Chrome simulator, which is very good, and I found it very reliable, but of course it’s best, ideally, to test on the real devices…)
I just figured out something I can do to make the images smaller… I will reprocess all images in one page and post here again (either later tonight or tomorrow), and then if you could look again I would appreciate it very much…