Sunday, August 21, 2011

Web language Revision

I'm probably stretching the definition of revision here. My only formal tuition in web languages was in HyperText Markup Language (HTML)(1 - except there was no number then) and it wasn't very formal. From memory it was a free one hour lecture provided by UWA to encourage research students to use the new medium to publicize their work.

Anyway, disappointed by the Mozilla Getting Started with JavaScript page, I went back to a Google search on "JavaScript Tutorial" and W3Schools was on top of the list again. Curious, I checked Wikipedia to find:

W3Schools is not affiliated in any way with the World Wide Web Consortium (W3C). It is created and owned by Refsnes Data, a Norwegian family-owned software development and consulting company.

Affiliated with W3C or not, I liked the style of their PHP tutorial, so I checked out their JavaScript tutorial. Listed as required knowledge was HTML and CSS, and a link was provided to their Home Page, in case of any doubt. I followed the link, because the initials CSS meant nothing to me. And listed with CSS were the languages of the web - HTML, and XHTML. So I decided the time had come for a refresher and catch up on what has happened in the last fifteen years.

I noted a few more formatting tags than were available in the olden days - whether one really needs them all or not is another question. Styles are completely new to me, and it looks as if I have been doing a few things wrong, or at least, not consistently with current standards. But at least I have a jogged a vague recollection that CSS stands for Cascading Style Sheets. I also noted on the images page that the language and syntax of what used to be the ismap attribute has changed a lot. It's not something I use much, but I now have an easy link to the correct form if I need it.

Forms came in well after my time. I've cribbed other people's code, but it's nice to see it all laid out properly. Frames came a little after my time (HTML2 I think) and I never liked them. I was pleased to read that they are being phased out and will not be supported in future HTML versions. The Iframe is completely new to me. Defined as a web page within a web page, I can see there might be applications for it.

When I was a boy, you began an HTML document with the HTML tag, and that told the browser what type of document it was. Nowadays, apparently, you need a document type declaration as well. In practice you can get away without it with ordinary HTML documents (none of the pages on my web site use it), but perhaps you need it for other document types, such as XHTML.

This brings me to the tutorial on EXtensible HyperText Markup Language (XHTML), which I am surprised to learn is simply a stricter and cleaner version of HTML:

XHTML consists of all the elements in HTML 4.01, combined with the strict syntax of XML.

  • XHTML elements must be properly nested
  • XHTML elements must always be closed
  • XHTML elements must be in lowercase
  • XHTML documents must have one root element

An XHTML document must have a DOCTYPE declaration. The html, head, title, and body elements must also be present.

Next came the tutorial on the search term which led me into this - CSS. To be honest, now that I have confirmed what the initials stand for, I can't see that it will be of much use to me. For my purposes, the "styles" defined in HTML(1) - H1, H2 etc - were more than enough for me. I'm not looking to edit a magazine here; I just want a page to host my Applet. Just in case, a style sheet is referenced inside the header as follows:

<head>
<link rel="stylesheet" type="text/css" href="mystyle.css" />
</head>

And the style sheet itself is simply a text document saved with the .css extension and written out something like this:

hr {color:sienna;}
p {margin-left:20px;}
body {background-image:url("images/back40.gif");}

And the "cascading" works as follows:

Generally speaking we can say that all the styles will "cascade" into a new "virtual" style sheet by the following rules, where number four has the highest priority:

  1. Browser default
  2. External style sheet
  3. Internal style sheet (in the head section)
  4. Inline style (inside an HTML element)

So, an inline style (inside an HTML element) has the highest priority, which means that it will override a style defined inside the <head> tag, or in an external style sheet, or in a browser (a default value).

The tutorial goes on and on, but I think I have what I need for now. And that's it for what W3Schools calls the HTML group of tutorials. When I saw XHTML in there I was hoping it might be just a trendy way of saying XML, but I see now that it is part of a whole group on its own, so it is probably worthy of its own blog entry.

No comments: