Content

The really important stuff.

Content is King. Content is why people use the site and return to the site. So what content are you going to add?

What Subject

Most subjects can be fitted into one of the existing sections. Perhaps they are photographs of past years that will go in the gallery. A recollection of club runs for the Runs section. Perhaps it is small enough to fit in an existing page. If not then use a template to write a new page and link it into the site stucture with appropriate menu entries.

How Long

Written material for the website should ideally be quite short. Unlike material for the Megaphone we don't look for text by the yard. Visitors have problems reading from the screen. Try to break text into shorter paragraphs than usual, even putting each sentence into its own paragraph. That will help readers keep their place if the screen is scrolled down. Keep the sentences short as well. Break where you have put 'and' or 'but'. That will help them to make sense of what they read late at night when they have been to the pub. That is long enough for this paragraph!

What to Include

What do past members and friends want to find?

Check how names are spelt and written in the past members lists. If you write it exactly the same then the tooltip will be added automatically. Cool!

  • First and foremost they want to read about themselves and their friends. Name names.
  • Places help people recall the context of stories. Say where the event was and try to describe special characteristics of the place.
  • It is a motorcycle club so details about the bikes will be interesting.
  • Any photos? (more later)
What NOT to Write

Past members were fair game for a bit of gentle leg pulling on a club night. The Leicester Phoenix MCC has always avoided back-biting and sarcasm. We still accept a joke at our own expense at a reunion. Now we are on the world wide web. Should we belittle a friend in front of so many people, many of them strangers? Add humour but turn it against yourself or make it very general.

These pages are open for children and maiden aunts to read. Be naughty, be rude but please don't be vulgar. If you need to ask the difference, don't put it in.

Tekky Bits

If you are writing the whole HTML page here are some reminders and a few tips. The content goes inside the part of the file clearly labelled as "Content Start" and "Content End".

<h1 class=main>Page Title</h1> defines the page title. There should only be one of these at the top of the content. Short and no full stop.

<h4>Page subtitle if required.</h4> Puts in a more descriptive version of the page title in slightly smaller letters. Write it as a normally punctuated sentence without capitals.

<h5>Minor Titles</h5> Smaller versions of the page title to break up the page into easily found and understood groups.

<p>The paragraph tags hold the actual text.</p> and divide the content into paragraphs with a line break after the closing tag.

There are also HTML tags to alter the appearance of the text. For the sake of the sanity of readers please stick to these few methods rather than all the colours and all the sizes of all the fonts available!

<i>italic</i> to slope over an odd word.

<b>bold</b> to make a word or phrase stand out. Don't use CAPITALS or underlines.

<s>strike</s> used to really pretend to cross out a word.

<span class="x" title="right">wrong</span> is a site specific way to cross something out and grab attention. The wrong word is covered with the X characters as we used to do in Megaphone (but in red) and the title text is placed after it. Don't try this across a line break.

<span class="red">red</span> Colours a word or phrase. Can't think of many reasons to use this. Note the cascading style sheet class has replaced the old <font color="red"> tag.

To add sly comments and short definitions use the following style sheet defined tag.

<span class="help" title="or phrase">word</span> puts the browser tooltip at the pointer when it hovers over the word. The user can turn this off or alter the delay in the browser settings.

This one is very site specific. It uses a totally non standard tooltip attribute. It is done using JavasScript in the body event

If you want to add a longer explanation, wisecrack or even a picture to the mouseover event, then use the special version shown next.

<span class="help" tooltip="let your imagination take flight.">explain this</span> You may include HTML inside the resulting tooltip. Don't include anything essential as it does not work with all browsers.

Don't use either of the above on a past member's name because a tooltip is applied automatically. If it is essential to do it on a name, put two spaces between first and last name of the person.

A Few Tricks

After interesting content the next most important thing is to keep the website up-to-date. Here are a couple more site JavaScript Includes that you can use to stop your page going past its 'sell-by' date.

 

Do you want to mention that there are past members in contact with us? Rather than changing the number on your page (and all the other pages with the number) every time we hear from someone new use the following JavaScript Include in your text. It calls a function in the common.js file.

<script>memno()</script> Just insert this bit where you want the number to appear.

 

If something happens today then WOW, that is up-to-date if you can get it onto the website immediately. But tomorrow the word 'today' is inaccurate. Next week it is wrong, next month it is a lie and then it totally loses credibility. So if you want to say 'when' something recent happened use the following JavaScript Include, with the English format date of the event, instead of the phrase.

<script>saywhen("")</script>

I put the above script here on this page  as indicated by the date at the bottom of the page. The JavaScript function turns it into an appropriate phrase. So you, me, the page and the site keep our street cred. Now that's something to drink to!

 

JavaScript includes are useful for ... er ... including items from the pseudo-database information. We can get even more lazy than that! Suppose you want to include a whole passage from another page? The traditional ways are:

  • Cut and paste it into your page.
    But then you need to update two or more copies of the same text.
  • Link to the source page.
    But then the reader goes wandering off in another direction.

Ajax stands for Asynchronous JavaScript and XML
Nuff Said

The solution is to use Ajax to pinch the paragraph from the source page and plonk it into your page complete with formatting! Include the following where you want the passage to appear on your page.

<div id="pinchthis"></div>
<script>AjaxRequest("page","pinchthis")</script>

The "page" is the address of the source HTML page such as "../help/help_security" without the ".htm" bit.

The "pinchthis" is an example id name of the lump out of the page that you want to pinch and the id of the preceeding DIV that is the destination for the snaffled content. (Quick and dirty!) In the source page the content could be defined by a <div id="pinchthis"> or a <span id="pinchthis"> but to make things plain to understand I have always used an infrequently used tag for addresses - ADDRESS!

On the page you want to pinch the content from, surround the content with tags something like
<address id="pinchthis">
...with the passage in between, then...
</address>

NB. Ajax only works from a Web Server.

Here is what happens with the above example. I have put the horizontal ruled lines in to indicate the copied passage.



Another extra ten minutes at the bar!

 

I suppose you want to put some of your snaps on the site now. We will look at how to use photographs next.

Summary

Fresh and interesting content is the most important thing on the site.

Web text needs to be short and format to make it easy to read on screen.

People are interested in family, friends and themselves.

Conventions for marking text with special meanings needs to be consistent across the site and not conflict with the accepted www methods.

The site has extra features that depend on site specific style sheets, JavaScript and Ajax.

Addendum: Stages of contributing to the website.
  1. Provide information, reply to posts.
  2. Lend material, especially photos with names and information.
  3. Write addition for a rally, club run or event. A post-script or other information.
  4. Contribute enough material for a complete page for the website.
  5. Edit or moderate an existing section.
  6. Take complete control of a new or existing section.
    1. People Search.
      • Search directories
      • Gather information
      • Coordinate searches
    2. Training Scheme
      • Structure the section
      • Research background
      • Find material
      • Interview for contributions
    3. Decades
      • Review period background events
      • Collect names and material
    4. Motorcycle Runs
      • Survey demand
      • Organise date/ place/ route/ stops
        • Matlock
        • East Coast
        • Wales (Snowdonia via Lake Vyrnwy)
        • Bristol SSGB
        • Founders Day/Stinkwheel
      • Publicise and obtain support
      • Document and publish reports
    5. Social Events
      • Distribute across county and calendar
        • Dinner
        • Kettering & D MCC meet
        • Skittles versus the Club
      • Publicise and gauge support
      • Consider themed events
      • Formulate organisation strategy
      • Record events
    6. Profiles
      • Define a size, template and typical questions
        • Schools and pre-Phoenix
        • Phoenix Years - what is recalled
        • Post Phoenix
        • Family
        • Work
        • Places
      • Interview past members
      • Assemble materials
      • Link to other pages
      • Publish to a schedule
    7. Favourite Pubs
      • History and current status
      • Collect stories and materials
      • Research characters
    8. Dealers
      • General format
      • Names and dates
      • Anecdotes