New Ghacks Theme Live Beta Test

You have probably already noticed that we have a new theme here on the site. It is not really that different from the old theme in regards to looks, I think, so that it should not be too uncomfortable getting used to it.

I plan to run the theme for a week to see how it performance and what you all think about it before I make any decisions to keep it, or switch back to the old theme.

For now, I'm trying to sort out all the little bugs and issues that are still there, and optimize the theme to improve page loading times for all of you.

I'd like to know what you think of the new theme, especially if you ran into any issue with it. If something is broken, I'd like to fix it asap so please leave a comment below or use the contact form up top to send me an email so that I can start to analyze and repair the issue right away.

I'd also like to hear your opinion in regards to what you think is missing, features that you would like to see here on Ghacks Technology News, or those that you do not like at all.

ghacks theme

I had a couple of reasons to switch to a new theme:

  1. I wanted a responsive theme design so that the site looks fine on smaller and larger screen resolutions.
  2. Ghacks has been plagued by Google algorithm updates (Panda), and I have the hope that a new theme may change that.
  3. I wanted to modernize the theme technology, as the old theme that I have used here on the site was rather plain in this regard.
Read also:  Help us test the new Ghacks theme

You find a couple of modifications and new items on the site. I did remove several categories from the top menu and moved them to the sidebar instead. They are all still there so no need to worry about that.



Each category displays an RSS icon on top now that you can use to subscribe to its feed. This has been possible before but only if you knew that you had to add /feed/ to the url.

The sidebar lists a top and latest posts, and latest comments module now. The top posts are set to include only articles made in the past 180 days so that you can expect fresh contents to be displayed here regularly.

I'm really looking forward to your comments, so keep em coming please.

Please share this article

Facebooktwittergoogle_plusredditlinkedinmail



Responses to New Ghacks Theme Live Beta Test

  1. Richard August 13, 2013 at 8:35 am #

    You might consider disabling your portable theme on iPads.

    I object to "portable" themes displaying by default on iPads. The screen is large enough not to need them. Performance for portable themes is almost always worse than the regular desktop theme. Your website is not an exception.

    • DanTe August 13, 2013 at 10:36 pm #

      iPads don't have a "desktop" setting for their browsers?? My Android and Android Firefox has desktop view default settings.

  2. robin August 13, 2013 at 9:03 am #

    Your CSS still needs some work when it comes to medium size screens, i.e. the menus are broken and the right sidebar kinda disappears off the right.

    For testing of various screen sizes, check this out:

    http://dfcb.github.io/Responsivator/?site=www.ghacks.net%2F2013%2F08%2F13%2Fnew-ghacks-theme-live-beta-test%2F

    I'm personally also a fan of position: fixed for the top nav bar on small devices.

    Just a theory, but your Google issues may be related to your code layout and the performance bottlenecks it creates. Run your URL on Google's Page Speed Insights service to identify the many! issues you might want to tackle (77 is awfully close to a failing grade!).

    • Martin Brinkmann August 13, 2013 at 9:10 am #

      I'm still working on the performance side of things and agree that I need to tackle it. The responsive theme has been designed to remove the sidebar when you reduce the width of the browser window too much.

      My main problem that I have is that many of the optimization suggestions are for third party scripts that I have no control over, and the other part is about script features that I do not know how to get around as well.

      The front is now at 81.

      • hiren September 4, 2013 at 7:19 am #

        hi Martin
        nice theme i have a education website and i have used thesis for that can you say that new ghacks is better then thesis for education website. thanks for sharing.

    • Joe August 13, 2013 at 12:49 pm #

      It will take some getting used to, but no problems so far. Keep up the good work.

  3. yoav August 13, 2013 at 9:29 am #

    Working fine for me on desktop firefox 22. The site also displayed very well on my cellphone (android 2.3).

  4. IshtarGate August 13, 2013 at 9:32 am #

    The best part about this theme is that coming from RSS, I didn't even notice it was different, and that's how it should be - out of the way, unnoticeable, but modern and clean. Excellent work!

  5. moinmoin August 13, 2013 at 9:33 am #

    It's a nice "light" Skin, Martin. I like it.

  6. kalmly August 13, 2013 at 9:36 am #

    Your home page has more white space than anything else. This page is a little better that way but my fingers are tired from scrolling. My browser is Opera (12.16). Might look better on FF. . . . Yes. It is better on FF, but BIG. :)

  7. ilev August 13, 2013 at 9:38 am #

    Pages doesn't smooth scroll for me. Scrolling is jumpy.

    Chrome 29.0.1547.49 beta-m with Chromium Wheel Smooth Scroller extention.

  8. Uhtred August 13, 2013 at 9:41 am #

    Display is fine on my old netbook win 7, except for the reply box css... unlike before the background is hard coded white but the text not hard coded black,... If you have text as white/offwhite as your default... this makes reading what you write very difficult.

    On my iphone / safari in mobile mode site renders well.
    Would be nicer if the ads were at very top or under body of text and replies rather than between title and body text.

  9. Paul(us) August 13, 2013 at 9:50 am #

    Hallo Martin,
    Glancing one you new outlook I think "Not bad at all!".
    Its a good idea to give us a week to get more familiar with the handling, but
    right now I am exited, not only because I think the reading for me is much better with this site.

  10. Milom August 13, 2013 at 10:13 am #

    Too much empty space on left and right. It actually feels like G+ where you have to scroll down like crazy.

  11. RG August 13, 2013 at 10:43 am #

    As of right now (~16:40CET) I see large spaces between each excerpt on the front page. Some filled with an ad but others blank spaces.

    • Martin Brinkmann August 13, 2013 at 10:50 am #

      This should not happen. There are no ads inbetween posts. Can you do a Ctrl-F5 on the page to see if it goes away?

      • RG August 13, 2013 at 11:09 am #

        It's fixed now.

  12. Swapnil August 13, 2013 at 10:52 am #

    Viewing the theme on my Windows Phone 8 - in desktop mode and while the new theme is good, do something about ads taking so much space. Otherwise I hope you won't be deleting the (current) mobile version and I will continue to use that. The reason I want the desktop version is because mobile version lacks some information and functionality.

    • Martin Brinkmann August 13, 2013 at 10:56 am #

      Which ads do you mean in particular?

      • Swapnil August 13, 2013 at 11:05 am #

        OK, forget that comment. I definitely saw ads in between posts on front page - but refreshing gives no ads in between. Could you do something about that Facebook ad at the (almost) end of the page? Takes up too much vertical space. The ad is slightly larger than my 3.8" display. And if it could be done, please have smaller ads when someone wants to use desktop mode on phone (use document height or User Agent string) - like the small ones in the current mobile version.

      • Martin Brinkmann August 13, 2013 at 11:10 am #

        Can you make a screenshot of that so that I can take a look at it?

      • Swapnil August 13, 2013 at 11:21 am #

        Posted the link to screenshot in a comment - the message was "awaiting moderation".

      • Martin Brinkmann August 13, 2013 at 12:05 pm #

        Thanks I got it. Do you get that add when you are running desktop mode on your mobile?

      • Swapnil August 13, 2013 at 12:08 pm #

        "Do you get that add when you are running desktop mode on your mobile?"

        Yes.

      • Martin Brinkmann August 13, 2013 at 12:20 pm #

        That's strange, I do not get that when I view the page on my mobile. In fact, I do not get a sidebar at all, and the only add that I see is the one between the article and the comments. Which mobile phone are you using?

      • Swapnil August 13, 2013 at 12:34 pm #

        I am using Windows Phone 8 (screen resolution: 480 x 800) The first ad I see, is yes between the article and comments. When the comments end, the sidebar content is shown in the same way comments are shown - vertically bigger and horizontally smaller. The big ad is just before the Partners, About Ghacks, Topics part. Try using IE 11 Dev tools to try this.

      • Martin Brinkmann August 13, 2013 at 12:56 pm #

        You are right, when I scroll down more I see the sidebar as well attached there. I'm not sure I can change that, will have to look into it.

  13. ank91 August 13, 2013 at 11:04 am #

    working fine for Opera mini 4.5 java.

  14. Chris August 13, 2013 at 11:09 am #

    Look great! You left light theme (right direction) but think about slightly larger font :)

  15. Paul August 13, 2013 at 11:22 am #

    What do you think about OpenSans font?

  16. Niks August 13, 2013 at 11:22 am #

    Why not use Thesis ?

    http://diythemes.com/

    • Martin Brinkmann August 13, 2013 at 12:06 pm #

      The main reason for using this theme is a recommendation by a friend.

  17. Pramod August 13, 2013 at 12:08 pm #

    Martin , the new theme of my favorite technology website is simply fabulous and it loads pretty fast .

  18. Shadess August 13, 2013 at 12:11 pm #

    Have to congratulate you on this. I've grown to hate site updates in recent years because most sites I frequent have just made their sites worse. Big, medium, small sites all of them basically. I love this update though!

  19. Kannan August 13, 2013 at 12:18 pm #

    It is pretty fast and couldn't find any issue at here, however it isn't awesome!

  20. Crodol August 13, 2013 at 12:20 pm #

    I do NOT like it!

    Please stick with the old one... if you are as old as me (>30 years) than
    any change is tough on you!

  21. yopka August 13, 2013 at 12:30 pm #

    Hi!

    From my point of view comment system needs some changes in colors / styles.
    Especially gray posts (post plus few replies to it) look difficult to read (user vs. comment distinction). See top comments on http://www.ghacks.net/2013/08/08/a-look-at-firefoxs-new-social-share-button/ article ("meh, Shared, ReTweeded" one). They don't look nice.

    While in general old vs. new.. surely NEW! :) (even if I'm >30)

    • yopka August 13, 2013 at 12:32 pm #

      And now they look far better - black line that separates them makes a huge difference! :)

  22. L0renc0_ August 13, 2013 at 12:30 pm #

    Looks nice. Keep this theme. :)

  23. Winston August 13, 2013 at 12:30 pm #

    FF23 / Win7 / 1080p
    Everything looks fine here. Nothing broken.

    Whitespace: lighter and cleaner, nice airy feeling, feels less claustrophobic.
    Font: larger and roomier, easier to read, also feels less claustrophobic too.
    Nav: simple, clean, unobtrusive.
    Comment section: The reply buttons are disconcertingly contrast-y to the rest of the page. I don't know if you have granular control over that one element but if you could make the buttons a shade of grey like #333333, I think it would be better. They are also on the left which feels unnatural. Bottom right would be better unless it's a touchscreen UI scrolling issue.

  24. Ramesh Khanna August 13, 2013 at 12:40 pm #

    I LIKE IT. IT IS EASIER TO READ. (I USE CHROME, ON A LAPTOP, IN A WINDOW ON A SCREEN WITH 1366 X 768 RESOLUTION.)

  25. mazling August 13, 2013 at 12:58 pm #

    The image on each post shoves text off to the right for a few lines, then the text sneaks back to the left. I find it breaks my reading flow. I don't even see the relevance of those images ... sorry :-)

    The rest of the site is just fine, good improvement imho!

  26. Maou August 13, 2013 at 1:00 pm #

    Not bad, but I would love if I could select a darker background, like some sites that allow you to select themes.

  27. Paul B. August 13, 2013 at 1:02 pm #

    I don't like the gray text. Too hard on the eyes. I do like the comment level being more indented. Otherwise I like the change.

    • yoav August 15, 2013 at 1:31 pm #

      After a few days I agree, the gray font is hard on the eyes. Please change it to black.

      • Martin Brinkmann August 15, 2013 at 1:36 pm #

        I have changed it from #555555 to #333333. Would you say that this is better, or do you want it to be even darker than that? What does anyone else think?

  28. tPenguinLTG August 13, 2013 at 1:28 pm #

    I think it's a little too washed out.

    I was playing around with a few styles and I think I've got something to start you off.
    If you're interested:

    body {background-color: #FFEECC; padding-top: 1ex; padding-bottom: 1ex;}
    #wrapper {background-color: #FFFFFF;}
    #navigation {background-image: -moz-linear-gradient(center top , #999999 0%, #666666 100%)}
    #navigation ul.nav > li a {color: #FFFFFF;}
    #navigation ul.nav > li a:hover {background-color: #808080;}
    .searchform, #searchform {background-color: #FFFFFF;}

    I uploaded a screenshot with the above styles applied.

    • Martin Brinkmann August 13, 2013 at 4:27 pm #

      I like it. What is everyone else thinking? There is a slight problem though with selected items in the menu as they appear with white text on white background.

      • tPenguinLTG August 13, 2013 at 5:31 pm #

        Whoops, I forgot to test on WebKit. It seems that the menu background gradient doesn't show up on Safari (the only WebKit browser I have access to right now), probably because of the -moz- prefix.

        Uhh, I'm not too familiar with CSS3 linear gradients, but I think you could replace the #navigation line with


        #navigation {
        background-color: #666666;
        background-image: linear-gradient(center top , #999999 0%, #666666 100%);
        background-image: -moz-linear-gradient(center top , #999999 0%, #666666 100%);
        background-image: -webkit-linear-gradient(center top , #999999 0%, #666666 100%);
        background-image: -ms-linear-gradient(center top , #999999 0%, #666666 100%);
        }

        That should cover the major browsers (I didn't include the old WebKit gradient code). If a browser doesn't support a declaration, it will fall back to the one it last understood, leaving a plain colour for those pre-CSS3 browsers.

        To fix the selected/hover problem, add


        #navigation ul.nav > li:hover {background-image: none; background-color: #808080;}

        I hope that fixes it.

      • Martin Brinkmann August 13, 2013 at 5:49 pm #

        I have fixed the issue with the selected menu item right away. The new code does not seem to work though.

      • tPenguinLTG August 13, 2013 at 7:34 pm #

        Hopefully I can whip up something for you tomorrow, assuming I'll have a chance to work on my Windows desktop.

      • Martin Brinkmann August 14, 2013 at 2:52 am #

        Thanks for all your help, I think I figured it out:

        #navigation {
        background-color: #666666;
        background-image: -webkit-linear-gradient(top, #999999, #666666);
        background-image: -moz-linear-gradient(top, #999999, #666666);
        background-image: -ms-linear-gradient(top, #999999, #666666);
        background-image: -o-linear-gradient(top, #999999, #666666);

        }

      • jasray August 13, 2013 at 9:50 pm #

        Insert here I think--yes, the faded yellow, not for me.

        A gradient . . .

        The thumbnails? Hmmm . . . variety without chaos. Don't know. It's hard to say, but I am sure it will all work out after a few weeks.

        Everything on the page is to elucidate content, make it real and alive. Anything that detracts from the content - gotta go.

        I did like the previous style because it was unique--no other site like it. First site I clicked every day for tech news. Maybe just the icon is attractive . . .

      • tPenguinLTG August 14, 2013 at 8:49 am #

        @Martin:
        Aha! Nice fix.
        Glad I could help.

        @jasray:
        The only reason I suggested the gradient was because the original theme had a gradient.

      • tPenguinLTG August 14, 2013 at 8:55 am #

        Please excuse the multiple comments, but I just remembered why I posted the fix
        #navigation ul.nav > li:hover {background-image: none; background-color: #808080;}

        When you hover over the little white line between the menu items, the menu item background colour is white. This code should fix that.

      • Martin Brinkmann August 14, 2013 at 9:49 am #

        Thanks, this fixed it.

  29. EuroScept1C August 13, 2013 at 2:06 pm #

    Truly nice one, and finally, some images; small and not annoying.

  30. Transcontinental August 13, 2013 at 2:33 pm #

    The graphics are IMO an improvement, delivering that touch of space, wideness.
    Personally white backgrounds are not my cup of tea (I'd prefer a light tea, camel, sand ground), but it does have the advantage of participating to that broad effect (darker a site is smaller it seems). I dislike even more black backgrounds than white. Just a clear color but not too bright ...

    Overall impression : fast as previous theme was. I'd dare say elegant, which includes comfort.

  31. Dhaval August 13, 2013 at 2:54 pm #

    Theme looks Awesome with Images. Sidebar is pretty impressive.

    Thanks for this nice update. Don't switch back to the old theme.

  32. alan August 13, 2013 at 3:22 pm #

    Is too white..Please add an option to make the background darker..

  33. Yogeshwaran Selvaraju August 13, 2013 at 4:23 pm #

    Good move towards responsive theme, loading time. Just make slight modification with the fonts style(Google fonts) would make it more impressive too...

  34. Tom August 13, 2013 at 4:58 pm #

    It's plain, the colors are ugly, the comment follow-up groups are hard to distingush and jeez, those big white empty spaces everywhere eating up the precious vertical space... why to scroll three times much as before when going through an article and the comments? If this stays might consider unsubscribe after 6 years...

    • Tom August 13, 2013 at 5:01 pm #

      So the top menu bar and the background color changed while I wrote my comment, so forget the ugly colors... the rest stays anyway.

      • Martin Brinkmann August 13, 2013 at 5:52 pm #

        Tom, please look at this as if it is some kind of beta test. Things will change and while I cannot promise to please 100% of all users, I try my best to come as close as possible. I have already changed the top colors and removed the read more links as they do not really serve any purpose. This has moved the article excerpts closer to each other so that you do not have to scroll that much anymore.

  35. Rocky August 13, 2013 at 6:04 pm #

    Martin,
    I like the layout on the front page/section "Home". Easy to scan down for articles of interest . However on the other sections "Windows", "Software" etc I find the ads between article excerpts irritating and breaking the flow. I understand that you need ads to generate revenue but perhaps keep them to the right hand side of the page ?

    As I normally read Ghacks from RSS ( android/greader) I did not know about the new layout until I saw your article about it.

    Keep up the good work - I have picked up many many tips from your articles

    • Martin Brinkmann August 13, 2013 at 6:09 pm #

      Rocky, the ads should not have been there in first place. I just spotted them and have removed them from the pages, should not be there anymore.

  36. Yoshi August 13, 2013 at 6:07 pm #

    I like the theme and it loads relatively fast.

  37. rickxs August 13, 2013 at 6:57 pm #

    yeah nice effort, but too much white for me martin strain on eyes

  38. Ken Saunders August 13, 2013 at 8:03 pm #

    There isn't anything that I don't like about it. Seriously.
    Well done Martin.
    I do like the thumbnails and the ability to jump right to comments (not sure if that was available before).
    The sites looks fine at any size using Ctrl+ Shift+ M in Firefox so I don't know what others are talking about.
    In my primary Firefox profile with like 8,000 add-ons enabled, this page, the homepage, and others loads faster than in Chrome and IE9.
    I tried updating to 10, but later.

    Not sure if this is just on my end, but the page doesn't finish loading or something is wrong in the code.
    http://www.accessfirefox.org//tmp-images/IE9.png

    Screw prefixes. They're a pain especially since you have to go back and change them later. Just use standards and basics for fallbacks (background-color or background: color, image etc if you use gradients for images and so on). I can't imagine your readers/visitors using anything but the latest version of whatever browser that they're using. This is after all a tech site.

    Thumbs up man.

  39. Felipe Veiga August 13, 2013 at 9:07 pm #

    Congrats Martin, it is a really nice theme, both on desktop and tablet. As a fellow blogger and admirer, I hope you can regain the ranking your site and articles deserves.
    All the best!

  40. DanTe August 13, 2013 at 10:34 pm #

    Your site scrolls fine on my Note 2. And the Firefox page looks clean. I don't see anything to dislike.

  41. hessam August 14, 2013 at 6:43 am #

    very nice theme.
    I not sure this from my Mozilla or Ghack can you check screen shot?

    http://photoload.ru/data/b3/3c/7b/b33c7b63d60ad9c71fb7f3fb2c36da22.png

    • Martin Brinkmann August 14, 2013 at 6:56 am #

      You should see a comment icon there, not sure why it is not displayed to you. Can you force a cache refresh? Press Ctrl-F5.

  42. hessam August 14, 2013 at 7:02 am #

    tested in opera and clean mozila profile now fine
    thanks

  43. Eli August 14, 2013 at 9:05 am #

    My 2 cents is this, I don't like the empty white (beige) space on the sides, I'd much rather have the content of the site fill my screen left to right, it would also reduce the amount of vertical scrolling needed.

    It would be nice to have a different color layouts as well, something that's easier on the eyes in the early mornings or at night, even something like this goes a long ways https://news.ycombinator.com/

    Lastly on every page there is that little box with Popular, Latest, Comments. Latest seems pretty redundant no? I mean looking on the home page and I can well enough see the latest articles so I don't see the point. Maybe you can replace it with something else like Popular (48h), Popular (month), Latest Comments.

    Otherwise a redesign I don't instantly hate, which is rare good job.

  44. doe August 14, 2013 at 10:09 am #

    Like the new theme...white space is good...not junked up...MAJORLY important!

    The only suggestion that might be a possibility to try is the text leading...a little less.

    You do an absolutely excellent job with the site and all the informative articles. I think we as followers will be pleased w/ whatever you decide. It's the content we are interested in...

    doe

    Using Firefox 22 Portable, Chromium Portable and Firefox 18 loaded w/ extensions on Windows XP SP3.

  45. Kevin August 14, 2013 at 3:03 pm #

    Sorry, I do not like the peach/light orange side/background colours

  46. Ken Saunders August 14, 2013 at 7:04 pm #

    I was thinking that perhaps your buttons (Submit Comment, Reply, etc) could use a darker second color stop if you're using gradients for them. They look disabled.
    Also, the line height in the textarea box is tight
    #comment {
    line-height:

    }

  47. Ken Saunders August 15, 2013 at 1:57 am #

    Sweet, much better.
    Both things.

  48. Brendt August 15, 2013 at 6:38 am #

    I simply love the new theme, loads fast. Nice and clean. love the thumbnail images next to the articles.

  49. Thomas August 15, 2013 at 7:38 pm #

    I'm not convinced by the peachy background. Maybe something to break the monotonicity (like a texture or some graded out texture) could fix this. This website http://sport.be.msn.com/nl/ has a blue background but it is not monotone.

  50. Ken Saunders August 16, 2013 at 4:56 am #

    You can zoom in and not see the background color, or
    use this userstyle.

    @namespace url(http://www.w3.org/1999/xhtml);
    @-moz-document domain("ghacks.net") {
    /*change it */
    BODY {
    background-color: rgb(255, 238, 204) !important;
    }
    }

    I added this comment to be facetious.

    Frankly, the fact that you have done this in the open Martin, a design by committee type thing makes me like and respect you all that much more.
    I personally wouldn't have the same amount of patience. :)

    • Ken Saunders August 16, 2013 at 5:03 am #

      I meant
      @namespace url(http://www.w3.org/1999/xhtml);
      @-moz-document domain("www.ghacks.net") {
      /*change it */
      BODY {
      background-color: rgb(0, 0, 0) !important;
      }
      }

    • Martin Brinkmann August 16, 2013 at 5:27 am #

      I'm trying my best, but it is impossible to please all users. Still evaluating and tweaking the theme, especially how search engines react to it, if at all.

  51. Jel August 25, 2013 at 10:27 am #

    The AutoPager rule for this site is broken in this site's beta theme.

  52. hessam September 3, 2013 at 2:08 am #

    favicon.ico dont load it become http://localhost
    http://localhost/theme-test/wp-content/uploads/2005/10/favicon.ico

  53. Miguel September 14, 2013 at 8:34 pm #

    The new theme looks quite nice :) The text is easy to read and the pages load as fast as before.

    Thanks for keeping it as simple as before. Many other sites, when they switch to new themes and desings, end up with difficult to read colors, pages cluttered with unneded/unwanted icons/things, features or styles incompatible with some browsers that make the pages render strangely or in an unreadable way, and painfully slow loading sites. You didn't hit any of those problems with your new theme: well done! :)

    The only problem I still see in the new theme are the "comment icons". They show up as little squares with "F0 75" inside them (it's just the same thing that happens on pages with foreing characters set, that characters appear as little squares like these). I have already cleared the browser cache. Anyway, it's not important at all.

Leave a Reply