Unmatched Style | CSS Web Design Inspiration and CSS Gallery

Trabian

Posted on March 16th, 2006 by Shane

You just know that the site of a Website Design Company for credit unions is going to be hot — smokin’ hot.

Okay. Maybe not. In fact, when I read Trabian’s About Us (”We help credit unions generate growth and connect with their members by building exceptional websites”), I seriously thought they were kidding. Credit unions? Bastions of great design. Who’s kidding who here?

Well, talk about distinguishing yourself in an undistinguished niche. Trabian is hot. The colors, the layout, the typgraphy — I love everything about this site. My particular favorite aspects are the mouseover bump-ups on the Recent Projects section, and especially what happens when you click them — and no, I’m not giving it away. You have to go see for yourself.

My least favorite aspect of the site is that someone else found it first :) Why would I still choose to highlight it here then? Well, three reasons.

First, it’s hot. Really hot. Did I mention that already?

Second, UMS should be a fairly comprehensive reference for great design, so it shouldn’t matter whether we’re the first or the last to highlight a worthy site.

Finally, being nice never hurt anyone. Check out part of Brent’s submission yesterday:

I thought I’d see if we could make the cut. If we don’t, and you have time, I’d also love to hear some of your negative feedback.

Since the only negative feedback I could think of is “why didn’t you submit to us first?” there was no reason not to feature him today.

(And yes, it’s perfectly fine to submit your own site — especially if it’s as hot (there’s that word again) as this one. Go ahead. Do it now.)

Thanks for clueing us in to your site, Brent! Fantastic work.

Tags: Blog, Graphic Background, Medium Background, U.S., Website Design Company

Rated 7.4 from 43 votes

More Opinions on Trabian

I’m a little on the fence over this design.

The screengrab of the site looks “hot” ;o) - but for some reason I don’t feel the same about it once actually browsing the site.

My first thought was “I’m lost”. Now I’m all up for websites breaking the conventions of design, but when I actually sat there and had to study the page to work out what to click on next can’t be a good thing?

Maybe it’s simply a case of things not looking how I’m used to in a conventional sense perhaps? For instance, the “About Us” doesn’t look or feel like an about us section. The only conventionally recognisable part of the page is the way “Recent Posts”, “Categories” and “Archives” are held in the narrow column in a very blog-esque way…

Like I said - I’m not sure what to think. Yes it looks quite pretty, but at the same time very unintuitive for me.

I guess I’m going to stay here on the fence a little while longer… :o)

– Chris
Chris, great comments. I’m a big believer that great design means great usability — a good-looking site is worthless if it doesn’t achieve it’s purpose — so intuitiveness is definitely as much a part of what makes a site great as the color scheme it uses. I didn’t have the same issues as you, but if you did, others probably did as well. Thanks for a great comment.

– Shane
I agree that it takes me a bit of hunting to know where to click next. I think that’s partly due to the index being a bit cluttered.

I’ve seen the pop up images before. Great effect but doesn’t “newly” impress me so to speak.

Having said all that, it’s a solid site. As are the pieces in the portfolio.

– meashman
I had much the same impression as Chris above. It’s very nice graphically, but seems a little cluttered. My first impression upon visiting was that there was too much packed onto the page, everything seemed to demand my attention at the same time.

Despite this, it’s still quite nice, and has it’s own thing going on.

– Chris Huff
okay … how the hell did they do that? specifically on the bit where you click the “recent project”

a) the translucency covers the entire viewport!!

b) the TRANSLUCENCE … it works in I.E … huh?

c) there appears to be some sort of progress bar while the project thumbnail image loads it appears to be translucent as well ..

off hand does anyone know, in general, how this hotness was acheived … sure I could dive into the code … but I’m sure it’ll be at least waist deep in there.

– Andrew Hicox
Hi Andrew,

I think this was the first place this techique (known as lightbox js) was discussed:

http://www.huddletogether.com/projects/lightbox/

It’s probably been discussed in much detail elsewhere by now :o)

– Chris
hmmm the Fav icon could be better :)

nice use of black glows , code is great , just how i like it :)
i don like that tiny red block , its too tiny and i cant read anything in there, its like i dont even see them when i look at the website.

also comments Background could be a better colour too

Overall nice job to you

– Sasan
Hi folks,

I just wanted to thank you all for your positive comments and constructive feedback. We’ve never really had the opportunity to be scrutinized by many other web designers, and you guys are pointing out the good stuff. Specifically, the A.D.D. factor of our site.

I’ve added a post on our homepage asking about this. Any ideas, ways you’ve dealt with this, or any other comments about the design will definitely very much appreciated. We’re definitely listening.

Thanks a lot.

– Brent
Positives:

- Lovely use of color and striping

- The header and typography are very classy

- Nice readable body font, decent lineheight

- Nice clean code

- The red / striped mouseover on the text header is very cool.

- I like the eye-catching design elements such as the “About Us” banner and the “Open Source CU” banner.

Potential improvements:

- Some accessability issues there when images are turned off, eg - the header becomes invisible because the background is all red (and the header is red), and many of the graphical sub headers become invisible (an image replacement technique might be of use here - http://www.mezzoblue.com/tests/revised-image-replacement/
Gilder/Levin Method and Shea Enhancement Method are most compatible for working with IE and Firefox)

- As a usability designer I think any website can benefit from a standard menu navigation bar, regardless of whether its content is echoed elsewhere in the site. In the case of Trabian I’d be thinking something along the lines of “Home - About - Blog - Open Source CU - FAQ - Contact Us”, etc. Users like and expect a navigation bar so why not give them what they expect :) Nothing else on the site would need to be changed but the addition of a menu bar (beneath or above the logo area for predictability purposes) would be a big help to users.

- I’m not a big fan of the left-alignment of web sites, as in this case, because users don’t position themselves at their desks to be best suited to view left-aligned web sites. This site would look no less impressive if it were center-aligned, and would benefit from meeting users expectation that most sites are center aligned. Regarding the background, either the red striped background could fill the page, or perhaps there could be red stripes on one side and a dark grey variation on the other.

Hope that helps Brent :)

– Harmony
Oh, I completely forgot, for Andrew if you end up using Lightbox JS (which rocks!) you’ll find some of the CSS doesn’t validate - a fix is available here - http://www.renegadezen.com/blog/article/79/valid-lightbox-js-image-viewer

– Harmony

Trabian

More Opinions on Trabian

Add Your Opinion

Sponsors

Search the Site

Latest News

UMS Interviews: Jina Bolton

July 30th, 2008 by Gene

Resources

Gallery Tags

Recent Readers