Solved

How to turn a. .jpg image into a .html web page?

Posted on 2009-04-09
3
1,215 Views
Last Modified: 2012-05-06
I'm "fishing" with this question ... I just purchased Adobe Web CS4, including Photoshop, Fireworks, and Dreamweaver.  (I'm a network administrator, not a web site designer, but I want to learn web site design as quickly as possible.  I know I need to do the tutorials on all the products, but ...)
Can someone help me get started quickly by telling me the general procedure for taking a .jpg image and turning into a semi-transparent layer to serve as the background for a web page?
I think I need to start by opening the .jpg in Photoshop, but I can't see the option in Photoshop to save as .html.  I can see "Save as .PNG".  Then I can open the .PNG file in Dreamweaver, but it comes up as a white page.  Or I can open it in Fireworks, but that doesn't have the option of "Save as .html" either.
Thanks for any tips.
0
Comment
Question by:Dwight Baer
3 Comments
 
LVL 8

Assisted Solution

by:MrMintanet
MrMintanet earned 50 total points
ID: 24111919
So, you're wanting to know how to make a web page?  Right?
0
 
LVL 16

Accepted Solution

by:
glenn_1984 earned 450 total points
ID: 24111979
For tutorials go to tv.adobe.com

To do what you asked above:
Open the .jpg in Fireworks.
Click on File, Export
On the Export line click the down arrow and select either
html and images
or
css and images.

That will do want you want and you can edit the html in Dreamweaver.

However, that is really not the full story.

For example, if your .jpg is large, you want to create sliced in Fireworks first.
Then you can export as above along with the slices.
Slices create smaller .jpgs that fit together so the web page loads faster.

0
 

Author Comment

by:Dwight Baer
ID: 24113360
Thanks, MrMintanet and glenn 1984.  Yeah ... I know how to make web pages, but what I was looking for was some hints with regard to how the various Adobe Web CS4 products work together.  You've given me a start ... I expect tomorrow I may be asking some more specific questions.  Thanks again!
0

Featured Post

DevOps Toolchain Recommendations

Read this Gartner Research Note and discover how your IT organization can automate and optimize DevOps processes using a toolchain architecture.

Question has a verified solution.

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

Suggested Solutions

This article describes how to create custom column layout styles for Bootstrap. The article uses 5 columns to illustrate the concept, but the principle can be extended to any number of columns.
I've been asked to discuss some of the UX activities that I'm using with my team. Here I will share some details about how we approach UX projects.
The viewer will learn the benefit of using external CSS files and the relationship between class and ID selectors. Create your external css file by saving it as style.css then set up your style tags: (CODE) Reference the nav tag and set your prop…
HTML5 has deprecated a few of the older ways of showing media as well as offering up a new way to create games and animations. Audio, video, and canvas are just a few of the adjustments made between XHTML and HTML5. As we learned in our last micr…

912 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

25 Experts available now in Live!

Get 1:1 Help Now