Join over 55,891 Subscribers Today! FREE UPDATES!
Get The Only Freelancer crash course you will ever need to read!
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
Windows
Mac
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.
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.
Get The Only Freelancer crash course you will ever need to read!
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. Other than that he loves Coffee and his Girl.
Friday, March 22nd, 2013 09:42
Great blog! This is indeed so informative and useful as well especially in web designing. Thanks for sharing this awesome article!
Thursday, March 21st, 2013 17:14
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.
Tuesday, March 19th, 2013 02:43
great video for beginners and first time i m learn about these html tag i m getting something new thing from this tutorial.
Friday, March 15th, 2013 11:50
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.
Tuesday, March 12th, 2013 20:20
Never thought I could find a site webdesign talking about CSS, I will always be here! \ o /
that other issues already discussed here?
Monday, March 11th, 2013 02:24
Thanks for sharing, these are some great tutorials I will be sharing with my beginner friends!
Thanks,
Tim
Sunday, March 10th, 2013 15:26
here is a really good editor http://www.sublimetext.com/2 too, because i missing it in your list.
But thanks for your tutorial
Friday, March 8th, 2013 05:03
It is really an awesome tutorial. It is great for the new learners. Thanks for sharing this awesome blog.
Thursday, March 7th, 2013 08:21
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
Thursday, March 7th, 2013 01:31
Such a nice tutorial, thanks for sharing it. HTML5 is way better than other programming languages.
Wednesday, March 6th, 2013 11:34
Why the first part don’t have 720p?? :( I can’t see that clearly..
Eager to see this part ;) Thanks for this
Wednesday, March 6th, 2013 09:58
Thank you Michael, I needed this tool before to use HTML. I come back soon to tell you if it works.
Best regards
If not, then it's time to learn how to:
You can trust 1stWebDesigner to help you become a better web designer!
- Jacob Cass | Just Creative
Just enter your name and email below and click Get Updates!
David
Wednesday, March 6th, 2013 09:58
Thank you Michael, I needed this tool before to use HTML. I come back soon to tell you if it works.
Best regards
Mike
Thursday, March 7th, 2013 08:21
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
Michael John Burns
Friday, March 8th, 2013 09:56
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
Evaclay
Friday, March 8th, 2013 05:03
It is really an awesome tutorial. It is great for the new learners. Thanks for sharing this awesome blog.
Michael John Burns
Friday, March 8th, 2013 09:57
You’re welcome Evaclay :) Watch out to the 3rd Part.
Faisal
Thursday, March 7th, 2013 01:31
Such a nice tutorial, thanks for sharing it. HTML5 is way better than other programming languages.
Fahim
Wednesday, March 6th, 2013 10:21
Thanks for the tutorial…It’s really helped me so much.
lawrence77
Wednesday, March 6th, 2013 11:34
Why the first part don’t have 720p?? :( I can’t see that clearly..
Eager to see this part ;) Thanks for this
Michael John Burns
Wednesday, March 6th, 2013 23:35
Hello Lawrence,
I apologize for the first part I’ve mistakenly recorded it you can still view it on 420p.
John
Thursday, March 21st, 2013 17:14
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.
cynthia mcardle
Friday, March 22nd, 2013 09:42
Great blog! This is indeed so informative and useful as well especially in web designing. Thanks for sharing this awesome article!
ashish
Tuesday, March 19th, 2013 02:43
great video for beginners and first time i m learn about these html tag i m getting something new thing from this tutorial.
Charissa Vaughn
Friday, March 15th, 2013 11:50
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.
Stephan Lück
Sunday, March 10th, 2013 15:26
here is a really good editor http://www.sublimetext.com/2 too, because i missing it in your list.
But thanks for your tutorial
Tim Carpenter
Monday, March 11th, 2013 02:24
Thanks for sharing, these are some great tutorials I will be sharing with my beginner friends!
Thanks,
Tim
djavan
Tuesday, March 12th, 2013 20:20
Never thought I could find a site webdesign talking about CSS, I will always be here! \ o /
that other issues already discussed here?