Creating a layout using image.

I am trying to create a layout using images. I do not even know where to start. First of all what program should I use. I would like to make something that looks like the green area at this webpage http://www.omahazoo.com could someone either tell me how to do this or refer me to a good tutorial that will walk me throught it completely
dkin69Asked:
Who is Participating?
 
whitexicanConnect With a Mentor Commented:
there is a way to tdo thie with Photoshop, I know Photoshop7 has it, but I cannot remember  if 6 or earlier offer this... :\

First of all desgin your layout the way you want it to look in Photoshop(buttons and all), then use the slice tool to line it all up. Basically you will be asking Photoshop to create your tables for you, once you have all the tables laid you go to file/save for the web and select all of your slices and ask photoshop to export them as images and html. Photoshop will create an HTML fiel and an images folder which will be used by the html file to create your page and your spiffy layout.

It is quite a pain in the a**, especially with buttons since you'll have to make them into their own slice thingy and then bring them into imageready and add the rollover if you want rollovers... but if youre dead set on the layout you can make it work. Just be careful no to create a ton of slices as this will create a slow and horrible loading experience for users that are on dial up.

Another simpler way is to lay out you background in photoshop, use the slice tool to export it all in different tables and then simply createyour own html arranging your images in their own table with no border, no cellspacing and setting the images as the table background, either eay it may end up being a bit difficult for a begginer HTML writer but with practive and patinece the niche of this can and is usally found.

I hope this helps you out. If you need more help or explanations let me know.

--whitexican
0
 
weedCommented:
A layout for what? Web? Print? Is it a brochure?

Your applications of choice could include Photoshop, Image Ready, Dreamweaver, InDesign and others.
0
 
dkin69Author Commented:
A layout for my web site. I would like to make round looking layouts as they did on http://www.omahazoo.com 
0
Get 10% Off Your First Squarespace Website

Ready to showcase your work, publish content or promote your business online? With Squarespace’s award-winning templates and 24/7 customer service, getting started is simple. Head to Squarespace.com and use offer code ‘EXPERTS’ to get 10% off your first purchase.

 
weedCommented:
Ok, first youll need Photoshop, which comes with ImageReady, and Dreamweaver for adding/editing content. Once you have those programs and learn to use them, which the manual will help you do, you wont need tutorials.
0
 
j3oneCommented:
If you look at the html you can see how to align it, and if o=you naotice the buttons, they are all the same button, with the text layer changed. Instead of making the whole thing in phtoshoop make your top part of the curve, and the buttons. the rest (top bar part and side bar part) are a small background, tiled to expand with the browser (table layered inside table) .... to learn, save the web site to your hard drive, open each of the images seperatly in photoshop, then experiment with saving over them to learn how to do it...
0
 
webwomanCommented:
You can also use Fireworks, though you might want Photoshop as well if you're working with photos.
0
 
QLJCommented:
right.. photoshop is the way to go. You need to master the slices and all, like the rest of them had said. But take note of how you slice them.. will determine the layout table on your webpage.
Anyway, start off by deciding WHAT you need to do, so as you can plan the size and all, size is an IMPORTANT factor. It will determine how neat the finished product looks after that!
That's all I wanted to emphasise here. Good luck!
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.