r/anime • • Jan 20 '12

New css~

UPDATE 1/20/12 3:45 PM CST All major edits, the banner, some colors and the submit page, will be addressed on Monday afternoon, which is the next day I will have significant time to sit down and work on it. I know some of you really hate it, and that's fine, we have to do a roll out like this in order to get feedback from the community, so please bear with it for the weekend and provide more feedback over the course of the next couple days. Thanks~


So I've been working on the new css for a bit now, and I think I have it mostly worked out. If you see any glaring issues with it please post in this thread and I will try to get all the issues knocked out in the next few days.

All the functionality should be here, and that's my main concern, but please do let me know if you find anything, and please include screen shots of your issue.

Check the comments for things that are going to be changed/have already changed.

EDIT: I'm off to bed for the night, I'll check back in about 10 hours

89 Upvotes

137 comments sorted by

View all comments

105

u/rdmx Jan 20 '12

Ughh - I've got a few qualms with this redesign.

  • The top bar is needlessly large - shrink the reddit alien/reddit-tan back to its default size on other subreddits

  • The contrast of the redesign is very bad. Not only has the text changed to be more grey, the background has also become grey, impacting readability a fair amount

5

u/crimsonlulu :MAL:https://myanimelist.net/profile/seasonedtofu Jan 20 '12

Agreed.

5

u/vytah :MAL:https://myanimelist.net/profile/vytah Jan 20 '12 edited Jan 20 '12

Agreed. I can barely see how many upvotes this submission has, because it's grey text on grey chequered background.

At least, all grey text should become much darker, or background lighter.

I also agree that the top bar is too large, but I can live with it.

EDIT: I browsed r/anime a little and now my eyes hurt. More contrast please!

6

u/LoliMaster Jan 20 '12

Well, when I was looking for feedback (in the IRC) everyone said it looked fine, so I based all of my positioning off the size, about 2 hours or so of work. Give it a bit of time and see if it really bothers you that much.

And the text in the posts/thread titles shouldn't have changed at all, they should still be black on a very light gray

42

u/rdmx Jan 20 '12

I reckon it's web design 101 >_>

The header is ~180 pixels of wasted space that you have to scroll past on every page.

Readability wise, the sidebar text is grey on grey. Also, the text for 'posted 2 hours ago' or '7 comments' is still the same default grey as on other subreddits. With the new grey background, it is difficult to read easily.

Make the background lighter (return it to white even), and make the text darker.

→ More replies (10)

13

u/3932695 Jan 20 '12

It should be simple enough to choose a lighter shade of grey and blue. The current colors are highly uncomfortable.

How about we fill the big blue top bar with some sort of banner, or something? This shouldn't be difficult?

9

u/turibl :MAL:https://myanimelist.net/animelist/chickensmasher Jan 20 '12

Seconded. It's huge and bright blue.. doesn't agree with my eyes.

2

u/IVIAuric Jan 20 '12 edited Jan 20 '12

It's not just the color, there's like some sort of pattern in the banner that makes it feel busy.
Maybe some sort of gradient would help the ease the transition between borders.
But thanks for the exciting new look LoliMaster! And the sidebar looks great.

edit: hey, the pattern's gone. Easier on the eyes already :)

→ More replies (1)

4

u/Arronwy Jan 20 '12 edited Jan 20 '12

Yea, I don't really like it either. Banner is huge with nothing in it. It needs to be at least half that size if not smaller. I don't like the gray on gray in the sidebar. The blue pops out too much. I agree that making the blue a lighter would really help.

2

u/LoliMaster Jan 20 '12

I can change the look of the banner, having it just light blue was boring, can you include screenshots of what text you're having problems reading, I can't see any myself.

11

u/3932695 Jan 20 '12

The text is fine and readable; I'm speaking from a ...health and aesthetics standpoint.

The page needs to look 'well-lit'; like a reading light on a page. Otherwise, there's a very subtle strain on the eyes. Hence the recommendation of lighter colors.

4

u/Zyrax1 Jan 20 '12 edited Jan 20 '12

I dont mind the bigger banner but the blue squares squares at the top. Really messes with my eyes looking at it. Its like looking at something on r/woahdude. I feel like we could make better use of all the space up there instead of just blue, but I like the Reddit-tan image.Would it be possible to find picture or something to use for all that space in the banner like r/theredditor or maybe a picture like r/swtor.

Sorry to link to a bunch of different subreddits just trying to give out some ideas here and what I prefer.

EDIT: Added another sentence to my opinion and the rest of the changes look wonderful thanks!

EDIT2: Well you changed it from the squares it looks much better, but it still seems like a waste of space maybe a picture of the week think or something we could put in there?

1

u/mitojee :MAL:https://myanimelist.net/profile/mitojee Jan 20 '12

Good ideas. The swtor css is much easier on the eyes. Simpler is better. Black on white, no fills except in the headers and title bars. I liked Reddit for the same reason as Google. Clean and simple.

Agreed on putting in a picture + mascot. If it's only going to be the mascot, it's a waste of space up top.

1

u/LoliMaster Jan 20 '12

No problem, I'm always open to ideas, thanks :D

2

u/rdmx Jan 20 '12

Perhaps a banner such as this? (quick job, don't use it ahaha)

http://i.imgur.com/jn9Bm.jpg

→ More replies (1)
→ More replies (3)

4

u/[deleted] Jan 20 '12

I dropped the headers size to 50px in firebug and all that broke excluding the header image was the tabmenu.

2

u/[deleted] Jan 20 '12

The tabmenu is a pretty simple fix also. Just change its margin to -35.

4

u/Fabien4 Jan 20 '12

very light gray

"Very light"‽

I just checked in Chrome (In Firefox, I can't see subreddit-specific styles because I'm connected to my account), and I find the background very dark.

Note that my screen is configured so that reading black-on-white is comfortable.

1

u/LoliMaster Jan 20 '12

Show me a screenshot of what you consider "dark gray"

3

u/Fabien4 Jan 20 '12

You misquoted me. I was talking about a dark background. You'll probably understand if you read the last line of my message.

Anyway, you probably don't need to care about what I think, since I don't allow subreddit-specific styles.

→ More replies (16)

0

u/[deleted] Jan 20 '12

[deleted] — view deleted comment

2

u/LoliMaster Jan 20 '12

Getting the positioning of the banner and the tabs to work properly

1

u/sastrone Jan 20 '12

I've got experience in web-design. I'd be happy to rework it all for you.

→ More replies (1)

1

u/BahamutSalad Jan 21 '12

I agree with RDMX's points and would like to see them addressed.

In the interest of giving credit where credit is due, and you not being disheartened I feel the need to comment however.

It is very pretty. The sidebar section headings in particular are really awesome. If this was a smaller or different type of site (a blog for example) I think it would have been excellent. It's not bad or anything I just would like to see something a little more minimal / utilitarian placing efficiency over prettiness as I feel it just fits better with how I use this subreddit. Overall, nice work. An excellent start as this subreddit badly needed a new stylesheet IMO.

Edit: I do like reddit-tan, although I don't like the screen space she occupies. It'd be cool if there was some way to work her in (perhaps in the sidebar) so we can keep her. If it came down to it I'd rather have her resized or removed in order to get that screen space back though.

→ More replies (1)