Slashdot CSS Redesign Winner Announced
The winner of the contest is Alex Bendiken. He will receive a new laptop as well as bragging rights as the creator of the new look of Slashdot. You can see his winning design in a near complete form now. Feel free to comment on any compatibility issues. We plan to take this live in the next few days. There will undoubtedly be a few minor glitches, but please submit bug reports and we'll sort it out as fast as possible. Also congratulations to Peter Lada, our runner up. He gets $250 credit at ThinkGeek. Thanks to everyone who participated- it was a lot of fun.
I really like the current look of Slashdot. What was the point in changing it? Just to change it?
~S
That is a very crisp look. it still feels like slashdot, just fresh.
Im a gamer, not a grammer major. This post is full of spelling and grammer mistakes.
Id just like to congratulate Mr. Alex Bendiken on a job well done and that his design was also one of my favorite designs throughout the contest. I cant wait till the design is rolled out onto the live server.
GL HF!
Welcome our new CSS overlord, Alex Bendiken.
steal it. Thanks.
Many of the entries were just too busy and distracting, or very Digg-ish (i.e. looked like a soul-less link farm). The winning design IMHO doesn't muck with things too much, but gives an aesthetically pleasing facelift to Slashdot. The only problem I could see with it is that the "Slashdot" logo (presumably should appear in the upper left) didn't show up on any browser I tried.
Oolite: Elite-like game. For Mac, Linux and Windows
It looks nice, I guess. But I really like slashdot as-is. Biggest complaint is the new location of the 'Read More...' link after stories. I'll be searching for it for a month or two before I get it down to muscle memory like the current one.
Unpleasantries.
What about the light mode?
/. stories and comments. IMHO, it is the best way to view /. with no mess and a minimum of garish color schemes. The only thing it lacks is the Poll slashbox.
/. and I'm worried that it'll be removed as an option.
I have Simple Design, Low Bandwidth, and No Icons checked in my preferences. This gives me a very streamlined, efficient way to read
The winner's entry doesn't show this view of
Please calm my fears! Tell me light mode will be part of the new look.
obviously no deficiencies vs. no obvious deficiencies
i like this design but pink was best evr ! bring bak the ponies :)
xx
bring bak the ponies!!
Slashdot'll never catch up to digg at this rate :(
I mod down anyone who says "I will be modded down for this", regardless of the rest of their comment
Looks to be the same to me, save a smaller harder to read font. A lot of other entries looked a lot more pleasant (no, I didn't submit, so I'm not bitter). I know Taco wanted the site to be different yet the same, but I think this is far too much on the "same" path. Not all change is bad, Taco.
today is spelling optional day.
No offense to the design winner, but too often CSS styles websites just end up a bunch of gradient filled rounded corner boxes. Its like the CSS community thinks with one brain cell. The collapsing side menu is a nice touch though. I would hope that the state of the menu will persist between sessions. Having something collapse or expand is annoying if it resets on every visit to the page (i.e. no point in offering it then). Also, I hope you bring back the running tape of the last few article icons at the top of the page. At a glance I can decide if I should bother to read slashdot or wait for an interesting icon to appear first.
Overall though, it is only a cosmetic change to Slashdot, and I don't think there is any reason why Slashdot cannot start adding theme support to their website. Why fixate on one theme? Why not take the top 5 designs and offer them in the preferences. That IS of course the beauty of designing a website with CSS. With one change of the CSS link, you can have your website easily look completely different.
I haven't thought of anything clever to put here, but then again most of you haven't either.
But at least it's using CSS throughout, so it can be customized more easily. The current CSS use is quite haphazard, so while this new look isn't very impressive on the surface, it's a vast improvement underneath.
Done with slashdot, done with nerds, getting a life.
Agreed. Check out the print css it is horrible. At least hide the login box with it!
Plan 9 from Bell Labs.
*chuckles* Quite the contrary. Or maybe not.m (Google is your friend).
It seems that people have a much harder time reading sans-serif fonts on paper than serif fonts. On the computer screen, however, the opposite applies.
Here's a study about it http://www.wilsonweb.com/wmt6/html-email-fonts.ht
And this is a quote from the Wikipedia http://en.wikipedia.org/wiki/Serif#Usage:
"The coarse resolution of computer screens has caused a reassessment of the role of serifs in readability, with a large percentage of web pages employing sans-serif type for body text. Fonts with hinting information, anti-aliased rendering and the ClearType rendering technology has partially mitigated these concerns, yet the basic problem of coarse resolution--typically 100 pixels per inch or less--continues to impose strict limitations on readability and legibility on-screen." And yes, in the end, it boils down to personal preferences.
Yuck. The main body text is in a sans-serif font. Hard to read.
Wow. I didn't realize that, but this is not even "in production" yet, and I'll say that when I first looked at it, I thought -- WOW! This is how Slashdot should look!
I think its very clean and nice, and just looks slick. Personally, I still believe in the sans-serif fonts for headlines and section headings and whatnot, and serif fonts for body as well, but many if not most of the online news sites are pretty much using san-serif fonts all over the place. Its trivial to make this an option for those of us who are registered users (hint, hint).
The only other issue I have with the design is that in my browser, Safari, there are alpha-channel issues with the bottom two grey rounded corner areas. I'm assuming these are PNGs here with an alpha channel.
But otherwise, I think this is very clean and beautiful. I can't wait until that Thursday when this gets thrown out on us!
Kudos for Slashdot for opening this up, and kudos to the guy that did this. If I needed a web designer, I would definitely ask you if you were interested in helping me out.
The original CSS overhaul was not that significant, except that it added div tags and whatnot for the addition for a new CSS overhaul. This is definitely a work in progress.
This design is too busy and too dense. You need to put some more whitespace in here. It is hard to focus on just the story summaries, for example, without feeling encroached on by the other elements.
Also, News for Nerds. Stuff that Matters is too tall and thin. It is difficult to read and distracting.
I wish we had something a little more fresh. This design it a little too loyal to the legacy design.
I do appreciate the move to Sans Serif fonts, however.
I'm using Firefox 1.5 up to date and clicking the triangles for me opens and closes sections.
I like it. It has a nice clean look. I'm glad too see that the italics and serifs are gone. They are hard to read on many displays.
Mea navis aericumbens anguillis abundat
P-P-P-Powerbook!
Humorless sig goes here.
My main concern, though, is that these "advanced" interfaces are making Slashdot harder and harder to read in browsers like Links. It used to be totally text-browser friendly, but that is no longer the case. Sad for a so-called techie site...
Mainframe/UNIX Bit Twiddler and long time Windows/Linux Hobbyist.
The Theorem Theorem: If If, Then Then.
No title. Less slick than Kuro5hin. Lame.
Why not have a selection of different CSS styles to choose from when you are logged in? That way people can select themselves what they like most.
Don't fight for your country, if your country does not fight for you.
absofuckinglutely stupid unless you're blind and using a screen reader
You greatly underestimate how much like Work Slashdot looks in an 80x25 terminal with amber or green on black text.
My God, it's Full of Source!
OUTSIDE_IP=$(dig +short my.ip @outsideip.net)
You guys have obviously never been hacked.
Reduce, reuse, cycle
To the creator of the new design (in case he reads this): a "cursor: pointer" style would be nice, and possibly a hover attribute on the tag that has the section name, for those without internet explorer.
Everyone loves some sort of visual cue.
Looks good though.
The text on the buttons looks a little cramped in Opera 9 beta 1. screenshot
Changes in the CSS shouldn't affect in any way what you see in Links (assuming Links doesn't do much with CSS... haven't tried it in a while. w3m 4 life!!). Of course, some html changes were made it seems, but it looks mostly the same to me. As a frequent text browser user, the main thing that bugs me about slashdot is the glut of links that precede the main body. I don't care to scroll through those links every time.
Looking at the new design (out of text browser land), I will say it's slightly prettier than the current design. However it doesn't seem any more readable and abounds with 1 + 1 = 3 noise in the same way the current design does. People have been reading newspapers for ages, yet newspapers don't make every heading a heavy contrast stripe across the entire page or sharply delimit every margin... Is it because ink is expensive or because ink is distracting? I also would have liked an off-white background and unspecified font size and style of the main text for readability's sake. In my own modest web designing (home pages and such), I've come across a good rule of thumb: if the page is more readable in lynx, links, or w3m than it is in Firefox, then it needs work. The current slashdot is pretty darn readable in a text browser once you get past the ton of links at the top. I can't say I saw any CSS redesign entrants that improved upon that for readability. (Now if I was hanging slashdot on my wall, I might prefer one of the CSS redesigns... but I'm not; I'm reading it)
Rob didn't want something radical, he wanted an updating of slashdot itself; similar, but better. For everyone here who thinks it sucks and how dare Rob do something this screwed up to "your" site, go make a site and for your own community there! That's what Rob did 10 years ago.
Craig Steffen
http://www.craigsteffen.net
The purpose of CSS is not to make pages pretty. It's to make pages portable.
Putting each individual feature of possible designs to an individual vote might.
It's true I tell you, feller at work's next door neighbour read it in the paper.
The first and the second are both excellent studies in slightly different information philosophies. If you imagine a spectrum of importance on which all information must fall, 0 being not at all important, and 10 being extremely important, then typically in a good design the visual accessibility of each piece of information will be proportional to the level of importance it is assigned. 10-items (headlines, etc) should be highly accessible visually.
The winning design simply shows that the designer believes all information on the slashdot page falls between a 6 and a 10. The second design has a much steeper curve - headlines are a 10, but immediately drops off into the 4-7 range. The visual accessibility curve should always be influenced by both form and function (aesthetics and purpose), but ultimately saying the design is "poor" is a purely subjective, personal view. From technical design, color theory and 2-D theory standpoints it is really quite good. Just not necessarily the best match for slashdot's function.
Rex is 09 F9 11 02 9D 74 E3 5B D8 41 56 C5 63 56 88 C0
I don't see why it would be difficult to have multiple versions of the site, one of which could be a text browser-friendly one (didn't there used to be a twin page like that?).
Having multiple versions of the site starts to become a administator's nightmare because of the overhead of keeping all the various versions working. Less of a problem when the content is all pulled from a DB like Slashdot is.
But this is what XSLT is for - serve up the content in XML and have the browser apply the XSLT stylesheet client-side. This has the added side effect of reducing bandwidth usage since you're not shifting the styling and layout data over the network every time the page is loaded.
The icky problem with XSLT at the moment, is that whilest all the mainstream browsers (even IE) support it, there's no way for the server to tell whether the browser is capable since there is no header the browser is required to set if it is.
In any case, if your web site doesn't work in both modern browsers and text browsers then you must be truely clueless when it comes to web design.
Use elements that are applicable to the *type* of content (i.e. tables are used to output tabular data, not to position random stuff on the screen. Menus can be presented as unordered lists, etc.). Then style those elements to give you the visual effect you need. Text-only browsers can discard the styling data and they still get to see the content - the correct use of elements gives the browser good hints as to how to display the data. Small-screen devices such as PDAs can select a different stylesheet.
And if you're expecting everyone to have Javascript then your site is very badly broken - Javascript-only features cause serious usability problems (for example, they may force someone to open something in a pop-up window when they don't want to). Javascript is an *enhancement* - build your site without it and then if you want to add *optional* enhancements then write some Javascript that modifies the DOM tree to add hooks to the right elements.
Interestingly, if your corporate website doesn't meet the W3 accessibility guidelines then (depending on your location) you may be breaking the law - many parts of the world have laws that prevent businesses from discriminating against the disabled. These often extend to corporate websites and large organisations have been sued for sizable chunks of cash for ignoring these laws.
http://blog.nexusuk.org
You're downplaying the original CSS redesign. Before the redesign, Slashdot was not anywhere near CSS/HTML spec compliant. The redesign accomplished 2 things:
- pages load faster due to smaller pages
- seperated most of the styling from the content (CSS)
- easier to maintain/modify
Don't downplay the original CSS redesign. While the front look may have not been altered much, a lot of changes went on behind the scenes.
ARROWED!
Please, for the good of Humanity, vote Obama.
When I look at the winning design by Alex Bendiken, I can't find any portion of it that has been done better than Peter's. The nesting menus on the left aren't nearly as smooth, and the text size is the same as the article text, so everything seems to blend together. I commend Alex for attempting to make teal look trendy again, but he has failed. Peter's color choice, although only slightly lighter, makes all the difference. Differentiating between separate sections of the site is extremely easy as well. It is obvious that Peter put a lot of thought into simulating real-world readership when he designed his layout. As far as content delivery goes, Alex's design floats boxes and dumps content in. Peter's is much more polished, with slight accents between copy shifts. This makes the right things stand out where they should. He even included a lovely box for the new tagging system, which is completely absent from Alex's design. The Slashdot people need to create functionality for users to pick their primary content layout from a list. After all, one of the main advantages of CSS is the ability to completely change the design of a site with just one click from the end user. I guess we can't expect much from a judge who's homepage looks like it's frozen in 1993.
P.S. This is what part of the alphabet would look like if Q and R were eliminated.
I have just one serious complaint with the winner... The center column, which is the IMPORTANT part of the site, gets very, very badly smashed if your browser window isn't full screen-width, while the other 2 columns are full-width. Big mistake!
f r.png
/. and much better than the runner-up, IMHO.
eg.: http://img187.imageshack.us/img187/7969/slashdot0
Fix that one issue, and I won't complain much. It will be a big improvement over traditional
Two minor things though, if anyone is interested:
Many others have already said it, and I agree... There's just too much whitespace around everything. The nav-bar and slashboxes at the sides are twice as tall now, for no good reason. Having 50% whitespace doesn't look good... Not at all.
Please make it a somewhat different color. The "dark-green into black" gradient is very hard on the eyes, and doesn't fit in with the white page anyhow. Either start from a much lighter green, or make it a gradient to white (or grey, or yellow, or anything else that is NOT BLACK!).
Slashdot gets worse every day... Pipedot: News for nerds, without the corporate slant
Is it because ink is expensive or because ink is distracting?
I'd imagine that it's a little of both. Don't forget that major newspapers will be printing hundreds of thousands or millions of papers every day; all that ink is going to add up over the course of a year.
There are also other issues, of course - newsprint tends to come off on your fingers, so if there was a lot of extra cosmetic ink on the page, the readers' fingers would get that much dirtier (I know I hate how dirty my fingers get after reading a paper now).
Finally, PCs are not newspapers. They have different design considerations, and so naturally lend themselves to different types of design.
've come across a good rule of thumb: if the page is more readable in lynx, links, or w3m than it is in Firefox, then it needs work. The current slashdot is pretty darn readable in a text browser once you get past the ton of links at the top
I'm not entirely sure what you're trying to say there - do you mean that the current page *does* need to be redesigned?
Now if I was hanging slashdot on my wall, I might prefer one of the CSS redesigns... but I'm not; I'm reading it
I know where you're coming from, but for me (and I suspect a lot of people), I tend to spend a very large proportion of my day staring at my monitor. What's on it had better be pleasing to my eye, and while plain text in a terminal window is definitely *usable*, it's not very aesthetically pleasing. That's a very subjective thing, of course, but my opinion would be the exact opposite of yours.
It's official. Most of you are morons.