Making your Footer stay put when having a fixed Header

on January 17th, 2012 in Design, Tutorial

I am currently developing a small web application for the department I am working at. Everything was looking good until I ran into a problem with the layout last week. It bugged me that the footer was placed directly after the content. It just looked wrong. So I googeled to find a way to have a non-fixed footer that stays at the bottom of the window as long as there is enough space. If the windows is to small the footer should be bedhin the content (so you have to scroll down in order to reach the footer).

Usually an easy task. Set the body width to 100%, add an negative margin, which is the same height as the footer should be and you’re done. In my case there was a little detail that smashed my approach: The layout has an fixed header navigation plus a top padding of the body so that the beginning of the content is not hidden beneath the navigation.

Read on to find a (hopefully good) solution to fix that.
Read more

WordPress: Rearrange category order

on October 21st, 2011 in Tutorial, Wordpress

Just recently I ran into a problem with the category order. The oldest category was “New Publications”. So dividing the items based on their category and then looping over them would always put items from the “New Publications”-category at the end of the page, which is rather unpleasant. WordPress sadly has no option to rearrange the order of categories (at least I couldn’t find it).
Read more

Fancy fixed Navigation powered by jQuery

on April 20th, 2011 in Design, Tutorial

Last week I redid my work page. It was hard to navigate through the page without a second navigation. So I used the chance to tinker around with jQuery. The goal was to provide an alternative to scrolling through the content. Also, it should be much easier to navigate through the page.

In this post I explain how to create a simple page layout with fixed navigation. jQuery is used to enhance usability of the the navigation even more.This includes animated scrolling, aligning the navigation to sections and a fancy fading effect.
Read more

Realigning tanzmusik-online.de

on April 8th, 2011 in Design

A good friend of mine, named Simon, is webmaster at tanzmusik-online.de. If you wanna dance to your favorite song, but don’t know what, this is the place to go to. It is almost impossible to not find your song because the data base behind the website is huge and every new submission is personally validated by Simon. A lot of work but it’s worth it. The songs range from Abba to ZZ Top, from Pop to Heavy Metal and from ’70 until today.

But there is one thing that’s bothering me. The design doesn’t fit the great service. 2006 was the last time the website got a new skin. But in it looks more like a millennium design. In this post I’ll present some ideas, which hopefully help to improve the usability and appearance for the next design.
Read more

WordPress: Improved dynamic Excerpt

on April 4th, 2011 in Tutorial, Wordpress

Let’s be honest, the default WordPress excerpt function is bad. It is nice to have access to a quick post summary but the only thing you can control is the length, which refers to the first x words of the post’s content. But that is not enough if you have limited space. The length will differ widely from word to word. Aside from that the excerpt will almost always cut off mid-sentence, which doesn’t look very nice in my opinion (even if there is the good old [...] at the end).

This post will explain how to display an excerpt, which is not longer than a predetermined length and doesn’t cut off in mid-sentence.
Read more