PDA

View Full Version : Slicing into dreamweaver without Tables


kearnsy
01-31-2010, 09:57 PM
Hi Folks.

Right, let's see where do i start?

I've sliced up all my images in photoshop, ready to be exported into dreamweaver, i've edited the html output settings to generate css instead of tables, but the problem i have is, photoshop puts a table around everything and puts the div tags inside of the table.

i thought, because i've edited the settings to generate css instead of tables, it would generate a container tag instead of a table?

i'm fairly new to web design, so my question is would it be ok for me to remove the table and insert a container div in place of the table, or would that mess things up?

or have i missed something while exporting from photoshop and that's why there is a table?

thanks folks, i look forward to your responses.

domedia
01-31-2010, 10:13 PM
Yes remove the table. Letting PS write your HTML/CSS is usually a bad idea, so you should also be looking into writing your own code.

DWcourse
01-31-2010, 11:24 PM
When you save for web and devices with the settings

Format: HTML and Images
Settings: div

You should get only divs, no tables. However the "wrapper" div may have an id with the word table in it such as <div id="Table_01">.

Unfortunately all the divs will be absolutely positioned which is not much better than using tables. So, like domedia said, exporting HTML from Photoshop is a bad idea no matter how you slice it.

kearnsy
02-01-2010, 12:15 PM
Cheers guys for your responses

As i said i'm fairly new to web design, so i'm trying to learn, sorry, cram as much in as i can.

So what's the best way to go about getting a layout from photoshop into dreamweaver then would you say?

Just out of interest, why is it bad to export slices from PS into DW?

thanks for your help chaps

DWcourse
02-01-2010, 02:26 PM
why is it bad to export slices from PS into DW?

Because you end up with tables or AP divs, both of which will give you problems the minute you start editing your page (there are a variety of other reasons as well but I'll leave those to someone else).

kearnsy
02-01-2010, 05:05 PM
Thanks DW, so what do you suggest i do to get my PS slices into dreamweaver?

Corrosive
02-01-2010, 05:09 PM
Create your sliced graphics 'by hand'. Save the individual pieces for web (strips unnecessary code out) and then reconstruct using CSS in DW.

DWcourse
02-01-2010, 05:14 PM
You can also slice your images in Photoshop and then place them into a CSS-based layout you create. If you're new to the process, you can always start with one of the CSS layout built in to Dreamweaver. But, if you're planning to get serious about creating websites, you're going to have to understand both html and css and that take some time and effort.

kearnsy
02-02-2010, 01:22 AM
Ha ha, i know what you mean about time and effort, i've lost so much sleep over the past couple of months trying to learn, going over and over the same thing only to be frustrated by something not sitting right on the page, or when something i expect to happen, doesn't happen.

It's so much easier and tempting to just export everything from PS and let that do all the work, but i'm determined to learn the right way to do it.

Ok, so let's see if i've got this right, i export just the images from PS, then re-create the page by building a container div, then lots of other div's where the sliced images go?

God, i feel like a div asking this 0:)... what's the best way to go about re-creating the tables, do i get the measurements of the slices and work it out like that?

Thanks for bearing with me on this one

gentleone
02-02-2010, 06:20 AM
I found a tutorial for you how to code a sliced up Photoshop design the right way.

http://freecss.info/free-css-tutorials/css-template-tutorial-setting-up/

kearnsy
02-02-2010, 02:33 PM
thanks gentleone, I best pull up a chair and stick the kettle on for this one, it could be a lonnnnnnnng night.

gentleone
02-02-2010, 04:45 PM
thanks gentleone, I best pull up a chair and stick the kettle on for this one, it could be a lonnnnnnnng night.

You don't wanna know how many looooooooong nights I had before I got how far I am now :) And you know what... I still have looooooooong nights if I want to know something deeply... you still wanna go on with this time consuming web development stuff? ;)

kearnsy
02-03-2010, 03:53 AM
I'm a hermit, i have no choice. '0)

edbr
02-03-2010, 05:30 AM
not Herman is it ? i wondered where he'd gone

Corrosive
02-03-2010, 06:20 AM
not Herman is it ? i wondered where he'd gone one for the teenagers Ed! Lol :lol:

tux
02-03-2010, 09:56 AM
Good luck with your learning curve Kearnsey. We have all been there but it does start to all click into place as you go up the steep hill of web design.

I was in your position about 18mths ago when I realised CSS and PHP was the route I should be looking at.

This is a link to the first tutorial I took on CSS and it helped me hugely. Hope it helps you. We are all here to help and pass on what we have all learnt from others.

http://www.subcide.com/tutorials/csslayout/index.aspx

You are in the right place mate.

Regards Paul

kearnsy
02-03-2010, 12:41 PM
Cheers for your help & support chaps it's much appreciated.

Hopefuly one day, i'll be able to return the favour to some of the newbies to the site.

Corrosive
02-03-2010, 01:19 PM
Hopefuly one day, i'll be able to return the favour to some of the newbies to the site.

That's the idea dude :)

tux
02-03-2010, 07:26 PM
No worries, thats what its all about. :-)