Standard Grade ComputingStandard Grade Computing

Web Page CreationWeb Page Creation

Revision: - What is a Web Page?Revision: - What is a Web Page?

A web page is a special type of document used A web page is a special type of document used to display information on the internet.to display information on the internet.

Web pages can contain text, pictures, animated Web pages can contain text, pictures, animated graphics, sound and video.graphics, sound and video.

Web pages are mostly made of a language Web pages are mostly made of a language called HTML (Hyper Text Mark-up Language)called HTML (Hyper Text Mark-up Language)

In the past you had to know this language to In the past you had to know this language to create a web page, however you can now use create a web page, however you can now use special packages to create web pages in much special packages to create web pages in much the same way as you would type a letter. the same way as you would type a letter.

Using a Web Page Creation Using a Web Page Creation PackagePackage

As mentioned previously, you can use special types of As mentioned previously, you can use special types of package to create web pages.package to create web pages.

These packages allow you to create a web page quickly These packages allow you to create a web page quickly as you do not need to learn any web languages to work as you do not need to learn any web languages to work them.them.

Web page creation software is known as Web page creation software is known as WYSIWYG( What You See Is What You Get) as what WYSIWYG( What You See Is What You Get) as what you see on the screen as you create the page is how it you see on the screen as you create the page is how it will look when you are viewing the completed page in a will look when you are viewing the completed page in a browser.browser.

Most packages will also contain templates to make your Most packages will also contain templates to make your job even easier.job even easier.

Using TemplatesUsing Templates

Templates are web pages that have been set up Templates are web pages that have been set up for you to use as a starting page for your website.for you to use as a starting page for your website.

These can contain tables, pictures or basic These can contain tables, pictures or basic hyperlinks.hyperlinks.

Once you have loaded a template, you then edit Once you have loaded a template, you then edit it to the way you want your page to look.it to the way you want your page to look.

This is a very useful feature that can save you a This is a very useful feature that can save you a lot of time when creating a webpage.lot of time when creating a webpage.

The next slide shows examples of some of the The next slide shows examples of some of the templates you can use.templates you can use.

Adding TextAdding Text

One of the main features any web page will contain is One of the main features any web page will contain is text.text.

It is very easy to add text to a web page using a web It is very easy to add text to a web page using a web page creation package.page creation package.

Simply select the add text tool then the section of the Simply select the add text tool then the section of the page you want to add the text to, and then type it in, just page you want to add the text to, and then type it in, just like in a word processor.like in a word processor.

You can change the font, size, alignment and style of the You can change the font, size, alignment and style of the text as well, just like in a word processor.text as well, just like in a word processor.

Adding TextAdding Text

You do have to be careful though when adding You do have to be careful though when adding text to a web page.text to a web page.

You must ensure that the size, style, colour and You must ensure that the size, style, colour and font of the text make it easy for the users to read font of the text make it easy for the users to read it.it.

For example: - if the text is too small then it will For example: - if the text is too small then it will be difficult for people to read, particularly if they be difficult for people to read, particularly if they have bad eyesight.have bad eyesight.

Adding GraphicsAdding Graphics

It is also very easy to add graphics to a web page using a web It is also very easy to add graphics to a web page using a web creation package.creation package.

You can use pictures you have downloaded or created and also use You can use pictures you have downloaded or created and also use clipart stored on the computer.clipart stored on the computer.

To add them, simply select the option to add a graphic and select To add them, simply select the option to add a graphic and select where you want it to go on the page.where you want it to go on the page.

It is also very easy to change or delete pictures once you have added It is also very easy to change or delete pictures once you have added them, or to change where they are on the page.them, or to change where they are on the page.

Remember though, if you are using pictures you have downloaded Remember though, if you are using pictures you have downloaded on a web page, make sure you are legally allowed to use them.on a web page, make sure you are legally allowed to use them.

Also, you must remember that graphics will take longer to load on a Also, you must remember that graphics will take longer to load on a page than text will. Using a lot of graphics on a page will mean that it page than text will. Using a lot of graphics on a page will mean that it can take a long time to load, especially on a dial-up connection.can take a long time to load, especially on a dial-up connection.

A sample webpage using graphics A sample webpage using graphics

Adding Video and SoundAdding Video and Sound

Since web pages are true multimedia documents, Since web pages are true multimedia documents, you can also add sound and video to them.you can also add sound and video to them.

This is very easy to do, simply select the option This is very easy to do, simply select the option to add the file, and place it where you want it to to add the file, and place it where you want it to go on the page.go on the page.

These can be videos and sounds you have These can be videos and sounds you have created yourself or that you have downloaded.created yourself or that you have downloaded.

As with pictures however, if you download items As with pictures however, if you download items you intend to use on a page make sure you are you intend to use on a page make sure you are legally allowed to use them.legally allowed to use them.

A sample page using sound & A sample page using sound & videovideo

HyperlinksHyperlinks

Hyperlinks are used to link web pages together.Hyperlinks are used to link web pages together. The user clicks on the link to move from one page to The user clicks on the link to move from one page to

another.another. Hyperlinks can either be text, graphics or a link button Hyperlinks can either be text, graphics or a link button

where a graphic is used as an icon for the link.where a graphic is used as an icon for the link. To add a hyperlink you simply choose to insert a hyperlink To add a hyperlink you simply choose to insert a hyperlink

and then browse for the page you want to link it to.and then browse for the page you want to link it to. It is often a good idea to set your pages out one after the It is often a good idea to set your pages out one after the

other, so that one page is linked to the page after it.other, so that one page is linked to the page after it.

Adding Tables to a websiteAdding Tables to a website

Another useful feature you can add to your Another useful feature you can add to your website is that of adding a table.website is that of adding a table.

Tables can be used to not only display data, like Tables can be used to not only display data, like you would normally, but can also be used to keep you would normally, but can also be used to keep text and graphics together e.g. pictures in a photo text and graphics together e.g. pictures in a photo gallery.gallery.

All you need to do is select to add a table, select All you need to do is select to add a table, select where you want it to go and select how big you where you want it to go and select how big you want it to be.want it to be.

A webpage using a tableA webpage using a table

HotspotsHotspots

Hotspots are special areas on a multimedia page Hotspots are special areas on a multimedia page which let the user interact with the page. A which let the user interact with the page. A graphic or a picture that has hotspots are called graphic or a picture that has hotspots are called image maps.image maps.

When the user moves the cursor into a hotspot When the user moves the cursor into a hotspot or clicks on it, an event is triggered.or clicks on it, an event is triggered.

This could be a hyperlink being opened or a This could be a hyperlink being opened or a sound being played.sound being played.

This effect can be used to bring your page to life This effect can be used to bring your page to life and make it more attractiveand make it more attractive..

Example of a page using hotspotsExample of a page using hotspots

Adding hotspots to a pageAdding hotspots to a page

It is very easy to add a hotspot to a page.It is very easy to add a hotspot to a page.Simply select the hotspot tool and you will Simply select the hotspot tool and you will

be prompted to enter the URL you want to be prompted to enter the URL you want to move to.move to.

Once you have done this you can then Once you have done this you can then place the hotspot wherever you want to on place the hotspot wherever you want to on the page.the page.

Other features of web page Other features of web page creationcreation

As you browse the Internet, there will be many other As you browse the Internet, there will be many other features you will come across.features you will come across.

Some web pages use Frames which make it easier to Some web pages use Frames which make it easier to organise their layout.organise their layout.

You will also find Animations using either Shockwave or You will also find Animations using either Shockwave or Flash. These require the user to install special software Flash. These require the user to install special software called “Plug-Ins” in order to view them.called “Plug-Ins” in order to view them.

This can be problematic, especially on school networks This can be problematic, especially on school networks where some users do not have the right to install new where some users do not have the right to install new software, meaning they can’t view sites that need plug-software, meaning they can’t view sites that need plug-ins.ins.