HTML5 Website Project for Beginners | First HTML Project Tutorial

Published: 25 January 2022
on channel: Dave Gray
331,278
6k

Web Dev Roadmap for Beginners (Free!): https://bit.ly/DaveGrayWebDevRoadmap

In this HTML5 website project for beginners you will be challenged to build an beginner HTML project applying all you have learned about HTML from the previous tutorials. A how-to HTML tutorial follows the challenge.

🚩 Subscribe ➜ https://bit.ly/3nGHmNn

🚀 This lesson is part of an HTML for Beginners tutorial series playlist:
   • HTML Tutorials for Beginners  

🔗 Starter Source Code: https://github.com/gitdagray/html_cou...

📬 Course Updates ➜ https://courses.davegray.codes/

HTML5 Website Project for Beginners | First HTML Project Tutorial

(00:00) Intro
(00:15) Welcome
(00:35) HTML Project Tour
(07:31) Solution Tutorial Start
(10:47) Nav menu
(13:24) Adding an image
(14:39) Completing the page structure
(15:30) Using a page as a template
(21:43) About section
(27:21) Menu section
(32:27) Homepage complete
(32:50) Store hours
(34:39) Contact Us
(41:19) Completing the project

Validate Your HTML code: https://validator.w3.org/

🔗 All Resources for this HTML Tutorial Series: https://github.com/gitdagray/html_course

⚙ Web Dev Tools:
Chrome Browser: https://www.google.com/chrome/
Dark New Tab Chrome Extension: https://chrome.google.com/webstore/de...
Visual Studio Code (VS Code): https://code.visualstudio.com/
Live Server Extension: https://marketplace.visualstudio.com/...
Prettier VS Code Extension: https://marketplace.visualstudio.com/...
vscode-icons VS Code Extension: https://marketplace.visualstudio.com/...
Github Themes VS Code Extension: https://marketplace.visualstudio.com/...
W3C HTML Validator: https://validator.w3.org/
HTML5 Outliner: https://chrome.google.com/webstore/de...

📚 References:
MDN HTML: https://developer.mozilla.org/en-US/d...
MDN HTML Elements Reference: https://developer.mozilla.org/en-US/d...
HTML Entities Character Chart: https://html.spec.whatwg.org/multipag...

🚀 Semantic HTML References:
MDN Web Glossary for Semantics: https://developer.mozilla.org/en-US/d...
w3Schools Semantic HTML: https://www.w3schools.com/html/html5_...
MDN Document and website structure: https://developer.mozilla.org/en-US/d...

🚀 HTML Table References:
MDN Table Basics: https://developer.mozilla.org/en-US/d...
MDN Advanced Tables and Accessibility: https://developer.mozilla.org/en-US/d...

🚀 HTML Forms References:
MDN Web Forms: https://developer.mozilla.org/en-US/d...
MDN Form Element: https://developer.mozilla.org/en-US/d...

✅ Follow Me:
Github: https://github.com/gitdagray
Twitter:   / yesdavidgray  
LinkedIn:   / davidagray  
Blog: https://yesdavidgray.com
Reddit:   / daveoneleven  

Was this first HTML Project for Beginners tutorial helpful? If so, please share. Let me know your thoughts in the comments.

#html #html5 #project


On this page of the site you can watch the video online HTML5 Website Project for Beginners | First HTML Project Tutorial with a duration of hours minute second in good quality, which was uploaded by the user Dave Gray 25 January 2022, share the link with friends and acquaintances, this video has already been watched 331,278 times on youtube and it was liked by 6 thousand viewers. Enjoy your viewing!