Monday, April 30, 2012

HTML Notes from BC's Website

Hypertext.  This is simply text, not far off from what I am writing now.  The difference is, when viewed via a Web Browser, it exhibits certain behaviors.  Here is an example:

<a>Google.com</a>

 
Markup.  That’s what we just did.  We took some text: “Click here to Search!” and marked it up so it will now act as a link.  HTML does many things, yet is essentially a way to format your text: make it big, bold, green, add an image, place a video on the right side of a page, or many other things.

Language. HTML is not a programming language, it is a markup language.  What is the difference? Programming languages tend to be able to perform logical tasks, numerical and text manipulation, error handling, etc.  HTML primarily is a formatting language.  There are some variations:

DHTML.  This is a dynamic HTML. It is a way to make pages more interactive and animated; however, it does this by adding using other languages in addition to HTML.

XHTML.  Extensible HTML. Okay...let’s start with XML, eXtensible Markup Language.  XML is a machine-friendly way to code for a web page.  Think about an e-tail web page that displays products for sale.  Each has a description, price, weight, reviews, number/code, images, and so forth.  If I make my page only using HTML, it is very difficult for me to take all that data and put it into any other application: a database, another web page, a spreadsheet.  To do this, I might screen scrape, and either write a bunch of custom code to try and extract the data and reformat it, or I might even just write it all down by hand.

Whereas HTML is concerned with the format, that is, how things look on a page, XML describes what is on a page.  Both languages can be used together, but using XML which has stricter rules and many industries share common standards about which XML tags to use...my web page now becomes readily shared between computers.  The data are described on a page, therefore, I can pretty easily take the data on my page and consume it on another page, put it in a database, or any other application. 

Think about RSS (real simple syndication) feeds. When I subscribe to a web page, I can read all the new posts and articles without ever going to that page.  For example, using Google’s RSS reader, I can subscribe to all my favorite web sites and read them all in one place.  The display and format are up to me and my reader, I’m just taking the data and displaying it on my own terms.

Another outcome are mash ups, where data from two websites can be put together to make something new.  Think of taking the weather, or traffic, or crime reports and overlaying them on a Google Map.

HTML5. This is the newest standard for HTML.  It is more robust than previous versions, adding many tags and elements that are better suited for mobile and tablet and social.  It’s an upgrade to respond to the trends of how people use the web.  The point is, if you adhere to HTML5 standards, then you can rest assured that most of the popular web browsers and devices (e.g. a tablet or smart phone) will render your web page correctly.  Standards are optional, and sometimes a browser like Internet Explorer or Firefox will disagree with the standard and have slight variations.  

Think of it like this.  The English language and grammar rules are a standard; yet how closely are they followed in all of our writing or on the web?  Not very, but close enough to get the point across.  With HTML5 or any other web standard, it is the same: the more you adhere to it, the more universal you message will be received. 

CSS. Cascading Style Sheets.  These are another big deal and together with HTML are where you need to start to learn how to code.  CSS are just HTML, but contain all the style elements.  For example, if I want all of my links to be a certain size, font, or color, I can make a style tag that will set all links on all my pages to adhere to that.  This saves me much time instead of coding all of those individual links, and if I want to change it ever, it is all in one place.  I can also choose just to make a subset of links or any other element on my page adopt a certain style.  

Web Browser. Microsoft’s Internet Explorer, Google Chrome, Apple Safari, Mozilla Firefox, and many more.  Did you know that you can make a web page by just editing a simple text file (e.g. Notepad) and choosing to “Save As” or renaming the file and typing in the file extension: .html or .htm.  It will then pull up as a web page.  

No comments:

Post a Comment