learn html5: links
TRANSCRIPT
inarocket.com
HTMLLearn at rocket speed
LINKS
What is a URL
inarocket.com - Learn HTML at rocket speed
WHAT IS A URL
U R LUniform Resource Locator
Is the syntax and semantics of formalized information for location and access of resources on the Internet
inarocket.com - Learn HTML at rocket speed
WHAT IS A URL
URL
http://www.w3.org/htmlDomain NameProtocol Path
Links: Basic Structure
inarocket.com - Learn HTML at rocket speed
LINKS: BASIC STRUCTURE
Go to the W3C website
Elem
ent
<a href=“http://www.w3.org/html”>
</a>
URLHypertext reference
Text that will work as a link
inarocket.com - Learn HTML at rocket speed
index.html
LINKS: BASIC STRUCTURE
Browser
Go to the W3C website
<a href=“http://www.w3.org/html”>Go to the W3C website</a>
Editor
Opens the link when clicked
Absolute & Relative URLs
inarocket.com - Learn HTML at rocket speed
NOTICE
Sorry for the inconvenience.
This presentation is a work in progress.
Links: Internal
inarocket.com - Learn HTML at rocket speed
LINKS: INTERNAL
image1.png
image1.png
img
javascript1.js
javascript2.js
js
list.html
catalog.pdf
index.htmlproducts.html services.html jobs.html contact.html
Imagine you need to create a link from index.html to jobs.html.
They’re both on the same website, so you just need to include a relative path to jobs.html.
Please find an example in the next slide.
inarocket.com - Learn HTML at rocket speed
index.html
LINKS: INTERNAL
Browser
Jobs
<a href=“jobs.html”>Jobs</a>
Editor
Opens the link when clicked
inarocket.com - Learn HTML at rocket speed
LINKS: INTERNAL
image1.png
image1.png
img
javascript1.js
javascript2.js
js
list.html
catalog.pdf
index.htmlproducts.html services.html jobs.html contact.html
inarocket.com - Learn HTML at rocket speed
index.html
LINKS: INTERNAL
Browser
PDF list
<a href=“pdf/list.html”>PDF list</a>
Editor
Opens the link when clicked
inarocket.com - Learn HTML at rocket speed
LINKS: INTERNAL
image1.png
image1.png
img
javascript1.js
javascript2.js
js
list.html
catalog.pdf
index.htmlproducts.html services.html jobs.html contact.html
inarocket.com - Learn HTML at rocket speed
index.html
LINKS: INTERNAL
Browser
Home
<a href=“/index.html”>Home</a>
Editor (list.html)
Opens the link when clicked
Links: External
inarocket.com - Learn HTML at rocket speed
index.html
LINKS: EXTERNAL
Browser
Wikipedia
<a href=“http://wikipedia.org”>Wikipedia</a>
Editor
Opens the link when clicked
Links: Anchors
inarocket.com - Learn HTML at rocket speed
NOTICE
Sorry for the inconvenience.
This presentation is a work in progress.
Links: Other Protocols
inarocket.com - Learn HTML at rocket speed
LINKS: OTHER PROTOCOLS
Contact the W3C staff
Elem
ent
<a href=“mailto:[email protected]”>
</a>
URLHypertext reference
Text that will work as a link
inarocket.com - Learn HTML at rocket speed
LINKS: OTHER PROTOCOLS
Download document
Elem
ent
<a href=“ftp://university.edu/doc.pdf”>
</a>
URLHypertext reference
Text that will work as a link
Are you also interested in learning
BOOTSTRAP 4POSTCSS?+
http://inarocket.teachable.com/courses/css-postcssPlease visit:
inarocket.com
HTMLLearn at rocket speed
LINKS