The document provides guidance on designing websites, including site structure, navigation, and common elements. It emphasizes the importance of clear organization, easy navigation, and minimal effort for users to find content. It also discusses topics like homepage design, navigation aids, shared resources, and what information visitors should be able to find on a website. Finally, it addresses putting a website online, such as getting a web hosting account, uploading files via FTP, testing and validating pages, and considering copyright issues.

1. 5. Site and page design
A well designed website is more than just a collection of linked web pages. It is a
coherent structure, easy navigable and where content can be found with minimum
effort.
Important advice before designing our website:
Important advice before designing our website:
1. Design your website before you write a single web page: have a clear picture of
how your webpage is to be organized.
2. Pay special attention to the way in which the text is laid out and to fonts and
colors. If your text is meant to be printed out then make sure that it will look as
good on the printed page as on the screen.
-Examples of bad WebPages:
http://www.webpagesthatsuck.com/worst-websites-of-2011.html

2. 5.1 Web Style Guide
The best practical guidelines for web authors can be found in:
1. The web style guide: The web author’s “Bible "contains useful guidelines on site,
interface and page design and is the reference which every web author should consult
before designing a web page. http://www.webstyleguide.com/wsg3/index.html
2. Jakob Nielsen’s website: another well known authority on web page design

3. 5.2 Homepage
Every website should have a homepage which is normally the main point of entry to the site,
ideally with an easy URL.
-The homepage should be simple and short. It is just an entry point to the site and does not need
much content. Sometimes a homepage just consists of a company logo which you click on to
enter the main site.
- Conventionally the homepage for any web page is called index.htm or index.html.
Web servers will automatically search for an index file in a directory so you don’t
have to specify the name in the URL.
- We can just use http://www.ICT4LT.ORG/
-Instead of http:// www.ICT4LT.ORG/index.html
-Which makes things quick and easier to type.

4. 5.3 Navigation aids
- A site that can not be navigated is useless.
- A common danger with any hypertext system (language in which the web
pages are written) is that of being lost in hyperspace. In other words going
to another web page and not being able to navigate back to the home page
- If you don’t have fixed landmarks with which to orient you’ll become
completely lost.
- In websites with more than one page it is essential to have some kind of
navigation aid or map.

5. - From the most basic web pages: A homepage with site landmarks, links
to other webpages.
- To the more sophisticated web pages : Might include a site map or a full-
blown graphic diagram, an index , and a site search engine.

6. 5.4 shared resources
• When you make a web page you have to introduce text,images that will be
shared in many resources, you should put this files on the same directory so
you can find them easily, to avoid duplication and to make site maintenance
easier.
• Make a directory only with images, keep them just in case there is a problem
with the server.
• When you want to insert a picture or a file in your web page your web page
editor will go to the common directory where you have your images and files.
This are relative links. They are local.
• If you do not want to insert those pictures you will use an absolute links and
you will have to specify the address.

7. How do relative links differ from absolute links?
Relative Link: Absolute Link
Are images in a predefined location The address has not been
in a specified directory where the
tools, pages, images are stored for
predefined. If I want an
my web page. They indicate the image that Its not already
location of a file relative to the included in my web site
document. Stored in a common folder directory I need to
directory in the web site folder. use an absolute address so
the software knows where
-It is better for Web authors to link to to look for it, the location.
files within the same website
For example on a hard
using relative links rather than
absolute links, as this makes the drive
file maintenance easier.

8. 5.5 What should I include on my website?
-Visitors to your website should be able to find out the following information at
your website:
1. Who created the site?
- Would should give detailed information on our homepage under the heading
who are we?
- We should name the authors of individual modules at the top of each of our
web pages.
2. Who is the site aimed at? Who is your target audience?
3. When were the contents created and how regularly is the site updated? We
have to give the revision date at the bottom of each page.

9. 4. Is there a contact address at the site?
5. Is there a feedback form? If you find a mistake or you want to make a comment
you can use the feedback form .It should be found at the bottom of each page.
This form helps to cut down spam as it makes less obvious our email address to
spambots.

10. 6. Evaluation of the website: quality and reliability of the content
7. Bibliographical referencing : recommendations given by the authors of the web
page on how to reference web pages
8. A disclaimer regarding links that we make to external sites:
-what type of links can we find in our webpage?
- who are the links managed by?
9. Who owns the copyright on the contents of the site and what are their term uses?

11. 6.Putting your website online
-We have already designed our web page on disc.
So how do we uploaded it to the World Wide WEB???
- in order to expose it to the world wide web you need to make it available online
- To do this you’ll need to obtain a web account on a computer connected to the
internet running a web server
- Then upload your website to the account.
So how do I get a Web account???
- Depending on your circumstances, there are a number of ways of getting file space on
a web server:
Work, Internet Service Provider, Free Web account providers, DIY- Running your
own server:

12. 6.1 Getting a web account.
1. Work: If your employer maintains a server for their employees.
Through Your employer you may run a Web server on which you can host your
site. For example University you can put you’re a personal page on the
server of your Company or University. you would have to have a link from the
index page to your web page.
2.nternet Service Provider: Almost every ISP ( telefónica) any company
which provides you with the internet service. will provide its subscribers with a
web account ( only to access or use the internet ,provides service to the
internet) when we have our ISP we can use a specialists Web hosting services.
Providers such as Titan and Amen or yahoo. Provides individuals or
companies to make their websites accessible.

13. 3. Free Web account providers: There are hundreds of free web space providers
on the internet, such as Tripod , which offers both free and paid-for accounts that
offer extra services. Probably free web pages wont offer you much space. Free
Webspace.net. Is a useful site where you can find suitable providers.
4. DIY- Running your own server:
If you have an internet connection, either via
your ISP or your employer, then you can turn your own computer into a web server.
But it has some disadvantages:
1. If you do not have a lot of knowledge on Web server is very complicated. You will
spend a decent amount of time reading documentation.
2. Any computer being connected to the internet is at risk of being broken into. So if
you have sensitive data on your hard disc you may prefer not to use your computer
as a sever

14. 6.1.1 Domain names
- If you are setting up a new website you will need to find yourself a domain
name.
- Domain names start with http://www which is followed by a dot and then a
name that you choose for yourself .
E.g. the ICT4LT website’s name is http://www.ict4lt.org.
- Domain names always have two or more parts, separated by dots.
- The part on the left side is more specific and the part on the right more
general.
- The ICT4LT website’s domain name is divided into two parts: ict4lt and
org,
- The former being the body and the later indicating the kind of body it is.
- Org= organization, companies can normally be identified by com.

15. - How do you choose a domain name? Check that the domain name
you have chosen is not being used by someone else. You can do this via most
hosting service providers or by looking up the name at a domain name
registration site such as Nominet or Register.com
Having found a suitable name, you then find an ISP or hosting service that
will give you adequate Web space for your registered name, and then you can
upload your website.

16. 6.1.2 CGI Scripts – hypertext scripts
If you want to add interactive features to your website:
For example searching engines
-We have to use server-side CGI scripts, the server that hosts your website
will have like a library of scripts that u can use to insert on your web page.
Such as navigation bars , form code elements. We select from the menu
the type of element that we want to insert in to our web page and the
programming tool generates the hypertext code to perform this function.
• that is a program/ option used on the web server which process form
data.

17. 6.2 Uploading your data:
To upload the website files to the web account we need to use FTP file transfer
protocol Software.
When do we use FTP? It is used to upload web pages and other documents from
one computer to another computer. Is a protocol for transferring files.
- Many web authoring packages for example Dreamweaver or Front Page editors
which generate hypertext mark up code html incorporate an FTP facility so that
you can automatically upload files by just pressing a button.
-Some hosting websites provide you editor software to design and make your web
pages and provide the method to upload it like yahoo.
If you need an FTP Client to upload your webpage the best ones are:
For windows- WSFTP.
For Macintosh- Fetch

18. 6.3 Testing your website
It is important to test your site both on disc and online. You should check that:
1. The major links in documents work
2. You do not get any ‘broken image’ icons indicating that an image file
can’t be found.
3. The document layout is as you want.
4. Your site works in all browsers.
- Most HTML editors now have an internal browser, that emulates a website , so that
you can change from HTML to WYSWYG (what u see is what you get)
- You can view your website before you transfer it to the web page, which is handy to
use when writing pages.
-To test your site you should do it live, as you can only see if it works by uploading it
and using it online.
-It is also interesting to check your web page in the different browsers such as Firefox,
Chrome…to be sure that the pages display as you want them to be viewed

19. 6.3.1 HTML Validators
What are HTML Validators?
Useful tools for testing your site. These are
programs which check your HTML . Verifies that your code has been generated
by your editor consistent with the rules of HTML.
-Check to make sure that the code is right.
-W3C Markup validation Service is a popular online validator.

20. 6.3.2 Case sensitivity
- A common cause of errors when generating a site is case sensitivity.
- When you program your web pages with an operating system that is different
from the host operating system. Case sensitivity may not be the same on
both. One may be insensitive to capital or small letters and the other may
not be. The results will be that some of the HTML codes will not be
recognized and will generate an error .
• Falta example

21. 6.3.3 Checking for dead links-linkrots
You need to check your site regularly for dead links. Some of the links that you
have made to interesting and useful sites will suddenly cease to work because the
site you have linked to has changed its URL, moved or just disappeared. This
phenomenon is sometimes referred as linkrot .
The main reasons for linkrot are:
Webmasters keep reorganizing their . sites, often without leaving
redirecting messages and consequently URL’S keep changing.
Some sites or pages simply disappear into the ether.
Many large sites are now dynamically built, i.e. database-driven. This
makes administration easier, if we want to add content to the site we just have to
update the database rather than editing HTML documents. But the visitors may
have no option but to enter the site through the “front door”.
.

22. -Most web authoring tools include a facility for checking links. At least for the
internal links.
-For external links you may have to use a link checker
Xenu Link Sleuth is a free software package that checks websites from broken links.
When checking your web page you should bare you have in mind:
1. Keep a note of usefull sites, indicating the name of the person responsible for
creating the web page into the internet . If the page goes dead then you may be
able to find it by using a search engine.
2. Once you have created a site containing lots of links make sure that it is properly
and constantly maintained.

23. - You may also be able to retrieve the contents of a dead link by entering its
URL into the Internet Archive ( aka the Wayback Machine) it is an
enormous archive that keeps records of revisions of websites at various
stages in their lives http://www.archive.org/

24. 7. A resource for web Authors.
• The HTMGoodies website is aimed at web authors and deals with all the
issues involved in designing, developing and maintaining websites. It is a
comprehensive resource for the web author from novice to expert
http://www.htmlgoodies.com/

25. 8. Case studies
The following sites are examples of work produced by secondary teachers in
the . Using Web Authorizing tools
1.The ashcombe School’s Modern Foreign Language Website: Resources for
teachers and students.
http://www.ashcombe.surrey.sch.uk/Curriculum/modlang/

26. 2.Language Online, Royal Grammar school, High Wycombe: Interactive
materials for secondary school learners of French, German, Spanish, Latin
and Italian. http://www.languagesonline.org.uk/
3. St Peter’s School, York: An extensive site for Modern Foreign Languages.
http://atschool.eduweb.co.uk/stpmlang/
4. Grahams davies’s favourite web sit
http://www.camsoftpartners.co.uk/websites.htm

27. 8. Copyright issues
• When creating your own website we have to pay attention to copyright.
• If you use of materials from another website make sure that you seek permission
from the owner of the site if it is not clearly stated that the material are copyright
free.
• If you include a link to someone’s site it is normally polite to request permission.
• Be careful about using others peoples logos.
• Down lend or donate downloaded materials to collegues in other institutions.
• Do not publish downloaded materials in printed publications or on your own website
without the express permission of the copyright holder..
• Include your own copyright notice at your website, indicating information about the
copyright owner, the dates on which the materials were created and your terms of
use.