View Full Version : Question: Photoshop to 'Online'
Gerrard 17 31-01-2003, 04:34:AM Well, I want to design a website, and I sort of have an idea of what I want to make it look like...
But I need to design it all in Photoshop, so the question is... is there an easy way to transfer my design into a program like Dreamweaver, AdobeGoLive, etc. and then put it up, or do I basically have to make every single thing I want on the site seperately and then just put it together in Dreamweaver? :S
i remember someone on here talked about making a site in photoshop and then slicing it and coding??? huh? :S :S
::shinji:: 31-01-2003, 05:02:AM yeah dude, just decide what resolution you want to design for then make your layout image at that size. Use this site as a guide to see what size you should work at:
Website Browser sizes (http://hotwired.lycos.com/webmonkey/99/41/index3a_page2.html?tw=design)
* keep in mind that the heights they give you are for no vertical scrolling. you can pretty much make it as high as you want though if you don't mins scrolling.
Once you've made your layout and saved it as a jpeg or whatever, just add it as your background in DW. Then what I do is, I make layers in DW where I want my content to be, then place all my tables and stuff into them. Buttons and stuff can be made in image ready if you want..
Originally posted by ::shinji::
yeah dude, just decide what resolution you want to design for then make your layout image at that size. Use this site as a guide to see what size you should work at:
Website Browser sizes (http://hotwired.lycos.com/webmonkey/99/41/index3a_page2.html?tw=design)
* keep in mind that the heights they give you are for no vertical scrolling. you can pretty much make it as high as you want though if you don't mins scrolling.
Once you've made your layout and saved it as a jpeg or whatever, just add it as your background in DW. Then what I do is, I make layers in DW where I want my content to be, then place all my tables and stuff into them. Buttons and stuff can be made in image ready if you want..
i been looking for something like that for ages :f***:
:o
Gerrard 17 31-01-2003, 05:35:AM Cool, thanks...
I dont really need it to be high, since its just about me and my stuff, so there wont be news or anything (H)
but lets say I make it for 800 x 600... wont it be all messed up for people with higher resolutions, i.e. the image will repeat itself over and over? I could set it as background for a cell in a table, then it would be solved, but can i have multiple layers with different sets of tables? :|
do you know any websites with web-making tutorials?
and something that is probably very simple....... how do i make rollovers on text? :$
Originally posted by K-Man
do you know any websites with web-making tutorials?
and something that is probably very simple....... how do i make rollovers on text? :$
www.a1javascripts.com ....
www.hotscripts.com (go the java section ...)
they will help you out with rollovers and all the other useless **** you should need :)
Gerrard 17 31-01-2003, 06:23:AM ok, thanks, but what i need is really simple, there must be a command for that in Dreamweaver...
http://www.sgfantasy.com/index.php
i need what you got on the Nav Bar, that when you put the cursor over something, it changes color...
Gerrard 17 31-01-2003, 06:52:AM Would something like that be hard to re-create in Dreamweaver and make a real website out of it?
it would have some graphic ****e with it too, of course, but thats the basic template i'd like to use....
Originally posted by K-Man
ok, thanks, but what i need is really simple, there must be a command for that in Dreamweaver...
http://www.sgfantasy.com/index.php
i need what you got on the Nav Bar, that when you put the cursor over something, it changes color...
why didn't you say so :p
why dont you just rip the source from the site ....? :confused:
the whole menu thingy is in a table ... and i cant be arsed looking :p
-William- 31-01-2003, 07:21:AM Originally posted by K-Man
ok, thanks, but what i need is really simple, there must be a command for that in Dreamweaver...
http://www.sgfantasy.com/index.php
i need what you got on the Nav Bar, that when you put the cursor over something, it changes color...
Well if im not wrong those are CSS (Cascade Style Sheets) theres a window in dreamweaver were you enter them, but i really dont know how to use them :(
Originally posted by nicafifa
Well if im not wrong those are CSS (Cascade Style Sheets) theres a window in dreamweaver were you enter them, but i really dont know how to use them :(
they're not that hard ... I used to go using people's designs, editing them and learning from them ...
its much more fun then following tutorials ;)
I'm learning flash atm ... its so much better than html :p
PhiLLer 31-01-2003, 11:49:AM You can actually design a template in photoshop for 800x600 and still make it look good in Dreamweaver for higher resolution. What you have to do is slice up the template with ImageReady (which comes with Photoshop).
Example: Say you designed a simple web site with a banner and a navigation bar to the left and only used two colours, green and yellow and a grey background (yeh I know, not exactly nice colours:) ).
First you would have to slice up the banner and give it its own name (ie. banner1.jpg) then you slice up the navigation bit (ie. navbar1.jpg) and once you have saved them in photoshop you can now work on the site in DreamWeaver.
Well the grey background is not a problem in Dreamweaver, just make the background grey. Then you'll have to use tables and put the images (banner1.jpg and navbar1.jpg) into the tables.
It's kinda hard to explain but that's the best way to transfer a site template from photoshop to dreamweaver. There are certain bits you won't have to slice up, like a red bar across the bottom, you can do that easily in dreamweaver.
::shinji:: 31-01-2003, 02:29:PM Originally posted by K-Man
and something that is probably very simple....... how do i make rollovers on text? :$
the absolute easiest and best way to make a simple text-only rollover is to use the 'insert flash text' button in dreamweaver. When you click on that button in the tool bar, a window will pop up and there you can pick your font, font colour, rollover colour, link, etc.
::shinji:: 31-01-2003, 02:42:PM actually..another way you can make your site viewable in all resolutions is to have it open in a fixed window size. This sorta thing is frowned up by some people, and I'd never do it for a site like soccergaming.com, but for a design or portfolio site it's ok.
Just in case you don't know what I mean it's when you have your opening splash page but then when you enter the site it opens in it's own pop-up window at 550x700 or something like that. So, because pixels are the same size on every computer, 550x700 in a pop-up window will look the same for everyone, regardless of their resolution. If you design this way, you really have to plan ahead what and where everything will go on your site, because the downfall of doing it this way is that you really, really lose out on a lot of workspace.
have a table, 75% as its width ... and it resizes automatically with the resolution i think :S
cant remember, dont use stuff like that anymore ...
Julianinho 31-01-2003, 03:19:PM This (http://www.webclass.ru/top.php?top=21) site has some nice tutorials for want you want...
-William- 31-01-2003, 04:39:PM Originally posted by ::shinji::
actually..another way you can make your site viewable in all resolutions is to have it open in a fixed window size. This sorta thing is frowned up by some people, and I'd never do it for a site like soccergaming.com, but for a design or portfolio site it's ok.
Just in case you don't know what I mean it's when you have your opening splash page but then when you enter the site it opens in it's own pop-up window at 550x700 or something like that. So, because pixels are the same size on every computer, 550x700 in a pop-up window will look the same for everyone, regardless of their resolution. If you design this way, you really have to plan ahead what and where everything will go on your site, because the downfall of doing it this way is that you really, really lose out on a lot of workspace.
I personally hate those windows!:f***: But they might be good :)
Gerrard 17 31-01-2003, 04:47:PM im not worried about the size that much, www.sgf-liverpool.tk i designed it for 800 x 600 but it works good for everyone i guess...
the thing thats hard is putting my template into Dreamweaver :(
thanks for all the tips though, i'll try to do somethin later....
Gerrard 17 01-02-2003, 01:47:AM hmm.... another problem...
i made all the stuff i want on the website, but....
u know how u have to make curved borders or shapes in Dreamweaver, that you make two cells, you fill one with color and then in the other one you just put in a picture of the curve? well, the difference in color is really big... I used Photoshop to determine the color of the curve, and it says its 504740. But 504740 in Dreamweaver is totally different :| :(
I'm guessing that the amount of colors you can do in HTML is less than what you can save as JPG, but how can I find out what colors I should make my graphics, so that they match the Dreamweaver colors? :S
Gerrard 17 01-02-2003, 03:33:AM Ok, i think i solved the problem now... not sure yet though...
anyway, what do you think about this set of colors?
oh, and about the rollover text... its not what i meant Luis :( The Flash thing makes an image, and I dont need that, all i want is a simple change of color when you put your cursor over a link, like on www.sgfantasy.com nav bar:S
::shinji:: 01-02-2003, 06:14:AM Originally posted by K-Man
Ok, i think i solved the problem now... not sure yet though...
anyway, what do you think about this set of colors?
oh, and about the rollover text... its not what i meant Luis :( The Flash thing makes an image, and I dont need that, all i want is a simple change of color when you put your cursor over a link, like on www.sgfantasy.com nav bar:S
image? are you sure you clicked on 'insert flash text' and not 'insert flash button'? I'm still using DW4, so it might be different..
Gerrard 17 01-02-2003, 06:22:AM Originally posted by ::shinji::
image? are you sure you clicked on 'insert flash text' and not 'insert flash button'? I'm still using DW4, so it might be different..
yeah, it inserted text but it was like a flash image file, anyway im not gonna do that anyway, i made some rollover buttons which look pimped out (H)
im almost done with the nav bar now, i need something nice for the banner though :S
::..Federico Debla..:: 01-02-2003, 12:33:PM Originally posted by K-Man
Ok, i think i solved the problem now... not sure yet though...
anyway, what do you think about this set of colors?
oh, and about the rollover text... its not what i meant Luis :( The Flash thing makes an image, and I dont need that, all i want is a simple change of color when you put your cursor over a link, like on www.sgfantasy.com nav bar:S
I don't know... kindda Army...
I think that it doesn't call the attention, it'd be cool for a "khakis" web... or an Army one.... :)
See ya!
Gerrard 17 01-02-2003, 06:24:PM good, i want the colors to be calm and balanced like that (C)
|
|