SitePoint Sponsor

User Tag List

Results 1 to 11 of 11
  1. #1
    Internet Consumist Kayn's Avatar
    Join Date
    Feb 2001
    Location
    Missouri
    Posts
    209
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Ideas and thoughts for you old school table people converting to CSS...

    After spending some frustrating hours playing with layouts using CSS, it dawned on me that I wasn't thinking in the right mindset.

    For guys like me who spent the majority of their web design career creating table-based designs, stepping into the world of pure CSS design is a rather jolting experience (almost like drinking orange juice right after brushing your teeth - blech!). With tables, you have a zone of structure that really limits what you can and cannot do. Normally, I'd break out dreamweaver and think in the mindset of, "Structured web page... organized... menu goes here... logo goes here..." and so forth. (Not sure if I'm making sense...).

    However, when I started trying that exact same thing with CSS (break out dreamweaver, start playing with code and stuff), I was having a very frustrating time getting the results I wanted (I also bought Topstyle, but it wasn't helping). I was thinking "structured web page layout" instead of "creative web page DESIGN." The "style" part of CSS wasn't clicking.

    So, I tried something new.

    I started up Fireworks and began DRAWING my website design (rather than just coding it). I had to completely abandon the old table limitations and just let my artsy-fartsy side take over. Since CSS has so many more possibilities, I can literally create anything using it (especially after flipping through all the csszengarden stuff and drooling all over my keyboard), and that kind of broke that barrier that was holding me back.

    I know it sounds kinda cheesey. You know what though? It worked. I'm staring at a drawn out design just floored that I created this (I'll share it with you all when it'd done ). Kinda took me back to when I first got started in design (around '96) and didn't know about limitations.

    Just some ideas/thoughts I wanted to share with newcomers and oldcomers to CSS. Carry on.
    Sing in a band called Psychostick, Alfredo Afro.

  2. #2
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,556
    Mentioned
    183 Post(s)
    Tagged
    6 Thread(s)
    Glad to hear someones happy with css

    Thanks for sharing your thoughts and maybe others will follow your way of thinking

  3. #3
    Fluffy Kitten Programmer~ Elledan's Avatar
    Join Date
    Jun 2000
    Location
    Netherlands
    Posts
    1,356
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You make it sound far too easy and attractive. What's the catch?


    <--- one of 'em 'old school table people'
    www.nyanko.ws - My web-, software- and game development company.
    www.mayaposch.com - My personal site and blog.

  4. #4
    Internet Consumist Kayn's Avatar
    Join Date
    Feb 2001
    Location
    Missouri
    Posts
    209
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    The catch? Well, y'know... having to think a bit outside the "standards" and learn CSS in depth.

    That's about it. I think... I'm still learning.
    Sing in a band called Psychostick, Alfredo Afro.

  5. #5
    SitePoint Wizard megamanXplosion's Avatar
    Join Date
    Jan 2004
    Location
    Kentucky, USA
    Posts
    1,099
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Yeah, it's really no more difficult than creating table-based designs. The difficult part is learning how to approach the designs using a new method of laying it out. The step forward isn't harder than learning how use tables, since tables have their own approach, CSS-ways also have their own approach. It's just the fact that people get stuck with the table approach and have trouble adapting their approach.

  6. #6
    Back in Action Winged Spider's Avatar
    Join Date
    Jun 2001
    Location
    outside my mind
    Posts
    900
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    For guys like me who spent the majority of their web design career creating table-based designs, stepping into the world of pure CSS design is a rather jolting experience (almost like drinking orange juice right after brushing your teeth - blech!). With tables, you have a zone of structure that really limits what you can and cannot do. Normally, I'd break out dreamweaver and think in the mindset of, "Structured web page... organized... menu goes here... logo goes here..." and so forth. (Not sure if I'm making sense...).

    I started up Fireworks and began DRAWING my website design (rather than just coding it). I had to completely abandon the old table limitations and just let my artsy-fartsy side take over. Since CSS has so many more possibilities, I can literally create anything using it (especially after flipping through all the csszengarden stuff and drooling all over my keyboard), and that kind of broke that barrier that was holding me back.
    No, that doesn't make too much sense at all. The "Zone of Structure" you talk about is in your head. Tables actually offer more possibilities with how you lay out websites. There are some things in CSS that you just can't do, or can't do with 100% compatibility across multiple browsers. It might be possible that the new and sleek CSS design method made you think outside of the box instead of the technology itself.

    You should always design a website first by drawing it instead of coding. CSS only designers tend to do things in the opposite way. Define what's in the middle, define what's in the left, and then how pretty it looks. You can't literally create anything with it. CSS still has limitations that hard coded tables can do better.

    I went CSS more than 2 years ago, and to my knowledge designed the first ecommerce site with a complete CSS design at that point. Anyway I went back to tables for a while because of issues we were having with supporting the "old school" of browsers. Math showed us that we were loosing over $2000 a month because of the low conversion rates our dummied down style was showing. Was it worth it in terms of dollar signs? Yes. Was it worth it when we needed to redesign 2 years later or convert the content over? No.

    I'm back to CSS only now and very happy with the results. New techniques and methods have really opened up what CSS can do visually, but the biggest factor in CSS designs is the foward compatibility with new layouts. Extracting the content from a tabled design is a real man-hour consumer, and so is doing modifications. Yes, including files helps, but situations arise were you need to change every file in a site to change a color. Find and Replace just doesn't cut it. The (x)HTML stays real nice and clean too which is a godsend in days of WYSIWYG browsers and bad practices. Making changes is also easier because my HTML code is simple.

    With CSS changing a design across a entire network or even making a small change to one page is smooth, easy, and low on man hours. The money we saved by supporting the old school crowd was quickly eaten up by modifications and redesigns. It just wasn't worth the peace of mind knowing that your site displayed well across all browsers. IMO this factor is the one quantifyable advantage of CSS that every business owner should pay attention too. If your designing to clients make sure you let them know that they will save money over time going with a CSS design. This factor just puts the icing on the cake of CSS's other great features.

    Go CSS go!


  7. #7
    Internet Consumist Kayn's Avatar
    Join Date
    Feb 2001
    Location
    Missouri
    Posts
    209
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Winged Spider
    No, that doesn't make too much sense at all. The "Zone of Structure" you talk about is in your head.
    Exactly, it was in my head. However, I've seen CSS do tons of things I've never seen table based layouts do before.

    I mean, there are advantages and disadvantages to both. I just think CSS holds more advantages, especially if you're aiming for a slick design.

    RAWR!
    Sing in a band called Psychostick, Alfredo Afro.

  8. #8
    ☆★☆★ silver trophy vgarcia's Avatar
    Join Date
    Jan 2002
    Location
    in transition
    Posts
    21,235
    Mentioned
    1 Post(s)
    Tagged
    1 Thread(s)

    You should always design a website first by drawing it instead of coding. CSS only designers tend to do things in the opposite way. Define what's in the middle, define what's in the left, and then how pretty it looks. You can't literally create anything with it. CSS still has limitations that hard coded tables can do better.
    I don't think any one method is "better" (drawing a design first rather than coding it). I've seen way too many photoshop comps that would be too much of a pain to code and have it work reliably, because the designer who created it forgot about the limitations of the Web as a medium. I've also seen a lot of "understyled" sites from those who code before coming up with any sort of concept or theme to go with. My point is that the process used to come up with a design shouldn't be used as a point of criticism for the design itself, unless it was a flaw in that process that led to the problem.

  9. #9
    Internet Consumist Kayn's Avatar
    Join Date
    Feb 2001
    Location
    Missouri
    Posts
    209
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Of course, this is all subject to opinion.

    I think it's vital for web designers to keep their mind open to different techniques until they find their happy medium. It's all about effectiveness and personal preference.
    Sing in a band called Psychostick, Alfredo Afro.

  10. #10
    SitePoint Wizard jag5311's Avatar
    Join Date
    Jan 2003
    Location
    Somewhere in Indiana
    Posts
    3,082
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    nice post. Its true, you have to sometimes break out of a standard structured design of thinking only in blocks versus RULES. Rules based design is the future, not the past.

  11. #11
    SitePoint Member
    Join Date
    Jun 2004
    Location
    Oakland, CA
    Posts
    13
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Winged Spider -

    What ecommerce solution allowed you to use css and no tables?


    Quote Originally Posted by Winged Spider
    No, that doesn't make too much sense at all. The "Zone of Structure" you talk about is in your head. Tables actually offer more possibilities with how you lay out websites. There are some things in CSS that you just can't do, or can't do with 100% compatibility across multiple browsers. It might be possible that the new and sleek CSS design method made you think outside of the box instead of the technology itself.

    You should always design a website first by drawing it instead of coding. CSS only designers tend to do things in the opposite way. Define what's in the middle, define what's in the left, and then how pretty it looks. You can't literally create anything with it. CSS still has limitations that hard coded tables can do better.

    I went CSS more than 2 years ago, and to my knowledge designed the first ecommerce site with a complete CSS design at that point. Anyway I went back to tables for a while because of issues we were having with supporting the "old school" of browsers. Math showed us that we were loosing over $2000 a month because of the low conversion rates our dummied down style was showing. Was it worth it in terms of dollar signs? Yes. Was it worth it when we needed to redesign 2 years later or convert the content over? No.

    I'm back to CSS only now and very happy with the results. New techniques and methods have really opened up what CSS can do visually, but the biggest factor in CSS designs is the foward compatibility with new layouts. Extracting the content from a tabled design is a real man-hour consumer, and so is doing modifications. Yes, including files helps, but situations arise were you need to change every file in a site to change a color. Find and Replace just doesn't cut it. The (x)HTML stays real nice and clean too which is a godsend in days of WYSIWYG browsers and bad practices. Making changes is also easier because my HTML code is simple.

    With CSS changing a design across a entire network or even making a small change to one page is smooth, easy, and low on man hours. The money we saved by supporting the old school crowd was quickly eaten up by modifications and redesigns. It just wasn't worth the peace of mind knowing that your site displayed well across all browsers. IMO this factor is the one quantifyable advantage of CSS that every business owner should pay attention too. If your designing to clients make sure you let them know that they will save money over time going with a CSS design. This factor just puts the icing on the cake of CSS's other great features.

    Go CSS go!


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •