Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 7 of 7
  1. #1
    Senior Member Tech0rz's Avatar
    Join Date
    Aug 2004
    Location
    Northwest, Eng
    Posts
    128
    Member #
    7314
    This has been a puzzle to me since i got interested in web design. I'm relatively new to web development and coding so pls bare that in mind when replying.

    I have read that using tables for layout is technically the wrong way to add content to a web page and that something like 70% of websites are impractical due to this.

    I can design anything in photoshop regarding web layouts and i know how to optimize images. Its just when i slice it and open it in dreamweaver, i don't know how to add content, and even if i could, how to position it wherever i wanted without the whole layout screwing up like it normally does.

    Can someone please give me some pointers or link me to a tutorial on this subject. I've searched far and havn't found specific info on this.

    Ta in advance :>

    p.s are sigs allowed?

  2.  

  3. #2
    Senior Member
    Join Date
    Mar 2004
    Posts
    1,518
    Member #
    5220
    IMO, that thing about tables being the wrong way to add content and that 70% of web sites are impractical due to it - complete rubbish! Anyway, to the subject in hand.

    You could use table rows, columns e.t.c and set the content thing as a background and make it so that if it expands, it won't mess up the layout.

    Alternatively, you could try using table rows, colums e.t.c, but on the content area, make a layer the same size as it, and make it scrollable. You'll have to use exact positioning (enter: gylakk ) for it to work though.

    There are 2 ways I can think of. Also, I'm sure you can find some stuff on the internet about this, how much searching have you done?
    Rednerve
    Creative Freelance Design

  4. #3
    Senior Member Tech0rz's Avatar
    Join Date
    Aug 2004
    Location
    Northwest, Eng
    Posts
    128
    Member #
    7314
    asdf

    hmm...i'll have to try and figure out how to do that, thanks for the tip :>

  5. #4
    Senior Member glyakk's Avatar
    Join Date
    Nov 2003
    Location
    USA
    Posts
    1,263
    Member #
    3828
    Liked
    6 times
    It shoulds like you are going about this a bit 'sideways'.

    "You do not add content to your site, you add your site to your content.." - crouching mouse hidden muskrat.

    I will explain this concept by explaing the two ways you can go about layout out your page.

    The most popular and traditional way to layout a page is to use tables. Tables are a grid-like structuer that incorporates rows to form cells arranged in a fashion so they may be used to hold images, content, whatever that will form the resulting web page. The problem with this is since your cells are arranged in such a tight arrangement any change you make to the structuer can affect the whole page. Plus table cells are commonly used as serrogate hosts for otherwise good content. These cause table based layouts to be 2 dimentional, and in many cases unessessarlly bloated. However, The advantage is it is an easy concept to grasp and learn since it is based on simple principles.

    The other way is using CSS as a visual layer(more on that in a bit). CSS is a strutured way to visually format your html markup. It can be used to change background colors and fonts, or add borders, and apply positioning, to laying out your whole site. What this means is you have greater control over your layout and much more flexability when comparied to tables because the visual formatting is not 'built' into the html, it is seperate from it, and is therefore not limited by it. This concept of seperation is not exactly new but to many it is an unfamilar concept when talking about websites. So I will explain it like this, since you work with photoshop you undoubably are familar with the concept of layers. Layers are the combination of several elements that when assembled produce the desired output. Think of your projects in terms of layers, You have your base html, that is your base layer. Then you have your visual layer using CSS, and even withen your css you will have other specalized layers. But when put together you end up with the desired output. This is the concept behind CSS to seperate your structuer(markup) from presentation(visual layer), unlike tables who try to mix both together causing data to often take a backseat to presentation.

    There are tons and tons of resouce and tutorial sites out there dedicated to the subject. Do a quick google search.
    [searchweb]css tutorial[/searchweb]
    [searchweb]css visual formatting[/searchweb]
    [searchweb]css positioning[/searchweb]
    you get the idea..

    Some popular sites you might want to take note of..
    alistapart
    w3schools
    cssvault
    csszengarden
    bluerobot

    NOTE: The vast magority of people today try to mix both CSS and tables to try and work off eachothers strengths, usually in the form of a prodominate table layout with CSS sprinkled for good measure. For the most part it works. But do be aware of what each can and cannot do. I just wanted to make sure you are aware that you can use both in the same document.


  6. #5
    WDF Staff Wired's Avatar
    Join Date
    Apr 2003
    Posts
    7,657
    Member #
    1234
    Liked
    138 times
    crouching mouse hidden muskrat

    ???
    The Rules
    Was another WDF member's post helpful? Click the like button below the post.

    Admin at houseofhelp.com

  7. #6
    Senior Member glyakk's Avatar
    Join Date
    Nov 2003
    Location
    USA
    Posts
    1,263
    Member #
    3828
    Liked
    6 times
    lol.. long story..

    Basicly I make alot of 'wise' statements like you "cannot find strength, strength must find you" If you have seen the movie Mystery Men you know what I mean. It is sort of a nickname bestowed upon me.


  8. #7
    Senior Member Tech0rz's Avatar
    Join Date
    Aug 2004
    Location
    Northwest, Eng
    Posts
    128
    Member #
    7314
    asdf

    cheers glyakk...u explained it beautifully :>...when u put it like...css is to seperate your markup from presentation, makes alot more sense.

    thx for the links aswell "muskrat" ? ... very helpful


Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 06:13 PM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com