Ever since Hack a Day first emerged on the scene in 2004, the site’s design has been pretty consistent. The black background with its green and white text, while a bit dubious looking at work, is fine by me. For others however, the site’s design is a constant eyesore both figuratively and literally. [James Litton] is one of those readers, and he wrote in to share a tip that helps him read up on the latest hacks without killing his eyes.
[James] uses Firefox to browse the web, so he whipped up a small Greasemonkey script that tweaks Hack a Day’s style sheet once it reaches his browser. His script inverts the background while changing a few other items, making for a much more comfortable read. Overall we found the change to be pretty reasonable, but go ahead and judge for yourself – you can see the before and after screen shots in greater detail on his site.
[James] also points out that the script should work just fine in Chrome, for those of you who prefer that browser instead.
So if your eyes are a bit on the sensitive side, feel free to grab his script and customize away – I don’t think we’ll be changing the theme any time soon.
Very funny. I have always used my own Greasemonkey script to do this exact same thing.
I prefer dark pages with low contrast text.
“eeeeeek! the light! save me from the light!”
a/k/a “troglodyte mode”. Perfect for when you’ve been starring at a screen all day and you eyes hurt. Also good for the pre-dawn “wake and check my email before off to work” routine
Heh, just like me in that matter.
shameless self-promotion:
Hackaday – Grey Theme
i prefer the greenish look :-)
// Change the color of each link
var zElements = document.getElementsByTagName(“a”);
for (var i=0; i<zElements.length; i++) {
zElements[i].style.color="#080";
}
// Change the color of each blogroll block
var zElements = document.getElementsByClassName("statsclass1");
for (var i=0; i<zElements.length; i++) {
zElements[i].style.backgroundColor="#ddd";
}
var zElements = document.getElementsByClassName("statsclass2");
for (var i=0; i<zElements.length; i++) {
zElements[i].style.backgroundColor="#ccc";
}
I doubt many remember when our theme used to force all text (even comments) on site to be lowercase.
yep, i remember the days. i think it had its charm to have everything lowercase…
that was fun. it was like school uniforms for the comments section.
Not only do I remember that, I remember the ‘before time’. That is the time before 2004 that the current administrators either do not know about or just refuse to accept existence of. Back when HAD truly started existing it was, indeed, mostly about security information systems hacking.
All posts have been gone for some time. I remember finding this site when wifi was not quite so ubiquitous and they had an article about messing with an apple store on a highly stickered laptop. Ahh the memories.
Not only that, I also remember the black and white pictures. And that there was exactly one hack a day.
When those things changed I was, and half a decade later (more or less) still am, of the opinion that it should have never changed. The only change I liked, somewhat ironically in this context, was the allowance of caps. All lowercase certainly had it’s charm, it had a certain air of leetness, but most of the content being technical sometimes it did annoy the hell out of me (ie. when writting acronyms).
hack a day is in the last years the only page that uses this good old black/green design with small font. hi hope this will never change !!! :)
when i designed hack-a-day and the logo the text was all lower case, that changed a few years ago. each photo was also “taped” on the page. however, my goal was for anyone to be able to “hack” the site and display it they want, glad to see this :)
The way the site looks is perfect, there is nothing hard on the eyes about the layout. Some people just can’t be happy until they have changed something.
It is perfect until you get old and need reading glasses… And, contrast sensitivity changes also with age, I can tell.
The Gray theme is really nice (with some size hacks ;-))
Isn’t that what hacking is about? Changing things?
“Some people just can’t be happy until they have changed something.” Perhaps satirical intent was intended, but probably not. Respectfully a odd statement when, posted to a place where changing something, is what it’s all about. For myself hackaday isn’t a problem, but I have seen some web pages so shitty(to myself) I have to decide if to say screw it, forget it move on, or if it’s worth copy/pasting the text into an application so I can read it.
Now if someone would only fix this Troll Muting script ;-)
http://userscripts.org/scripts/show/78836
Any takers on fixing this script? I’m not that fluent in Javascript. I asked the author about it but no answer.
I love the color scheme of this site. Perfect for when I’m up at 3 in the morning and wondering if I missed anything new. I just can’t get enough.
If I have to read longer articles on this site I usually just put Opera into user mode, which disables all style sheets. Obviously there is no design at all then, which is perfect for me :-D
Since I read most articles via the RSS feed I rarely need to resort to that.
Still a nice idea, though, I could see how this might be useful.
Or if you have a mac hit ctrl + option + Apple + 8. I like the white text on black, its easy on the eyes.
Greasemonkey has become an invaluable tool for web browsing, especially when sites keep changing their dsmn layout and introduce crap that just doesn’t interest me and gets in the way of the real content.
Several sites I regularly visit now look less cluttered thanks to Greasemonkey. I admit I’m not very proficiant with creating my own code from scratch but have found enough freely available code out there to modify to do my bidding.
One site I have a big gripe with is eBay, they keep tweaking the layout of search results to the point where you can only see a few results on screen at any one time because the thumbnail images are so damn big, Greasemonkey makes eBay usable again because they just don’t listen to our complaints.
I do like the white & green text on black background of HaD, don’t ever change it.
Funny..what people are deeming ‘better’ looks like just another white BG layout..boring
I don’t know what is fucked up with the screenshots but the font on them looks very hard to read with black background, but in my computer, the font is very easy to read with black background.
I think it’s a font problem and not a color problem.
dont ever ever ever change the color scheme…
im already pissed you started to use CAPS on stuff.. pfff…..
also, i agree. shameless self promotion.
body {text-transform:lowercase;}
the black/green theme is great, no need for change.
is there a way to see more then 8 articles per page?
Dark backgrounds with light text are supposed to be far easier on the eyes then a white background.
How bout someone write up a script that makes all pages look like HaD?
Either you die, or you get to age, so you are forced to make adjustments. Others are forced to make adjustment from the very begging or unexpectedly along the way to the inescapable conclusion. While hackaday is not a problem for myself, many web pages are. I had set Firefox to override web page to present me with black text on white. Work OK with Hackday until hackaday went to the current commenting. James script “breaks” hackaday in a similar manner. While the Grey theme provide by legend everyone keeps the comment section easier to follow, it’s not for me otherwise.
Admitting it’s because I have a bone in the accessibility fight,hopefully whenever modifying it’s web page Hackaday, would insure it usable by those who have visual difficulties. While no one ever fit all, accommodation rarely adversely effects those who don’t require it when they use a web page. What wouldn’t be important are thing like that Hackaday may be to only page using the green on black theme. In entering Hackaday at http://wave.webaim.org/ shows there’s a problem with the images used for navigation,evidently no alternate text is used.
I don’t know what I would do if HackADay changed it’s style like facebook does. I would probably update my status about it with as many expletives as I can muster.
I’m sure if that ever happend either someone would change it back or publish some sort of HackaDay fixer to put things roughly how you want them (as for facebook’s, Social fixer)
Don’t let it get to you, instead, just think and answer the question – How can I do this (:
Amusing in some ways how that question can hve two meanings depending upon your outlook on life (:
As an old bloke I find the typical black on a sea of white quite nasty to read, so I’m very happy with white on black/grey thanks, and I actually think it makes more sense when reading a light emitting as opposed to light reflecting medium.
Well I remember the all lower case days and the difficulties it presented with acronyms and such. Glad to see the back of that.
My thoughts exactly (:
Myself, I have always trouble with next page and previous page when navigating.
When one writes a diary, next page is what comes after current page. In HaD next page is what came in the past. How comes?
Keep the colors!
I rather like the current theme – it reminds me of the old days when we had green font terminals to work with.
If I wanted black on white, I’d use an RSS feed reader instead.
Why use javascript to change CSS. If you have Stylish installed there’s white designs for HAD already :)
Another thing: Does Greasemonkey work properly again? Ever since FF4 it regularly froze and thus I uninstalled it.
Greasemonkey has been giving me no problems lately.. back in the past I would agree with you though.
i just use firefox’s builtin usercontent.css for pure css changes to websites. Greasemonkey is way more powerful, but not needed to make the aricles on hackaday a bit wider. :-)
I hate this site as much as the next user of it but really, it’s great the creators kept the color scheme the same over the years. Especially with so many fcuking boohoo criers complaining about the colors hurting their eyes.
If you are one of those people, instead of installing this GM script, maybe you should take a look in the mirror and slap yourself in the face for being a pansy who cries about the colors of a website.
Why use greasemonkey to edit the stylesheet when there’s stylish, which is made to do that?
Stylish is made to edit CSS, Greasemonkey is made to manipulate pages with Javascript. I would say they are both made for editing pages and “styles” but Greasemonkey can do more. Also, you may be fluent in Javascript but not CSS.
you can use this script n IE6-7-8 by using IE7pro and change GM_AddStyle with PRO_addStyle
People still use IE?
In practice besides installing IE7Pro
and changing GM_addStyle to PRO_addStyle
you also need to add a function for ‘getElementsByClassName’ apparently only firefox has this function built-in
document.getElementsByClassName = function(cl) {
var retnode = [];
var myclass = new RegExp(‘\\b’+cl+’\\b’);
var elem = this.getElementsByTagName(‘*’);
for (var i = 0; i < elem.length; i++) {
var classes = elem[i].className;
if (myclass.test(classes)) retnode.push(elem[i]);
}
return retnode;
};
and then finally it will work with IE 6,7,8
worth mentioning Ie7pro is the add-on that makes this possible and it makes IE bearable
it allows slight redesign to the interface, spell check, Ad block, mouse gestures, user scripts and more…
In the words of Maddox, “Staring at a white background while you read is like staring at a light bulb”
Hopefully someone can build a script to get back to the pre November 2014 style layout.. This text is just too large. Not all readers are that old with failing eyesight!
Stylish is faster and works for all future elements added to page.
With JS, you’d have to write MutationObserver for it, more code to do same thing.
And because it loads slower, you might get short flash.