View Full Version : Transferring from Photoshop to Dreamweaver to Internet
I am wanting to create a website but what i know about HTML can be written on the back of a postage stamp.
An associate of mine makes templates in Photoshop and then transfers then via Image Ready in to Dreamweaver before finally turning them in to a web page.
He has been helping me slightly but now i have found that he has nicked my idea and gone ahead to make his own website :(.
The help i am receiving is getting more 'sketchy' all the time so I'm asking here for help instead.
Here is what i have:
A home page that is completed except for a body of text. I tried entering the text in Photoshop but it looked awefull. Instead i have saved it to add in Dreamweaver (that's a question for later).
I also have a template made for other pages but i do not want to go ahead and finish them until i know i can do this.
Here is what i want:
I need step by step (in layman's terms) instruction on how to get this page (currently saved as .jpg) from Photoshop to Dreamweaver.
Also.....Once there i may need help turning this in to a web page, but that is one for later ;).
All help appreciated :).
Insert it as a picture or highlight copy to clipboard and paste into a frame.
To be honest though Vidster you would be better just typing it directly into Dreamweaver in the first place because it will load better once it is uploaded then. Have quick look at mine I did this in dreamweaver (originally) - the pages relating to the Credit Union will give you a better idea. I typed all the text directly in. I wouldn't put text in as a jpeg as it will load too slowly for people on dialup. my site is on www.wendye.pwp.blueyonder.co.uk
That's my novice tuppeneth worth anyway.
It's funny you should say that wendy.
I opened the page earlier and added a frame so i can enter the text straight in to it..... once i actually get it in to Dreamweaver that is! :hihi:
Now i have a different problem.
I have realised that i can simply drag and drop straight in to Dreamweaver (using one of the pre-installed framesets).
The problem is the page is only 782x430 and it is won't let me select any of the other sizes from the menu.
Does anyone know how to adjust the page size?
alchresearch 24-03-2005, 21:49 First of all click on View in Dreamweaver so you get CODE AND DESIGN.
Highlight the frame then look at the highlighted code and look for the occurance of "782". Alter it to suit, or a percentage.
Don't forget to accomodate for 800x600 users though, they're a pain but there are still a lot using 15" screens. If you use percentages rather than actual pixels, the pages will size to accomodate the viewer's screen.
PM me if you need any further assistance.
Originally posted by alchresearch
First of all click on View in Dreamweaver so you get CODE AND DESIGN.
Highlight the frame then look at the highlighted code and look for the occurance of "782". Alter it to suit, or a percentage.
Don't forget to accomodate for 800x600 users though, they're a pain but there are still a lot using 15" screens. If you use percentages rather than actual pixels, the pages will size to accomodate the viewer's screen.
PM me if you need any further assistance.
I tried what you said alchresearch but all i get is the code below :?. I don't see any page dimensions to change. I'll go to PM's if you want but once i start quizzing you, i might not stop :hihi:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
</head>
<frameset rows="80,*" cols="*" frameborder="NO" border="0" framespacing="0">
<frame src="file:///C|/Program%20Files/Macromedia/Dreamweaver%20MX%202004/UntitledFrame-9" name="topFrame" scrolling="NO" noresize >
<frameset cols="80,*" frameborder="NO" border="0" framespacing="0">
<frame src="file:///C|/Program%20Files/Macromedia/Dreamweaver%20MX%202004/UntitledFrame-10" name="leftFrame" scrolling="NO" noresize>
<frame src="file:///C|/Program%20Files/Macromedia/Dreamweaver%20MX%202004/Untitled-5" name="mainFrame">
</frameset>
</frameset>
<noframes><body>
</body></noframes>
</html>
I use tables when designing sites, I would start off with something like this :
<html>
<head>
<title>Untitled Document</title>
</head>
<body>
<table width="100%" border="0">
<tr>
<td>&nb*sp;</td>
</tr>
</table>
</body>
</html>
(Remove the *, it wont display on here if I dont put it in)
Then put everything in that table, this enables your site to be 100% the width of the viewers screen. I'm not sure if this is the best way but it works for me.
Ahh....But then your talking in code and it may as well be Latin to me :(.
I just had someone look at the source above and he told me to go back to Photoshop7! :hihi:
On a new site in Dreamweaver press 'Control Alt and T' together. this will bring up a box with options in it, select 1 row, 1 column and 100 percent width and press OK, this will give you a table to work inside that will be 100% the width of the viewers screen.
Originally posted by adlinds
On a new site in Dreamweaver press 'Control Alt and T' together. this will bring up a box with options in it, select 1 row, 1 column and 100 percent width and press OK, this will give you a table to work inside that will be 100% the width of the viewers screen.
Cool :thumbsup:
Any ideas how to make a page as long as i want? :suspect:
If you put everything in that table it will adjust to the height of what you put in it. Therefore the it can be as long as you want, I wouldn't have it too long though, some people don't like scrolling too much.
Yep..That worked a treat :clap:
Another problem :suspect:
Being as i don't know any code, i'm just dragging and dropping pre-made images in to place. This worked fine with the framesets but on a blank page the image (in this case the banner) just snaps straight to the middle of the page (ie: half way down) when i release the mouse :?.
I don't suppose you know what i'm doing wrong there?
*Vidster realises why website designers are paid well!*
When you have dropped the image into the table, make sure the table is selected and then at the bottom left (ish) of the screen should be an option saying "Vert" this will be set to default, change it to "top" and the image will appear at the top of the table.
You can design things better if you split the table (Ctrl, Alt + S) I would split it into 3 columns usually and have the menu in the left hand table and the main stuff in the middle table, adverts and any other bits can go in the right hand table. Just open a blank document and have a play around with tables, you will soon get the hang of it.
Originally posted by adlinds
When you have dropped the image into the table, make sure the table is selected and then at the bottom left (ish) of the screen should be an option saying "Vert" this will be set to default, change it to "top" and the image will appear at the top of the table.
You can design things better if you split the table (Ctrl, Alt + S) I would split it into 3 columns usually and have the menu in the left hand table and the main stuff in the middle table, adverts and any other bits can go in the right hand table. Just open a blank document and have a play around with tables, you will soon get the hang of it.
Tremendous adlinds! Just what i needed :thumbsup:
I'm off to play!. I suspect a late night coming on ;)
Good luck, I'm off to bed now so someone else can take over for a while. PM me if you get stuck again and i'll help you out when I get up (about 2pm ). :D
adlinds, your a diamond :thumbsup:
I've been playing for hours and 'finally' figured out how to split the screen in to as many rows and columns as i need.
One 'hopefully' final question.
Is there a way to 'lock' a row or column in place permanently?.
I place my menu buttons in the left column, one on top of the other. Yet for some reason as soon as I'm selecting something else (another section for example), the buttons snap in to a horizontal line and stretch the column across the screen :?.
Hope that makes sense :rolleyes:
For a simple menu create a column on the left hand side, and set it's width to 18% for example, this is typed in the "W" box.
Then split that column into rows, usually however many menu buttons you want plus 2, then in each of the rows in the column making sure the curser is in the middle, insert another table (ctrl alt + T) and make that 90% the width of the table you are inserting into. Do that all the way down and then type you menu in, 1 option per box, this way its spread out nicely and shouldn't keep messing up.
Sorry if that sounds like a load of nothing, I find it hard to explain. If you struggle send me the files and i'll see what I can do.
Well simple Numpty's like me sometimes can't see the wood for the trees adlinds :rolleyes: .
I had never thought of splitting the column in to rows :loopy:. It's obvious once someone points it out to you :thumbsup:
Now i have another Numpty question :rolleyes:
Can i just delete all the borders once i have finished a page? or will the contents of the page just merge in to a heap?.
I thought they would disappear when i viewed it in a browser :?
To get rid of table borders either highlight your table, open the properties box and put 0 next to where it says border, or in the code type <table border="0">
Originally posted by Nooka
To get rid of table borders either highlight your table, open the properties box and put 0 next to where it says border, or in the code type <table border="0">
Thanks for that Nooka :thumbsup:
I just finished my first ever template :o "Happy Days" :clap: :clap:
|
|