Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations Mike Lewis on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Design Tips Needed

Status
Not open for further replies.

power97

Programmer
Sep 17, 2003
67
CA
Hi,
I am redesigning my site and want to know what other people do when designing a site from scratch. Do you use a graphics tool such as Photoshop to design the page template and then go from there. If not , then what ?

Thanks

 
That's what I usually do... come up whith a look and feel in Photoshop... cut it up as needed in Photoshop... then start building the back-end

[conehead]
 
Although I code the real page directly in html, I make a prototype in Dreamweaver layers. At least it's good for something ;-)
 
It all depends on the front end of the site.. is it going to be graphics intensive? If so, I will design the basic look in Fireworks or Photoshop, slice and dice and then bring that all over to Dreamweaver. ( is an example of this).

If the site is going to be more HTML intensive, then I will create a basic graphical logo or header and lay that out on the HTML layout, and concentrate on building the CSS for the site.

When in doubt, deny all terms and defnitions.
 
I do all my work in photoshop, dreamweaver, illustrator, fireworks and sometimes flash. My personal preferences are: I like nice looking sites and I will not sacrifice quality of images -- So my sites are medium to possibly heavy but always optimized.

Most hovers and color tricks and what not i do in the browser rather than make images -- Ie hovers, some drop shadows.

i dont really slice anymore for most parts. I draw out a layout on actual paper then create my table--either 3 rows or 3 columns. then i nest from there. Then once layout is done i create styles. Im still using tables but i will make my first css only site within the next year.

all my hovers are css only -- unless it must be images. I also like lots of open space and white -- i try to do text dark on white 90% of the time. Easiest to read. And since i got into php about a year ago i feel like the 2 years i was doing this before then was a waste. It really helps make life easier.

<Signature>
Sometimes the Answer You Are LOOKING for can be FOUND BY SEARCHING THE FAQ'S @&%$*#!!!
</Signature>
 
For general design tips, I recommend you have a good read of the links in Web Design Layout Guidlines (thread253-628329).

Depending on your level of skill with HTML/css vs photoshop you can either start with your basic HTML & CSS template and add graphics as needed, or design a big picture of your site in photoshop and then chop it and make it in HTML.

I would recommend the former, as you tend to end up with more liquid, flexible layouts. IMO - better ones :)

Posting code? Wrap it with code tags: [ignore]
Code:
[/ignore][code]CodeHere
[ignore][/code][/ignore].
 
I also create the site first in Photoshop, getting all the elements I will need ready and positioned how I like them. Using the layers in Photoshop makes combining all your elements very easy and allows you to quickly create the individual images for the page as well.

Once I'm happy with the layout I cut the page up as needed and use Dreamweaver to create the main tabular layout for the site. I find that being able to visualise the page in this way makes settings up my tables much easier.

With the general page layout complete I tend to move onto hand coding for adding the text and images. I also take the time to tweak the code to finalise the layout and fix any obvious errors.

It's all down to whatever works best for you. I like to visualise the site first and see if it works and Photoshop lets me do that quite quickly. Other people prefer to jump straight in and get the tables laid out before creating the images to be placed on the page.

Steve Gordon

Steve Gordon
 
I prick around with designs in MS paint, very basic and simple, good enough to copy and paste different types of layouts, menu bars etc which I have an a screenshot library. When I find the basic look I want I hand-code a draft in my editor. If it's still what I want I recode from scratch and fine tune otherwise back to the drawing board.

What I found useful was building the aforementioned library of screenshots, gret for getting ideas. I also save all sorts of templates which I have worked on over the years.




<!--#sig value=''É'' url='' -->
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top