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: https://www.youtube.com/playlist?list=PL0Zuz27SZ-6OlAwitnFUubtE93DO-l0vu 🔗 Starter Source Code: https://github.com/gitdagray/html_course/tree/main/10_lesson_starter 📬 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/detail/dark-new-tab/kcphhkbdlfggickaoeiahdcfhagfbajl?hl=en Visual Studio Code (VS Code): https://code.visualstudio.com/ Live Server Extension: https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer Prettier VS Code Extension: https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode vscode-icons VS Code Extension: https://marketplace.visualstudio.com/items?itemName=vscode-icons-team.vscode-icons Github Themes VS Code Extension: https://marketplace.visualstudio.com/items?itemName=GitHub.github-vscode-theme W3C HTML Validator: https://validator.w3.org/ HTML5 Outliner: https://chrome.google.com/webstore/detail/html5-outliner/afoibpobokebhgfnknfndkgemglggomo 📚 References: MDN HTML: https://developer.mozilla.org/en-US/docs/Web/HTML MDN HTML Elements Reference: https://developer.mozilla.org/en-US/docs/Web/HTML/Element HTML Entities Character Chart: https://html.spec.whatwg.org/multipage/named-characters.html#named-character-references 🚀 Semantic HTML References: MDN Web Glossary for Semantics: https://developer.mozilla.org/en-US/docs/Glossary/Semantics w3Schools Semantic HTML: https://www.w3schools.com/html/html5_semantic_elements.asp MDN Document and website structure: https://developer.mozilla.org/en-US/docs/Learn/HTML/Introduction_to_HTML/Document_and_website_structure 🚀 HTML Table References: MDN Table Basics: https://developer.mozilla.org/en-US/docs/Learn/HTML/Tables/Basics MDN Advanced Tables and Accessibility: https://developer.mozilla.org/en-US/docs/Learn/HTML/Tables/Advanced 🚀 HTML Forms References: MDN Web Forms: https://developer.mozilla.org/en-US/docs/Learn/Forms MDN Form Element: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/form ✅ Follow Me: Github: https://github.com/gitdagray Twitter: https://twitter.com/yesdavidgray LinkedIn: https://www.linkedin.com/in/davidagray/ Blog: https://yesdavidgray.com Reddit: https://www.reddit.com/user/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