Announcement Announcement Module
Collapse
No announcement yet.
Alternatives to tables... Page Title Module
Move Remove Collapse
Search Search Module
Collapse

Advertisement Advertisement Module
Collapse

Featured Images Featured Images Module
Collapse

Mediabistro Creative Sites Mediabistro Creative Sites Module
Collapse
Latest Topics Latest Topics Module
Collapse

  • KitchWitch
    Reply to Text Wrap in Illustrator - No worky worky
    KitchWitch
    Hi StevieD009 and welcome to GDF.

    We ask all new members to read very important links here and here. These explain the rules, how the forum runs and a few inside jokes. No, you haven't done...
    Today, 12:18 PM
  • KitchWitch
    Reply to Anyone else only have a diploma¿?
    KitchWitch
    Hi Frodo and welcome to GDF.

    We ask all new members to read very important links here and here. These explain the rules, how the forum runs and a few inside jokes. No, you haven't done anything...
    Today, 12:17 PM
  • KitchWitch
    Reply to creative business cards
    KitchWitch
    Hi Damonharris and welcome to GDF.

    We ask all new members to read very important links here and here. These explain the rules, how the forum runs and a few inside jokes. No, you haven't...
    Today, 12:12 PM
  • KitchWitch
    Reply to Catalog Design
    KitchWitch
    Hi and welcome to GDF.

    We ask all new members to read very important links here and here. These explain the rules, how the forum runs and a few inside jokes. No, you haven't done anything...
    Today, 12:12 PM
  • KitchWitch
    Reply to Hi everyone!
    KitchWitch
    Welcome.
    Today, 12:08 PM
Advertisement Advertisement Module
Collapse

Sponsors Sponsors Module
Collapse

X
Conversation Detail Module
Collapse
  • Filter
  • Time
  • Show
Clear All
new posts

  • Alternatives to tables...

    Hi people,

    Basically, i'm no web designer, but I've made a couple of sites in Illustrator, then sliced them up and took them over into Dreamweaver, where they end up in tables. The sites end up fine, mostly graphics so they look good.
    But, people keep on telling me tables are rubbish - i'm sure they're right, I was just wondering if anyone can point me towards alternatives? And maybe tell me the pro's cons of them?

    Ideally i'd still llike to design my sites in illustrator....I just want to find more effective, efficent ways of building them.

    Thank you...

  • #2
    you should be using semantic HTML and CSS to build sites. using tables is a hack from back in the day that is no longer considered the best way to build sites anymore. semantic HTML + CSS separates the content (the HTML) from the style (the CSS) and makes sites much easier to build, and ridiculously easy to change aesthetically. this also makes them faster to load, more compatible across browsers and platforms, and generally works within the confines of the browser environment rather than hacks around it the way tables does.

    i suggest Lynda.com to learn how, or google it - tons of resources out there. all you need is a text editor - no dreamweaver needed. you can design your sites anyway you want (illustrator, pencil and paper, etc..), but you will need photoshop or fireworks to convert images into web-correct formats.

    Comment


    • #3
      Originally posted by greedo View Post
      you should be using semantic HTML and CSS to build sites. using tables is a hack from back in the day that is no longer considered the best way to build sites anymore. semantic HTML + CSS separates the content (the HTML) from the style (the CSS) and makes sites much easier to build, and ridiculously easy to change aesthetically. this also makes them faster to load, more compatible across browsers and platforms, and generally works within the confines of the browser environment rather than hacks around it the way tables does.

      i suggest Lynda.com to learn how, or google it - tons of resources out there. all you need is a text editor - no dreamweaver needed. you can design your sites anyway you want (illustrator, pencil and paper, etc..), but you will need photoshop or fireworks to convert images into web-correct formats.
      No dreamweaver?

      I thought illustrator CS3 save for web option too? Thats what I use...

      Comment


      • #4
        dreamweaver is not needed - just a good text editor. and yes, that sounds like it would be a lot harder, but in reality it is MUCH easier to write the code yourself.

        and i guess you can save for web out of illy, but you need to be cutting up images and sizing them to the pixel for placement on the web and i find photoshop is easier for that. either way it does not matter (as far as i know) so long as the result is the same in terms of correctly sized, correctly compressed images

        Comment


        • #5
          Using a program function to export a sliced design means you didn't think too hard about making the design for the web.

          CSS does borders, colors, and repeating backgrounds live in the browser. It's like putting up plain white wallpaper when the walls are already painted. You can easily reduce page load time and reliance on images, or make a decadent design that loads more quickly.

          Tables are inefficient for design and hard to maintain. With CSS, you can control the look of the site from one file rather than making the same changes to dozens. You reduce the amount of HTML you have to look at so changes to the page are easier for you and whoever may end up working on the site.
          Swedish Meatball Pornography

          Comment


          • #6
            Tables are still useful for tabular data but generally html/css is the best option. A basic Dreamweaver book is the best way to learn, it really is relatively straightforward once you get your head around it!

            Comment


            • #7
              Reb, there's nothing wrong with designing sites in Illustrator, but letting it write code for you—which is what it sounds like you're doing—is a mistake. It would be fine to use Illustrator-generated code for rapid prototyping, but for actual live sites you really should be writing your own code. Why? Well, would you use Illustrator to lay out a 64-page catalog? Would you use Photoshop to design a logo? No, you wouldn't because you know you need to use the correct tool for the job at hand in order to have an optimal outcome. Writing HTML & CSS code is not what Illustrator was designed for, which is why it produces cruddy code. Use the proper tool for the job—e.g. Dreamweaver, Notepad, TextMate, BBEdit, Bluefish, Eclipse, Komodo Edit, NVU, whatever ever you're most comfortable with.

              As others have already mentioned, maintainability is a big reason that separating structure & presentation is important. Say you have a 2-column layout and the client decides that they'd prefer to have the sidebar on the right instead of the left: If you've done your layout with tables, it's going to be a chore requiring you to nest your tables differently (not to mention that you'll need to change things on every page manually). But if you've used a CSS-based layout, you can do it in a matter of minutes by simply editing your external CSS file to move the div from one side to the other.

              A few other reasons, not necessarily in order of importance:

              Printing - If a table-based layout is wider than a standard sheet of paper—and they typically are—then when a user goes to print the page, not only is part of it is going to get cut off, but unnecessary elements (such as navigation, search boxes, etc.) will also get printed. If you've used a CSS-based layout, you can just create a copy of your CSS file in which the width of the page is flexible and unnecessary elements are hidden form view, then set that file as your print stylesheet.

              Accessibility - Tables were created for use with tabular data. When you use tables for layout, people using screen readers and such will have an awful time trying to make sense of your content. See http://www.webaim.org/techniques/tables/ for more info.

              SEO - Using a table-based layout isn't necessarily going to kill in terms of SEO if your content is good and the rest of your markup is semantic, but it isn't going to help you either. See SEO Reports - Tables for layout affect your SEO efforts and Are CSS-based layouts better than tables for SEO? for more info.

              Combined with what others have already mentioned, the above should be sufficient to make the case for not using tables for layout. If you have neither the time nor the desire to get up to speed with current best practices in coding, then as a matter of practicality I'd strongly suggest that you stick to only doing design and hand off your files to a professional coder for production.

              Digi
              The world is divided into people who think they are right.
              —Anonymous

              Comment

              Mediabistro A division of Prometheus Global Media home | site map | advertising/sponsorships | careers | contact us | help courses | browse jobs | freelancers | content | member benefits | reprints & permissions terms of use | privacy policy Copyright © 2014 Mediabistro Inc. call (212) 389-2000 or email us
              Working...
              X