When we decided that our template needed a remake several years ago, we knew it was going to be a long and difficult process. We offered you a chance to give us some input in a recent post and now we are releasing the first iteration of the new template.
For those that saw the mockups and gave us your opinion, you will be happy to see we actually listened to many thoughts and incorporated them in our final design. We worked with some people at Google to determine what features should be tossed and what to keep, and what we have ended up with, is what you see. We also acknowledge that not everyone will love the change, but we feel it is a move in the right direction. We’re really happy how it has ended up.
I want to offer a special thanks to [Stephanie Froehner] who put tons of time into making this template pretty, even if it has been hacked and slashed a bit since then.
Join me after the break for an explanation of some of the new features and upcoming features.
New features that are active right now:
- Related hacks: After each story there are links to 5 hacks from the same category.
- Staff picks: In the right column is a section for “staff picks” each week the staff agrees on a select few posts to add to the “staff picks”.
- Social media stuff: You can now connect to social networks easier. We’re not forcing that on you. Don’t worry.
Features we plan on implementing soon:
- Popular categories list in the right column: Displays a list of the categories that have posts with the most comment activity.
- turn on the lights: a button to switch to a light colored theme for those that find the black and green to be too high contrast.
- Possibly a new commenting system: There are several other systems available to us. We need to do more research before making any decisions.
Fixes slated to happen in the immediate future: (we will be fixing things. We won’t be doing everything anyone asks).
double spacing: needs to be a little tighterfixedpost titles shouldn’t change size when you click on a postfixedfavicon needs uploadedfixed- related post formatting is not there for some reason.
- speed improvements (changing the social buttons at the end of posts just helped a bunch) — ongoing
“CATEGORIES” select options are almost unreadable: text is white and background is light grey-almost white. I have to manually select each option to gain some contrast and read it.
It’s too contrasted. Too much for the eyes. Please change this.
I can’t agree more
Dissaprove.
There I fixed it:
p{
line-height: 20px;
}
#wrap{
width: 100%;
max-width: 960px;
}
#header{
width: 100%;
max-width: 960px;
}
.menu{
width: 100%;
max-width: 960px;
}
This solves the problem of horizontal scrolling when the window gets smaller.
implemented
This line spacing is horrible to read and why a fixed width page? It fits in a tiny part of my screen wasting the rest! You may have started this template years ago, it seems you have chosen design concepts that went out of fashion years ago too. The old style was fine.
Title font to stretched (tall)
Doube line spacing annoying -> too much scrolling to do.
Otherwise nice.
Being a long term user of Hackaday for many years, I would like to say thanks to the entire Hackaday team (newbies and oldies) for all your work on the site. Being a web developer myself, I know how not everyone will be satisfied with layout changes, especially after many years of being used to a certain layout, but I think you guys have done a great job at maintaining at least some of the old Hackaday spirit and at the same time, making the site look more inviting to new users that are used to today’s website standards. I will agree that the text line spacing needs a little tweaking, but it looks like you already know that!(haha) The site is loading fast and working fine for me on Firefox and Chrome with Windows 7.
While I respect you opinion I do not believe that the new template is more inviting.
Lots of opinions, too many to read and I may get flamed but I think it looks great, especially on my phone. Good work!
With the Greasmonkey script from a hack some time ago, just add the following lines to make the line-spacing bearable again ;-)
addGlobalStyle(‘.entry-content {line-height: 110% !important}’);
addGlobalStyle(‘.entry-content p {line-height: 110% !important}’);
addGlobalStyle(‘.comment-content {line-height: 110% !important}’);
addGlobalStyle(‘.comment-content p {line-height: 110% !important}’);
(comment entry also needs to be fixed… looks like that is class “comment-textarea”)
Title font bad.
Double spacing bad.
Otherwise good.
Meh …
Thank you for the “Return to the top of the page” link.
I like the new look, but I think, as it has been mentioned, the spacing between the lines is a bit too much and there is too much horizontal scrolling involved right now. If you can make the text as tight as the old layout, I don’t think there is going to be a problem with adjusting to this new form.
(Or if anyone can tip me on how to achieve this on my end through Opera, I would be quite grateful)
mush easier to read
I’m digging it.
The
Double
Spacing
Needs
To
Be
Tightened
Had to comment to say how much I agree with previous posters saying get rid of the fixed width.
Don’t make me rotate my monitor round every time I want to read Hackaday.
It is now unusable slow, unless I block some of the Javascripts.
Blocking |http://*.wp.com/_static/* means the CPU usage isnt 93% anymore.
(Mac mini G4 1,5GHz & TenFourFox5 with Flashplugin)
This is not NEARLY as bad as the first template announcement post made it look like it would! Haha
And I agree with the others about the font. Something’s not right about it, making it not very appealing or easy to read.
Otherwise looks lovely. I dig the subtle rock-like pattern of the gray background.
I had to block Javascripts from |http://*.wp.com/_static/* otherwise I got constant 93% CPU usage on my old Mac mini G4.
Sorry for any doublepost. Wasn’t shure if it got posted.
I’m digging around in it and it looks like that may be part of some wordpress infrastructure stuff I can’t modify. Some seems to be associated with the reply function in the comments being different.
It’s strangely… Normal.
Feels like the old site but while looking nicer.
Is it what they call improvement ?
generally an improvement, but this design takes a long time to render. i’m not sure if it’s excessive abuse of javascript (google is notorious for this) or html layout tags that account for the difference, though.
where’s the checkbox that converts my comments to (old-style) all lowercase?
Ok so the doublespacing between the lines has been reduced – but I still do not like the new layout, I don’t lik the extra space between the lines at all it’s not as compact and easy to read because of that and the larger font size.
Great, I like it much better already!
It’s very good to know that you take the improvement suggestions into account and make fast changes. This was actually one of the first times I commented at all and I’ve been a reader for many years, so thank you once again. :)
I know some of your readers might be old and wear glasses (me) but I find the font size chosen too big. I liked the idea of displaying more information on a page over than less on a page.
I liked the old style as it made HackADay unique in it’s design rather than trying to imitate all the rest.
Maybe offer logged in users the option of using the old format in addition to the new one.
Changing a site that is beloved by so many takes awsome courage — and some skill. The old look was familiar, like the looks of an old friend, but now that the old friend has had the facelift, I’m sure I’ll adjust and grow to love the new looks as well. Thanks….
One more remark. I like to have the comments count at the bottom of the article. I usually scroll over the articles and when it looks enough interesting on its own I like to see if there are some comments added.
See, the sequence is heading, summary, comments and not heading, comments, summary.
I’ll just stop right here and second that. I didn’t mind those fancy colour pictures or capital letters, but the comment counting thing at the end… It was my link to the other world! Now I just keep on scrolling like an insane person!
Yeah, I need to get the comment count at the bottom of the page.
Oh crap. I forgot to mention, I actually like the new template as a whole. It makes me feel younger. Not that I’m that old, but since an internet minute is like ten outside years, it makes me happy. And I’m drunk. That makes me happy too.
I’m late to the party….but I will say I like the new reply box. Just wish the text was a little darker. I though you guys were going to chuck the white on black, but I am glad to see it is still here for the most part. I only have a few real nitpicks. Like others have stated the green is a little dull compared to the old one. I wish the grey was a little darker, I like the contrast between the comments, but it is a little too light. I also agree with the others on the white space issue, however I like the spacing of the text in the comments. I think you have a little too much space between the borders of the comments. Other than those little things the new look is good with me. I still haven’t tested the other areas of the site yet, but since it seems everyone else has been doing their best to break it I probably wont encounter many hiccups.
i am not sure what you have tried to do but this thing is a mess…..
there is no right side column the are no links to other related stuff unless you mean in the expanded article.
the whole thing looks much too large and takes a lot of time to scroll through. this is on firefox.
This new layout looks nice but just takes up a lot of space. I can’t read nearly as much as I used to be able to with the old layout. This is an example of what may be a slide into form before function.
Hey why was my comment removed :( it was funny
Horrible.
The comment box is white and my text is white on white so my typing is invisible until I post forching the users to change their colors when you could have left well enough alone.
The font sizes are hard on the eyes. As usual, the site needs improvement. I am typing blind here so I’ll see if I made typing mistakes.
what os/browser combo? I haven’t seen this issue.
Is it possible you have noscript enabled? The reply system uses js to allow you to reply at the comment instead of scrolling to the bottom.
Scrolls, scrolls some more, then some more. Wow is this the most commented hackaday post ever? Or is it just that there is so much whitespace it seems more? ;-) Great website still, report comment reduction good, leave reply also. Whitespace.. erm!
things still need to be compacted a bit. It is funny that people are getting so upset about whitespace, then requesting the old template… which had the same whitespace.
the spacing does need tweaked though.
needs to be darker, i like everything pure black, not grey, that’s just me though
Can’t see which items have been commented on or not.Now you have to click through each one to see if there is any appended info.
it is at the top of the article. I need to add it to the bottom as well. I agree that it would be nice to see there.
Oh, well that was stupid of me! Anywhere is fine really, I just didn’t notice it, thanks.
I think it should appear at the end of the post though. You don’t think about the comments till you’ve read a post.
I like it. I had just switched over to a new computer and thought it was some settings in Firefox that I had not gotten the same. It’s different without being drastic. Just a couple requests though.
1) after the first reply in a thread, the report and reply buttons are gone. This is a continuing problem with the old theme, I just was hoping it would have been fixed. Sometimes I want to report a reply not the original post in a thread.
2) I wish the number of comments was back by the comment section instead of at the top. I think I can live with it though, just take some getting used to.
3) Once the comments get passed the side bar, it would be nice if they expanded to the full width of the top section. I can understand that may be difficult, as I’ve done some CSS myself.
I forgot #4. It would be if the “follow-up comments via email.” only sent when someone responded directly to my comment instead of every comment.
I love this new theme, it’s awesome. Much nicer than the old one.
You’re missing the primary “read” link on every article. I can’t count the number of blogs which talk about a website, yet stupidly hide the link to it. It’s far more important than those useless share buttons.
Also, the new style forces a horizontal scroll on the main page when it definitely isn’t needed.
nope.avi – 45% of my screen is just showing border. 70% if I include the black borders.
i was totlly shocked when i saw that huge space, but now its ok
Fixed width? really?? it’s terrible when viewed on a wide screen monitor. Too much empty space. Need to make a change so it fills up people’s monitors. If you’re going to go fixed width, at least make it 1024 wide instead of whatever you’ve done (800??)
make that 1280, not 1024
I absolutely love the new format on my phone (HTC Thunderbolt). The banner could use a slight pattern or something in the background just for some extra detail. Something subtle.
Just a suggestion, HaD could possibly use the platform used by slashdot. AFAIK it is opensource.
for the commenting system that is.
Heck, it’s ahelluva lot better than the template Makezine came up with for their blog. It’s fast & sparse and looks mostly the same as before.
im very happy you kept the blog layout. God how i loathe the new layouts of lifehacker, gizmodo, and jalopnilk
eee-pc 900, Ubuntu, firefox, full-screen: the articles and comments are the full with of the screen (the lines are a bit long to read), and the right-hand panel (with “never miss a hack” and everything below it) appears below the “notify me of new posts” check box.
It this really supposed to look like that?
nope. Any idea what your screen resolution is? Browser version? I’ve seen that happen if the window is tiny.
The screen is 1024×600 pixels. The Firefox title-bar is folded into the Ubuntu taskbar, so Firefox is nearly the whole screen.
Ubuntu 11.04 (not supported anymore), Firefox “16.0.2 for Ubuntu canonical – 1.0”.
And I just found the “problem”: I had HAD zoomed in one step in Firefox. When I reset the zoom, the panel moves to it’s top-right location and the comment width is narrowed to fit.
glad the default size fixed it. I’m still working on tweeks. We did decide we weren’t going to optimize for the smallest, but we also didn’t go for the biggest.
It wants me to post with an account??? WTF???
Hmmm…second try it didn’t…weird.
Long time lerker, few time poster. I semi approve the changes on the site, any way to make those damn reddit, facebook, etc icons smaller?
thank you for keeping the black and green. if you change that. you lose me.
The article post time is not there. Can it be put back?