Showing posts with label html. Show all posts
Showing posts with label html. Show all posts

Tuesday, April 24, 2007

Don't Quote Me

This one has me sad: Browsers are supposed to render the Q tag with quotation marks (W3 Schools.com).

"This is a Sample of the Q Tag."

If you are viewing this page in Firefox or Mozilla; you will see two sets of quotes. Internet Explorer only shows the quotes that I added. The different renderings make the tag useless.

The fact that the W3 started to use HTML tags for punctuation makes me really sad. This is the ultimate violation of the rule of separating form from content. The following line uses the Q tag. You can see them in Firefox.

Highlight me! I am quoted.

If you copy and paste the sentence into Notepad, the quotes magically disappear. The meaning of sentences change when you remove the punctuation.

I don't know who I dislike more. W3 for the stupid behavior of this tag or Microsoft for not implementing a really bad idea.

Here is the W3 Tag Definition for quotes.

Sunday, April 22, 2007

floating about, or about floating

First the good news. I finally figured out how to center the contents on Ryan Hiller Music. The next link should pop up a page with a song that you can listen to while you read this post.

Now for the rant. This is about the type of garbage that makes web programming miserable.

NOTE: I've spent about $300 bucks on CSS books and have tossed several hundred frustrating hours into trying to find good ways to render pages with multiple columns with CSS. You know, that stuff that took all of 8 minutes to learn using the venerable TABLE tag.

Anyway, on Ryan's site, I wanted to use the FLOAT method of page layout.

The basic idea of the float method is to create an outer division of a fixed size, then to let the elements of the page float in this known block. Setting the left and right margins to auto affectively centers the page. Several of my expensive books suggest taking this route.

On Ryan's page the outer division is 640px. The first item in the page is a picture of width 200x200. The next item is a logo that is 440x120px. 200 + 440 adds up to a width of 640px. Notice that I have a blank spot under the logo that is 440x80px. The next division is a menu in a 440x24px box and a header that is 440x56. Since the outer box is 640px in width, the inner elements will just float into place. I can then add addition blocks of information below.

If you have a fixed outer box, you can adjust the sizes of all the elements so that they float into place.

This is all well and good. For that matter, the page rendered perfectly in Internet Explorer. I spent several days struggling to get the page rendered in Opera and Mozilla. I read several hundred online pages on web design. I did search after search on Google, and then finally conceded defeat. (This was 2002). I fell back on a crappy absolute position design that I severely disliked.

I took up the problem again in 2007. The float model renders easily in internet explorer, but not in Firefox.

Fortunately several thousand other people had the same problems. There is now a large number of pages talking about the subject. For example, here is a 2006 thread on WebMaster World. It turns out that to get the CSS to display the way I want, I need to add the line "overflow:auto;" in the outer division tag.

What I gleaned from the other pages is that the originators of CSS thought that one item floating in another item was logically absurd. It would be like someone putting a swimming pool on a cruise ship.

Imagine an ice cube floating in a martini glass held by a tanned young woman floating in a pool that is in a yacht floating in the Caribbean. The very notion is absurd. I refuse to believe that such an event could happen. Yes, you can buy be a ticket on a cruise ship. But I won't concede this point … until I've rubbed some suntan lotion on the shoulders of that young lady.

Now for the big controversy: Microsoft rendered the page as people would expect. When writing internet explorer; a programmer at Microsoft decided that if a person put one division inside another division, they probably wanted the inner box to be displayed inside the inner box.

This is the weird part. On reading pages from different CSS gurus, most of them are angry at Microsoft for displaying the page in the way that people would expect the page displayed.

Many of the CSS gurus are extremely passionate in deriding Microsoft for not being "compliant" on this issue.

Quite frankly, I think the gurus are sick.

In a healthy society, standards are an organic, changing thing. In the first decades of the computer industry, all of the applicable standards evolved rapidly with technology. The ie browser had a more intuitive implementation of the CSS standard. In a healthy world, the standard would change.

Like almost all ideas. The first iteration of CSS was buggy. In a healthy world, the players in the industry try finding different ways to implement the standards, and gradually work out the bugs through better implementation, or by changing the standards.

What seems to have happened with CSS is that the thugs at the standards committee have made an intentional effort to stop the natural evolution of CSS, and are engaged in a group thrashing of Microsoft. They are taking all of the bugs of the first CSS implementations that Microsoft did not implement, then trying to say that Microsoft is evil for not implementing the bugs.

The method is simple. A group defines an enemy then systematically attacks their defined enemy. When people fall into this mindset, they fall into oblivion where they are incapable of doing those things that can make society better.

When tracing down these CSS bugs, the patterns seems to be that the standards committees are intentional preventing the improvement of CSS simply so that they can throw the accusation of noncompliance at their hated enemy.

I loved the response from ZackAttack on Webmaster World. "PS: Sorry I should have said.. IE may show it correctly but I imagine this is because of non-compliance "

The attack on the hated enemy has become almost a chore. (BTW, I need to say something bad about George Bush).
BTW, I am not a fan of Microsoft. Microsoft has a history of introducing new proprietary features with their browsers, and other moves to undermine competition. I am not a fan of Microsoft, but a rational world shout down Microsoft when it is in the wrong, but welcome when the company implements a more intuitive understanding of the standards.

We should be upset for the things that people do wrong. This modern method of trying to focus absolute hatred on one's enemy leads to naught.


Anyway, I know it is logically absurd. But the more I think about it. I would rather be floating next to that tanned young lady sipping a martini while floating in a pool that is in a boat floating in the ocean. She really needs just a little more sunscreen on her shoulders. My margarita would have one of those little umbrellas to keep the ice cube from melting. I know. I know. I would look absurd in a panama hat, bright floral patterned shirt and flip flops, but I can live with that.

Now, where is my lost shaker of salt?

Saturday, April 21, 2007

There Is No CENTER

The first thing we need to remember is that a floating element is shifted either to the left or to the right. It is not possible to make an element float in the centre.


While visiting CSS guru sites, I finally learned the reason why there is no "float: center" option in CSS and why the W3 deprecated the HTML center tag.

The reason for this is that it is logically absurd for something to float in the center.

You can easily prove this assertion true: Take a balloon into a room with standard atmospheric pressure on earth. Fill the balloon with helium. Tie off the end of the ballon and release it. The balloon will not float upward to the ceiling. Instead, it will float left or right to the nearest wall.

Okay, I have not tried this experiment myself. I don't have a balloon or helium source at hand.

I feel confident that a balloon would not float upward because the W3 consortium and leading web authorities say so. The only other possibility is that the elitists at the helm of the W3C are one dimensional thinkers with a stick up their collective [the ending of this paragraph was removed by the moderator].

Anyway, I now know that the reason why the W3C deprecated the CENTER tag. They did so because centering an element on a web page is as logically absurd as the notion that a balloon filled with a substance lighter than air would float upward.

Wednesday, April 11, 2007

Aligning Tabular Data

The TABLE Tag in HTML exists to support tabular data.

Here is a question for any accountants out there: What is the one formatting thing that you want to do with columns of numbers?

Yep.

You want to either right align (or preferably decimal align) rows of numbers.

The standard of right aligning columns of numbers and left aligning text reaches way back to the invention of the Arabic numeral system.

The HTML language includes a COL tag. Internet Explorer will align columns specified with the col tag. FireFox and standard compliant browsers do not.

I understand that the reason that the COL tag does not work in FireFox is that cells in the row do not inherit the properties of the column. I guess the ideal of the HTML standards is that everything in XML languages need to be based on a hierarchical model. A tag can only inherit properties when it is nested in other tags. Since an HTML file really is just a one dimensional string. In the 1 dimensional hierarchical world of the standards committees, only the rows can inherit properties.

Tables are two dimensional.

The simple one dimensional hierarchical method that bureaucrats love fails when more than one dimension is involved. With a one dimensional model, you can either inherit the columns or you could inherit the rows, but not both.

The sad thing, of course, is that HTML is primarily about displaying information on a two dimensional surface.

Tables are an inherently two dimensional structure. Rene Descartes showed us that we can do all sorts of wonderful things with very simple two dimensional mathematics.

The reason that web masters were drawn to TABLEs like flies was because it gives them a two dimensional framework for their designs.

Creating a program that allows formatting of both tables and columns is really not that difficult.

It leaves me wondering why the standards committees are forcing so much brain damage on the world in their pursuit of the idiotic ideal of trying to force inherently multidimensional structures into one dimensional hierarchical models?

In order to do the really simple task of aligning a column, I have to set a style tag on each cell in the column I want to align ( style="text-align: right" ).

Here is a Webmaster World Thread lamenting the same lack of thought on the part of the W3.

Tuesday, April 10, 2007

iFramed

I finally gave up on HTML Strict and fell back to HTML transitional. I really want to support the standards movement, unfortunately, the standards movement is off in its own separate universe and fails to give the web designing world what it needs.

IMHO, depricating the center tag was totally uncalled for. Centering text and objects is the fastest and easiest way to balance a web page. This is especially important since you don't know the size of the page on which an object gets displayed.

W3 probably saw the deprication of the ability to center objects as some great statement in their battle to separate content from presentation. Of course, while they got rid of the ability to align text, they require the width and height attributes for images. This means that you have to define the presentation of an images with a mix of attributes. So you have to define a imag as: width="100" height="50" style="margin: 0px auto 0px". If defining format is so all super critical why not go all the way and have you define it all in the style tag?

Anyway, I gave up on HTML strict so that I can use iFrames. The pages on the community directories (e.g. Grand Junction) have a Dex Ad at the bottom of the page. The ad is 5KB in length. The page itself is only 6KB. I figure I can reduce the load on the server by putting the ad in an iframe. HTML strict does not support the iFrame Tag. I had been tempted to place all ads in iFrames.

I imagine the browser makers and standard setters sitting in ivory towers battling over petty details of tags, while the population at large is the victim of their arrogance.

Saturday, April 07, 2007

A Table for One

We used to use tables, which worked well in this scenario—but forms don’t constitute tabular data, so it’s a semantic faux pas.

Nick Rigby, A List Apart


I know this sounds absurd, but I've been burning the midnight oil trying to come up with a new way to do HTML forms.

The ideals of CSS and DHTML say that programmers should not use HTML tables in design. Every single form I've developed uses tables. I want to be a good programmer ... so I've thrown in hundreds of hours to figure out how to do it the right way. Unfortunately, not a single one of the CSS/DHTML methods I've found for formatting forms has the elegance of placing the form in a table.

For nonprogrammers, here is a short summary of the conflict: In the first versions of HTML there was no way for web developers to set the margins on a web display. To make matters worse, the web browsers of the day scrunched the text of a web page against the edges of the browser, making pages hard to read.

It just so happens that HTML included table elements. Programmers quickly learned that they could overcome the shortfalls of HTML by putting all of the text in a table, and giving the table a margin.

Later versions of HTML included layout boxes called divisions and a layout language called CSS. The standards organizations then went on a crusade to remove tables from web design.

In a classic story of over reaction, the intelligensia went on a crusade to remove all tables from web pages. The ideal was to develop web sites with absolutely no tables. Group think dictates that the presence of a table in a web page is a sign of a second rate programmer. I admit it. I actually feel less of myself because I can not figure out a good way to make a form look good without using tables.

Anyway, while working late night sessions trying different ways to replace tables it dawned on me: The reason I want to use a table in HTML forms is because forms are, by their nature, tabular data.

I came to this realization simply by stepping back and looking at what I was doing:

I am first and foremost a database programmer. The web pages I design are generally about putting data in tables and displaying that data. In most cases, the purpose of the web form is to gather a row of data to place in a web form.

In database programming, you often find yourself working with a single row of data. A table with a single row of data is still a table.

It is customary to present tables in a top down fashion with the headers of the table in the top row and the data in rows. There is no universal law against displaying the data horizontally ... that is with the headers in the first column and each row in following columns. When dealing with a single data element, it is often cleaner to display the data in the horizontal fashion. For that matter, most drill down reports will display a table with rows of data. When you click on an item in the list, you will see the detail listed in a horizontal table. (eg, here is a list of books I've read recently. If you click on a book, the program shows the detail in a horizontal fashion.

A form is really just a blank row of tabular data.

Yes, using tables for the primary layout of a web page was a misuse of tables. The mania to replace all tables in web design with divisions was a similar misdirection. Using divisions and labels for displaying tabular data is as much a misuse of the technology as using tables for divisions.

Good web design is about using the proper design elements at the proper time. Reviewing Nick Rigby's comment: "We used to use tables, which worked well in this scenario—but forms don’t constitute tabular data, so it’s a semantic faux pas."

Nick Rigby and thousands of web designers have put themselves through a great deal of brain damage on the false premise that forms are not tabular data. For that matter, I contend that the reason forms and tables worked so well together is because forms are tabular in nature.

I wish I could get back all the time I wasted looking for ways to program forms without tables.