Design order question....

[SithLord2K]

When designing a site using html/php/css. what do you do first?? Which would make it easier to get done efficientlly??? Do the funtionality first then work on appearance?? or the other way around??

[.josh]

I try to start at "appearance," assuming you mean layout and what you are wanting the site to be able to "do."

[tomfmason]

Well first before anything I like to start by writing a site plan. Here are several things that may help.

When I first start I try and find out what type of visitor we will be gearing the site towards. There are three main types.
[list][*]Some one seeking information(most of this sites traffic)
[*]People seeking entertainment
[*]people seeking a product or service[/list]

Now you can have combinations of these types but you should figure out which one will be the main type of traffic.

Now you should read up on the physiology of color schemes and pick one that will be the best suited towards the type of visitor you are going to have.

Here are some nice links on the subject.
http://www.webwhirlers.com/colors/combining.asp
http://www.wetcanvas.com/ArtSchool/Color/ColorTheory/

Also, graphics should be a complement to your site not a distraction. When the end user visits the site they should focus on the content and not the graphics. Complex flash images will distract the user.

Now after I have worked out a color scheme, graphics and a basic layout. I then move on to the backend.

It will make your life alot easier if you write down all of the features that you will need. Here is a simple example.

1) Custom error handling system
  A)Functionality
      1)your functionality
      2)something else here
2)CMS(content management system)
  A)Backend
    1)functionality needed for the backend
    2)some more functionality
  B)Admin Interface
    1)dido
    2)dido
  C)End user appearance
    1)dido
    2)dido

Well you get the picture. After you have done that you can now move onto the Database Schema. Here is a nice example http://publib.boulder.ibm.com/infocenter/rbhelp/v6r3/index.jsp?topic=/com.ibm.redbrick.doc6.3/wag/wag35.htm.

Once you have all of that done you can move on to actually starting the developing of the site.

Hope that helps,
Tom

[SithLord2K]

Thanx, that helps a great deal, I have been writing down the things that I will want to include in the site and have a rough idea on the over all look or layout, those links for color schemes will help a great deal as well, that was my main point of hardship waas picking a good color scheme. I really appriciate all the info you have been able to provide.

If anyone else has anything to add feel free.

[.josh]

someone or other posted this link a while back, and I loved it so much I bookmarked it. It's great for helping you come up with a color scheme:

http://www.behr.com/behrx/workbook/index.jsp

[tomfmason]

It is important to be organized when designing a website. I recommend when you write down the features for your site, to use something like my example above. You should break it down like this.
section
 feature
   functions
 feature
   functions

so on and so fourth. Also, a poorly designed database will slow your progress down drastically.

Good Luck,
Tom

[tomfmason]

[quote author=Crayon Violent link=topic=113182.msg459836#msg459836 date=1162197774]
someone or other posted this link a while back, and I loved it so much I bookmarked it. It's great for helping you come up with a color scheme:

http://www.behr.com/behrx/workbook/index.jsp
[/quote]

Very nice. I will also be bookmarking that..

Thanks

[SithLord2K]

I have done the written part already :) I also find writing things down helps greatly with getting it done better and more organized. I'm loading that link now to find a color scheme and will be bookmarking it as well it's a great help.

Thanx to all who replied and advanced thanx to those who are yet to reply.

[jcombs_31]

I always think about the basics first.  Fluid vs fixed, where the menu will go, how many columns, etc.  Then I draw up a design in photoshop.  Then I break up the graphics and put them into the html/css.

[SithLord2K]

Does anyone have some good links for someone like myself who is very new to css to learn how to do layouts with it. I'm talking extreme basics to advanced stuff. I currently don't have the money to buy the books needed just yet.

[ober]

http://www.phpfreaks.com/forums/index.php/topic,79168.0.html

[Jocka]

hmm maybe i missed someone.. am I the only one that starts from the inside out? The first thing I do is the coding. After I've got the coding done THEN I start on the template. The only reason I wouldn't do this is if the site was needed ASAP then I would create the design and just put something like "feature not available" on some of the pages. But if I'm not rushed I'd rather start with the code. The way how I see it is like this.
(Metaphor like sentence coming)
Theres a beautiful woman infront of me. But I'm not gonna go for her if she's braindead.

[jcombs_31]

Jocka, design and functionality can be two different things.  Obviously if I'm writing a shopping cart I don't necessarily care what it looks like right away, so I'd probably write my base code first and figure out how I want it to look later.  But, designing a site I would say it makes more sense to have some idea of what you are building before attempting to build it.

[.josh]

I used to sell custom mini-blinds.  Okay stop laughing now.  Anyways, we had lots of different styles from aluminum blinds to pvc to wood blinds, etc.. We also had different 'grades' from basic cheap parts and limited colors (for people looking to replace broken blinds in their apartment) to high quality parts that will last forever, have better insulation, etc.. and I spent a whole lot of time memorizing every single little piece of information about all of the different products we offered. 

And when I first started trying to sell those blinds, I spent all day long spouting off all this technical crap about the blinds, trying to explain how much more insulation blind A provides over blind B, etc.. etc.. and customers generally yawned and walked away and I really didn't make a whole lot of commission at all.  It took me a while to realize that customers don't give a damn about all the technical crap. 

They don't give a damn what the parts are made of, where they are made, how they work, etc.. All they care about is that it [i]does[/i] work (which is just an afterthought, because the fact that it should work should go without saying), but more importantly, how cool it looks/does it fit the look of the rest of their house.  And then how much it costs. 

I would imagine that just like selling products in the real world, the design (including what it can do) is what gets the customer to throw their money at you.  I would think that they don't really care [i]how[/i] it works.. I can explain to the customer all day long how innovative and streamlined the code is and all they hear is blah blah blah. 

That is why I focus on the design first.  Customers are generally impatient and don't understand the work put into making things work.  If I start working from the inside and work my way out, and the client wants a progress report, no matter how many leaps and bounds you've made on the structure and code etc.. all they generally hear is blah blah blah all the while wondering where the hell their site is and you must not be doing a damn thing because they equate physically seeing the design as the end-all-be-all of building a website.

I don't blame them; people just look at things like that in general.  When is the last time you went to go nuke a burrito and thought about how your microwave actually works? Or do you usually just look at it as far as absent mindedly pushing some buttons and waiting a couple of minutes and it magically cooks your burrito?  Same concept. 

The point is, cater to the guy handing you your paycheck, not the other way around.  You'll make your life easier by doing so.