This web page created by Kathleen M. Weber on February 4th, 1998.
In HTML you will come across tags which may work in one browser but not another. Sometimes, this is because a tag has fallen out of favor (Perhaps it was not used a lot or a better way of doing it was found.) and has been "dropped" from the newer versions of HTML.
More often it is because this tag set has been designed by the maker of a particular browser for use specifically with their product. Examples of browser specific tags are the <BLINK> </BLINK> tag set which is used in Netscape only to cause the text in between to blink and the <MARQUEE> </MARQUEE> tag set which will make the text between the two tags scroll across the page in Internet Explorer only.
It is because these tags were designed to work on a specific browser that they are called browser specific or sometimes browserisms.
Is it "bad" to use a browser specific tag? Well, it would be less than optimal if you use the <MARQUEE> </MARQUEE> tags because you want the visitors to your page to see the text scroll across the page and they are using Netscape to view the page. Netscape users would see the text sitting still not moving as you intended.
It's probably a good idea to avoid browser specific tags unless it makes no difference to you how the visitor sees the page. Sometimes, browser specific tags can cause the whole look of a page to be different on another browser.
Intro to HTML 4.0
In December 1997, the World Wide Web Consortium (W3C) issued a "recommendation" for acceptance of new version of HTML, HTML 4.0.
HTML 4.0 provides improvements in several areas which allow for greater design control over web page creation and increased accessibility to web users who are using browsers which read the text aloud.
Most people associate the changes to HTML with the adoption of HTML 4.0 with the adoption of the two things which have received the most "press": Cascading Style Sheets and Dynamic HTML. The high press coverage seems to be deserved because these additions are quite literally the future of HTML. Together they add to HTML much more creative freedom for web designers. Among other things, Cascading Style Sheets offer precise positioning of elements on web pages, alternative ways of altering the page such as setting colors and text styles, and allowing for the same style to be applied over any number of web pages without coding each page individually. Dynamic HTML can make pages more visually exciting. Other changes to HTML include attributes which allow for tables to be written in such a way they take less time to download and can be laid out so that text-to-speech readers can interpret them better. Frame improvements and form improvements are also big parts of HTML 4.0. While we will be covering a few points of HTML 4.0 in this class, explaining all of the changes and enhancements to HTML in HTML 4.0 is beyond the scope of this class, but reading further and studying all aspects of HTML is highly encouraged. Here are a few resources to get you started.
HTML 4.0 Resources
Required reading
HTML 4.0 Fact Sheet
Best concise explanation of the changes from the W3C.
Suggested Reading
20 Questions about HTML 4.0
Easy to digest format, see if your question is there.
Other Resources
The Complete HTML 4.0 Recommendation
Intro to Inline Styles
NOTE: This portion of this document will appear significantly different to users of browsers which do not support the addition of Style Sheets. In my opinion it is best viewed with Netscape 4.03 (Communicator) with I.E. 4.01 coming in a close second. Some changes will be viewable in I.E. 3.0. If you would like to upgrade your browser, Netscape 4.0 is available on the V.U. web site at the Free Software page. If you are interested in I.E. 4.0, visit the Microsoft site. You should also be aware that the method used to effect the style changes in this area is not the only one available in Cascading Style Sheets. It is simply the one chosen for simplicity and this demonstration.
Style Sheets are probably the most interesting and perhaps most important part of HTML 4.0. Style Sheets represent a way to control the formatting and layout of web pages with a greater degree of control than HTML is able to do. Style Sheets, in their simplest form known as inline styles, offer the web author an alternative way of setting the values for items such as text color, text size and text style within a specific part of a document by applying the attribute STYLE to any HTML tag. While using Style Sheets in this way is far from the most efficient way of using them, it does provide a way to familiarize oneself with some of the basics of applying style and can help serve to illustrate some of the problems.
The heading on this part of the page, which consists of centered red text on the black background, was created with the application of an inline style within the <H1> tag. This method of applying style to web pages is almost indistinguishable from using HTML tags with attributes and values. Below, in navy text on a light blue background is the the example HTML code for the inline style sheet which makes up the heading for this page. Note that included within one tag are a change of text color, background color and alignment. Adding this information for style directly to the tag for the <H1> eliminates the necessity of typing a separate HTML tag for color and alignment. It also allows a change the background color more than once within a document, which is a feature that had not been previously available in HTML!
Not only can Style Sheets perform functions such as centering text or changing the font color, they can do much, much more. (Some of these will be discussed in a later lesson.) In addition to the inline form of style sheets, they can also be written so that they can affect an entire HTML page by placing the information to be altered in the <HEADING> of the document (called EMBEDDED Style Sheets). style sheets can also be created as separate documents which can then be referenced across a number of HTML documents and affect them all identically (known as LINKED style sheets)!
It is due to the increase functionality which style sheets offer to the web author that the use of them will eventually replace the tags for which they can perform the same functions. With the adoption of HTML 4.0 as a recommendation of the W3C certain tags currently in use are being "deprecated."
Deprecation sounds pretty bad but what it means is that certain tags, such as <CENTER> </CENTER> are gradually being phased out but will continue to be supported by HTML at this time (termed backwards compatibility) for the sake of older browsers.
Should you use style sheets?
That's a question which web authors must answer for themselves, although right now it looks like style sheets are a promising newcomer with a way to go before widespread use is feasible. Unless you can be sure all or most your page's viewers are using a browser which support HTML 4.0/style sheets (such as in a corporate setting when all of your viewers are using the same browser.) then you should keep in mind that those with other than the newest browsers are not going to be able to see your effects at all. Also, as you can see if you read through the section "How Inline Style is Interpreted in Different Browsers" you will see there are still problems/differences between the newest of browsers! Even though a particular tag,such as the <FONT></FONT> tag set, might be considered deprecated, such a tag can at this time still be viewed and properly read by browsers which support HTML 4.0/style sheets.
Should you learn about Style Sheets?
DEFINITELY!!! The increase in what you can do with style sheets and the ease of which it can be done are reasons of their own to begin your learning NOW. This introduction to the most basic of basic things which can be done with Style Sheets is only the beginning.
Let's Do An Example:
For demonstration purposes, let's say we are making a web page and we have decided we would like a couple of words within out web page to really stand out from the rest and in order to do that we want
First we must set apart the text to be altered. Since we want to change a part of the text in the middle of a paragraph, we can accomplish the desired effects by using the <SPAN></SPAN> tag set. This allows us to specify which text to apply without causing a line break.
Inside the opening tag of the SPAN set we will then add the attribute STYLE thusly:
Next we need to specify the values for the style to create the effects. We want the text to be yellow, so we add "color:yellow".
We also would like there to be a red background around the text, so we specify "background:red". Surround the style values (the information following STYLE=) with quotation marks.
Note: In order to make changes to several aspects of this section of text, the changes are linked together by placing quotation marks around all of the changes and using a semi-colon between the individual changes.)
Finally we want the text to be italicized so we add "font-style:italic"
We would then add the word or words which we want to be affected and then close the </SPAN> tag set.
The result looks like this:
A "Web Test": How Inline Style is Interpreted in Different Browsers.
For this inline style test the portion of the lesson with the inline styles inserted was viewed in Netscape 2.02, Netscape 3.01, Netscape 4.03, Internet Explorer 3.0 and Internet Explorer 4.01. All of these versions were running under a Windows 95 environment.
In both Netscape 2.02 and Netscape 3.01 the elements of the inline styles were lost. The browsers did still interpret these HTML tags, the <H1> and the <B> tags, which are standard in HTML. The browsers ignored the additional style elements which had been added into those tags .
I.E. 3.0 interpreted the background color changes around the text, the italicization, and the larger font sizes. It did not however center the <H1> nor did it recognize the <B> tag even without the additional style!!
Netscape 4.03 did a good job of interpreting the inline styles. In the areas where the background color was changed, Netscape 4.0 only changed the background around the text element to which the inline styles had been applied itself. Netscape 4.03 did not recognize the application of the inline style for color in the <HR> tag, which in my opinion is a shame!
Internet Explorer 4.01 also did a good job of interpreting inline styles as coded. Like I.E. 3.0 it did not recognize the style request to center the <H1> tag. However the MAJOR exception seemed to be the way I.E. 4 handled the change to the background color around the HTML tags to which inline styles were applied. The background color extended across the entire page rather than just around the text portion of the element. This made for a really awkward looking arrangement in my estimation. I.E. 4.01 was able to interpret the color change applied to the <HR> tag.
End of Study Tips for 01/27/98.
This web page created by Kathleen M. Weber on February 4th, 1998.
