Creating a web page using Photoshop?

F
Posted By
Funky
Nov 22, 2005
Views
285
Replies
3
Status
Closed
Hi people,

I have designed a game in Java, that can be played online. However, on the index page it’s too bland. I wanted to make the background creative. So i’m trying to use Photoshop to create the main webpage for me with cool effects, and put my game onto it so as to have a rather more colourful background. In photoshop, everything is in picture format (isn’t it?), and I was thinking of how I could use it as my webpage? Do I save it as a JPEG and then insert it in the HTML source code?

Any help will be handy.

thank you,
Funky

How to Master Sharpening in Photoshop

Give your photos a professional finish with sharpening in Photoshop. Learn to enhance details, create contrast, and prepare your images for print, web, and social media.

WK
William Kazak
Nov 25, 2005
"Funky" wrote in message
Hi people,

I have designed a game in Java, that can be played online. However, on the index page it’s too bland. I wanted to make the background creative. So i’m trying to use Photoshop to create the main webpage for me with cool effects, and put my game onto it so as to have a rather more colourful background. In photoshop, everything is in picture format (isn’t it?), and I was thinking of how I could use it as my webpage? Do I save it as a JPEG and then insert it in the HTML source code?

Any help will be handy.

thank you,
Funky
Why don’t you go to Border’s Books or Barnes and Noble and read up on this? There are plenty of books out there on Photoshop.
I use Dreamweaver, so I don’t create web pages in Photoshop. Did you search for Photoshop Tutorials on the web?
And,yes,you will need to save as web page to get your html for any "pic" you create in Photoshop.
William Kazak
http://www.williamkazak.com
G
gruhn
Nov 26, 2005
Why don’t you go to Border’s Books or Barnes and Noble and read up on this?

Because he has no idea where to start and would waste ages reading the wrong stuff in the wrong books.
G
gruhn
Nov 26, 2005
i’m trying to use Photoshop to create the main webpage for me with cool effects, and put my game onto it so as to have a rather more colourful

background. In photoshop, everything is in picture format (isn’t it?), and

Only "mostly." And depending on what you mean by "picture format."

I was thinking of how I could use it as my webpage? Do I save it as a JPEG and then insert it in the HTML source code?

That is the most simple and direct of routes. In the old days we did it like so

<BODY BACKGROUND="my.jpg">

That will still work, but kids these days have a new fangled "right" way to do it with CSS.

You’ll want your image to either be "kinda big" or designed so that it tiles nicely. I supposed you _could_ resize the browser to fit your image size, but then I’d have to scorn you. You _could_ run the game in a new window which is sized to fit. That would be a little less scorn-worthy. If you are getting in to CSS, you could use the background as only in the DIV which contains the game… Oh, and I think CSS has a no-repeat option (don’t forget to make the edges of your image "nice" and don’t forget to set a background color).
http://developer.mozilla.org/en/docs/CSS:background-repeat seems to be a fairly nice reference.

PShop also has image slices and ways to attach urls to image parts… All "stuff gruhn doesn’t know about." It’s there. I think it isn’t what you want.

PShop won’t do fancy Flash animations for you (I really really don’t think) but then, you’ve got a whole game going on, so I suspect you are looking for a static image.

Remember: if you get wild in PShop with layers and whathaveyou to save the image as a .PSD to work on in future when you decide to change the image as well as a JPEG for use on the web page. Actually, not even if you get wild. You’ll probably end up saving the JPEG out at least once as a "test" or "proof of concept" or "I just wanna see how it looks". You should (as a general rule) never repeatedly save and open a JPEG. Work on your master Photoshop file and save off JPEGs to.. display.

How to Improve Photoshop Performance

Learn how to optimize Photoshop for maximum speed, troubleshoot common issues, and keep your projects organized so that you can work faster than ever before!

Related Discussion Topics

Nice and short text about related topics in discussion sections