Every now and then a project comes along that just makes me so glad to be doing the things I do. Don’t get me wrong, I enjoy my work. I even look forward to jumping out of bed and starting my day. But sometimes a project is just truly exceptional. Recently, I had the honor of working on just such a project with the brilliant folks at Happy Cog.
From Housing Works’ about page:
Housing Works is committed to ending the twin crises of AIDS and homelessness. We believe that all people have the right to a rich and empowering life. Since 1990, we have provided the highest quality services for homeless men, women, and children living with HIV and AIDS in New York City and beyond.
That’s a powerful cause, and it’s awesome to get to interact with and ultimately help those who are carrying it out. They are an awe-inspiring group of people.
With the excellent art direction of Daniel Mall, front-end development by yours truly, and Expression Engine development by the extremely talented Mark Huot we crafted the new Housing Works website that focused especially on the human side of their work.
For more about the project, check out the case study on Happy Cog’s website, and definitely make sure to visit Housing Works to see it for yourself.
All articles on this site are licenced under the Creative Commons Attribution Non-Commercial Share-Alike license. All design, code, etc are All Rights Reserved.
Icons by iconbuffet and FAMFAMFAM.
Be Good Not Bad is all about really good web design, based on the utmost respect for web standards, accessibility and respect for the user. Based in Denver, Colorado, Be Good Not Bad is run by Brian Warren, freelance designer, blogger, homebrewer and coffee nut.
Very awesome work, sir! The full bleed photo on the front page is really striking and inviting at the same time.
§ By Vance Reeser at 10:37pm on October 16 2008
Thanks Vance! Refresh a few times on the homepage to see a variety of those really excellent photos.
§ By Brian Warren at 10:43pm on October 16 2008
Amazing work as usual Mr. Warren. Really looks good.
c
§ By Charles Plath at 9:44am on October 17 2008
Wonderful job, Brian. I’m thoroughly impressed!
§ By Luke Dorny at 10:34pm on October 21 2008
Brian, was there anything particularly challenging about coding this design?
§ By Greg at 8:00am on October 24 2008
@Charles & @Luke Thanks!
@Greg: Great question. Yes there were a few areas that were challenging. As you can imagine, much of the challenges surround our friend IE6
1. There are a ton of translucent effects throughout this design. The header, the navigation, those white boxes, etc. If you take a peak into my IE6 css file you’ll see extensive use of the magic filter. IE6 + Image Replacement + Translucent PNG + Navigation Hover & Active States = Lots of extra IE6 code.
2. The email newsletter was a fun challenge. If by “fun” you mean “wow you thought testing in a few browsers is annoying?”. I hadn’t ever done a richly designed email template before, so that one was something new. It sure made me appreciate the web standards movement.
3. We used sifr a bunch throughout the site. Take the social enterprise page, for instance. We used it in the big “Social Enterprise” title, as well as the “Our Businesses” subheader, and the blue listing titles, too. Making the page flexible enough so that it can take long titles, short titles, listings without images, etc, all while keeping the markup and style as lean as possible, was a challenge for sure.
§ By Brian Warren at 8:42am on October 24 2008
That design looks awesome, will definitely be using it as a sIFR usage example!
That said, some improvements could be made. For instance, there should only be one sIFR.activate() call, but you can pass multiple arguments to it. Also try avoiding transparency, because it’s not always supported and causes various browser issues. From the looks of the design, you can just specify a few background colors. You should also specify the ratios for each font you’re using.
The sIFR version you’re using, r413, doesn’t always work in IE6 with older Flash players. Use at least r419, although r427 has some more improvements regarding visual jumpiness as the Flash is loaded.
§ By Mark Wubben at 4:49am on October 27 2008
Thanks for your thoughts Mark. If anybody would know about sIFR-related issues, then it would be you!
We’ve already handed the project off to the client but if there are any bug reports or a chance to go back in and optimise things, then I’ll know where to start. And I’ll definitely be keeping this in mind for future development.
Thanks for your work on the sIFR project.
§ By Brian Warren at 6:49am on October 27 2008
Great Job. Every people has the rights for a fair housing. Keep up the Good work.
§ By Housing at 12:30am on November 06 2008
This is a great design. Will probably be seeing this one on the galleries. Sometimes a good photo is half-way to a good design.
§ By Paul at 7:44am on December 29 2008