LDraw.org Discussion Forums

Full Version: Banner gradient on the main site
You're currently viewing a stripped down version of our content. View the full version with proper formatting.
I'm not a huge fan of the gradient background behind the logo on the main site. Any suggestions on an alternative?
(2020-08-03, 20:39)Orion Pobursky Wrote: [ -> ]I'm not a huge fan of the gradient background behind the logo on the main site. Any suggestions on an alternative?

I agree. Maybe get rid of the gradient and figure out a solid color that looks good?
(2020-08-03, 20:39)Orion Pobursky Wrote: [ -> ]I'm not a huge fan of the gradient background behind the logo on the main site. Any suggestions on an alternative?

We have had this very discussion, when we migrate from PN. Just for fun you could dig out the discussion we had back then.

w.
(2020-08-03, 23:54)Willy Tschager Wrote: [ -> ]We have had this very discussion, when we migrate from PN. Just for fun you could dig out the discussion we had back then.

w.

Care to give me a hint? The PN migration predates the forums so I'd have to dig out my Thunderbird email archive off of my Mac.
May I suggest a solid white background. Here are some literal bullet points in no specific order:
  • The "wireframe reveal" in the logo depicts a faux transparency with a white background. This illusion gets lost with the gradient.
  • White would match the rest of the website buttons and text spaces, and contrast with the soft gray background.
  • The brick color used for the different sections is highlighted (meaning it pops out better) when on a plain white background. (example of this is the forum)
  • Some people with certain degrees of color blindness may potentially have some trouble reading the black font as it approaches the darker blue of the gradient.
  • The blue gradient is not used anywhere else on the website, so there really is no "tie-in" to anything else.
(2020-08-04, 18:28)Leonardo Gonzalez Wrote: [ -> ]May I suggest a solid white background. Here are some literal bullet points in no specific order:
  • The "wireframe reveal" in the logo depicts a faux transparency with a white background. This illusion gets lost with the gradient.
  • White would match the rest of the website buttons and text spaces, and contrast with the soft gray background.
  • The brick color used for the different sections is highlighted (meaning it pops out better) when on a plain white background. (example of this is the forum)
  • Some people with certain degrees of color blindness may potentially have some trouble reading the black font as it approaches the darker blue of the gradient.
  • The blue gradient is not used anywhere else on the website, so there really is no "tie-in" to anything else.

Here's 2 mockups. Note, the right logo is just there for illustration purposes. It won't be there on the front page or most of the the main site. In fact, I'm seriously considering centering and enlarging the logo on the front page.

[attachment=5594]
[attachment=5595]

My thoughts: I'm not sure I like the epic whiteness. Maybe if we darkened the background grey?
(2020-08-04, 23:28)Orion Pobursky Wrote: [ -> ]Here's 2 mockups. Note, the right logo is just there for illustration purposes. It won't be there on the front page or most of the the main site. In fact, I'm seriously considering centering and enlarging the logo on the front page.

My thoughts: I'm not sure I like the epic whiteness. Maybe if we darkened the background grey?

Here is an idea. What if, you completely remove the background color for the header, center it as you suggested and add a background image code with a 45 degree angle from grey to white?

[attachment=5596]

The footer would have to be worked so that it is more readable, either with a box or a full stripe, or something.

[attachment=5597]
(2020-08-05, 1:54)Leonardo Gonzalez Wrote: [ -> ]Here is an idea. What if, you completely remove the background color for the header, center it as you suggested and add a background image code with a 45 degree angle from grey to white?



The footer would have to be worked so that it is more readable, either with a box or a full stripe, or something.

Not really a fan of that.

The bottom of my options for the non-front page articles is growing on me though. I'll do some more tinkering for a front page solution.
(2020-08-05, 1:54)Leonardo Gonzalez Wrote: [ -> ]Here is an idea. What if, you completely remove the background color for the header, center it as you suggested and add a background image code with a 45 degree angle from grey to white?



The footer would have to be worked so that it is more readable, either with a box or a full stripe, or something.

I took your gradient idea and ran with it for a bit. Here's the result:
[attachment=5602]

Definitely could use some tweaking but I actually kind of like it. This also shows my idea for a large (maybe a bit too large in this mockup), centered banner image.
(2020-08-05, 17:04)Orion Pobursky Wrote: [ -> ]I took your gradient idea and ran with it for a bit. Here's the result:


Definitely could use some tweaking but I actually kind of like it. This also shows my idea for a large (maybe a bit too large in this mockup), centered banner image.

I definitely like this better than the current banner, or any of the other things I have seen suggested in this thread.
(2020-08-03, 20:39)Orion Pobursky Wrote: [ -> ]I'm not a huge fan of the gradient background behind the logo on the main site. Any suggestions on an alternative?

Since discussion seems to have ended on this and Leonardo has sent me the new logo files, I'm going to go ahead with the mockup I posted above. The background gradient still isn't a satisfying as I'd like so this thread can stay open to discuss that.
(2020-08-05, 19:18)Travis Cobbs Wrote: [ -> ]I definitely like this better than the current banner, or any of the other things I have seen suggested in this thread.

This would provide a better user experience if you resized the image. At present, the full size (384kb) image is downloaded and resized by the browser from 2850px x 750px to 450px x 118px. That slows doen the page rendering.
(2020-08-12, 8:00)Chris Dee Wrote: [ -> ]This would provide a better user experience if you resized the image. At present, the full size (384kb) image is downloaded and resized by the browser from 2850px x 750px to 450px x 118px. That slows doen the page rendering.

I meant to do this and forgot. Thanks for the reminder.