Solved

Creating a layout using image.

Posted on 2004-04-15
7
177 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
How to run any project with ease

Manage projects of all sizes how you want. Great for personal to-do lists, project milestones, team priorities and launch plans.
- Combine task lists, docs, spreadsheets, and chat in one
- View and edit from mobile/offline
- Cut down on emails

 

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

Better Security Awareness With Threat Intelligence

See how one of the leading financial services organizations uses Recorded Future as part of a holistic threat intelligence program to promote security awareness and proactively and efficiently identify threats.

Join & Write a Comment

I've been using this technique since Adobe CS2, and it should work with any version of Illustrator that includes the appearance panel. In this tutorial we'll create a button using the appearance panel in Adobe Illustrator, and then save it as a r…
Keep your audience engaged and get the most out of your next presentation with these quick Prezi tips.
In this Micro Tutorial viewers will learn how to remove an unwanted object using Photoshop’s feature known as content-aware fill.
In addition to being a great web-based presentation tool, Prezi also makes it easy to save your presentation as a PDF to share with others as well. Learn how in this tutorial. Select the share icon from the top menu in your Prezi editor: Select "D…

758 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

Need Help in Real-Time?

Connect with top rated Experts

19 Experts available now in Live!

Get 1:1 Help Now