Subtitles of the Movie

In this tutorial we do a brief review over HTML. HTML stands for Hyper Text Markup Language and is the foundational structure in which we have to build everything else for web-based presentation. Every tag or HTML element that is placed on the page around specific content has a logical significance. It is this structure that we are going to be dynamically changing with JavaScript. It is also through this logical markup that we are able to share our information across platforms, from cell phones to monitors to screen readers. I like to think of HTML as the bones that the rest of the web page rests upon. Technically, these bones are references as the DOM, or Document Object Model and the DOM is a hierarchical way of looking at a document which allows us to navigate the document and find the elements we're looking for. So if we take a look, here we have kind of a code sample; very simple code sample showing the relationship between our elements. Now, at the root level we have the HTML tag that contains all the other tags. So inside of the HTML tag we have the head tag as well as the body tag. Both sets of these tags are known as the children of the root. So the parent of the head is HTML. Head also has a child element known as title. The body also has children; H1, which is heading and paragraph. H1 and paragraph are siblings and have their parent in body. So there is relation between the elements inside of our HTML documents. This is going to be handy to keep in mind when we're trying to traverse our Document Object Model. Now, when the browser reads our HTML documents, it's going to read documents from the top to the bottom. When it encounters elements, it's going to attempt to render them. Now, once the browser finishes reading everything, it says OK, I'm done loading the page and it triggers an even called On Load. There are a number of other events that are tied to your browser that can end up triggering other things to occur, specifically with JavaScript. Now, other aspects of HTML here is that all of our HTML elements are going to be referred to as tags. We're going to have basically three different types of tags; in-line tags, block tags and form tags and here you're seeing kind of samples of the different tags that are available. I do mention the span tag in the in-line and the Div tag in the block and these are going to be used quite a bit for manipulation because these are really the only tags in HTML that don't really have strong, logical meaning. Span just indicates that it's a selection of text. Div is logical division so logical division has a bit more of a meaning attached to it than span but these are going to be our generic content containers for most of our applications. Below that we see that we have attributes. The ID, Style, Class and Title are four of the different attributes that you're going to be able to apply to any of your HTML Tags. Now, of course, there's more of these universal tags but these are the ones that are going to be really important to us whenever we're doing our JavaScript manipulations. Also, when dealing with forms, the type, value and name is going to be very important as well. So that's the extreme basics of HTML. For full information, please visit W3.org as they are the maintainers of the standard four HTML and that's where you're going to be able to find out all about any new revisions to HTML or other web standard technologies.