Basic Web Design Video Course – Basic HTML Tags, Structure & CSS [Part 2]

Howdy, guys, it’s Mike here again and this is the second part of our “Basic Web Design Video Course”. This time we will talk about the tools needed before starting out with HTML and CSS,  then we will learn the most commonly used HTML tags.

For this tutorial, we will only cover the tags that are very useful to beginners, we will cover more tags at a later time. Then, we will style the tags using basic CSS properties. No worries guys, in the next videos we will go more in-depth and learn together.

Have you seen the first part?

If you missed out the first chapter make sure to watch it!


Download: PSD Template

Part 1: Basic Web Design Video Course – Wireframing, Photoshop Tools & Panels, and Designing
Part 2: Basic Web Design Video Course – Basic HTML Tags, Structure & CSS Properties
Part 3: Basic Web Design Video Course – Complete HTML Markup & CSS Styles

Final Product

1wd-basic-web-design-video-course

Preparation

Text Editor

Windows

Mac

HTML Basic Tags and Structure

We will talk about the most commonly used tags that you’ll see on a website. We will cover headings, paragraphs, links, images, list items and divisions. Also we will familiarize ourselves with the basic structure of HTML markup and how to open and close a tag.

Basic CSS Properties

In this video we will learn to style a certain element or tag using CSS properties by changing width, height, colors, floats, etc. Using these basic properties we can turn our HTML markup into a well presented website.

Now that we have finished positioning our layout structure we can now proceed to the next part, which is marking up the HTML of our very basic design template and completely style it using CSS.

So, that’s it for this part. I hope you learned something and found the videos helpful. If you have any suggestions regarding the videos, or how I presented them, please leave a comment below. I’m really excited to hear your thoughts in the comment section, see you guys down there.

Michael John Burns

Michael is a Web & Graphic designer based in Philippines. He started designing during his teenage years and most of his skills and knowledge are self taught. He's dating with Photoshop for about 4 years now and been flirting with HTML & CSS from 2011 to present. See his works at burnstudio. Other than that he loves Coffee and his Girl.

15 Smart Tools To Help You Build Your Freelance Business

Discover the awesome tools we use in making our clients comfortable and happy in learning new things every day.

Download Now

Comments

  1. cynthia mcardle says

    Great blog! This is indeed so informative and useful as well especially in web designing. Thanks for sharing this awesome article!

  2. John says

    Thank you so much for this post and these videos, this has actually been incredibly helpful.

    And Stephan Luck, thanks very much for the link.

  3. says

    great video for beginners and first time i m learn about these html tag i m getting something new thing from this tutorial.

  4. says

    Simply desire to say your article is as surprising. The clearness for your put up is
    simply excellent and i could suppose you’re a professional in this subject. Well along with your permission allow me to seize your RSS feed to keep updated with drawing close post. Thank you one million and please keep up the rewarding work.

  5. says

    Never thought I could find a site webdesign talking about CSS, I will always be here! \ o /
    that other issues already discussed here?

  6. says

    Hi Michael,
    Thanks once again for taking the time and effort to present these videos. Although they are basics, I have (still) to catch up and learn HTML5, so it was good to see the new tags. Also thanks for introducing me to Intype. I have been using Dreamweaver/Notepad++ but I think I will give Intype a go, it seems really useful and more designer/developer friendly than Notepad++

    Look forward to next part.
    Will you be doing more advanced tutorials in HTML5?

    Cheers,
    Mike

    • says

      Hello Mike,

      Cool Name same as mine. Glad this to hear that this video makes you catch up with the basics of HTML 5.
      Yeah! Intype for me is so good. I’ve been using this for about 2 years and I have no problem with it.

      I still don’t know yet Mike, hopefully soon.

      Thanks,
      Michael

  7. says

    Thank you Michael, I needed this tool before to use HTML. I come back soon to tell you if it works.

    Best regards