Slashdot CSS Redesign Winner Announced 882
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 have to say (Score:4, Insightful)
~S
Re:I have to say (Score:5, Insightful)
I agree. The runner-up seems FAR better. (Score:5, Insightful)
Re:I agree. The runner-up seems FAR better. (Score:5, Interesting)
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)
Re:I agree. The runner-up seems FAR better. (Score:4, Insightful)
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.
Re:I agree. The runner-up seems FAR better. (Score:3, Informative)
If you really have to sit in a dark room, then you should know how to turn the brightness down accordingly, also a recommended thing to do. The assault happens beca
That's the whole point (Score:5, Insightful)
The purpose of CSS is not to make pages pretty. It's to make pages portable.
Re:That's the whole point (Score:3, Insightful)
Re:That's the whole point (Score:4, Insightful)
The designner obviously didn't do this check, or else he would have noticed that the <div> containing the left-hand sidebar gets displayed first, making the user do a lot of scrolling to get to the actually content.
Re:That's the whole point (Score:3, Informative)
Turn in Slacker Credentials at the Door (Score:5, Informative)
You greatly underestimate how much like Work Slashdot looks in an 80x25 terminal with amber or green on black text.
If you REALLY want to read Slashdot at work... (Score:3, Informative)
Re:Turn in Slacker Credentials at the Door (Score:3, Funny)
Re:I agree. The runner-up seems FAR better. (Score:3, Interesting)
absofuckinglutely stupid
Why is it stupid? I frequently use eLinks because it's a whole lot faster than firing up a graphical browser (why exactly do I need graphics in order to read text news stories?).
I've also found myself using Elinks in an 80x25 console on a machine while waiting for it to install a Linux distro - it certainly helps pass the time. Not to mention those times when I've had to go searching for drivers/configuration/whatever which I needed in order to
Re:I agree. The runner-up seems FAR better. (Score:3, Insightful)
Generally I hold slashdot users as a group more intelligent than the average person, so seeing bigotry - which is the direct manifestation of ignorance and immaturity - running around slashdot like wildfire was disturbing so say the least
I think you've just made a prime example of yourself.
Re:I agree. The runner-up seems FAR better. (Score:3, Informative)
Anyway, I think that he was referring to your comments about holding slashdot users as more intelligent than the rest of the population and that you were shocked to see immaturity and ignorance displayed here. The vehicle that
Re:I agree. The runner-up seems FAR better. (Score:4, Informative)
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.
Re:I agree. The runner-up seems FAR better. (Score:3, Informative)
Here's an example of www.osnews.com being viewed by Links via PuTTY on a SunOS server:
http://www.visi.com/~rsteiner/links.gif [visi.com]
and the main project site is here:
http:// [sourceforge.net]
Re:I have to say (Score:5, Insightful)
Having a look at both the winner and the second using Firefox on Linux, the winner is definitely better looking than the second - the winner respects my font settings, while with the second many parts of the page are simply unreadably small. For that reason alone, there is simply no contest between the two.
Re:I have to say (Score:3, Informative)
No it doesn't. Take a look at the stylesheet [slashdot.org]. I quote:
If that respected your font settings, the first number would be 100%, not 82%. Since when is reducing your preferred font size by almost one fifth "respecting it"?
Perhaps if you have a small font size configured in your browser, it might not look very different to you, but the larger you've configured your fonts
Re:I have to say (Score:3, Insightful)
Re:I have to say (Score:5, Funny)
C) read before you write
It may not be a democracy, but it is still slashdot.
Re:I have to say (Score:5, Funny)
It's not like the editors ever read the site anyway...
Re:I have to say (Score:5, Insightful)
I'm not sure the world is ready for such customizability, but slashdot should boldly step into the late '90s world of customization!
Are you nuts ? (Score:3, Insightful)
What do you think this is, 1999 or something ?
Idea stealer!!! (Score:3, Informative)
And I still think it's a great idea.
Re:I have to say (Score:3, Insightful)
Re:the ultimate design-by-committee (Score:5, Insightful)
Putting each individual feature of possible designs to an individual vote might.
Re:the ultimate design-by-committee (Score:5, Interesting)
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.
Re:the ultimate design-by-committee (Score:3, Insightful)
No, saying the design is poor is taking the things you mentioned into consideration, such as the form and function, and determining that the design performs poorly in both cases; therefore, the design is poor. It's not subjective - UI has been studied out the wazoo, and colour theory too. This is only Slashdot - I'm not going to submit a rationale.
I'm a bit surprised someone would say the second design is good from a colour theory standpoint. It is pasty gre
Re:Where? (Score:5, Informative)
Re:Where? (Score:4, Insightful)
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.
Re:Where? (Score:3, Insightful)
Re:Where? (Score:3, Informative)
You mean, aside from the arrows?
Re:Where? (Score:3, Informative)
To many, this is an indication of bad design. (See affordance.) [jnd.org]
Of course, the "bad" in this case refers to usability for new users, not to the visual appeal of the page. The former often takes a second seat to the latter.
Re:Where? (Score:3)
I don't enable java by default, and it works fine for me.
Maybe meant JavaScript?
Big difference. JavaScript is OK (its part of the web), Java and other plugins are not.
Re:I have to say (Score:2, Insightful)
Re:I have to say (Score:2, Interesting)
Re:I have to say (Score:3, Insightful)
Re:I have to say (Score:3, Insightful)
Re:And I have to say... (Score:5, Funny)
Re: (Score:3, Insightful)
What is the comparison? (Score:3, Insightful)
I'm honestly seeing no comparison to the Mac OS. Have you had any exposure to or experience with the Mac OS at any point? 'Cause I have, a few different times, and this design has precisely zero to do with anything Apple makes... Is it their Web site, which also uses a controversial white background? Or what?
Re:I have to say (Score:3, Insightful)
Or, rather, 8 pixel high sans-serif fonts are in fashion now.
Are all the "web designers" aiming for people running 640x480 screen sizes? The winner is close to illegible at 1280x1024 on a 19" CRT.
Re:I have to say (Score:4, Interesting)
We all want to know! (Score:2, Insightful)
(looks fantastic btw, job well done)
Re:We all want to know! (Score:5, Funny)
Re:We all want to know! (Score:3, Informative)
Ugh (Score:3, Informative)
Well done (Score:5, Interesting)
Congrats! (Score:3, Insightful)
I, for one... (Score:5, Funny)
Re:I, for one... (Score:3, Funny)
Imagine a Beowulf cluster of Alexes designing CSS templates for the web.
Nice, clean, simple. I like it. Guess I'll (Score:5, Funny)
Phew (Score:5, Insightful)
Re:Phew (Score:2)
However, it took a few seconds to load; I'm guessing the site is slow. Did you give it a minute to see if it showed up?
It looks... (Score:3, Insightful)
New, harder to read version (Score:2, Insightful)
Re:New, harder to read version (Score:3, Insightful)
Re:New, harder to read version (Score:5, Informative)
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 [wikipedia.org]:
"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.
Re:New, harder to read version (Score:5, Interesting)
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.
Downplaying the original CSS redesign (Score:5, Insightful)
- 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.
Enh... (Score:2, Interesting)
Perhaps the problem here is editorial: Taco and the gang couldn't stomach a more radical departure from the old standby.
Changes? (Score:2)
Personally, I'm a bit sad that Jason Porritt's design didn't end up in one of the top slots. (His design was the one who's mockup had the "
the preview version is missing images? (Score:2, Informative)
http://summit.makalumedia.com.nyud.net:8080/wp-co
The images for all the rounded corners appear to be missing.
Re:the preview version is missing images? (Score:2, Informative)
Congrats on the slashdotting... (Score:2)
Huge ads (Score:2)
still, good luck with the new design.
slashdotted prize (Score:2, Funny)
I cut myself on the new slashdot (Score:2, Redundant)
A small Criticism (Score:3, Insightful)
Re:A small Criticism (Score:5, Informative)
First thoughts (Score:2)
Some people have already commented about wasted space... first off I don't think this is really true, it seems to be more down to the fact that everything is less "bendy" at the edges.
Well done on this, even the original icons fit in, although it would be nice to see these gradually phased out as more cle
Light mode? (Score:5, Insightful)
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.
Re:Light mode? (Score:5, Informative)
Looks ok (Score:2)
I like it... (Score:2)
pink was best evr ! (Score:5, Funny)
Not very Web 2.0 (Score:5, Funny)
Slashdot'll never catch up to digg at this rate :(
Lipstick on a pig (Score:4, Insightful)
Hoping for something new (Score:5, Insightful)
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.
not that pretty.. (Score:5, Informative)
Please don't force a font on us... (Score:3, Insightful)
Too Busy (Score:5, Insightful)
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.
Re:Too Busy (Score:5, Interesting)
As a contrast, look at the runner-up design, which got this right. It is easy to differentiate between, and focus on, any of the page layout sections.
Re:Too Busy (Score:3, Interesting)
Thumbs Up (Score:5, Insightful)
Comment removed (Score:5, Insightful)
Let us choose without signing in (Score:3, Interesting)
Partly because it's more convenient, partly because.. you know, I don't always want to be signed in.
There's been a few comments about minor preferences, such as whether the body uses serif or sans-serif. These kind of things should be easily customized without having to sign in.
So: It would be nice if there was a way of choosing a style sheet or changing minor preferences by specifying it in the URL, so I could simply bookmark it. For example: http://www.slashdot.org/?style=ponies&font=serif [slashdot.org]
I mean, would it be THAT hard to do?
I see why it's necessary to choose a good, simple default design, but it would be fantastic if it was possible to bookmark your favorite stylesheet this way, being able to choose from a large catalogue of people's designs. Imagine every user could register designs and you could choose someone's stylesheet by specifying it in the URL: http://www.slashdot.org/?style=user_radarsat1 [slashdot.org]
That way people would be submitting new designs all the time, it would be a great way to generate some creativity on the site.
I dunno..
Anyways, just an idea.
Nice... but big. (Score:3, Interesting)
Take the winner and compare with the origional. The origional is tight... some say too tight. There is little or no spacing around the non-story text (titles, menus, etc).
The winner is very like the origional, except that the spacing around the titles, menus, basically everything that isn't story text, is very loose. The spacing is much much larger, and wastes screen estate IMO. It's unfortunately also rather plain, plainer than the origional.
Now take the runner-up. It takes all the browser width, which is popular in most sites now. It has a better spacing around the non-story text, but still could use some tightening up. It also looks much better -- it has the shiner look.
I think being tighter (more like Google's GMail) yet stylish, will help.
Why not UTF-8? (Score:3, Insightful)
You guys have obviously never been hacked.
Buttons look cramped in Opera 9 beta 1 (Score:4, Informative)
Judging by the comments...he got it right (Score:5, Insightful)
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.
The winner's design is missing a lot (Score:3, Insightful)
One SERIOUS problem... (Score:5, Interesting)
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!).
Re:It looks kinda like gnome (Score:3, Insightful)
Re:look good to me (Score:2)
Re:I just redesigned my house. (Score:3, Interesting)
All true. I wasn't necessarily lashing out. I sometimes am frustrated by attention to things, as you put it, "not broken".
So, when there are things potentially needing fixing I'd rather see energy spent there. I haven't gotten mod points now for well over two years. Turns out, after being laid off from a job of 21 years, my available extra time to be MORE active on slashdot pushed me past +1 sigma in the slashdot activity -- slashdot picks modders from the norm.
Considering I do alright in my karma, et
Re:"read more" link (Score:3, Informative)
Re:Teen Girl Squad: (Score:3, Funny)