June 6th, 2007
CSS Progress
A few notable websites that I have switched over to CSS layouts:
National Swine Registry - This one was a challenge because they have one URL, but wanted it to look like three separate sites: the National Junior Swine Association (NJSA), International Marketing, and the main site, National Swine Registry (NSR). It came to me as a table design, with image-as-text for all of the navigation, many broken links and the GoLive site file used as a dumping ground to organize every file ever associated with NSR. Cleaning up the site file, broken links, changing out the image navigation for text, and creating a clean CSS layout took five days, including browser-specific testing and proofing to the client. This has been my longest tables-to-CSS project to date.
Kentucky Angus Association - This one was fun. I designed this one in Photoshop as a mockup, then no longer needed the mockup. The borders and block colors are all CSS. The only image element used in the design for Kentucky is their logo, incorporated in the header. They knew their target audience, and instructed that I make the site “as accessible as possible” for their aging audience, hence the large font sizes and ample line spacing.
New Mexico Angus Association - I designed this one and created the CSS layout. It was a refreshing project because I spend the majority of my time doing updates to our current websites (cleaning up the garbage as I go along) or I am rebuilding them, getting rid of the tables. The New Mexico Angus Association website was among the first fluid CSS layouts I created.
Louisiana Angus Association - Another tables to CSS project. What made it one of my favorites was trying out SWFObject, an answer to the Internet Explorer “Click here to activate” annoyance. Using CSS and SWFObject on the Flash banner ads made the site feel a little more coherent, rather than broken up into “Click here…” pieces. It was also the first website I used AJAX to build their membership list. Tim found an AJAX recipe that solved the membership problem beautifully. Now managing their membership list is less painful. (Look ma! No giant-long-scrolling-single-membership-page anymore!)
Woodland Farms/Woodland Alliance - This was one of the first websites I switched to CSS. You can tell it is one of the first because I still wrote ‘div’ in front of my id’s, to train myself to identify the tags, selectors, and divs I was styling.
On my to-do list
American Angus Auxiliary - they have picked a look, but I have not had time between other projects to slice it and build it.
Gardiner Angus Ranch - they have over 1,000 pages, and an old Flash site too. When the other projects slow down, I will be combining the Flash site and the static HTML site: a Flash intro you can skip, and the static HTML site for the main content. I am rebuilding their design from scratch (the original Photoshop file is nowhere to be found), with a few additions and changes needed to make it a fluid layout. This will help modernize their design and give it a fresh face without sacrificing their current corporate identity.
Tags: Projects, web design, web dev