Grow your CSS skills. Land your dream job.

Where To Start?

  • # July 15, 2008 at 6:50 pm

    Out of curiosity after a psd image is created, where do you like to start? I haven’t done a ton of sites and I always find myself starting differently. Laying out containers, or buttons , nav bars, I guess I never start fresh it is always off of the last and start changing around. I do CSS sites but I often cheat and see the last layout as a good start for the next. But then I have tons of CSS that I don’t use and don’t want to get rid of because it might be holding something in place or something. Like I say I am new to the process.

    How do most of you start ( those of you who don’t speak code as a second language)? Maybe a basic templet?

    Here is my last finished site http://latstudio.com/

    p.s. The php was a cheat to I don’t fully understand what I did, I just changed to match what I needed.

    # July 16, 2008 at 3:27 pm

    I think overall page structure is the best place to start. Look over your graphic mockup and look closely at how you can describe the areas as semantically as possible. Are you going to need a page wrap? Is there a header section? main navigation? main content area? sidebars? footer? Then try to write the HTML for those things first, then worry about the details.

    # July 16, 2008 at 5:18 pm

    Totally agree with that. See it as building a house. You start with the fundaments (for example a pagewrap) and there on you start building the elements (header, content, sidebars, footer etc.) I always start with the structure in xhtml and halfway doing that I add the css and eventually in the end the javascript.

    # July 17, 2008 at 4:43 pm

    I start with the absolute most basic page structure before I do anything else. I don’t do any styling at all until I have the underlying structure completely nailed down.

    Start off with a very clean, defined, and organized structure, and it’ll be MUCH easier to make large-scale changes further down the road. I’ve learned this through a lot of trial and error, where my initial structure only worked within a very limited scope because I didn’t consider any future changes.

    For example, say you’re designing a site and it has five main navigation items. Don’t assume that the site is only ever going to have five, and then base your site structure on that assumption. If at some point in the future you suddenly need to have eight, then you’re stuck. You’ll have two choices: attempt to rework your whole structure to fit in the extra items (which is time consuming and will make your code really messy), or scrap the whole thing and rewrite it (which is easier, but it also means you just wasted a ton of time writing code you’re not going to use anymore).

    Flexibility and scalability are key! Once you’re sure your structure can handle those issues, then go ahead and start styling everything.

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".