Hacker News Reader

Comment by Guest98123 | Hacker News Reader

You might want to add a text shadow, because the error message isn't visible on quite a few images. I just loaded the page 5 times, and couldn't see it twice.

http://i.imgur.com/YNBEUzc.jpg

Also, it gives some strange behavior in Firefox. If I load the below in a tab, it shows a random image as expected. Then if I open it again in a new tab it shows the previous image that loaded from the first tab, and then it switches images to a new random one a second later.

http://www.hrpartner.io/nopage

Lastly, you could solve the above issues, and decrease the load time from 1s to 200ms if you just self hosted a few random images, and you wouldn't have to worry about your 404 page depending on Unsplash.

Edit: It's actually taking 6-8 seconds to load the image now, and the 404 page is white text on a white background during that time.

View on HN

Thanks for the feedback! Yes, I do notice there are quite a few lighter images on Unsplash nowadays, so the white text will be hidden on those. Will add the shadows to the text as you suggested to make it work better.

I'll investigate those Firefox issues too - I did most of the testing in Chrome, Safari and IE, but will do some more on FF to ensure it works OK on all browsers.

If traffic gets really high on our site, I may resort to locally hosted images to reduce load time. Unsplash.it may also be throttling the image load time for us, as I am thinking the sudden spike from this HN post may have alerted them to the fact that there is suddenly a flurry of remote calls to them from our server IP? Or perhaps the Amazon CloudFront CDN is causing a slow down there? I will investigate - thanks for your useful feedback.

You could color-sample the pictures displayed on the fly with a library like color-thief[0] and render the text in some acceptable contrasting color. We do something similar for a bit of our app that allows the users to set color schemes.

[0]http://lokeshdhakar.com/projects/color-thief/

Nice library! All javascript too. Thanks for the heads up - will certainly make an interesting project to use this to calculate the text colour for the error screens.

In fact, I may be able to go back to using coloured Unsplash images. I went for Grayscale images purely so that I could stick to white text for the contrast.

Since you're worried about server load on Unsplash there is always (as I'm sure you're aware) the option to periodically ding their server and store a rotating cache of their images instead of having the user hit them per request.

Thanks. I had heard about the possiblity of doing this, but never visited it in detail - mainly because (up until this post today), we were only serving up one or two 404/500 pages per day, but if things get really busy, then I expect I will look into that.

I already use pre-downloaded Unsplash images within the app itself for the user 'lock screens'. I've curated and placed about 20 images on our server expressly for that purpose [1],[2]

[1] - https://flic.kr/p/NV8cS3 [2] - https://flic.kr/p/NN3vvY

lol, the awkward moment when you recognize the Breather used in the stock photo

What does this mean?

Reply on news.ycombinator.com