SS!AB 2010 Redesign
Kabitzin on
April 25, 2010 · in Blogging Tips,Site News
Now with extra Nama-ko
As I previously mentioned, I’ve been working on a redesign for 2010. It took some extra time to get started because Apache wouldn’t start in Xampplite; it turns out some other programs were using the necessary ports. I haven’t yet enabled that many of the new features, but I wanted to get the new design up to see how readers liked it. There’s only one header for now, because I don’t want to have to remake a ton of headers every time I update the header image’s template.
I know the page CSS is wonky, but that’s because I’ll be redistributing the information on the various pages. I’ll also be reactivating various sidebar widgets, so don’t worry if your favorite widget isn’t there yet.
Notes on the redesign:
| Spoiler Inside |
SelectShow |
|---|
Usability:
- Arial is a fine font, but it can appear a bit narrow. I actually looked up the best fonts for reading text online, and it seems like Verdana offers a versatile and easy-to-read solution. And although it tweaks me stylistically, I increased the font size as well.
- I’ve decided to curtail the ads displayed for regular viewers. If you came here via search engine, the ads might be a bit more obnoxious, but everyone else will see much fewer ads. In many ways, Smart Pricing is a bitch.
Style:
- I ditched most of the 1-pixel borders, as it was a little out of control. There were too many lines everywhere and it was distracting.
- Cut down on the number of colors used in links, headers, menu backgrounds etc. Most text is now in shades of black and white, so that colored text stands out more.
- I checked out a lot of other themes for style cues and I find that judicious use of white space makes for the best delineation of sections without making everything feeling boxed in. The redesigned theme feels a little plainer, but bigger. I kept the same width constraints, however, because I know there are still a lot of readers using 1024 pixel widths on their monitor.
- Rounded corners make a conservative comeback!
- Increased the header size; I know this takes up valuable screen real estate, but when you pay this much for commission pieces, you want viewers to see them! Increased the size of Nama-ko and the “Sea Slugs!” name for branding purposes.
- Moved the navigation menu from its own line below the header to the top left area above the header (which would have been dead space). I blended the navigation menu in more; hopefully it is not too hard to see. I figure most regular visitors do not use this navigation menu that often, and so the menu does not need to be a central focal point. In the last version, the navigation menu was one of the most prominent features on the page.
|
Tagged as:
Redesign
This post was written by...
Kabitzin – who has written 1971 posts on Sea Slugs! Anime Blog.
One of the founders of Sea Slugs, I handle most of the blog admin tasks while wearing my I AM BOSS shirt. I like my action series well choreographed, and my romance series extra trashy. I also have a soft spot for puns.
{ 33 comments… read them below or add one }
Hmm, the arial is readable enough to me.
Mm, you know your blog is the third result in a Google search for “sea slugs”?
Looks pretty good. Nama-ko being larger is a good decision.
(Because it’s Namako~)
Yeah, I don’t think we will ever beat the pages that are really about sea slugs…
Navigation at the top is much better, and though I miss all the boxes, the page does flow better without them. And more Nama-ko is always the right choice.
I tried to put the focus back on the important parts of the page, i.e. the posts and Nama-ko =3.
I love this. It looks so streamlined and clean, great job on the design.
Also, the comment boxes look great too. It looks so new now
Thanks! I cut down on a lot of the extra elements, and I think it makes everything less confusing.
It’s been, what, less than half an hour, and I’m already loving this layout. The colors are easy on the eyes, and the sidebar seems more friendly.
About the replies though: are they still indented?
Yes they are!
I really like the new look Kabitz, it’s very easy on the eyes.
It makes for very nice browsing, everything looks nice and smooth.
Nice! I know rounded corners are so 2008, but I really dig the comeback. And more room to show off more of Nama-ko’s… assets is always a good thing. ;P
The only thing I’d say is the menu does get a little lost. And it looks especially wonky when you rollover an item (colophon ) with a subitem. But otherwise, I love the clean lines and font spacing. Excellent for readability.
One of the most annoying issues with page lists (which is what the menu is) is the automatic title attribute that Wordpress assigns it. At first I thought it was generated by Thematic, but from this thread I realized that it is automatically assigned by the wp_list_pages function.
It took a lot of searching (since the suggested plugin did not work), but I finally found a thread with the solution: the Remove Title Attributes plugin.
It annoys me that you can’t simply pass an argument to the wp_page_list call to exclude titles from the page list (and the titles are super-redundant since it’s just the page title), as this totally clutters up the menu, but at least I found a solution.
That’s what functions.php is for lol
Ugh, I’m no PHP whiz, and I don’t really want to muck around functions.php for something as simple as turning off titles on pages, especially if someone already made a plugin for it.
Rounded corners will soon be so 2010/2011 once Internet Explorer 9 comes out and IE finally actually recognizes the border-radius CSS element.
Yeah, but everyone will still be using IE 6
Rounded corners were out?
I didnt get the memo when I designed mine lol
I totally dig your comments section. The theme is looking bonza!
Clean, readable and, dare I say it? … elegant.
Of course, I coded it with my pinky extended.
I’m loving the new design! Very clean and easy to read, and yet stylish.
You mentioned “one header for now”. Planning on making it a “randomizing” one in the future?
The randomized functionality remains, and will immediately kick in the moment I add additional headers to the folder of header images.
The new design kicks ass
Nice new design, very nice job.
I was wondering where the ads have gone. This explains it haha.
The design is plainer than before, but it looks good.
I also like Verdana. I was actually surprised to see I was using Arial on my own site. I guess I was mixing it up with work. I like the new “whiter” format, though I guess I might worry that the links on the sidebar don’t stand out enough…though the headers obviously stand out, which I guess is good enough.
I like how in this redesign and my redesign, we kind of both went “back to the roots” (though in different directions). I kind of liked the things boxed in by lines while you don’t (though I think we both pulled off our respective new designs off well).
Maybe my one real beef is the white text on the (light) blue background for the top links. I know that they aren’t really that important, but I think they may hide too well. That’s my real only initial criticism of the design at first look.
Oh, and how many more people are throwing together redesigns before it’s their turn in the AniBlog tourny? lol (though, granted, both of us were working on ours before that was announced, I think)
Arial is a good font for cramming text into narrow places, but if you’re not constrained as much I think Verdana makes a better choice.
I didn’t hate the lines, but there were too many of them IMO. I liked your redesign, but you didn’t post about it so I couldn’t see your thought process.
Yeah I agree, but since the background color has been the background color for the last 3 or so iterations of the blog, I am loathe to change it. Black stood out too much, and so white was the best compromise between blending in and standing out.
Scamp says that Round 2 doesn’t start until Round 1 finishes, so this theme will be old and busted by the time our match comes around, lol.
Lol I meant to post about it eventually, but I never got around to doing it. I always usually announce my redesigns with fanfare, but this time I didn’t for whatever reason.
So I guess that means we’ll have a week break from voting while the round 1 votes end before the round 2 votes begin then.
In the Hontou Ni quest for an ever closer isomorphism with SS!AB, I’ve also switched to Verdana and upped the font size; after seeing the redesigned SS!AB, Hontou Ni’s previous default of Tahoma 11 was just too narrow and tiny. As the saying goes, imitation is the sincerest form flattery. :3
Cleaner is good. Simplicity is indeed for the best. The new design is heaps better than the previous one, no contest.
It looks really nice. A lot simpler and much fewer distractions. Also, agreed with everyone about the top.
we need a way to contact Epi
You can just use the contact form up at the top, and mention that the message is for Epi.
never saw that thanks but thats still impossible he is on vacation
{ 1 trackback }