LearnITWithMrC

Adding pages and content

What am I Learning today?

I am learning how to create a multipage website with pages linked together

I am learning how to use HTML tags to add functionality (e.g. links, images) to my website

Knowledge Organiser

Lesson

Task 1 - Getting up to date Click to see more

We need to make sure we are up to date with our page so we can complete todays tasks

You must have completed your navigation bar to create the page links,

Task 1

Open your web page from last week using either Edublocks or Notepad++.

If your webpage is in Edublocks then Copy the code and paste it into your notepad++ index.html page

Open your page in a web browser

Task 2 - Creating your pages Click to see more

Now we have covered all the main elements lets finish our Home Page

Click on the image below to see it as a real web page

Task 3 - Duplicating your pages Click to see more

We now want to make a couple of copies of our home page to create other pages we can link to that will have the same style as our Home Page

To do that we simple need to open up two new files in notepad ++ and save them as page2 and page 3.

Don't forget to change the Language to HTML.

Task 2

Open up two new files in notepad ++
Change the change the Language to HTML.
save them as page2 and page3.
Open them both in Chrome.

Don't have any spaces in the filename of your HTML page.

Extension - Make the pages different

Change your two new pages so that you can tell the difference between them.

Task 4 - Adding Hyperlinks Click to see more

Now that we have got three different pages we are going to add in some hyperlinks so that we can click to move between the pages.

Task 3

We are going to use the anchor tag to create our hyperlinks. Anchor tags<a> need a "hyperlink reference" (href) to the page they will link to. Look at the example below

<a href="page2.html" >Page 2 </a>

Put the above link into your navigation bar
Test that it works by running the page and clicking on the link

Extension

Add in another link this time for page3 also try styling the link by changing its background colour. Click on the link below to see more styles you can use.

W3 Schools

Task 5 - Lesson review Click to see more

Summing it all up

Lets look at the learning outcomes and decide which one best describes our current level of understanding :

Tick the one you feel is closest to your level

Learning Outcomes I need to learn how to create a multipage website with pages linked together

I have a basic understanding of how I can create a multipage website with pages linked together with a little help from my teacher
I can show my teacher that I can create a multipage website with pages linked together without their help.
I can create a multipage website with pages linked together independently and I can also explain it to others and can complete any extension tasks I am given.

🠜 Now update your learning objectivesClick on the Assessment image

My Notes: Web_Design

Student_Comment_6 not found