Friday, May 04, 2007

Got Style?

Photo Sharing and Video Hosting at Photobucket

When you read a web page, like this one, it is put together using a language called HTML (Hypertext Markup Language). Web designers -- I'm referring to professionals here, not the wannabes doing volunteer work -- must become proficient in writing and understanding such code, rather than merely using page-layout software such as Dreamweaver or FrontPage. In addition, there has emerged the existence of what are called "cascading style sheets," or CSS. Rather than assign styling attributes to the text "in line", a separate portion of the web page defines these styles, so they can be altered globally from one file.

In the last three or four years, the role of CSS in web design has risen in prominence. This has occurred hand-in-glove with what developers call "standards compliance," a means of writing code so that a site can be read on all major browsers -- Firefox, Internet Explorer, Netscape, among others -- with equal compatibility. An international standards group known as "W3C" has labored to ensure voluntary compliance. (Sites that guarantee such compliance show the association's trademark at the bottom of their home pages.) Without the means to truly enforce industry trends, it has been an uphill battle, but necessity and higher expectations for design and usability are helping them win the day.

To this end, the existence of "external CSS" has become the norm, whereby a link in the HTML page code refers to a separate file with a ".css" extension. Why should a webmaster go through every page of a site, when he can simply go to one independent file and make global changes even more effectively?

This development still leaves us with the use of tables, to align text and images both vertically and horizontally. Even with external style sheets and javascript code, "table rows" and "table data" cells are still applied in-line, even to most professional web sites.

And so, the next phase of development is emerging, known as "CSS-based layout." At this level, all parameters of appearance, placement, and presentation are contained in the external CSS file. Working only with a plain-vanilla text file on a web page, the designer can apply any number of different style sheets any number of different ways.

The model of choice for demonstrating this capability can be found at the CSS Zen Garden, ( Serious web designers are invited to appropriate the plain text version of the main page, and submit style sheet solutions of their own. Numerous examples of other aspirants are provided at this site. The variation of results is most impressive. The point is, NONE of the text of the site is changed; only the appearance.

External files are particularly useful with programming languages such as Javascript. Serious hackers find it harder to brake proprietary code -- thereby interrupting the flow of e-commerce -- that cannot be read by clicking on "source" in the "view" menu. In addition, elaborate coding sequences and database links embedded in a ".js" file, can also be altered to meet changing client needs, without disrupting the appearance of a large and multi-faceted corporate site.

From the time I entered the Art Institute in the fall of 2004 to the present, the "state of the art" went from internal style sheets with table cells to external CSS-based layout without a "tr" (table row) or "td" (table data) in sight. Being a part-time student, there emerged a gap between my learning the old way of a few years ago, and what is being expected of me now. Even in the space of only three years, this has now come to bite me in the hind-quarters in my studies of scripting languages. I have spent the last five weeks, effectively trying to grasp two subject matters in a course alloted to only one. Both cannot be taught effectively in such a setting, and with mid-term grades due out next week, yours truly finds himself transformed from an honor student with a 3.8 GPA, to a would-be slacker in serious jeopardy. Fortunately, a serious sit-down session with the department head, and a three-way conversation with the professor, betrayed a situation that was allowed to get out of hand too easily, and not necessarily at the fault of the student. So they're going to work with me to dig my way out of this. I get to sit in on a CSS class on Saturdays for the next several weeks, and every week, I'll report to my professor on how I'm catching up on programming.

Even if I end up withdrawing before the end without penalty, and taking the class over in the fall, I will have gotten what I would have had to pay someone to give me anyway. In any case, it's even more work now, and much less disappointment in the end.

It shouldn't have come to this, but it did. One reason why your prayers have been appreciated. The others will come in due course, as we "gird our loins" for the job that needs to be done.

1 comment:

M.Z. Forrest said...

It is a little deeper. Basically, it has to do with the development cycle. Ideally, designers can perform their work with very little input from developers, and developers don't have to consult designers whenever they want to make a change. CSS is ideally suited for team development. Designers can't program, and programmers can't design worth a lick. (No, I'm not talking about writing an HTML page as programming. More PHP, ASP, jsp, etc.)

In regards to positions, you should be able to avoid tables in layout with proper utilization of float and relative values in the position attribute. It does take a little getting used to though.

Keep having fun and good luck in your education.