Nodejs.org: Addin JS Interactive to website homepage?

Created on 10 Jul 2018  ·  12Comments  ·  Source: nodejs/nodejs.org

I wanted to see if it would be possible to add a link to JS Interactive to the website? Either as a banner as we've done with the security warning or as a potential tab that links back to the JS Interactive website - see what JS Foundation has done: https://js.foundation.

We've done this in the past with Node.js Interactives and its driven a lot of traffic to our event websites. Please let me know if this is okay with the community. If so, I would like to share a special UTM link. Thanks for your time and look forward to hearing back from the group on this.

Most helpful comment

Know this is closed, but just want to thank everyone in this thread for helping me with this and special shout out to @fhemberger! Thank you and I hope everyone has a lovely week.

All 12 comments

@ZibbyKeaton Sure, let's do this. Should we link to https://events.linuxfoundation.org/events/js-interactive-2018/ directly?

I made a quick mock how a banner could look like on the website:

@fhemberger I think this looks great. I don't know if we could stick a mini button in there that states "Learn More" and when folks click on it they can go directly to the website. If that's too much, then I think this would be perfect. I would agree that we send them directly to the homepage of the event site. If we could use this UTM that would be much appreciated: https://events.linuxfoundation.org/events/js-interactive-2018/?utm_source=nodesite&utm_medium=homepagebanner&utm_campaign=jsint18&utm_term=eventpage UTMs help the marketing team determine what promotions are working and not, so we can continually do a better job of promoting the event to the right channels.

@fhemberger I was able to pull this banner graphic that we've already created around this to make it easier - see here: https://drive.google.com/file/d/19EpcU3uiGYRKeGsFjKHT_AMm_gZALZp4/view

@ZibbyKeaton Sure, link and UTM is no problem.

Your banner graphic is a bit larger than the one I came up with, this is how it would look:

a) at the same with of the content (735px wide)
b) adjusted to the width of the two download buttons (515px wide)

new_banner


new_banner_v2


My version (515px wide) in comparison:

fh_banner_v2

What do you think?

/cc @nodejs/website /cc @amiller-gh

I like option b, but will defer to those that have a design mindset :)

Let me know if there's anything else you need from me here @fhemberger

@ZibbyKeaton Was hoping for some more feedback. Personally, I'd still prefer option c. ¯_(ツ)_/¯

Will add the banner over the weekend.

If you don’t mind, here’s my two cents (option B vs. option C):

  • The text is easier to read in C. The dark blue text on the black background is hard to read in B.
  • The font in C fits with the rest of the website.
  • The “See the lineup” button in B probably doesn’t make a lot of sense when the whole banner is clickable (which I’m assuming it will be).
  • I like that C explicitly mentions Canada. nodejs.org is pretty international and not everyone may think of Canada immediately.

I like how the text in option C is aligned left and right against the edge of the container, making the grid-ness of the layout feel more natural. However, with C more than B, due to the smaller margins, it looks like an abrupt transition from a light theme to a dark theme. I like that C is more efficient with space, so I think the best option would be a variant of C with a lighter background color than the dark grey, maybe something closer to the light color scheme of the JS Foundation logo.

JS Foundation

I would suggest
"C" with background colors of "B" (dark colors are looking good)
OR
Remove the "SEE THE LINEUP" button from "B" and change the text color from "Blue" to "White"

Sorry, I don't have the original layered image, so I can't do combinations of both. Will start with C for now …

Know this is closed, but just want to thank everyone in this thread for helping me with this and special shout out to @fhemberger! Thank you and I hope everyone has a lovely week.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

mlibby picture mlibby  ·  3Comments

williamkapke picture williamkapke  ·  6Comments

mognia picture mognia  ·  4Comments

JungMinu picture JungMinu  ·  8Comments

ghost picture ghost  ·  4Comments