Grow your CSS skills. Land your dream job.

Site Recoding – Up to Standards Finally!

  • # September 30, 2009 at 1:55 am

    This week I’ve been working on recoding my neighbor’s small outfitting businesses website, ensuring that it meets W3C standards and validates, adding a little polish and cutting some file-sizes to speed it up a bit for those of us still stuck on dial-up connections.

    In addition to just cleaning up the code, which previously used tables (not my doing), I added a few bits of polish all ’round. I had already implemented a nifty jQuery slider banner, so I started by re-writing the menu, using an example posted by Soh Tanaka on his blog as a starting point (thank you, good sir), to eliminate a bulky external JavaScript file as used by the old menu. It is now almost 100% CSS, only needing jQuery for IE6 and older.

    I also revamped the company logo, opted for image replacement for the page headings to get a nice inset style to the type, gave the site a bit more depth in FF and Safari by adding a box-shadow to the content area and a background gradient to the body, and trimmed fat where I could to increase load times.

    Still to do: tackle the contact form styling and functionality, adding JavaScript for background labels and client-side interactivity/validation and writing a custom PHP mailer with server-side validation.

    Let me know what you think of the overall design, layout, and any details you think pertinent! I’m all ears and open for constructive criticism here. This site is a constant work-in-progress, and we want it to be the best it can be.

    Link: Pine Mountain Adventures

    # September 30, 2009 at 4:52 pm

    You’d be amazed at how much better a drop shadow looks when the opacity is turned waaaaaaaay down on it. Subtlety is so key in the design of any website!

    # September 30, 2009 at 9:00 pm

    like it, didn’t notice the shadowing until I looked at site in FF

    like the navigation, like the way the multi-level nav is handled

    Al

    # October 19, 2009 at 7:39 pm

    If you don’t mind reactions from a noobie…

    Professional, clean look. Good color palette. Good typography.

    Nice graphics in the header. But I find the scrolling to different image sets more distracting than attractive.

    10 items in the nav area seems a bit much. Maybe separating them (Corporate, About Us, Contact Us, and maybe Educational could be grouped together) and placing the less critical ones elsewhere would might make the main tabbed nav area seem less intimidating, more inviting.

Viewing 4 posts - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".