Sitening Launches Newly Designed Family Resource Website

Sitening just launched a redesign of FamilyResource.com. It's a significant change from the old site. The layout and colors are much more mom-friendly, and more attention was given to the actual design instead of just the content and ad delivery.

Before

After

It was important to our designer to try to keep the typography that she chose, while it was also important to me to make sure anything that was a title used header elements (H1, H2, etc...). In order to have the best of both worlds, We used sIFR for several of the headers, which enabled us to preserve the two fonts that were not web-friendly (Futura Book and Mrs. Eaves). sIFR uses Flash to render the headers in the chosen font, and it works okay as you'll see, but when you apply it to several items on a page, like on the category pages, it slows down the rendering a bit — especially on Safari. The next version of sIFR (sIFR 3) is currently being developed and it's supposed to be a lot faster and more flexible.

Another cool aspect of the site is the use of CSS and modern code techniques. For example, if you go to an article page like this one and do a Print Preview, you get a perfect article print out. Since CSS allows you to specify both Screen and Print media types, and because the HTML code doesn't use tables for the layout, we were able to turn off and on blocks of content and print out a perfectly formatted article without any navigation, ads or unnecessary styling.

Screen View of Article

Print View of Article

Lastly, on the article page, we use a subtle AJAX feature for emailing articles to friends. If you click on the email this article to a friend link to see how it works. For more AJAX form goodness, send it to someone (or yourself) to see how it handles it.

Email Form After It Opens Up