Web Authoring

On-line version of Powerpoint Presentation

Tutorials:

Beginners: Getting started. (1.72MB - takes a moment to download before displaying). NCSA--A Beginner's Guide to HTML

Intermediate: Bare Bones Guide to HTML

Advanced: There are three tutorial links on Cascading Stylesheets. A very short tutorial, a more detailed one and a collection of other tutorials.

IMPORTANT: The most important tutorial will be given in class when a sample webpage will be created showing you the fundamentals of HTML; this class will also include the uploading of that file, creating and modifying other files and any other aspects of HTML you ask about. So ask!

Assessment

Assessment is by project, accounting for 100% of the marks, where you create a full working website. You may view current/previous submissions by clicking in the section below. Please note that the links in the sections below are not examples of best practice; they are merely examples of past work.

Your project should be created in a plain text editor - Notepad for Microsoft® Windows® or KWrite for Linux is recommended (marks may be deducted heavily for the use of any other publishing tool such as Microsoft® FrontPage®).

What colours can I use? Technically you can use any colour that you like; but how the codes for that colour will cause the colour to appear on someone elses computer may be completely different. That's why the idea of "Web-Safe Colors" was introduced.

Today, most peoples computers are sufficiently well equipped to display all necessary colours. But if unsure, choose a colour from the set above.

What colours should I use? Firstly, choose a consistent colour scheme for the whole site. This scheme should in some way reflect the type of site you're creating. There are good guidelines for which colours will look well with others on many sites, all based on tried and true colour theory. Here is one such sample site: http://colorschemedesigner.com/. Just watch out for the fact that the scheme designer should be taken as a guideline for which web-safe colours you use.

Generating non-standard characters such as áccented characters appropriately is also easy enough: just choose them from the list (PDF 17.7KB) and insert the proper çödèš.

In so far as is possible, your website should conform to recognised standards. This site http://interact.webstandards.org/ may set you clear why we have defined standards in the first place. Read on from there...

Assessment 2009/10:

Project Sites

  1. it.davidc
  2. it.ryand
  4. it.sineadf
  5. it.jamesg
  6. it.ireneuszg
  8. it.deanh
  9. it.dariusk
  10. it.jamesk
  11. it.marekk
  12. it.niamhl
  13. it.karlm
  14. it.michaeloc
  15. it.fionaod
  18. it.craigt

Your topic for this year is "Crossing the water: Clonmel & its Bridges"

  • (Last updated: 20090219-23:51)
  • You must create a website for the project for which you will:
    1. Design & Plan
      1. Provide textual, graphical and any other planning materials you consider relevant
      2. Identify a target audience
        • Clearly identify the pupose of the website
        • Identify the main communications intent of the website
      3. Develop a consist design solution (style) for the website
        • Provide a master page design
      4. Develop a consistent site navigation solution with ease of use as the prime aspiration
        • Provide a website map
    2. Implement
      1. Create at least 6 (six) webpages.
      2. Use original artwork & photography as used for Image Processing.
      3. Create each page in accordance with best practice
      4. If possible use css. Links to tutorials are shown above
      5. Use any/all appropriate materials delivered in class as content on your site.
      6. Conform to file naming conventions and use a logical directory structure.
      7. Remain within the storage size allocated to the project (currently 5MB)
    3. Review/Evaluate
      • Objectively evaluate the completed website
    4. Submit
      • Create and electronically submit 1 (one) PDF document containing all materials (including screen grabs) as well as submitting in paper format and via upload to the location designated.

Assessment 2008/9:

  • Apart from the standard FTP open, edit, save, FTP upload, browser view and restart cycle, you can also download the source of your html file and work on it live at http://www.squarefree.com/ and copy it back into place when done.

Project Sites

  1. it.sarahc
  2. it.simond
  3. it.frankom
  4. it.virgoo

Your topic for this year is Culloughty's Country Hostel near the town of Ballyamiel (Baile na Meala) not far from the beautiful hill-walking charms of Cnoc Mór na Cailíní.

Rough sketch of location of the hostel:

Hostel Location Sketch
  • (Last updated: 20090219-23:51)
  • You must create a website for the hostel for which you will:
    1. Design & Plan
      1. Provide textual, graphical and any other planning materials you consider relevant
      2. Identify a target audience
        • Clearly identify the pupose of the website
        • Identify the main communications intent of the website
      3. Develop a consist design solution (style) for the website
        • Provide a master page design
      4. Develop a consistent site navigation solution with ease of use as the prime aspiration
        • Provide a website map
    2. Implement
      1. Create at least 6 (six) webpages plus a provisional reservation form (see re-usable sample below) with background processing script (Cross reference to Computer Programming).
      2. Use original artwork, photography, shared pool materials and non copyright-infringing materials only
      3. Create each page in accordance with best practice
      4. If possible use css. Links to tutorials are shown above
      5. Use any/all appropriate materials delivered in class as content on your site
      6. Conform to file naming conventions and use a logical directory structure
      7. Remain within the storage size allocated to the project (currently 5MB)
    3. Review/Evaluate
      • Objectively evaluate the completed website
    4. Submit
      • Create and electronically submit 1 (one) PDF document containing all materials (including screen grabs) as well as submitting in paper format

    Shared picture pools. Only images from these pools may be used. If you don't contribute to the pool for your year, you may not use any image pool. Original artwork is excluded from this rule.

  1. Stock Pictures to use (legally) in your project: from 2009
  2. Stock Pictures to use (legally) in your project: from 2008
  3. Stock Pictures to use (legally) in your project: from 2007
  4. Stock Pictures to use (legally) in your project: from 2003
  5. Stock Pictures to use (legally) in your project: from 2002

Assessment 2007/8:

Personal Sites:

  1. it.lilietea
  2. it.ernestoc
  3. it.joshuac
  4. it.seanc
  5. it.susanc
  6. it.johnc
  7. it.jamiec
  8. it.peterg
  9.  
  10. it.kieranob
  11.  
  12. it.rhondaw

Bi-Lingual (or tri-lingual) Project website.

  1. it.lilietea
  2. it.ernestoc
  3. it.joshuac
  4. it.seanc
  5. it.susanc
  6. it.johnc
  7. it.jamiec
  8. it.peterg
  9. it.fionak
  10.  
  11.  
  12. it.rhondaw

Your topic for this year is FitzGeralds Park, on the The Mardyke in Cork.

Note that The Mardyke doesn't exist as it once did. Where once it was fabled in song for it's Elm Trees...
The Banks Of My Own Lovely Lee
Oh how oft do my thoughts in their fancy take flight
To the home of my childhood away
To the days when each patriot’s vision seemed bright
Ere I dreamed that those joys would decay
My heart was as light as the fair wind that blows
Down the Mardyke through each elm tree
Where I sported and played ‘neath each green leafy shade
On the banks of my own lovely Lee
Where I sported and played ‘neath each green leafy shade
On the banks of my own lovely Lee

Words and chords for the above song are available in:

...those Elm trees have died long since as a result of Dutch Elm Disease, and The Mardyke itself has seen development that the author of the song would not know how to describe.

Each page must have a language option carefully placed on the page that allows the reader to change from viewing the website in the current language to the other supported languages. The supported languages are:
  • English
  • French
  • Irish (Optional for extra marks)
  • Any other optional languages you wish to add
Once an alternate language is chosen, the site should remain operating in that language until another language is chosen.

A suggested language switcher might look like this:

All normal rules about website creation will apply.

Due Dates: 20th December 2007
(English version with French links in place)
3rd January 2008
(Multi-lingual version with all links in place)
18th Janary 2008
(Tour booking version with start of feedback in place)

Assessment 2006/7:

The two topics thus far selected upon which students may create a website on are:

On-line Submission:

Your project should be SFTP'd securely, using our alternate secure port, to the folder 
/home/yourusername/public_html
on the webserver 
mymailbox.fachtnaroe.net
- this will enable viewing of the site by pointing of the browser at the location:
https://www.fachtnaroe.net/~yourusername/

Click below to see this years student submissions. Not all will be active yet - or ever!

Assessment 2005/6:

Please disregard these instructions for future years. This was a once-off arrangement.

This year your assignment must include at least the following elements:
  • A frameset (read below)
  • A clear consistent colour scheme
  • At least six pages
  • Navigation bar at top, bottom or both
  • At least 1 image per page, but image use should not be excessive without proper cause and images should be constrained in size

Paper Submission:

This is just a minimum of five pages:
  1. Standard Cover Sheet,
  2. 1 A4 page with a site map, description of the target audience of the site, reason for choice of subject material, summary of the steps used to create the site,
  3. At least one representative page from the website printed,
  4. A print-out of the HTML behind the page selected above,
  5. An evaluation of your finished product.

On-line Submission:

Your project should be saved in the folder 
/192.168.1.252/home/yourusername/public_html
- this will enable internal viewing of the site by pointing the browser at the location:
http://192.168.1.252/~yourusername

As the first page of a website should be called 
index.html
and there is already a single webpage in that folder you're going to have a problem. They can't both be called 
index.html
so we'll use a frameset to get around that problem.

We can't just delete the previous page as the external examiner hasn't seen it yet, so no official marks have been allocated. Therefore, it has to stay.

To access your files on a website you normally use FTP. As you are creating these files on an internal Microsoft Windows network you can access your folder using a file explorer window and typing \\192.168.1.252 or \\LINUX2 into the Address bar. Provide your username and passwd from the previous Linux system.

Once this folder is opened you can use normal file explorer actions to put together your site in the public_html folder. If you want to open a file to edit it, right click on it, choose Open With and use the Notepad editor. Reload your site in the browser (which you should have open simultaneously) to see how your changes are working.

Framesets and frames were hailed as a superior way of dividing up the screen into separate sections when they became available first. Today, the use of frames is heavily deprecated; despite this we will use them to solve our problem of the two items needing to share a folder.
  1. Rename the existing index.html in the location above as history.html
  2. Rename the first file of your website as webbing.html - it should already be called index.html but as explained above, this has to change
  3. Copy your website into the folder
  4. Create a new file called index.html and put the html below into it
  5. Create a new file called internet-task.html and put the html below into it
  6. Test your site by using a web browser to go to: http://192.168.1.252/~yourusername
index.html 
<frameset rows="40,*">
	<frame name="topline" src="internet-task.html" />
	<frame name="mainwindow" src="webbing.html" />
</frameset>
internet-task.html 
<html>
<body>
<a href="history.html" target="mainwindow">History & Structure of The Internet</a>
</body>
</html>

NB Subject Matter NB: You may create your website around any subject you like as long as you clear it with your tutor first.

Sites 2005/6

(Closed to further submissions)

  • No suitable submissions received.

Assessment 2000-2004:

The website must be submitted online, so that the extern can check it for appearance and for working links etc. (The online submission should be matched by a paper submission. The paper submission should include a signed 'My Own Work' form).

Related:

Miscellaneous:

A sample site, dealing with dolphins. No representation is made about how accurate the contents of this site are.

Photographs from field trips:

Last updated: 20100512-14:10