Hi, I'm Dr. B and welcome to my digital composing instructional video series.
In this tutorial, I cover basic HTML markup.
Specifically, I discussed the difference between block level elements and inline elements.
As I said in a previous tutorial, HTML tags are semantic keywords that help an Internet browser understand how to format the content of an HTML document.
We call HTML a semantic markup language because most of the predefined HTML tags are semantically linked to the type of formatting they produce.
In other words, as shown in the example here an h tag will always represent a heading and a p tag will always represent a paragraph.
Most HTML tags can also be defined as block level elements or inline elements.
The difference between a block level element and an inline element is pretty simple.
Block level elements like the h and p tag shown in this example usually start and end with a new line.
In other words, they automatically add a line break before and after the content being formatted.
As you can see, they're also called block level elements because they block out an entire section of the web page regardless of how much content is added between the start and end tags.
Inline elements like the emphasis tag and the strong tag highlighted by the red boxes in this example, on the other hand, only affect the content you put between their start and end tags.
In other words, as shown here, they do not add any additional line breaks or add any additional space to our website when we include them in our HTML documents.
When marking up content, it is important to understand that all of your content should be surrounded by a pair of open and closed block level HTML tags.
It is also important to note that when marking up content you can put inline elements inside block level elements as shown in this example here.
But you cannot put block level elements inside other block level elements.
If you do, your content will contain a number of line break errors and your web page will not display properly.
In the rest of this video tutorial series we will be putting this knowledge to work.
So before watching the rest of the video tutorials, make sure you have access to an HTML editor.
For now, the thing to remember is that when marking up content, most HTML tags either work as block level elements and automatically create line breaks in your content or they can be defined as inline elements and do not add line breaks to your content.
That's it that brings us to the end of today's tutorial.
I hope you enjoyed today's tutorial and that you are enjoying building your own digital compositions.
As I always say, thank you for playing along and for trusting in the process.
Dr. B’s instructional video series is brought to you in cooperation with the Bacha Design Group.
For more information about the Bacha Design Group, or to view more tutorials, please visit us online at jeffbacha.com.