redho home | products | services

Programming Forums


Community for Java, PHP, Perl C, ASP and Python programmers
Friday 03 September 2010 04:34

Ask your IT question here

From TABLE to DIV


Goto page 1, 2  Next
 
Post new topic   Reply to topic    Programming Forums -> CSS forum
View previous topic :: View next topic  
Author Message
happyman
New Programmer


Joined: 31 Jan 2009
Posts: 6
People, I'm trying slicing pages with <div> tag. I've made a page with help of <table> tag, where the content is in table cells. But the fact is that some features I can't do...
So, what I must do now? How I must begin? Maybe you'll give me some good links... Embarassed
_________________
we are hunters for miracles

Reply with quote
 
Guest Programmer





My opinion: advantages of block-slicing in comparison with table-slicing:

1. Essential reduction of the size of pages, as a rule in 2-3 times (depending on complexity of structure of pages), that considerably reduces time of loading of a website. Thus will insignificantly grow the size of a CSS-file, but, due to its once-loading on user-side, other pages on the site reference on loaded CSS-file, so user's browser read out CSS already from his computer, in result the site is loading much faster, than table-sliced site.

2. Decrease in the universal Internet - traffic. Consequence of 1-st point.

3. Decrease in load of server-side. Consequence of 1-st point.

4. It is much more convenient to change design of pages of the site, born in a CSS-file. Thus practically there is no necessity of editing of a HTML-code.

5. Ease in manipulation with elements of a site. Any SEO-expert will confirm, that if the content of page settles down higher in a HTML-code, such page is more significant from the point of view of search optimization. Search systems will give more respect to such pages and are indexed faster.

6. Due to opportunities of div-slicing you can settle the basic content of page higher in your code, and only then - header, the left and/or right columns. Thus appearance of page will not change at all. Undoubtedly, in tabulared-slicing it is possible to achieve similar result, however div's allow to realize it much easier.

7. The transparency of the div-coded-pages is visually pleasant - there are no heaps of tags, all is very beautiful and compact.

happyman, you're on the write way - you must learn CSS well...

Reply with quote
 
linx
New Programmer


Joined: 09 Feb 2009
Posts: 11
You know, on that topic there are a lot of forums...
_________________
...and justice for all...

Reply with quote
 
musician
Enthusiastic Coder


Joined: 09 Feb 2009
Posts: 27
linx wrote:
You know, on that topic there are a lot of forums...

But forum exist for alife people... Smile

Reply with quote
 
musician
Enthusiastic Coder


Joined: 09 Feb 2009
Posts: 27
Important point which you will face at transition to block-slicing - necessity of applying various hachs for cross-browser displays of pages. In div-slicing appear many bugs, for the majority from which as a rule you'll manage with the help of hacks, available for each browser.
Reply with quote
 
happyman
New Programmer


Joined: 31 Jan 2009
Posts: 6
musician wrote:
necessity of applying various hachs for cross-browser displays of pages

What do you mean - hacks - sound like smth horrible Confused
_________________
we are hunters for miracles

Reply with quote
 
musician
Enthusiastic Coder


Joined: 09 Feb 2009
Posts: 27
happyman wrote:
What do you mean - hacks - sound like smth horrible Confused

In the work I use only three browsers: Opera, Mozilla FireFox and Internet Explorer, I shall write hacks which are distinguished separately by each of them.

Code:
.foo {color: gray} /* for all browsers */

*html .foo {color: yellow} /* only Internet Explorer <6> body .foo {color: red} /* Opera and FireFox and Internet Explorer 7.0 */

html:root .foo {color: green} /* only FireFox */

@media all and (min-width: 0px) { /* only Opera */
  body .foo {color: blue}
}


Also I want to pay attention to the following property which is required for setting minimal width of the page at block-slicing. At narrowing a browser, the information did not move down in a heap:
Code:
#wrapper {
  width: expression((documentElement.clientWidth||document.body.clientWidth)<1000?'1000px':''); /* Internet Explorer <= 6.0 */
  min-width: 1000px; /* Opera & FireFox & Internet Explorer 7.0 */
}

happyman, soon you will understand all these features - it is simple...

Reply with quote
 
linx
New Programmer


Joined: 09 Feb 2009
Posts: 11
When using hacks there is one minus: in the following versions of browsers these hacks can be corrected, then at each exit of the new version of a browser you'll need to alter CSS-file and if there are 100 of sites...
_________________
...and justice for all...

Reply with quote
 
musician
Enthusiastic Coder


Joined: 09 Feb 2009
Posts: 27
I decided to transfer TABLE-sliced scripts of my internet-shop on DIV.

With surprise looking through HTML code of pages with 5-6 of table enclosures, and with even big surprise looking at how in 3-5 times the code and "transparency" of HTML code was reduced on DIV!

One confuses - it is necessary to get used: with DIV-slicing is necessary to have more flexibly idea, than with TABLE method, where all by itself is united in the lines and columns.

Reply with quote
 
Feodor
Guest Programmer




Colleagues, reduction of volumes of the code in 2-3 times, decrease in load of server-side, etc. - all this is correct in the theory, but on practice - a crap. Let's understand. I have a portal. Weight of the main code-page is 136 KB with the content. If I throw out the content – it is about 70 KB (menu, different counters and other services). Thus when the page is loaded – about 800 KB of the data is transferred (pictures, files of js-scripts, css and other data is cashing on the client and at repeated loading there is a transfer of about 250-300Кб).
If we reduce the initial text of the page in 2 times for the account of DIVs and we get 70/2 = 35 Kb. Thus the schedules and content amount remained the former. And a client will not notice any special difference (yes, on modem connection of 35 KB difference is about 5 seconds, but I do not think that the basic visitors of sites have modems Smile). Ratio of the content/code always will be aside the content. Therefore for the clients it is not a question.
Now let's understand with loading of server-side. We shall take advantage of open statistics and we shall look at attendance of a site: for last full week we had 375429 viewings. For one viewing we have reduced the transmitted data by 35 KB. So, traffic is reduced by 13 Mbyte a week. So, for a day we have the prize of 2 Mb. It seems to me this figure is absolute frivolous to present measures. Especially, if to take into account, that the general daily proceeding traffic of our site is near 7 GB in a day! The prize will make 0.03 %.
And now lets look on negative sides. The first and the most terrible - cross-browser absence. All these tricks, complicate development, expert work make slicing more expensive. Making the same page will get more time. In a result we receive the pure loss Smile
So, alas and ah. At present to apply the given technology commercially it is unprofitable. But it does not mean, that it is necessary to forget about it and to refuse. No, developing that direction is necessary. But it is no necessity in blind rush to do so Smile

With the best regards Smile

Reply with quote
 
Page 1 of 2 Goto page 1, 2  Next
Post new topic   Reply to topic    Programming Forums -> CSS forum


Dubai Forums - Expat Help | Vegan Forum | Java Programming | 3d Design Resources | 3d Forum | 3D Jobs | 3D Textures | Paris Forum | Europe Forum
Dubai Classifieds | Dubai Property | Jobs in Dubai | Free London Classifieds | Jobs in London UK

High Quality, Custom 3d animation and Web Design solutions Royal Quality Web Hosting Services Vegetarian and Animal Rights news

Based on phpBB © 2001-2010 RedHo