CSS suggestions needed

liunx

Guest
Hello
I am concentrating on the SEO aspect for our website and I have read that tables lead to bad SERP.
I am trying to remove table based layouts....till now I have been able to simplify the layout but don't know how CSS can be used to have same look for the website and remove tables...

Is it possible to completely remove tables and get same layout using CSS?

Please kindly look at this and give me some suggestions

With Regards and best wishes for 2005

<!-- m --><a class="postlink" href="http://www.MyTutorOnline.comyes">http://www.MyTutorOnline.comyes</a><!-- m --> it is possible, try to do it with <div></div>
i dont have any usefull css based design links, but if u perform a little search in this CSS forum, u will find a lot.<!-- m --><a class="postlink" href="http://www.bluerobot.com/web/layouts/">http://www.bluerobot.com/web/layouts/</a><!-- m -->
<!-- m --><a class="postlink" href="http://csszengarden.com/Read">http://csszengarden.com/Read</a><!-- m --> this thread (<!-- m --><a class="postlink" href="http://www.tutorialforums.com/showthread.php?s=&threadid=71112&perpage=15&pagenumber=3">http://www.tutorialforums.com/showthrea ... genumber=3</a><!-- m -->) at Tutorial Forums for a good place to start. It's actually a Web site review topic, but it turned into a push for CSS design. Read my second post on the page (Same name). The whole thread is an interesting read because of the whole Web standards gurus vs. Make-it-look-pretty Graphic Designers conflict.Yes, absolutely, you can get the same layout with CSS. Try reading up on floats though--your going to need them. If you need some extra help, try emailing me(<!-- e --><a href="mailto:[email protected]">[email protected]</a><!-- e -->)Hello
Thanks for reply
I was wondering how this change will affect my rankings for google?I doubt it will afect Google, file size doesn't really affect google. Proper semantic coding will affect google rankings though. For instance, properly marking up all your headers with <h1>, <h2>, <h3>, ect. tags - Search Engines weigh Headers more heavily I hear. However, a full CSS layout using an external CSS file will cut down on your bandwith consumption.I would just like to say that you shouldn't think of CSS layout as <div> layout- that's what Yahoo did, and it's just as horrible now. First, code your page semantically- use tags for their meaning, not their appearance. Also, put the content in the order in which it should be, not in the order which would be convenient.

So, headers with header tags, quotes with quotation mark up, emphasis with emphasization tags, lists of links as lists of links, etc., etc; navigation to other pages after the content of this page, the title of the content before the name of the page, etc.

Next, think of how your design related imagery will work out, and into what elements on the page they should fit into- sketch it out, if you can... basic arithmetic comes in handy here, and this way of looking at it makes converting an old design much easier.

Now, absolutely position, float, add margins, padding, etc. until everything is where you want it to be- use background colours to be sure, and do this for Firefox- now, holly hack your way into IE's favour, to fix what's borked- maybe getting help from the people here. Next, layout the text (Aligning it, colouring it, sizing it, facing it, etc.), and then, put in the already ready imagery, and you're done. Convertizedistication.

Well, that's my way of looking at it... it makes things more efficient, once you have a design down.okay
after learning some CSS for few days and freeing myself from college work i have changed layout to css for my pages

however can u please whats wrong there in the bottom of the main page
it says

.bove.

i dont know how it came but what ever last finishes in the upper line the last few alphabets come down like this


thanks for all those who helped me in inspiring me to learn CSS

With RegardsCheck your page in several browsers, at least IE, FF and Opera. A few surprises for you!
The .bove is probably the duplicate characters bug (<!-- m --><a class="postlink" href="http://positioniseverything.net/explorer/dup-characters.htm">http://positioniseverything.net/explore ... acters.htm</a><!-- m -->)yes that was real surprise

i checked my pages in IE only
how do i correct this..any suggestions

thanks:confused:i think CSS is not for me....whenever i try to set girl at the place the content moves off its place and vice versa...

may be i had to shift back to table layout

:confused: all my hard work went in vain"Shift back" is right- table is a step far, far back. CSS is actually quite simple, once you get used to it- just be sure to code for a standards browser first, otherwise you'll be riding on IE's queer rendering, and correcting mistakes will become very difficult. Don't give up- once you "get" CSS, you'll realize it's much easier and more practical than unsemantic tabular layouts- as in "the right way of doing things is better than throwing crap together."Here's a start; see zipped css.
I've switched some of the declarations off ('x' in front of the property)
Added a clear:both; to the html
</div>
<!--Ends right side of page ends-->
<div style="clear:both;"></div>
</div>
<!--Ends main whole page div ends-->

Generally too much css, too many ids and classes and no semantics (using divs everywhere)Thank You Fang

I shall be contacting you again in case i find problem

Thanks once again for your time

With RegardsHello and Thanks Fang
The file you gave works great

I have seen that you have used xwidth and many more times x in the new css file..where we need to use simple variable like width and where xwidth.

And also can you give some idea about clear ,when to use it and when left right,altough i have some idea but not absolutely clear..as you might have noticed my coding skills

Thanks once again for your time and cooperation
:)xwidth, or any word in your css beginning with 'x' does nothing; they are all the declarations I switched off.
Also remove all <center> tags.
 
Back
Top