Try right clicking GitHub's logo | Hacker News Reader

Try right clicking GitHub's logo

github.com

353 pointsvincentchan141 comments

Not sure if this is something new but I really think this feature is very thoughtful. Great UX. I hope every site will do the same thing.

Open articleView on HN

Saw this on Flask (http://flask.pocoo.org/) a while back. I don't remember where Armin got inspiration from, but I remember he showed me another site that did this before his.

Sidestepping the UX discussion here, there's an important moral here for startups:

Have a logo page with print-suitable copies of your logo. Actually, do one better and have the following logos:

1. Vector, raster (large), raster (small) in color

2. Vector, raster (large), raster (small) in monochrome

Anytime somebody wants to write about you, anytime you're sponsoring a conference, anytime you need stuff printed—that page will serve you well and let your t-shirt suppliers/conference organizers/curious journalists the thing they need without having to bug you. Until you get really big, misuse of your logo is unlikely. Just make it easy for people to get, like everything else about your company.

At Skills (http://skillsapp.com) we have a direct link in every page's footer and another on our about page.

Here's how I would improve this:

The lightbox that opens up asks, "Looking for the GitHub logo?"

But it doesn't let you answer no. It just presumes that your answer is yes, and supplies you with what it thinks you actually want (or, more cynically, what it wants you to want).

I would suggest adding a "No thanks -- just let me right-click" link at the bottom. That link would close the lightbox and prevent it from reopening for the rest of the session, which would be in contrast to its current behavior, where the lightbox pops up no matter how many times you right-click.

I like this idea. Sounds like a "nicer" interaction.

I think this is a fantastic way to handle it. I feel like it should probably be a user-configurable setting, too. There are a surprising number of comments in this thread from people whose process has been interrupted, and I think it's a cop-out to just tell them to ctrl-click to open a new tab. Don't get in the user's way.

You must be a program manager - you have taken a simple and easy solution and added a ton of complexity for a problem 1% or less of people will encounter.

they really should save this kind of preference to their database so that it follows the user across other sessions and machines too. and then add a setting in their account preferences to opt back in to the right hand click lightbox.

Maybe it's also useful to sync this settings to the Mac App and possibly other apps... an email every time it gets changed would also be useful, in case someone with your login decides to change it. And finally, in teams one should be able to control which member can change this setting for himself, and which not, and the team lead can also set a default what should happen on the right click.. Yeah, that's it.

We're also going to need a way for someone to report on the right click actions. Log the action, build an alert system to distribute and then auto generate an email letting someone know the alert is sent. The reporting should have control levels so the team lead can designate whether someone can see this report, share this report or print this report.

and give me an API to query if a user likes the right click override setting off and on. "Gravatar for right click settings."

Also A/B test the pop-over dialog to see what works best.

and a multivariate engine to test different font face/wording combinations for logo download conversion tracking.

better build in social sharing too, "I just right-clicked and won!"

Can someone get on crunching numbers so I can get a pie chart on how many users disabled the right-click, how many people never right-clicked (hey, maybe a tutorial-like tooltip bubble that says "Right-click me!" ?), trends in right-click usage over time and separated by geo localisation? That should be trivial to do, I'm sure.

Sounds like a plan. Can we get some consensus on what tool to use for capturing these items and generating the burn down chart?

why do I feel like I'm on Reddit all of a sudden

c-c-c-combo breaker?

No, really, please don't turn every comment page into a pun thread that would be an end to HN as we know it. Please try to keep it serious and technical, and down-vote if you can this kind of conversation.

and yet I'm the only one that got down voted. Too little too late my friends.

Can you also get in touch with the marketing department to create a new landing page with email opt in which will put all email subscribers in to a 3 day launch sequence to demonstrate this awesome new feature along with video tutorials on how to use it. Please include the usual A/B testing and analytics features. Regards, dolan

What Github needs is a virtual octocat assistant that helps you with common tasks.

"It looks like you're looking for Github brand image resources. - Have you tried right-clicking on the Github logo?"

Clippy! You're back! Where have you been all these years?!

Personally, I'd use a combination of Dropbox, iCloud as well as an arbitrary SFTP server. They could use the SSH key you register with them to allow seamless log in, and also encryption of the setting on Dropbox and iCloud.

Am I really in a <1% minority of people who right click site logos to open the main page in a new tab and start a separate browsing path?

Well I middle-click...

yes

Requires two hands, but I often find it easier to control-click on links to open in a new tab, and that still works in this case.

I open new tabs with middle click (scroll wheel click). That works too. It also works for closing tabs.

seconded

I don't know how I got this far in life without knowing this, thanks

I do this too. CTRL-click to open a new tab.

That is NOT working for me on a Mac.

It's command + click on mac.

Or if you're on a newer laptop, you can press down with two fingers on the touch pad.

On OS X, you can use Command-click for that.

I'd say the best way would be to add a "No, I just want to get to the homepage!" option to the lightbox. No cookies or saving preferences, just a simple link.

But track how often that link is clicked, and if it really is a lot more than 1% of people, then you know it's a behaviour worth accounting for and can code in your preference tracking thing accordingly. If not, no time wasted.

Ctrl (or Cmd) Click, done.

Though it's falling further and further behind mainstream browsers, Konqueror seems to take a principled stand on some of these things - I can still right-click on the github logo normally, and my keyboard isn't intercepted by flash plugins.

I think there's a small market for a browser (or browser plugin) that's all about client control. Querying mouse position, hijacking keypresses and showing popup windows and modal dialogs should be activated with a "This site tried to... Allow/Deny".

NoScript gets part of the way there, but I think you could go even further. Pages should display as soon as the HTML starts downloading, before CSS is loaded, before JS is all there, whatever. I don't care if this causes the page to jump a few times, or if it breaks a few scripts because it's not standards compliant, I just want to read my content on a slow connection.

I probably want to disable webfonts. They're a vanity thing, mostly, and the more I consider it the more I think I should be picking the fonts I read.

Maybe you could go even further - for specific sites with really atrocious interfaces you could have custom-written interfaces that almost completely remodel them (a'la Readability, I guess). I'm sure it would annoy web developers to have their pages render "incorrectly" on your screen, but screw them. My browser, my rules.

Double right-click brings up the regular browser menu on FF on Linux FWIW.

I'd guess that people who wants to open a link on a new tab but doesn't know how to middle-click or command + click is indeed a very small minority.

I doubt it's a matter of knowing or not knowing about those, it's just convenience. If my hand is not on the mouse then I will just Cmd-L gith<TAB><RETURN>, but if my hands are not on the keyboard then I will right-click Open In New Tab.

You and me both. Apparently I'm expected to go out and buy a new laptop with a middle mouse button so I can open new tabs properly.

If you left and right click at the same time, it will middle click.

Except when it doesn't. My thoughts on that are in another comment.

Or you can do a Ctrl + click to open a link in a new tab.

The usual right-click menu works fine (using FF on linux).

Am i the only person who uses middle click(the scroll wheel button) to open a link in a new tab? This worked for the github icon too; i just checked (Opera 11.61/Linux)

No, no you're not.

To all that mentioning middle-click: what about when I want to open the main page in a new window? Or copy URL to the page? (sometimes it's faster to right-click on logo than to move up and copy-paste from address bar; also keyboard is not involved).

It's probably overkill to save the preference. A good-and-still-simple solution would be to include a (non-linked) replica image of the original button along with an explanatory link to github.com.

Bravo. This is so simple, I can't believe I didn't think of it -- just put a "github homepage" link/image on that pop-up that users can then right-click to their hearts content.

And here I was thinking about adding cookies and saving client-state. :)

You could say the same thing about what Github is doing with the interception of the right-click event. The "about us" page would be a better place to put links to logo. Leave the user's right-click alone.

The point is they found that members of the press or bloggers who want these assets in the first place are not bothering to drill down to the Press section; they're just grabbing it right from the root index, causing sub-optimal assets to propagate through the media, which reflects poorly on the brand. This way, Github makes sure they're getting publication-friendly versions of their logo when people do that. Ultimately, ensuring their brand is well-represented in the media was deemed more important than avoiding inconvenience to a few power users.

The complexity is already there. GH went to the trouble of doing it, why not add another button that sets a cookie. Compared to what they've done it's peanuts. Heck, if the website was here (https://github.com/github) they'd get a pull request.

By the same type of abrasive, quick to conclude mindset, you must be a different type of program manager - you believe that just because you do not use a certain feature, no one else should be allowed to use it either.

Why do you need to answer no and right-click otherwise? If you don't want it, you close the dialog; closing it effectively means "No thanks". You're not going to be right-clicking on that logo often like a mad man. The current solution makes perfect sense. Your solution is terrible and overly complex.

But when I close the dialogue and right click again, the dialogue reappears. It'd be nice if it didn't, which is what the OP is suggesting. Maybe the extra "No" button isn't necessary, but I wouldn't call it "terrible".

Why are you going to right click again? Do you want the browser's regular right-click context menu? Okay, that's a valid reason. But then what if you want the popup AGAIN after you click "No thanks"? Does the user then have to clear his cache? This is overly complex. If the right-click behavior is being overloaded, then the current solution is better than making it a global preference. Many user will be confused with what "No thanks" means. Are you going to have an explanation saying "If you click "No thanks", then you'll get the browser's regular menu after you right-click from now on? If you get rid of the "No thanks", then you'll have inconsistent behavior. The first time you right-click, something will happen, and something different will happen the second time, and users will be like "WTF?" All this trouble with such a small feature shouldn't happen in the first place. The person who suggested this does indeed sound like a typical PM.

If I want to open Github's homepage in a new tab, I can't use only my mouse (right click -> 'open in a new tab'), I must use Ctrl+click. Why Github force me to do that ? [Edit: middle-click doesn't work for me]

Then this is an argument for NOT overloading the right-click behavior, not for adding a "No thanks" preference. Then all users who want to right-click have to go through ONE EXTRA STEP just to be able to do that?

I think the idea is that you would only have to do that extra step once, have that preference saved, and after that all right click / middle clickers would have the functionality they wanted. Doesn't seem too inconvenient to me, honestly.

This answer sent shivers down my spine.

That my fried, is called experience.

canv.as does the fancy right-click menu too, and at the bottom there's a note saying 'Use Shift + Right click for the normal right click menu'

Unfortunately for this case, Shift+RC takes as much effort as Ctrl+RC and replaces the "open in new window" shortcut.

There's more in the right-click menu than just 'open in new window'

I think it should include a note that Shift+Right Click opens the standard context menu. And then let the standard context menu open when you hold down shift.

So many people on HN coming up with elaborate ways to get a consistent UX that works for all cases. In my mind the best thing to do would be showing the lightbox but also not disabling the context menu.

Advantages:

    * Shows context menu immediately, allowing for edge cases
    * Shows lightbox
    * Always consistent, no clearing cookies or preferences to get it back
    * Unobtrusive; "don't make me think"
    * Simple to implement (just allow the event to propagate)
    * Robust, context menu works if lightbox breaks

I know that overriding expected functionality like this is considered a "no-no", but let's not loose sight of the fact that this "UX trick" was used on a logo, on the masthead, on the site's header.

What do you really want if you right-click on a logo like this? If you did indeed want to right-click & save-as to get the image, this feature takes that a step further and actually offers you a selection of high-res images to choose from -- it's adding not subtracting.

Its not like this trick is used unabated and disables functionality completely, like those "don't steal my image bro!" javascripts...

IMO this could even be expanded further, i.e. Link to company's about/contact pages, mission statement etc.

The logo acts as a gateway to the company -- I like it.

Just don't do it everywhere. Use it in moderation, PLEASE.

This has actually got in the way of expected functionality for me. I've often right clicked on the logo to try and open the github homepage in a new tab.

I know that in some cases it is not an option, but middle-clicking will open the link in a new tab. One of the best shortcuts I ever learned.

My laptop doesn't have a middle mouse button, and it's a modern Dell. Naturally I use a real mouse when I'm on a desk, but remember that not everyone has a middle mouse button.

Try clicking both right and left touchpad-button on your laptop. At most (all?) laptops it will open the link just as if you had middle-mouse-clicked it.

I know that's the standard, but it doesn't appear to work on this one (Studio XPS 16).

That works in X, but I've never seen that work in Windows. And when I have used it, the timing was only about 9/10; the other times I get a left-right click combo, or a right-middle combo, or something else equally disastrous considering how the X clipboard works.

I use Windows 7 and it works for me.

So do I. I just tried it. I get a left and a right click. So the menu shows up for a little while, then it follows the link anyway. Wherever the Emulate3Buttons setting is in Windows, it's not on for me. I open new tabs by right clicking then left clicking for a reason, and it's not because I don't know about the dozen other ways to open a tab.

I'm surprised nobody's suggested "hit tab until the link is highlighted, then hit the menu key" yet. There's another great workaround.

CMD+click WFM

ctrl+click (or mouse middle click)

[Edit]: Accidentally replied to the wrong comment :(

This is "correct", but for users who don't know it, it's still going to be an issue (admittedly less so on a tech-savvy site like GitHub).

I think they could improve this by including a little text message "Open Github in a new window".

The actual images aren't quite what I would call "hi-res" - 512x512px at 72dpi for the Octocat, for example. Seems like if they are going to all this trouble they should include a few sizes, not just a few formats...

You don't need to specify DPI when you're talking about pixels already, that pic will be 512x512 pixels at any DPI.

Specifying the dpi gives the print size of the image. So basically instead of printing very small and hi-res this will print as larger but with low-res; so it makes sense as the claim is that the images are not hi-res.

We're talking about on-screen images, not printing them.

I think the problem here is that you can't presume to know what the user is trying to do. For many, the right-click has become the gateway to pretty much any functionality besides a normal click. It's probably safe to say that a majority of the users are trying to perform this functionality, but as mentioned above, if they aren't it would be nice to have the option to disable this "feature".

This is a bad idea. It was a bad idea when paranoid sites did it to try and stop people from stealing their images and it is still a bad idea when trying to be helpful. There is a wide variety of behavior accessed through right click beyond save as.

...which moving your mouse away from the logo still allows you to access.

Personally, I think it's a great little addition to a website.

Cool feature, but it block the "open link in new tab" menu option.

While I agree that designating what a user can accomplish on your page is making UX sacrifices, this is handy:

Ctrl (Cmd) + Left click = open link in new tab

So we then have to learn the shortcuts for all of a browsers right-click menu options?

Not to mention the fact that a lot of add-ons add functionality to that menu.

But how long before someone figures out a way to override ctrl+clicks and middle-clicks with a lightbox as well?

Clicking with the mouse wheel usually does that

wow, you just made my day. thanks!

Yeah. I guess the one thing it could conceivably block is the ability to tell where that specific logo file is being served from...but the niche group of users who need to know that most likely would use inspector-tools to find it.

I was shocked when my roommate told me that in 8 years of owning a Mac (and using a PC from time to time), she had been completely unaware that there was such a thing as a "right-click"

I recently taught some media people how to use the web-inspector...and had to explain what a "right click" was to even show how to get to the inspector's context menu.

I use right click, slight move the right, left click to go back. A lot quicker than mousing all the way up to the back button, and the four and five button mice never seemed to have caught on.

Why was it necessary to bundle the _MACOSX and .DS_Store files with the zip download? I rarely see zip files with thumbs.db or desktop.ini files in them.

I'm assuming they put the files in a folder, right-clicked, and hit "Compress" in Finder. Finder takes the HFS+ metadata that can't be natively stored in the zip file and turns them into the files you mentioned.

Most likely they didn't notice they were included in the .zip before they uploaded it. By default those are hidden on OSX.

its terrible when Windows (ouh ouh EVIL MS) does stuff like that it's normal when Mac OSX does it.

Lets push this further. It's ok when github hijacks your right click (makes the logo download more annoying while pretending to make things nicer). It's terrible if MS/Mozilla/Whoever isn't hype right now does it.

As simple as that. Sadly.

Taking it a bit too seriously?

I've seen this done a few times before.

Akismet is one example: http://littlebigdetails.com/post/6493183632/akismet-when-you...

A long time ago, when I first installed Firefox, I went Preferences → Content → Enable JavaScript → Advanced and unticked all the "Allow scripts to:" options, including "Disable or replace context menus".

I still get the cute dialog-box when I right-click, but I also get my proper right-click menu for the link in question.

No, I'm not looking for Github Logo. I'm looking to open dashboard in a new tab. ok thanks.

Ctrl + Left Click (or Command + Left Click) works in just about every browser.

Or middle click.

I'm going to go out on a limb here and say that delightful bit of UX was Kyle Neath's idea and execution.

I think every site should implement this great UX. So thoughtful.

Violating the user's expectations to this degree is not delightful UX.

I find it kind of disarming to overload not-typically-overloaded events like this though. I wonder if it'd be possible to let the right-click menu appear as normal, but background a div that pops up and give you the option of downloading the nicer logo files?

In Firefox you can untick "Allow scripts to Disable or replace context menus" (hidden under Preferences/Content/Enable Javasript/Advanced), which gives exactly the behaviour that you described. I assume other browsers have similar options.

That should be possible if you do not cancel the event bubble when the overlay is shown. I did not have time to inspect their code, but I assume they are canceling the event.

You're thinking of preventing the default action, not stopping propagation. (Event.preventDefault() vs. Event.stopPropagation() in modern browsers.) But you're right, if they handled the right-click and did not explicitly prevent the default action it would do both.

It's not exactly what you suggested, but with HTML5 you can add to the browser's context menu:

http://hacks.mozilla.org/2011/11/html5-context-menus-in-fire... http://www.whatwg.org/specs/web-apps/current-work/multipage/...

Please let this become the norm. This is fantastic.

Note - requires you to load javascript from akamai.net. Didn't notice a thing different until I enabled that through noscript.

The actual logo that is being displayed looks like it is suffering from being shrunk down too much from a bigger image.

It is. In a presentation at Superconf, one of the Github designers (whose name escapes me) said that they serve some images at high resolution and resize in the HTML tags for the benefit of iPhones 4 and other high-dpi devices.

Can't this be handled with multiple stylesheets?

You can even handle it with a single stylesheet, i.e. with `min-device-pixel-ratio`.

We do it so that when people zoom in on the site (using `⌘ + +` on a Mac) the image doesn't become pixelated and ugly.

We do it with most other images, too.

Well this way it's pixelated and ugly by default. I don't think that's better.

What browser/OS are you in? It looks pretty reasonable in Chrome on OSX; we spent a decent amount of time trying to get it as close as we could. Some browsers do weird math on resizing.

Win7, FF11 (current). You're right, it looks better in Chrome.

I ran into this the other day when I was attempting to right-click & "open as new tab" and got so confused.

I couldn't help but notice the actual logo wasn't one of the download options. Although inspecting the element tells us that the original logo is at https://a248.e.akamai.net/assets.github.com/images/modules/h...

I'm not entirely sure what Github was trying to accomplish with this, other than being a neat trick.

EDIT: https://a248.e.akamai.net/assets.github.com/images/modules/h... for the non-hover logo. ;)

That's not the actual logo. It's a variation that is only used in the header.

The official logo includes the Social Coding tagline.

I think this is awesome.

I'm in an industry where our customers (pro photographers) are at paranoia level: tin-foil-hat with regards to people stealing their images. Regardless of how much I try to educate people, many will always want right-click disabled.

I think this is a great compromise. If you could offer them a low-res or watermarked version, that would be something people would pay for.

$(".site-logo").on("contextmenu",function(){ return $.facebox({div:"#logo-popup"},"logo-popup clearfix"),!1})

TIL about ContextMenu[1] and Facebox[2] in Jquery

[1] http://archive.plugins.jquery.com/project/jqueryContextMenu [2] http://defunkt.io/facebox/

Maybe I just want to right-click and open the homepage in new tab. With this feature, I can't do this.

In Firefox, open Preferences -> Content, hit the "Advanced" button next to "Enable Javascript", and uncheck "disable or replace context menus". With that unchecked, you get the right-click menu as usual, in addition to whatever the site wants to offer.

I think this is a cool way to do it. It's a very nice effect and ensures people are using good quality versions of their logo.

Akismet (The anti-spam tool) does something similar with theirs: http://akismet.com/

// Listen to Right Click events on your logo image $('img').bind('contextmenu', function(e){ // Your code/interaction goes here });

I thought Akismet was the first to adopt such design: http://akismet.com/

How can I disable that a webpage can hijack right click in Chrome like it's possible in Firefox?

Wasn't the logo not even a link a couple of days ago? All this whining is ridiculous.

Behold, the Octodex:

http://octodex.github.com/

That's awesome, they should definitely have a link to this page on their pop-up :)

This is pretty neat. A nice way to share the logo with the world.

hahaha i cant see anything... what happens exactly?

POLA violation.

just click shift+/ and be done with it.

smart

Reply on news.ycombinator.com