How the Web Works Safe and Responsible Who’s Watching? Online Security Risks Creating Web Pages Spiderman ©Marvel Comics

How the Web Works

Learning Objective: Learning Outcomes: Understand how data travels around the Internet and recognise how search engines find web pages and how to perform effective searches. GOOD: Take part in a demonstration of how packet switching works and identify some effective Internet search techniques. BETTER: Research and fully explain a list of five effective search techniques. BEST: Draw a diagram to demonstrate how search engines work.

K EYWORDS Internet ~ World Wide Web ~ packet switching ~ IP address ~ web crawler

Data is split into small chunks (packets) and sent to your router Sending Data Router Computer Your router sends these packets to their destination across the Internet. The Internet

Header: Network Packet NumberTotal Length Time to liveChecksum Source Address Destination Address The header contains some basic information about the packet. Real packets contain more than this example. TTL enables a packet to “die off” if it does not reach its destination in a set amount of time. The checksum performs a calculation to ensure the data doesn’t get mixed up.

Jobs Origin Host (1 person): Your job is to distribute the data packets. Routers (5 people): Spread out and tell the packets where to go next. Destination host (1 person): Put together all of the packets once they’ve ALL arrived. Packets (9 people): Start anywhere you like, you can only go where the routers tell you and must stop when you reach your destination address.

Quick Task  Write the title: Packet Switching  Under this write an explanation of the activity you have just carried out to explain the process of Packet Switching.

How search engines find information Search engines send out Web crawlers to collect information about websites. The web crawlers collate an index of all websites found. Search engines look for keywords in their databases when someone enters a search.

Effective Searching  There are ways to search the World Wide Web to ensure you find the most relevant sites possible, remember quality is better than quantity! YOUR TASK  Research methods for effective search techniques and put together a list of the top five techniques (remember to write in your own words by writing the Point, an Explanation and an Example). EXTENSION  Draw a diagram to demonstrate how search engines work.

Quick Questions 1. What is the difference between the World Wide Web and the Internet? 2. What is packet switching? 3. What is an IP address? 4. What does a Web Crawler do?

Spiderman ©Marvel Comics Be Safe and Responsible

Learning Objective: Learning Outcomes: Understand how to keep yourself safe online and be a responsible Internet user. Over two lessons: GOOD: Collect information about being safe and responsible online and compile together to make a simple video. BETTER: Completed video that gives a clear message to the selected audience about being safe and responsible online. BEST: A fictional story about a child who runs into problems online.

K EYWORDS Internet safety ~ “Think U Know” ~ Virtual Global Taskforce ~ personal details ~ netiquette ~ copyright

Using the Internet Who uses the Internet every day? Who has created their own social networking space? Who plays games online? Who has “online friends” that they do not know in real life?

What are the Risks?  Paedophiles  People lying online  Bullying  Viruses and pop-ups  Seeing nasty pictures

What to Remember  It’s important to trust your instincts.  Once you put a picture or video online it’s impossible to get it back.  It’s never to late to report.  Paedophiles can be young and good-looking and the kind of person you think you might want to be friends with.

Reporting a Problem

Tips to Stay Safe  Don’t give out your personal details  If you share a picture remember it can easily be changed  Remember people lie online  Don’t meet up with strangers without an adult you trust  Always report problems

How to be Responsible Online Netiquette rules:  When posting on sites don’t be abusive (you can disagree with someone without name calling!)  Remember that posts are public  Stay on topic when posting in forums (don’t post about Spiderman in a Superman forum!)  Do not post copyrighted material  When sending s always include a subject and suitable message

Make an Internet Safety & Responsibility Video YOUR TASKS (you have 2 lessons)  Gather information to create a video aimed at primary school children to tell them how to be safe and responsible users of the World Wide Web.  Put the information together using Movie Maker to make a suitable video to show to primary school children. EXTENSION  Write a fictional story about a child your age that runs into problems after meeting someone online. (Think about how you’ve been taught to write stories in English)

Quick Questions 1. What does the symbol look like to report problems to the Virtual Global Taskforce? 2. What does the word “netiquette” mean? 3. Give three examples of online risks. 4. What is the name given to people who are deliberately abusive and rude to others online?

Spiderman ©Marvel Comics Who’s Watching?

Learning Objective: Learning Outcomes: Be able to understand the ethical issues surrounding using data online and restricting Internet access. GOOD: Basic letter, correctly laid out, explaining whether they are for or against the proposal. BETTER: Clear and concisely written letter using PEE. BEST: Script for a debate between two people with opposite views on the proposal.

K EYWORDS privacy ~ ethical ~

Does it Matter if Someone’s Watching Us?

How About Censorship?

UK’s Golden Shield Project? Consider this hypothetical scenario: “The UK Government are considering putting into place similar filtering regimes to China. They intend to block social networking sites as they feel these contributed to the London riots a few years ago. Also, media sharing sites such as YouTube are to be blocked along with a range of search terms, such as pornography, violence, drugs, guns, weapons, suicide, and any anti-government comments will be filtered.”

To Agree or Not to Agree… YOUR TASK  Write a formal business letter to your local MP to either support or oppose the Government’s proposal about Internet filtering in the UK.  Your letter must clearly make the point, give clear evidence and be fully explained (PEE).  It should be clear whether you are arguing for or against the proposal with clear reasons given. EXTENSION  Write a script for a debate between two people with opposite views on the Government’s proposal (each person needs to give valid points to support their argument.)

Quick Questions 1. What are the good points about our online activity being monitored? 2. What are the negative points about our online activity being monitored? 3. In what circumstances would it be okay to restrict access to certain websites?

Spiderman ©Marvel Comics Online Security Risks (Part 1)

Learning Objective: Learning Outcomes: Understand what is meant by the terms Spam, Phishing and Viruses. GOOD: Some basic information given about online security risks in the form of a leaflet. BETTER: Detailed explanation of each of the main three security risks with clear examples. BEST: Identify and explain a further two security risks online.

K EYWORDS SPAM ~ Phishing ~ Virus ~ Trojan Horse ~ Spyware ~ Adware ~ Worm

Spam  What is spam? (we’re not talking about tinned meat!)  Electronic junk mail!  Unsolicited messages sent over the Internet.  Usually sent to large numbers of people.  Purposes:  Advertising  Phishing  Spreading malware

Phishing  What is phishing?  The act of stealing personal information by sending s that appear to be from legitimate websites, ie, your bank, Paypal, Facebook, Twitter etc.  How do I know if an is phishing? …you don’t, but there are some signs… ©AllSpammedUp.co m

How to Tell if an ’s “phishy”! Dear Internet Banking Customer, Thank you for using the Nationwide Building Society Online Transfer services. In order to provide final approval for the transaction, we need aditional information. Please access you’re online banking account to verify the information is correct and complete your enrolment.online banking account If we do not hear from you within the next 24 hours, we will cancel your Online Transfer service. Click here for online banking If you have any questions, please visit our website at Thank you for using Nationwide Building Society! Why doesn’t your bank know your name? Spelling and/or grammar mistakes. When you hover over the link it is not your bank’s website address. It’s not always this obvious, to be on the safe side, never click links in s, instead go to the website directly yourself.

Viruses  What is a virus?  Malicious software that, after running, copies itself into other programs and files on the computer.  Some common types:  Trojan Horse  Spyware  Adware  Worms QUICK TASK  In pairs find a definition of each of the above types of computer virus.

Security Risks Leaflet Threats – Explain what is meant by SPAM and Phishing and give clear examples of each. Front page – Must be eye catching to make people want to read the leaflet. Viruses Use the back panel to explain what is meant by Viruses and give examples of different types of virus. EXTENSION  use one of the pages inside to identify and explain what is meant by the terms Pharming and Key Logger.

Quick Questions 1. What is SPAM? 2. Give an example of phishing. 3. Give an example of a type of computer virus. 4. What is a key logger?

Spiderman ©Marvel Comics Online Security Risks (Part 2)

Learning Objective: Learning Outcomes: Understand the main methods to protect against online security threats and be able to recognise the characteristics of a secure password. GOOD: Identify and explain how to set a secure password. BETTER: Identify and explain the functionality of antivirus software and firewalls and why they should be used. BEST: Identify and explain the use of secure payment systems online.

K EYWORDS password ~ antivirus software ~ firewall ~ encryption

Secure Passwords  It’s important to protect our data with secure passwords.  Ideally use a different password for different sites. Why? spiderman – is this a secure password? $p1d3rmaN – why is this better?  NEVER share your school password (even with your friends)

Antivirus Software  What does antivirus software do?  Checks files when they are opened to protect from viruses.  Scans the computer regularly for viruses.  Removes viruses from the computer.

Firewall  What does a firewall do?  Limits data that can pass through it to protect your computer system from unauthorised users.  A router is a hardware device that has a built in firewall.  Operating systems also have firewall filters.

Security Risks Leaflet Passwords– Explain why passwords should be used and how to set a secure password. Firewalls – Explain what a firewall does and how to turn on the firewall on your computer. Antivirus Software Explain what antivirus software does and how to use it. Give examples of different antivirus software. EXTENSION  Find a space to explain what is meant by Secure Payment Systems and how you can check a site is secure when entering your card details.

Quick Questions 1. Give some key functions that are performed by antivirus software. 2. How can we make a password secure? 3. What does a firewall do? 4. Name a hardware device that has a built-in firewall?

Spiderman ©Marvel Comics Creating Web Pages (part 1)

Learning Objective: Learning Outcomes: Understand how HTML is laid out and which components are required to make a simple webpage. GOOD: Construct a simple web page using HTML tags. BETTER: Select and use a suitable heading type and add some basic information in a paragraph. BEST: Add a range of appropriate information and an image to the page.

K EYWORDS HTML (Hyper Text Markup Language) ~ tags ~ head ~ body ~ indent

What is HTML?  One of the main languages of the Web:  HTML  CSS  JavaScript  HTML defines the content.  CSS defines the appearance. (we’ll look at this next lesson.)  JavaScript defines the behaviour.

How is HTML Written?  HTML is made up of open and close tags with content in the middle. Here are some examples:   This is my title  All the main content goes here  (one of a few tags to have no closing tag) 

Getting Started Before you can start building your web page you need to do the following: 1. Create a folder in your documents called … webpage 2. Open up Notepad++, create a new document and save it into your “webpage” folder as… index.html

This line tells the web browser to expect an HTML web page. YOUR TASK Type these tags into your blank document in Notepad++ then save the file. (Don’t forget to indent it in the same way as here.) This section gives information about the site (it’s one of the places search engines look for information.) All of the content (the visible parts) of your website will go into the section.

My Cool Website! Welcome to my website! This is my website, hope you like it! YOUR TASKS  Add a suitable title, heading and opening paragraph to your web page.  Investigate different types of heading you could use. EXTENSION Decide on a topic for your web page then:  Find out how to add a picture  Find out how to add a hyperlink  Add some relevant information

Quick Questions 1. What does HTML stand for? 2. What are the three main languages of the Web? 3. What is the purpose of the tags? 4. Why do we indent different sections of our code?

Spiderman ©Marvel Comics Creating Web Pages (part 2)

Learning Objective: Learning Outcomes: Understand how CSS works with HTML to change the appearance of a web page. GOOD: Change the colours of the page background and text using CSS. BETTER: Use tags to define and style separate areas of the page and experiment and apply different border styles to CSS boxes. BEST: Apply a font using Google Fonts.

K EYWORDS CSS (Cascading Style Sheet) ~ tags ~ border ~ RGB value

What is CSS?  One of the main languages of the Web:  HTML  CSS  JavaScript  HTML defines the content. (we covered this last lesson.)  CSS defines the appearance.  JavaScript defines the behaviour.

Getting Started Before you can start styling your web page with CSS you need to do the following: 1. Open up your index.html page in Notepad++ 2. Create a new file in Notepad++ called… style.css 3. Save this into the same folder as your web page. 4. Add the line of code in bold below to the section of your own web page: My Cool Website! Note – NO capitals here!

Structure of CSS  CSS is a bit different to html. Instead of open and close tags it uses brackets{ } to begin and end a section.  To define a style for our body we would do this… body{ } This tells the CSS what part of the web page we are styling. Curly brackets are used to begin and end each section of CSS. color: A CSS property can be assigned a value using the colon : All CSS statements must end with a semicolon ; rgb(251, 133, 195);

body{ color: rgb(195,1,112); background-color: rgb(251,133,195); } YOUR TASK  Type these styles into your CSS document. You can play with the RGB values to change the colours. Search online for an “RGB Colour picker” to help you.

Tags  tags define divisions (or sections) of our page so we can apply different styles to different parts.  In html this looks like… tags define the start and end of a section in the. Some content would go in here. For example, paragraphs of information, pictures etc. Each needs an ID so the CSS know which one we are styling.

My Cool Website! Welcome to my website! Some info you’ve written YOUR TASK  Add tags to your web page to define a section of the html. Add the bits in bold into your own page

body{ color: rgb(195,1,112); background-color: rgb(251,133,195); } div#box{ width: 80%; margin-left: 10%; background-color: rgb(253,195,225); } YOUR TASKS  Give your box some style by adding the section in bold to your CSS document.  Use to find out how to give your box a border (hint: put the code underneath the background colour) EXTENSION  Apply a font to your web page using “Google Fonts”.

Quick Questions 1. What does CSS stand for? 2. What are tags used for? 3. Give an example of a type of border style that can be applied using CSS. 4. Who managed to successfully apply a font using Google Fonts?