For the most part, I do the same thing.
Lots of pros use templates. They already have the tables laid out, and they plug the graphics/text in the corresponding boxes.
I look for inspiration at coolhomepages.com
I start out thinking about the design for a couple of days. Once I think I have focus I get down and dirty in photoshop. I try to visualize the site before I start working. Not much changes from my head to computer.
I like to jot down ideas for colors and layout and fonts. I try several on paper first. Mainly I use 1/10" graph paper to do rough layouts. Then I use Paint Shop Pro for layouts and graphics to see how it looks on screen. Once I have my look I create my template.
I usually take 2-3 days of thinking ang jotting before I work on the PC. Once I have enough templates I plan to save time on design by re-using the good ones
I draw out the whole site/concept on paper with me bare naked hands. ;)
first I liase with everyone else involved and set the priorities of what the site should achieve
next I decide how users will need the content to be shaped and arranged...then I draw up a site map...and chop the content into page sized chunks
then I mark up the content conceptually using html 4, from here on html 4 strict, though up until recently I used transitional
now I have the basis of a working site that can't fall apart unless I do something badly wrong
at this point I'll work out how some of the page elements should work visually (and aurally etc)...some of this will be dictated by the intention of the site, some will be down to context...I also decide on an overall look
I then apply styles...first getting the overall look working both in a linked and in an imported stylesheet, the latter for Netscape 4 et al...next putting the page elements together, first in the linked stylesheet, then as far as possible in the imported one...finally I'll juggle the styles around until I'm confident that it holds together for all pages in most circumstances, and is always usable
now any scripting gets added, unless it was fundamental to the whole operation of the site, in which case it is part of the earlier process
finally I test and tweak in a range of browsers
Would these sites be designed for clients? or just for fun...and how many clients or sites do you work on at once?
I can never seem to work forwards or in the proper order!
I use Dreamweaver, but I never use the layout feature, nor do I ever lay out a whole page or site in Photoshop. It ended up just wasting me a lot of time on designs I never seemed to stick with.
I now go straight to the html/code view and go. Inevitably, usability and html limitation issues get caught faster that way.
I try to be me--the designer, for a spell, then my average user, then my boss, and back to me again while making design decisions.
I do pay for my method with some glitches and a little uneavenness, but it's mostly due to my lack of testing time, and given my understanding, non-profit audience, I like the trade-off and less 'static-feeling' results.
I am a small fry. Most I have worked on at once was 3 sites. Every site I do is fun, I really enjoy web design, and I get paid to do it!
>>I now go straight to the *code/design* view and go.
<<Would these sites be designed for clients? or just for fun...>>
Tim - welcome to Webmaster World. As to your question above, I don't think you will find many people on this board designing sites for fun :)
Although they may try to have fun while still making a living.
As to your question that started this thread, I start by working out what the site needs to do and mapping a flow plan on paper. I give that to my artist (along with any existing key graphic and text elements), and she works out some drafts in Photoshop, then after client approval it moves on to the code guy.
For me, web design is much tougher than brochure design. Brochures have a set starting and ending point, and a straight path through. Web sites are much more complex, and sometimes I have trouble making sense of some of the complexities until we get some working links in place. Maybe I just don't visualize well :)
This approach works fine for my little marketing/consulting practice, but I don't do the volume or size of site that many on this board undertake.
Obviously, it depends on your resources. If you can afford a snazzy artist and a pro coder, that's very different than if you have no budget and are expected to be the all-in-one gal/guy. I think there are a lot of us out there in the latter position. In which case, it's important to come up with a strategy that suits your working style and limitations.
I currently deal with over 300 clients. Many of them come back each year for redesigns and updates. I'd say I deal with 10-20 clients on a regular basis, updating their sites everyday.
I basically start the layout in photoshop, and the client approves the layout, then I program it with dreamweaver and if there is any database stuff i send it over to their department where they handle that side of it. I'm just trying to get a feel for what other designers are going through.
I've noticed not all web designers program what they've designed...talk about a nice commodity!
300 Yikes! how do you do it!
For in-house stuff, I do a lot of print screening from browser windows. I just am addicted to seeing the page actually work before offering up anything as an option. For re-designs, I love ripping to shreds existing working pages in Dreamweaver and saving different options of working pages. I guess my lack of ability to predict how nav design will feel in a new overall design, makes me have to work this way.
<<I've noticed not all web designers program what they've designed...talk about a nice commodity!>>
Coding and designing take such different skill sets and personality types - I think it is a really unique person who can do both well. I think as technology continues to change, and the demands on both the code and design side grow, doing both well will only become more difficult.
I'd have to agree...I'm tired of having to design and code. If I only had to deal with designing and the coder had to code it the way I've designed it, it would be a better position to be in. Trying to learn the latest coding techniques (CSS, DHTML, XML) and keep up with them changing just takes away from design time.
> If I only had to deal with designing and the coder had to code it the way I've designed it, it would be a better position to be in.
Easier for the designer maybe, but not necessarily for the client. I think you bring great value by knowing HTML as well as design - and staying up on CSS, XHTML etc. means that you won't paint the coders into a corner.
I think a coder should never have to "code it the way the designer designed it." It takes a lot of teamwork [webmasterworld.com] to create a top-notch final product.
Tedster - I just think the two skills are very different, and I prefer to have a designer and coder. I also expect the designer and coder to work in concert to make certain the end result is the best possible site for the client. My designer and coder are husband and wife, so they really work VERY closely together.
As far as designers knowing CSS, etc, I think it is crucial that the designer know what is possible - making it a reality, in my opinion (humble though it may be :)) is better left to a code guy or gal.
I prefer to do both design and code. But if I had to choose between them, for any particular job I would prefer to code. T0 take an idea and make it reality is where the action is at for me.
I believe if your design and code and database, etc are handled separately that each should be a master in their field and have novice to intermediate skills in the other fields. It helps in team planning and team work. It also provides opportuntity for cross training and creates the ability to have primary and secondary teams so if someone leaves the team you have a backup in the interim while looking for their replacement
I personally got into building websites from a 100% designer perspective... and now that I've learned a fair bit about HTML, CSS and other code stuff, I can't imagine letting my design ideas get turned over to a separate coder!
My knowledge of coding has influenced my design style in ways I never would have experienced had I been left alone with Photoshop and my sketchbook... my whole understanding of design in general has expanded in previously unimagined directions. At the same time, wanting to make a difficult design "work" has forced me to expand my coding skills in more different directions than I ever would have gone, if I was just handed a pre-designed site to code. I personally HIGHLY recommend to any designer to get your hands dirty with some code, if only to expand your design perspective.
I start out with pencil sketches of page layouts, and colorblocks in photoshop, and do some multi-page structural diagrams on paper... Then I hop into Photoshop and build my basic graphics elements, open up golive to try sticking it all together, go back to photoshop to tweak sizing, color, etc., and sometimes go back to the sketchpad if I get really stuck on a layout... and on around in circles until I have a site done. (I left out the bit about beating the pre-written perl scripts into some kind of shape that fits with my layouts... that's always fun!)
The whole process is a really exhilarating combination of art and puzzle solving, once I really get started on a site... especially once I got more into integrating cgi scripts and learning CSS.
I do a lot of sites for musicians. After an extensive interview trying to extract exactly what they are picturing, I start with the photos and artwork they give me and build from there. I try to match the mood of their music as well as what they *think* their image is.
Also, I learned XHTML and CSS from the start and code everything by hand. All of my sites are completely liquid.
antedote - bet you didn't do bowie's or jagger's.
If I did I wouldn't own up to it LOL.
> My knowledge of coding has influenced my design style in ways I never would have experienced had I been left alone with Photoshop and my sketchbook
That's an important statement. I hope that art schools start teaching HTML if they don't already. It's all part of knowing your media.
Would a painter complain because water color paper won't hold up under oil paints? Doesn't a charcoal artist know how to leverage the textures of different papers?
Just so with the web - knowing the medium makes you much clearer about limitations AND possibilities.
Mivox, I can think of a few people I'd like you to talk to!
I'm a lay it out on paper kind of guy. After I know what it's supposed to look like, I get to work on the graphics using Fireworks and Photoshop. Then, I create tables using Dreamweaver to facilitate my paper design followed by plugging in the new images and then adding the copy.
I like to work with raw data/content first..layout a bare bones structure..get a feel for how the database/cart/static pages are going to bulk, link and flow...and then I put a face on it.
I think they call it "form follows function".
I create the site first. Then I worry about design.
I can dress the content up in a dress I want. But it helps to see what you are dressing before you go off making dresses.
Photoshop is the first thing - sometimes I have nothing in mind when I load that... BOOM, in some hours I have PRETTY NICE CONCEPT :)
Sometimes that comes from long thinking.
But that is when the site is simple - design + content and that is all!
When that is a complex project, then approach is different - planning, design/layout, programming, design change... And content during this time!
I'm a coder with a reasonable design sense. I won't say I'm a designer (I know better) but I know good design when I see it and can dictate what I want to someone who can execute it. I can even bull my way through simple designs but I can't create top notch designs and hire someone to execute these.
Now that you know this. My approach depends upon the complexity the client is after. If we're talking about a complex site - I'll take it to paper first with colored pencils. If it's a relatively simple job, then I'll start right on screen either in Fireworks, Illustrator, Photoshop or DW.
I tend to go with the skills I have, I'm no artist but have a good sense of layout, useability and accessability so usually start with in this direction:
Good long chat with all involved.
Some of that is in the wrong order to how it /should/ be but the clients I deal with don't usually have a clue untill they see something on-screen so to get the ball rolling I do some prototyping and take it from there.
My designs tend toward simple, as my art skills are rather basic: It's the programming and css layouts that get me going :-)
| This 48 message thread spans 2 pages: 48 (  2 ) > > |