[Design] Banners on the Front Page
Harry Wood
mail at harrywood.co.uk
Sat May 11 15:52:47 UTC 2013
I've designed a slightly smaller SOTM Birmingham banner (165 x 116)
http://harrywood.dev.openstreetmap.org/temp/sotm-birmingham.png
I suggest we put it on the site and display it
...or display the SOTM US one if rand<0.4 (40% of the time. Decided on page load)
This is the SOTMUS one:
https://github.com/samanpwbb/openstreetmap-website/blob/1781f56180fe6597d4f1808734f71b470a227bc1/app/assets/images/sotm-us-ad.png
Harry
> Brian emailed me with an image previously. I'll share it here:
> http://harrywood.dev.openstreetmap.org/temp/comeToSotm.png
> That's actually quite massive. 165x165 pixels
>
> Previous banners were smaller e.g. 165x116 for this SOTM PDX one. I think the tokyo one (can't find it in github just now) was shorter than it was wide too.
> https://github.com/mvexel/openstreetmap-website/blob/cd280aeac2874305b2d65871c56e2f02b1f2e7ef/app/assets/images/sotmpdx.png
>
> A taller image shoves things further down the page. "Make a donation", and indeed the bottom of the banner image itself will start to fall off the bottom of the screen for non-logged in users. I'd suggest that should be redesigned a bit less tall in line with previous banners. (agree / disagree anyone?)
>
>
> But we could consider a banner at size 165x50 similar to this SOTM scotland banner, or shorter even :
> https://github.com/openstreetmap/openstreetmap-website/blob/749caaff73596e284c39ce7d0a840f8a0a50687d/app/assets/images/sotmscotland.png
>
> That's if we wanted to place both banners, SOTM black bull and SOTM US, on top of eachother. So in this case we'd need the SOTM US image a bit smaller too. This one:
> https://github.com/samanpwbb/openstreetmap-website/blob/1781f56180fe6597d4f1808734f71b470a227bc1/app/assets/images/sotm-us-ad.png
>
> Does anyone want to prototype that?
> ...or it's probably quite trivial to put in a bit of randomised flipping code, if we just go with both images at a larger size.
>
>
> Harry
More information about the design
mailing list