subdued

subdued

Subdued was always an oldie, but a goodie, in its previous incarnation. Unfortunately things suddenly went silent for quite sometime. Now Bart-Jan Verhoef is back with a complete redesign, and my gosh it has sIFR’d FF DIN!

The site features his blog, portfolio, photos and more, a typical breadth of subject matter for a personal site these days. Unfortunately, the portfolio second is a bit empty at the moment, and I’m not a fan of thumbnails, but there’s no denying the site has a rich quality that’s hard to find in most grunge based designs.

a tale of sans and serifs

Detail screenshot of the article formatting

The combination of DIN and Georgia is surprisingly nice, and provides great contrast between headlines and body copy. Speaking of contrast, the powerful red with the off-white created by the textured background is excellent as well.

However, I think if the red was pulled more towards the crimson in the logo, it could eliminate the buzzing effect of the large red areas, such as headlines. The headlines also lack a hover state, which seems minimal, but made me second guess whether I could click on a headline or if I had to click “permalink”.

nice links

Detail screenshot of the custom link styling

There is some nice detail work to gather inspiration from. I love the custom underlines on all the content links, it really adds character and maintains the feel of the site, whereas normal horizontal rules would’ve seemed out of place. The technique is quite simple, but doesn’t seem to get used enough.

the grunge

The logo of one Bert-Jan Verhoef

One of my favorite things about the site are the grunge textures in the background that also form the borders that wrap the columns. They are powerful without being overwhelming and manage to leave plenty of legibility for the body copy. I really dig the grungy illustration and effects on the logo type as well.

Example of scratched text

The scratched in type in the footer is a very characterful, but I wish it was still sIFR text or placed by some other more usable method. There’s more text in the imagery that doesn’t necessarily have contain any important information, but it’s an interesting use of typography as a texture.

criticism

One issue that does irk me though, is on shorter pages. If the page isn’t tall enough, the background image in the footer overlaps the one in the header and creates a rather hard line where the images aren’t blending. While it wouldn’t be friendly to image size, if the two images were faded into transparency, this issue could be avoided.

I’m not sure how I feel about the introduction of a third font (Arial) in the sidebar, as it adds another layer of texture, but then again, it is a grunged up site isn’t it? What do you good folks think?

  1. Kevin Zak

    I love the overall design, but I believe the layout could use some work. In this day and age, there are just as many widescreen monitors as there are standard (if not more), so I think that he could’ve taken better advantage of the whitespace to the right. The design seems to end so abruptly, and I think he could’ve added another column or at least increased the width of existing columns.

    I am a huge fan of the grunge look. The background and the borders of the design are fantastic. The logo flows well with the rest of the design while still calling attention to itself. I dislike the fact that there is not a hover on titles. This seems like such a huge mistake on an otherwise accomplished design.

    The navigation is great. It’s minimalistic feel prevents it from being an overwhelming source of information, yet I can still find everything easily. On top of everything, the search function works great and its design is very polished.

    A very small issue I noticed is the RSS image. I feel he could’ve made it flow better with the grunge theme instead of using a glossed up cherry version of the original. The footer text either needs to be more defined or redone entirely. It is barely legible and should call more attention to itself. It may not be vital information, but it is information nonetheless, and should be treated as such in terms of typography.

  2. Bart-Jan Verhoef

    Thanks a lot for the review, I really appreciate it and am honoured to be showcased next to the great sites that are up here :) .

    You might be right on the footer text. I wanted to (and did) use my own handwriting, which makes it a bit hard to use SIFR. I did however use image replacement on text there, so the content is there in the HTML. Yet, it might be interestingto turn my handwriting into a font. Anyone has any experience doing this?

    On the footer background that overlaps on shorter pages, I’m aware of it and and don’t like it much either. Need to fix that soon. The same goes for What Kevin points out on the whitespace on the right, where all design elements suddenly fade away. I’ve actually already created a pattern for the background that can repeat throughout the entire page, and am also testing to see how it would work if I’d center the whole site, and make the main column a bit wider.

    I’m personally not sure either about the Arial in the sidebar. Honestly, I went from Georgia to Lucida Grande to Arial, yet haven’t quite locked what fits best there. I am going to give it some thought though, also well as the coloring and hover states on the headings.

    Thanks again for the constructive words, also to kevin.

  3. elyse holladay

    I’m working on a redesign for my site, and this is one of the ones I saved as inspiration. I love the header, and I love the organic feel without it being overwhelming. I also adore the little details like the arrows for the screenshot here: http://www.subdued.net/breaking-the-silence and the custom underlines.

    Like Kyle said, I’d love to see the headers in a darker, more crimson red; they’re a little too vibrant. The header on the left, that red is a touch more subdued and I think much nicer.

    Overall beautiful!

  4. Benek

    This site blew me away. Such a beautifully executed use of grunge and type. A+