Blogging

Build An HTML5 Website With A Responsive Layout

Build An HTML5 Website With A Responsive Layout
Written by techmanish

In this video we will build a clean coded responsive mobile friendly HTML5 website for a fictional web design company. We will go over semantic HTML tags like header and footer as well as the basics of HTML and CSS. This is a great project for beginners.

CODE DOWNLOAD:
http://www.traversymedia.com/downloads/acme_website.zip

SUGGESTED VIDEO: HTML Crash Course For Absolute Beginners

SPONSORS:
DevMountain Bootcamp – https://goo.gl/6q0dEa

2017 WEB DEV GUIDE:

SUPPORT THIS CHANNEL WITH A CUP OF COFFEE PER MONTH:
http://www.patreon.com/traversymedia

ONE TIME DONATIONS:
http://www.paypal.me/traversymedia
Video Rating: / 5

About the author

techmanish

20 Comments

  • Thanks for a great tutorial, Brad. Your style of html first then style component by component make more sense to me that anything I have seen. You use the classic building block approach to teaching which has served me well in many endeavors. Thanks so much for the quality guidance and example.

  • Wow I really love this tutorial.  I am using Visual Studio 2013 to follow along with the tutorial.  Visual Studio supports everything being used here directly. The main page I named Default.aspx and then created a stylesheet.css. Also Visual Studio has amazing intelli sense so everything being typed here just shows up. You can press the next letter to accept the key word or select it from the list; this is going very fast.

  • +Traversy Media my footer doesn't work? when i type the background-color in it also makes the images orange? Plzz help me!

  • Brad, your tutorials are the kind of sticking around and not just passing by to the next one. They are very fiendly and humble. I have learned a great deal of complex concepts by means of your peacful, practical, effective and thorough method. Thanks a million for serving this much

  • This is probably a dumb question but, why are you using the section tags and not any other tags? What is really the importance of the section tag semantically?

  • I'm trying to use atom but I'm having trouble getting started, nothing is color coded and the snippets aren't working etc etc

  • Hi… Great video. It helped me a lot. All I couldn't do is setting the background image. Idk why, I tried so many times..

  • 26.49

    header a{
    color: #ffffff;
    text-decoration: none;
    text-align: right; //I had to put this to bring the buttons to the right
    text-transform: uppercase;
    font-size: 16px;

    }

Leave a Reply

%d bloggers like this: