Fauna 1.5

Introducing the latest evolution of the Noscope design. This latest version has a few tweaks, changes and improvements.

New Features

  • Plain Fauna is default again
  • An on and off style, “Plain” Fauna is once again the default, light, style for Noscope. Preferences can still be adjusted if you prefer Nocturnal Fauna.

  • New, relevant meta information style
  • The main page has meta information such as date, link to comments and category presented in context with the post. For permanent post locations, this information is tucked away in the sidebar.

  • Inline Textile / WordPress comment formatting help
  • Go to a single post, click “Formatting your comment”, and voila, it opens right there.

  • New background image
  • In an attempt to break the verticality, I’ve added a more personal and wide background image.

  • Less images

In an effort to simplify future re-designs, I’ve minimized the amount of “needed images”. One image sacrificed was the shadow for the previous style of meta information.

Future Plans

This is the final version of Fauna, for Noscope. I expect to make no further visual changes to the site, until the time comes when I do an actual redesign. While Fauna has its cons, I’m fairly satisfied with the looks of it. It is for the same reason that it’s been the de-facto Noscope design for more than a year now.

Some of the cons include the fact that there’s the same huge header image on all pages. While this has been a conscious decision on my part, it does become redundant and illogical on archive pages and the likes. Another problem is the verticality that all weblogs seem to suffer from in one form or another (except shining examples such as Joshuaink and Broken Kode). In a redesign, these would issues I would want to address.

For now, I’ll let Fauna stay here for a while more. What happens next, is up in the air.

Responses to “Fauna 1.5”

  1. Tristan says:

    I like it! Seems everyone is getting rid of all kinds of shadows and extraneous images everywhere. I also like the bit of graphic at the top, and in fact I was considering doing the same thing with my recent color morph, but I couldn’t get it to work with the shadows. If only all browsers supported PNG transparency…

    In any case, it’s nice, a good refresh, and still very functional and all. Cool.

    Also, is it just me, or does binarybonsai’s new look-in-progress remind you of Vista? Not that it’s a bad thing… ;-)

  2. Joen says:

    Thanks Tristan,

    Actually I just now removed even more shadows, one from the copyright text in the bottom, and a few from the index sidebar.

    Also, is it just me, or does binarybonsai?s new look-in-progress remind you of Vista? Not that it?s a bad thing… ;-)

    I did notice the glass effect, and thought “hey, isn’t that what Microsoft is doing?”. But to be honest, I think Michael’s glass design is looking much more interesting than that of Vista. For usage reasons as well… Michael’s design screams for varying backgrounds.

  3. khaled says:

    Man, you keep saying that sort of thing, I might actually believe you :) . Seriously though, I’ve said it before and I’ll say it again, there’s something special about Fauna, it’s great because of the fact that everything exists in it’s place for a reason. Nothing seems to have come by chance. This mini updates also show an appreciation for the code, so when you do finally get around to going down another route for the site, it will be just as equally memorable, I’m sure.

    I for one really liked the drop shadows, because they served a purpose, but hey it’s all cool.

    About Mike’s site, I think it’s both great and strange the way he’s updating it. What I’d really like to know is how he’s worked out that he’s only gotten 35% of the site done. What the hell is going to change from now till 100%, that’s what I’m interested in knowing.

  4. Bilal says:

    Looks great as always. Very nice. :)

  5. Levi says:

    Looks great, I love the background image. I do however miss the rounded box edges.

    Your code is cleaner than my room!

  6. Jonas Rabbe says:

    It’s always nice with a little freshness, even if it’s just a minor facelift. Anyway, I’ve been looking at fauna nocturnal for so long, that it feels like a totally new design.

    On Michael’s site (since he hasn’t made the comment box it’s nice we can just take the discussion elsewhere): Why he’s chosen the glass effect must be for him to reveal, but I’m hoping for some more life behind the glass to show off the translucency of the different layers.

    To Khaled, since he hasn’t even gotten the comment form working yet, I’m sure he can find 65% more work. Although the design seems polished there is always room for touching up the back-end to make the coherence absolutely perfect, or at least close enough.

    On the subject of redesigns I put it to the great minds here to consider a design (both visual and structural) which ties the past of the blog better into the present without being too cluttered. It’s something I’ve spent a lot of time thinking about, but I’ve gotten nowhere, and as it is archives seem like a place that’s just tagged on after the fact. Somehow puling entries from the same time, that are similar, or just some that might be of interest in with the current entry is quite a challenge. And now I’ve put it to you.

  7. Joen says:

    Khaled,

    Man, you keep saying that sort of thing, I might actually believe you :)

    Saying what? :)

    Oh, and thanks, I appreciate it.

    Yes, the code has gone through some major tweaks, and I’ve intentionally kept off a redesign until the code is so mature that a redesign can focus on the CSS and just a few “rearrangings” of the code.

    I for one really liked the drop shadows, because they served a purpose, but hey it?s all cool.

    Triage. The drop shadows didn’t survive. The thing is, while CSS allows for less creativity, it’s much more flexible. And warming up to a redesign, I wanted to minimize the amount of cruft. Furthermore, I really do think it looks better without the shadows.

    Levi,

    Looks great, I love the background image. I do however miss the rounded box edges.

    The rounded box edges were Mozilla only CSS 3 code. They were killed off for the same reason. I considered doing them in CSS and images, but no, it wasn’t worth it.

    Your code is cleaner than my room!

    Heh heh. Well, the code has been here for more than a year now. Once you clean up the code it stays that way (unless something goes wrong). I can’t say the same for rooms.

    Jonas,

    Anyway, I?ve been looking at fauna nocturnal for so long, that it feels like a totally new design.

    I know what you mean. I feel the same way. Thanks.

    On the subject of redesigns I put it to the great minds here to consider a design (both visual and structural) which ties the past of the blog better into the present without being too cluttered. It?s something I?ve spent a lot of time thinking about, but I?ve gotten nowhere, and as it is archives seem like a place that?s just tagged on after the fact. Somehow puling entries from the same time, that are similar, or just some that might be of interest in with the current entry is quite a challenge. And now I?ve put it to you.

    Challenge accepted my friend.

    However, I’m not sure I am able to win that challenge. We discussed it on Chris’ site a while ago. I have some ideas, but whether it’ll work I do not know.

  8. Jonas Rabbe says:

    You can do corners in css and js using nifty corners which are actually quite nifty.

  9. Joen says:

    They are nifty indeed! And I have thought about it, I’ve actually have that link bookmarked for a while.

    The thing is, I despise things that work “onload”. They pretty much postpone stuff until everything has loaded.

    I very much prefer inline solutions, such as what I did on Sporkle — which is is actually pretty nifty too. Basically, a box there has this semantic:

    <div class=”box”>

    <h2>headline</h2>

    <p>body</p>

    </div>

    The box has the footer graphic bottom aligned. The h2 has the header, and the p has the body.

    Works for almost all the content.

  10. Jonas Rabbe says:

    Plus using the “onload” method to attach functions is flawed as you have to save all the functions for onload before setting you own, and then calling them all. A problem in one function will the result in none of them being loaded.

    If you want the onload functionality you should use load/onload even handlers that can be attached to the body or window or whatever.