Join James Williamson for an in-depth discussion in this video Learning HTML, part of Introduction to Web Design and Development.
- HTML is one of the core skills of any web designer. And should be one of the first things that you master. Knowing where to start can be tough however. So, I wanna cover some of the very basics and give you an idea of what to focus on. If you understand just a few of the basic concepts of HTML the process of learning it becomes much easier. First, remember that HTML is a markup language. It uses tags to mark-up content on the page which it then identifies it as a specific type of element.
Elements are the core building blocks of HTML documents. Most have an opening and a closing tag that wrap the content inside of it. Take this paragraph, for example. In this case the "p for paragraph" tag is used to identify this text as belonging to a paragraph. Noticed that the closing tag has a "/" to signify the closing of the element. A lot of people tend to confuse the terms tag and element.
Tags refer to the actual tags themselves while an element is the tag plus its contents. You can also pass on more information about elements by using attributes. Some attributes are used to give necessary information. Such as where to find an image or where a link should point to. While others simply help give the element meaning. As you can with the class attribute that we use here that helps further identify the paragraph content.
So, HTML documents consist of elements arranged in a specific order that helps structure the page's content. Attributes can be used to give further meaning to elements or to supply critical information about that element to the browser. With that in mind, here's what I recommend focusing on when learning HTML. First, focus on the basics of HTML syntax. There are rules for nesting tags inside of other tags to control the process of structuring documents.
Other rules guide the basic structure of HTML documents and when certain tags are required. Learn the rules and restrictions around structuring elements so that your documents are built correctly and without errors. Next, study the most common HTML elements. Elements like paragraphs, headings, lists and tables make up the bulk of HTML documents. Concentrating on those first will minimize distractions and promote properly structured content.
As you learn elements be sure to focus on which attributes are available for them, what values are accepted for them and when they're appropriate to use. If you're like me, trying to memorize a ton of tags and their attributes can be a bit of a chore. And that's why I recommend researching common page elements and the best practices around structuring them. Find out the recommended practices for marking-up addresses, quotes, product listings, blog posts and other types of common page elements.
You'll not only learn a lot about the individual elements themselves, but how they fit together to properly structure content. You'll also learn that not every designer agrees about how to mark-up specific content. Much of how you structure your content will depend upon your own personal preferences. So, researching how other designers do this will help you form your own opinions. You should also spend some time looking at the HTML5 sectioning elements. These elements like article, nav and section were designed to help create more meaningful documents.
Learning when they're appropriate can help you create more semantic pages. That should give you a good idea at how to approach learning HTML. Now, at the end of this course I'm gonna share a few resources with you that can make that process even easier.
This course is part of a Learning Path approved by the American Marketing Association.
Gain the skills you need to become an AMA Professional Certified Marketer (PCM) in Digital Marketing by using the industry-leading courses and resources in the Learning Path. Take the AMA certification exam to show that you have what it takes to lead the digital transformation.
- What is web design?
- What is a web designer?
- Learning to code
- Choosing a web host
- Working with a CMS
- Exploring how websites are structured
- Choosing your framework or software
- Designing with standards and accessibility in mind