Theory
Theory
Comments

Absolute addresses

Relative addresses are useful for linking pages within your own website, both while working locally and after publishing it. To link to another website, you can use its complete URL.

This is called an absolute address. It includes the information the browser needs to find the destination without relying on the current page’s address. For example:

https://site.com/blog/index.html

In this web address, the three parts shown are the protocol, server name, and path.

https:           — Protocol
//site.com       — Server name
/blog/index.html — Path

These relative addresses omit the protocol, the server name, or both:

https://site.com/blog/index.html - Absolute address
      //site.com/blog/index.html - Relative address
               /blog/index.html - Relative address
                     index.html - Relative address

The main page has no useful links yet, such as a link to HTML and CSS courses. This is where an absolute address is useful.

index.html
style.css

HTML

<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>The website of a beginning coder</title> <link rel="stylesheet" href="style.css"> </head> <body> <header> <h1>The website of a beginning coder</h1> </header> <main> <nav> <h2>Recent Posts</h2> <ul> <li><a href="day-1.html">Day One. How I forgot to feed the cat</a></li> <li><a href="day-2.html">Day Two. I want to become a coder</a></li> <li><a href="day-3.html">Day Three. My cat is upset with me</a></li> <li><a href="day-4.html">Day Four. How I almost got sick</a></li> <li><a href="day-5.html">Day Five. I am relaxing</a></li> <li><a href="day-6.html">Day Six. How I failed to understand anything</a></li> <li><a href="day-7.html">Day Seven. Muffin gave me an assignment</a></li> <li><a href="day-8.html">Day Eight. It’s getting very serious</a></li> <li><a href="day-9.html">Day Nine. Or, more precisely, night</a></li> <li><a href="day-10.html">Day Ten. Summing up</a></li> <li><a href="day-11.html">Day Eleven. Everything should be taken in moderation</a></li> </ul> </nav> <section>  <p>Greetings to everyone! Welcome to my first site. Up until just recently I had no idea what a coder does for a living, but now I have found interactive courses in HTML and CSS and I have set myself the goal of becoming one. I was even assigned an instructor, Muffin, who won’t let me slack off and will track my progress.</p> <p>My first assignment is to keep a diary and honestly write about all of my accomplishments.</p> </section> <section> Skills section </section> </main> <footer> Website footer </footer> </body> </html>

CSS

body { padding: 0 30px; font-size: 14px; line-height: 22px; font-family: "Georgia", serif; color: #222222; } h1 { font-size: 36px; line-height: normal; } h2 { font-size: 20px; line-height: normal; } a { color: #0099ef; text-decoration: underline; } ul { list-style: none; padding-left: 0; } footer { margin-top: 30px; }

Goalscompleted

Format the text interactive courses in HTML and CSS in the first paragraph as a hyperlink that points to the following absolute address: https://htmlacademy.org/courses.

Absolute addresses

Comments

Log in

Sign up

Restore access