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

This tutorial shows how to add links in HTML code. During this HTML5 linking tutorial you will learn how to link to external pages, how to link to pages on your own website, and how to link to sections of your web page.

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/04_lesson

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

How to Add Links in HTML code | HTML5 Linking Tutorial

(00:00) Intro
(00:05) Welcome
(00:15) Hypertext is the HT in HTML
(00:49) We don't create hypertext links with the Link element
(01:53) The Anchor element
(04:37) Absolute vs Relative references
(05:45) Linking to another page on your website
(06:40) Challenge: Create an about.html page
(07:28) Solution: about.html
(10:44) Linking to sections in a page
(16:14) Link to the top
(17:03) IDs in the web address
(17:56) Changing anchor link colors
(19:55) Link text best practices
(22:45) Download links
(24:32) Email links
(26:10) Phone links
(27:21) Opening a link in a new tab
(28:48) Link to the default page
(30:06) Validate your HTML code

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/
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/

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

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 tutorial about how to add links in HTML code helpful? If so, please share. Let me know your thoughts in the comments.

#html #html5 #links