Using Browser Data by Keith Oustalet

One of the things you should keep in mind when developing Web Pages is the fact that not all Web Browsers have the same capability. The two giants of the industry, Microsoft and Netscape, are engaged in a battle for supremacy that will probably last for years to come. Both companies claim to be compatible with the latest HTML Standard, but at the same time they have both added proprietary features to their Browsers in an attempt to win Users over to their camp. While some of these features may be appealing to Web Authors, the result is that Browser compatibility issues are now more important than ever, and a way must be found to design Web Pages that take advantage of these new features without creating a maintenance nightmare for Webmasters.

On the other hand, we want to be able to create pages that take advantage of specific Browser features such as JavaScript, VBScript, and ActiveX, to name just a few, but we can't just send this stuff down the pipeline indiscriminately. In other words, we first need a way to find out which kind of Browser people are using when they visit our Web Site. Then we need a way for our Pages to react dynamically, based on that information, and deliver a Web Page that has been tailored to suit the needs of the situation.

To accomplish Web browser compatible or specific pages, heitml provides the Server Variable SrvUserAgent.

In conjunction with the heitml if Tag, this variable can be used to extend the capabilities of our Web Page Template, yet still maintain a structured and modular (i.e. "maintainable") Web Site.

Here's a look at some of the data SrvUserAgent might provide, depending on the User's specific Browser type:

• Mozilla/5.0 (Windows NT 6.3; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.100 Safari/537.36
• Mozilla/4.02 [en] (Win95; I)

• Mozilla/3.01 (Win16;I)

• Mozilla/3.01 (Win95;I) via proxy gateway CERN-HTTP/3.0 libwww/2.17

• Mozilla/2.0 (compatible;MSIE 3.0b; Windows 3.1)

• Mozilla/2.0 (compatible;MSIE 3.0B; Win32)

• Mozilla/2.0 (X11; I; SunOS 4.1.3_U1 sun4m)

Notice that the above data not only tells us which Browser version is being used, it also tells us what Operating System the User is running, and whether or not he came to us through a proxy. If this seems like a confusing variety of information to get from a single variable, don't worry. The important thing here is that in all cases the SrvUserAgent identifies what Browser a person is using.

But notice also that, in order to determine the Browser, we can't simply look at the first few characters where "Mozilla/x.x" appears to decide which features are supported. We also have to scan further into the string to see if "MSIE" is present, and, if so, which version of Internet Explorer is being used.

heitml has a built-in function called Contains() which checks to see if a specific string of characters is contained within a given Variable.

Here's an example of how this can be applied:

<if contains(SrvUserAgent,"MSIE 3") && contains(SrvUserAgent,"Win32")> Your Browser supports ActiveX <else> ActiveX is not supported on your browser </if>

In the above example the two &&-symbols represent a logical AND condition. In other words, only "if This AND That" are true the condition will be satisfied.

Two ||-symbols represent an OR condition, which means a condition is satisfied "if This OR That" is found to be true.

The example above is provided merely to show how you would build <if> statements that test multiple conditions. In a real-world application you wouldn't just print a message telling a User what features his Browser does or does not support. Chances are he already knows some of the strengths and weaknesses of his given Browser and, for reasons of his own, has decided to stick with it.

Instead, the if Tag, Contains() Function, and SrvUserAgent variable should be used with the thought in mind of using information about your Users to later help you dynamically assemble and ship versions of your Web Pages that best take advantage of the capabilities of each User's Browser.

Imagine, for example, that you want to design a re-useable code module to be placed at the top of every Web Page you develop. This code module would be designed to interrogate the SrvUserAgent variable and set values to Global Variables. These values would then tell your application what features should or should not be included in a Web Page. In effect, they would serve as "Guides", creating different views of your Web Pages to different Users.

Here's one way you might do this. We'll first define a Tag to test the configurations. Here we will only check for ActiveX and VBScript to keep the example comprehensive.

Example:

NewLayout.hei

<def SetUserBrowserValues; // Initialize Global Variables to "false" gl.ActiveX = false; gl.VBScript = false; // Test for Browser & OpSys. if contains(SrvUserAgent,"MSIE 3") && contains(SrvUserAgent,"Win32"); gl.ActiveX = true; gl.VBScript = true; else if contains(SrvUserAgent,"MSIE 3") && contains(SrvUserAgent,"Windows 3.1"); gl.VBScript = true; else if contains(SrvUserAgent,"Mozilla/3") && contains(SrvUserAgent,"Win32"); gl.VBScript =true; /if; /if; /if; /def>

Notice in the above example that that we first set the Global Variables to false as a safety valve . This assures that no ActiveX or VBScript specific features will be launched unless it has been determined safe to do so.

Then we created <if> statements to test the SrvUserAgent variable. Obviously if your Web Pages never use ActiveX or VBScript, there is no need to test for them. The point here is, that no matter what special features you would like to build into your Web Pages, a test must be done to see whether or not they can be used to display your pages in the manner in which they were intended.

Notice here that, instead of constantly opening and closing our heitml Tags with "< >" symbols, we simply separated them with a semi-colon. As you can see, the heitml alternate syntax is closer to what you would expect to find in a programming language because, in fact, heitml is a full-featured programming language. We think you'll find that, as your Web Pages become more heavily populated by heitml Tags and control statements, you will come to depend on this syntax, simply because it makes your code easier to read and understand.

You don't have to use this "programming" syntax if you don't want to, but it provides an easy method of separating heitml Tags from standard HTML Tags, thus helping you to keep track of when you are in "programming mode" and when you're in old-fashioned "text mode" (i.e. HTML mode).

Next we call the tags at the beginning of each Web Page, and launch the ActiveX or VBScript modules depending on what we now know to be true:

Sample.hei
<include name="NewLayout.hei"/>< olPage; SetUserBrowserValues; if gl.ActiveX = true; LaunchActiveXmodule; /if; if gl.VBScript = true; LaunchVBScriptmodule; /if; if gl.ActiveX = false && gl.VBScript = false; PlainHTMLpage; /if; MoreStuffGoesHere; /olPage>

You don't have to use this "programming" syntax if you don't want to, but it provides an easy method of separating heitml Tags from standard HTML Tags, thus helping you keep track of when you are in "programming mode" and when you're in old-fashioned "text mode" (i.e. HTML mode).

One final thing to notice about the above example is that you no longer see any HTML Tags at all in the Sample.hei file. HTML is a Document Description Language. heitml is a modular Programming Language. The more highly structured and modular your code is, the more insulated you are from the underlying HTML formatting details. HTML Tags are still very much a part of heitml programming, but they don't need to clutter up your code, making it difficult to read. If you want to make changes to the HTML formatting modules, your merely have to go to where those modules were defined. Otherwise, they stay out of your way, allowing you to examine the flow of your application from the perspective of a high-level overview.

Summary

In this section we introduced just two of the special heitml Server Variables that are available to give you information which can be used to create Pages that respond dynamically to suit the needs of a given situation.

We showed how the if Tag and Contains() function can be used to control the way a Web Page is created, at the same time preserving the structured/modular approach we introduced earlier. This method of dividing your pages into independent and easily modified modules is the key to adding features and complexity to a Web Site, without creating a maintenance nightmare for your Webmaster.