954,604 Members — Technology Publication meets Social Media
Username:
Password:
Lost login information?
Have something to say? Contribute New Article Reply to this Article

Designing website as a graphic - any hints?

A couple of months ago I learned that many web designers lay out an entire web page in an image editing program first , then slice it up, insert in tables, etc.

My understanding of how to do this is quite limited but I am getting a few website jobs and think I really need to learn and get an handle on this. Can any one offer a few tips, hints or references?

Some of my initial questions would be:

- is there a standard size to make the overall graphic (pixel width and heigth)?

- do you insert individual slices as a foreground or background objects, or a combination of both?

- do you make rollovers right in the graphics program using layers?

- how do you add text? Do you allow for the text area (using white space) in the image, then slice it, delete it and add text in Normal view of FrontPage?

If there are other basic questions I should have asked but failed to do so, please address them if possible. thanks in advance for any tips,

gail

btw, I use Photoshop.

Labby77
Newbie Poster
6 posts since Oct 2007
Reputation Points: 10
Solved Threads: 0
 

You are asking for trouble. Consider the following:

- Browsers have different-sized windows, depending on the user's preferences and the screen resolution used.

- Some people can't read text superimposed on a textured or photographic background.

- map or ismap tags must be used to define clickable areas. This makes it difficult to make pages that work independently of the browser window size.

MidiMagic
Nearly a Senior Poster
3,319 posts since Jan 2007
Reputation Points: 730
Solved Threads: 182
 

Yes, first we design the layout in softwares like photoshop. I personally use photoshop.

I prefer to design at 800x600 width because its fits to any resolution size. I will suggest the same to you. And if you want a fixed size of your layout on all resolution then its totally optional.

Using Images as foreground or background totally depends on the object in which we want to use the image. Say if we have a glossy button with the same pattern, then we will just use a 1 pixel of its width and then apply in cell background. In this way the size will be less and page will load more fast. ......So there is mix use of images in foreground and background.

You have to prepare the images for the rollover in graphics program and then implement the rollover dhtml effect or javascript to run it on site.

- When slicing the text are left blank and don't use the white space just provide the width to cell where to want to put the text relative to the image(take size of the white space where you want to put text).

I hope you will surely go great in web design and wishing you a very best of luck

innovativeatul
Junior Poster in Training
72 posts since Dec 2007
Reputation Points: 3
Solved Threads: 0
 

This article has been dead for over three months

Post: Markdown Syntax: Formatting Help
You
View similar articles that have also been tagged: