YEAR 8 I'C'T'

1
YEAR 8 I.C.T.
http//www.westwightmiddle.iow.sch.uk/ict/y8webpub
lishing.ppt

• Publishing on the Web

School ICT http//www.westwightmiddle.iow.sch.uk/i
ct/y8webpublishing.ppt
2
Lesson 1

• Getting started

3
OBJECTIVES
To learn about how web sites are written.
To understand what is appropriate.
To investigate code (language).
To self assess your progress.
4
Today you will learn

• to use code to make a web page
• about basic instructions called tags.

You will have succeeded if you have

• a web page with text and colour.
• a knowledge of what basic tags do.

5
Terms you should know
browser The program you use to look at web pages
e.g Internet Explorer home page The first page
of a web site the index page HTML The language
used to make web pages. hypertext Links between
web pages. tags Instructions in HTML code. web
page An internet page. wysiwyg What you see is
what you get. GIGO Garbage in, garbage out.
6
Part 1

• Open NOTEPAD
• Copy the the program onto notepad.
• Save as index.htm into your zwebsite folder.
• Close NOTEPAD
• Find index in your zwebspace folder.
• Double click to open the file.
• Mouse click RIGHT and choose VIEW SOURCE to edit.
• f5 refreshes the page.
• Continue with the worksheet.

7
Part 2 Colours

• 000000 black
• FF0000 red
• 00FF00 green
• 0000FF blue
• 800000 dark red
• 008000 dark green
• 000080 dark blue
• FFFF00 yellow
• 808000 brown
• FF00FF magenta
• 800080 indigo
• 00FFFF cyan
• 008080 turquoise
• FFFFFF white
• 808080 grey

the 0 is a zero, not a letter
8
Part 3 Add in extra lines.

• ltHTMLgt
• ltHEADgt
• ltTITLEgt
• My page
• lt/TITLEgt
• lt/HEADgt
• ltBODYgt
• ltBODY BGCOLOR 008000
• ltBODY TEXT FFFF00gt
• ltH1 ALIGN CENTERgt
• Hello!
• lt/H1gt
• ltHRgt
• ltHRgt

ltH2gt ltMARQUEEgt My web site lt/MARQUEEgt lt/H2gt This
is my website. ltBRgt I hope you like it. ltH2gt What
its about. lt/H2gt This is where I write loads of
stuff. lt/BODYgt lt/HTMLgt
9
(No Transcript)
10
What I am looking for

• You have a basic idea of HTML
• You can change and add lines of HTML code
• You can use excel to record your understanding

11
Web publishing

• Lesson 2 ADDING PICTURES

12
To put piccies into my shiny new web site.To
make more groovy pages.To think about the dudes
who use the website.
Today you will learn
13
Language
jpeg (a picture file type) gif (another picture
file type) bitmap (yet another picture file
type) image alt tag (a description of the picture)
14
Who is the web site for?

• audience
• purpose
• special features
• A site to evaluate

15
Decide on the audience for your web site.
go on!
you know you want to
16
How to make an extra page.

• Load up your INDEX.HTM page.
• Right click. View source.
• SAVE AS
• Save as page1.htm into your zwebsite folder.
• You now have another page thats identical to the
  first one.
• You can change each page separately.

17
Images
Get a picture from Google Images or My Pictures
and save it into zwebsite.
Dont use spaces in image filenames.
ltIMG SRC filename.jpggt or ltIMG SRC
filename.gifgt
18
TRY THIS! Advanced images
ltIMG SRC filename.jpggt ltIMG SRC filename.jpg
ALTmypicturegt ltIMG SRC filename.jpg
Height200gt ltDIV ALIGNCENTERgtltIMG
SRCfilename.jpggtlt/DIVgt
Dont use spaces in image filenames.
19
Web publishing

• Lesson 3 Hyperlinks

20

• Today you will learn
• To use hyperlinks to connect to pages, sites (and
  within pages).
• To evaluate the basic usability of a website.

• You will have succeeded if you have
• Made working hyperlinks to other pages, websites
  (and within pages).
• Identified the basic things that make a website
  usable.

21
Look at how the hyperlinks work on some of these
web sites.
West Quay amazing animals penguins zoo living
coasts
Yamaha Land Rover wightcycling Manchester
United coast NASA BMW
22
Hyperlinks
Load INDEX.HTM and right click to VIEW SOURCE.
Insert ltA HREFhttp//www.bbc.co.uk/weather/gtClic
k here for the WEATHER FORECASTlt/Agt Insert this
into your INDEX.HTM page ltA HREFpage1.htmgtClick
here to go to page 1.lt/Agt Put this at the
bottom ltA HREFtopgtClick here to return to top
of page.lt/Agt
23
Some useful help links
http//www.lissaexplains.com/html.shtml http//www
htmlhelpcentral.com/ http//www.htmlcodetutorial.c
om/ http//www.htmlhelp.com http//www.htmlgoodies
.com/ http//www.davesite.com/webstation/html/ htt
p//www.webreference.com/html/
24
Round ups

• You will have succeeded if you have
• Made working hyperlinks to other pages, websites
  (and within pages).
• Identified the basic things that make a website
  usable.

25
Assessment

• Go to your spreadsheet in zwebsite.
• Find the column for lesson 3.
• 3 I understood all this, 1 Arghhhhh!, 2 maybe.