Basic Amaya tutorial for beginners

PC help starts here

This tutorial will put you on the path to being the greatest web designer of all time :) at the very least it will show you how to build a website site using Amaya.

I will assume you have allready installed Amaya from here. Make sure you have installed the latest version.
Once Amaya is installed you should have a link to this programme on your desktop.

Steps to follow

1, Double left click with your mouse on the Amaya icon on your desktop. (Amaya will now be open)

2, At the top of your screen you will have 8 links which look like this.

File, Edit, Views, Insert, Format ,Links ,Tools ,Help (Look at the screenprint below)

I want you to left click on File scroll down to "New" then scroll across to "New document" (Like I have below) and left click on it.

 

You will now get a little popup window like below where you can give your page a title

Now I want you to look at where it says "Title" you will see a blank space below this is where you will give your page a title (This is the title of the page so when it is opened in a web browser thats the name people will see. So name it "Page 1" then click "create"

Important

Make a note of where it says (Document location) you will need this information later

 

 

You will now have a blank document you will see this blank document has created a tab near the top of the window and it is called "Page 1"

 

4, Now I want you to place the mouse pointer on the blank screen and left click with your mouse. You will now see a flashing cursor on the screen.

5, I want you to now type some words on your screen so type this "This is my first web page" Now press enter you will see the cursor move to the next line. Now type "This is my second line of text" Then press enter. What happens when you press enter?? Yes thats right the cursor moves to the next line.

So you have just put 2 lines of text on your page like I have done in the screen print below.

Saving your document

6, Before we go any further you need to know how to save your document so at the top left of the page click on File once clicked on File scroll down to"Save as..."(Look how I am doing it here)

 

and left click with your mouse this will open a new window which will show you where your document is being saved you are given the option to change the place where your document is being saved. But we will accept the default option for know. In the same window you are given the option as to the type of format you want to save your document. You are given 3 options as listed below.

Now when you left click on "Save as" this is what you can see.

1, HTML

2, XML

3, TEXT

You will change the default option to"HTML" Now this is very important make sure you make a note of where it says "Document location" because this is where your new webpage document is being saved. Then left click on "Save" button at the bottom of the window.

Modifying text

1, Now I will show you how to format text to make it stand out and generally look different.I am assuming your docunet is still open.

Change color of text

2, change color of the text, So I want you to place the cursor at the begining of the first line of text you wrote "This is my first web page" I want you to hold the left mouse button down and drag the cursor to the last letter of the last word. You will see the text is being highlighted as you drag it. When you get to the last letter of the last word I want you to release the left mouse button which will leave your text highlighted. (Look at my screenprint below)

Now do you remember those 8 links at the top of your page?? yes the ones that say:

File, Edit, Views, Insert, Format ,Links ,Tools ,Help

I want you to left click on Format scroll down to Text Color then scroll across to "Select a text color" then left click on it.

(Look at my screenprint below)

This will open up a small window with the title Color I want you to choose a color by left clicking on it then click OK. If you now look at the text on your page you will see it has changed color. (below is a screenprint of the color chart)

 

 

For this tutorial I have chosen red as my color just to make it stand out. (Look at the final result below)

 

How to Align text

3, Lets say you would like your text in the centre of the page instead of aligned to the left which is the default setting, or it certainly is in this country :)

Place the cursor at the begining of the first line of text" This is my first web page" and press and hold down the left mouse button while dragging the cursor to the last letter of the last word. Then release the mouse button without pressing any other key. You will notice the text has now become highlighted. (Like I have done in the screenprint below)

Now left click on "Format" which is located at the top of the screen and scroll down to Alignment, now scroll across to "Center" and left click with the mouse. Look at my screenprint below you will notice there are several choices for aligning text ("Left, Right, Justify, Default") For now we will just do "Center"

You will now see your text has moved to the center of the screen and the line of text is still highlighted if you left click with your mouse on a blank space some where on the page the line will no longer be highlighted and the task is finished. (Look at my screenprint below for the finished task.)

Save

Do not forget to save your work, if something goes wrong you dont want to start from the begining again.

To save a document you have already created click on File scroll down to Save and left click.

If you remember the first time we saved the Document was when we created it then we clicked on File and scrolled down to Save as...the difference now is that we are saving data we have added to an allready created document so we only need to click on Save


-------------------------------------------------------------------------
Images

Now I will show you how to insert an image in a webpage. The first thing we are going to need is an image to insert so here is one I prepared earlier. (You are welcome to use your own it will not make much difference) any way here goes.

You can see an image of a Koala bear below,

      Who does ths remind you of?

I want you to right click on it then left click on "Save Image As" a new window will open, the name of the file should be called "Koala" you just need to click on "Save"

Now you have saved the image of the Koala bear we can continue.

4, We will start by adding a line of text to our webpage so place the cursor at the end of the second line of text "This is my second line of text" and press enter to start a new line.

Now type "This is my first image" now press enter. (Like I have done in the screen print below)

Now click on Insert located at the top of the page and scroll down to "Image" (Like I ave done below) and left click with your mouse.

 

A new window willl have opened up like in the screen print below.

 

on the right hand side of the window is a picture of a folder left click on the folder which should open up another dialog box (Like the one in the screenprint below)

 

by default for me it opens up the My Pictures folder if yours does not then you will need to browse you way through till you come to the picture of the Koala bear you saved earlier. When you have opened up the My Pictures folder I want you to select a picture, image from there by left clicking on the image you want. Now click "Open" The "My Pictures" folder will now close and you will be left with the first window still open. Click on Confirm.

You are now given the option to type in alternative text, sometimes depending on the browser that someone uses or on how it is setup they might not be able to view an image on a webpage. So we enter alternative text something like "If you cant see this image update your pc" or what ever you like it dont matter that much. When you have finished click "Confirm"

Now save your document.


Dont let the learning stop there lets continue

Links

How to create a link

There are a couple of different types of links, I will now show you how to create a link to another page on the internet. Lets say you are writing a news article about the Zoo.

Firstly make sure the webpage we have created or starting to create called "page1" is open in Amaya. Now the first thing you need to do is put your cursor on a new line below the picture you have created and type the following text.

http://www.dudleyzoo.org.uk/home.htm

Next you need to place the cursor at the begining of the first letter of the first word, press down and hold the left mouse button while dragging the mouse to the last letter of the last word. You will notice that it is now being highlighted. Once you have highlighted all of it release the mouse button and click on Links at the top of the page and scroll down to "Create Or Change Link" and left click with your mouse. (Look how I did it in the screen print below)

You should of just seen a new window open in the blank box (Like I am showing you in my screen print below)

I want you to type in the web address of :

http://www.dudleyzoo.org.uk/home.htm

So your screen should now look like this.

Now press "Confirm" when you press confirm the little window will close

Now save your page (It is better to save your work on a regular basis)

Please remember that all this learning takes time and dedication, Its fun to learn. So if you go to bed tonight stressed your doing it wrong.

Now we will view the page we have started to create in a web browser just so we can see what we have acheived. To do this we need to go to the folder where we have been saving our work so the default location for this seems to be

C:\Users\nigel     (where I have the username nigel you will replace this with your own user name)

If you just can not remember for love nor money where it is saved do this.

Click on "File" scroll down to "Save As" and a pop up window will appear like mine below. Make a note of where it says "Document Location" this is where you saved work is.

 

Now you know where your work is being saved open up that folder like I have done in the screen print below. Now look at the last item in my folder you will see there is a "Firefox icon" called "New" this is the html version of what we have created. So click on it to open it up.

 

Now you have clicked on it your web browser should open and you should see the finished article like mine below. So click on the link to Dudley Zoo and check it works. :) I know it does.

.......................BUT....................BUT.................BUT................................
Who realy wants to show the actual web address on a page like the example above. I personally like to disguise it like this thats ok go ahead click on it. If it works you should still be on this page that is because the link has been given the address of this webpage.

So lets try it out open up Amaya so you are on the webpage we have been working on and start a new line after the dudley zoo link" http://www.dudleyzoo.org.uk/home.htm"

Now type this "Please tell me where I can get help with my PC"

Now lets create a link to a page where we can get help with our PC without showing the full web address like the example above about dudleyzoo.

So place the cursor at the begining of the first word "Please tell me where I can get help with my PC" hold down the left mouse key while dragging the cursor to the last letter of the last word which will be "PC"

You will now notice the words "Please tell me where I can get help with my PC" will be highlighted. if you look to the right hand side you will see there is a small img of a globe (blue ball) with a little square on it. (directly above my link box in the above screen print)

left click on it with your mouse. This will open up a new window which will say (insert the url or browse) so I want you to enter this address "http://www.NJS Computing Services/" then click "Confirm"

You now need to Save your webpage so click on "File" and scroll down to "Save"

Now if we view our webpage in a browser it should look like this

You have just created your first link to a webpage without showing the url

To continue this tutorial click on the link below.

 

Part 2 of this tutorial will show you how to

Align an image to the Right, Left, Center, of the page in Amaya.

 

If this tutorial has been of help please give my educational software a shout at http://mathswhizz.org maybe you can tweet it or give it a shout on some other social media for me.