Jump to content
xisto Community
marijnnn

creating a simple webpage with photoshop! really easy

Recommended Posts

well, basicly, what you have to do is make your background in photoshop. you take just any picture, edit it as you wish, so you finally have the background for your website.then you save your picture and open imageready, which is delivered together with ps.you open your picture and choose the slices tool. you draw a rectangle for the area where your text should come. you can draw more of them if you want several text areas, for example: you want an area for some sort of menu and then you want a menu where the text will be. once you're ready, you choose 'save as html' in the file menu somewhere. now you'll have a html file and a folder with the image slices. open the html file and in the cell that should contain your text, you just start typing. your text will be in the right position and you'll be able to see your background. or you could open it with frontpage or words or whatever wysiwyg editor if you're not that good at html.see? it's really easy to make a good looking websitecheck http://forums.xisto.com/no_longer_exists/ to see an example. this one is a little mor advanced. the picture opens in a new window that has the right size and the text is opened in an iframe. but that layout is done just the way i described above.you can see the code by rightclicking just next to the border and choose 'view source'. feel free to use it. but please don't just copy it, try to understand it :)

Share this post


Link to post
Share on other sites

another hint, hehe:in photoshop, you have an option in the file menu called "save for web"choose it and then at ther right top somewhere you'll find an a little arrow that expands to a menu. in that menu, choose the 'file size' option'pick a file size of about 70kb and then take the 'auto choose jpg/gif' option thing.it will save to a file of 70 kb and try to make it look very good by choosing the best compression.really cool.the rest remains the same: open the jpg/gif file in imageready, slices, save as web,...

Share this post


Link to post
Share on other sites

I tend to minimize the use of images as much as possible but your guide is pretty good to me. We cin indeed create a nice site with photoshop but if we "abuse" it too much, there will be a counter-effect. Someone may not be patient enough to wait, wait and wait for your website to load and at last it turns out to be a gingerbread ! :)

Share this post


Link to post
Share on other sites

hehe, you're right. but pictures are cool when they make it look nice.pictures suck when you use 1246 pictures on one page.next to this, it's an unwritten rule that you shouldn't use too much animations to your site. they tend to irritate people.don't use pop up windows too. hey, maybe we should write down all of the unwritten rules in a new topic :) good idea if i may say so :)

Share this post


Link to post
Share on other sites

i'm pretty sure you can use the splice tool before you import it into imageready, if i'm thinking of the correct thing, if i'm thinking that the splice tool is that kind of blue box that you can make, then yea, i'm pretty sure you can do it in photoshop beforehand.

Share this post


Link to post
Share on other sites

you can use the slice tool in ps and then import it to imageready. it's all the same :)or you can download 'the gimp'. it has somewhat the same features.

Notice from moonwitch:
mentioning of illegal ways to obtain software is a violation of the TOS thus I have removed the reference
Edited by moonwitch (see edit history)

Share this post


Link to post
Share on other sites

thanxs i went there found some stuff i can use for my web site.

thanxs for the info.  but one more question there any way for me to build a site like gamespot.com and beable to get there source code and use and change and stuff????

<{POST_SNAPBACK}>

well, you could go to the 'view' menu of your browser and choose 'view source'

then you'll have the html, so you can fake the layout and stuff.

 

but if you want the coding, that's impossible. they use jsp i think and the only way to get that code is by asking them :) but if you want it to look the same, you just have to copy the html as described above.

then, in the html, you'll find some links to 'js' files and 'css' files. you have to copy those too. then, you'll have their layout. but i think it's easier to just start from scratch :)

Share this post


Link to post
Share on other sites

Hey marijnnn,I agree it all looks cool ; but do look at the other side of the fence, the grass is definitely not greener out here. You'll need a MBps connection to view these image only sites. And one thing for sure, you won't be able to edit your web pages easily and creation of DYNAMIC web page is not possible.By the way I tried out this idea on a project presentation on local HDD. and it surelu looked gr8. But guess it's an altogether different matter for WEBBye,Cool.techie

Share this post


Link to post
Share on other sites

why wouldn't it be possible to create a dynamic website with it? just have php/asp(.net)/jsp fill in the text inside the table, and you have a dynmaic website. make some parts into links and it'll work just fine

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

×
×
  • Create New...

Important Information

Terms of Use | Privacy Policy | Guidelines | We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.