Solved

Creating a layout using image.

Posted on 2004-04-15
7
180 Views
Last Modified: 2010-04-06
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
0
Comment
Question by:dkin69
7 Comments
 
LVL 30

Expert Comment

by:weed
ID: 10838762
A layout for what? Web? Print? Is it a brochure?

Your applications of choice could include Photoshop, Image Ready, Dreamweaver, InDesign and others.
0
 

Author Comment

by:dkin69
ID: 10839129
A layout for my web site. I would like to make round looking layouts as they did on http://www.omahazoo.com 
0
 
LVL 30

Expert Comment

by:weed
ID: 10839249
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
Networking for the Cloud Era

Join Microsoft and Riverbed for a discussion and demonstration of enhancements to SteelConnect:
-One-click orchestration and cloud connectivity in Azure environments
-Tight integration of SD-WAN and WAN optimization capabilities
-Scalability and resiliency equal to a data center

 

Accepted Solution

by:
whitexican earned 250 total points
ID: 10840980
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
 
LVL 9

Expert Comment

by:j3one
ID: 10856582
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
 
LVL 19

Expert Comment

by:webwoman
ID: 10859987
You can also use Fireworks, though you might want Photoshop as well if you're working with photos.
0
 
LVL 1

Expert Comment

by:QLJ
ID: 10897318
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

Featured Post

Free Tool: Port Scanner

Check which ports are open to the outside world. Helps make sure that your firewall rules are working as intended.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
What languages and tools i need to use to develop Teen Patti game. 9 617
video on my landing page in Wix 1 83
best online free website 29 133
Free stock image website 3 119
Many programs have tried to outwit PowerPoint in terms of technology and skill. These programs, however, still lack several characteristics that PowerPoint has possessed from the start. Here's why PowerPoint replacements won't entirely work for desi…
Technology opened people to different means of presenting information, but PowerPoint remains to be above competition. Know why PPT still works today.
Not only does Prezi allow you to create non-linear presentations, it also makes it easy to apply transition animations between your frames. Learn how to apply a fade-in transition to select items and entire frames in this tutorial Select "Edit Path"…
Learn how to use the remote presentation tool in Prezi to allow you to harness the power of this cloud based presentation platform. You can show your presentation with a remote audience using this free tool.

830 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question