The Ring Fragment
Most ring systems (excluding the default webring.org webrings) require you (the ringmaster) to define a ring fragment. This fragment is intended to be added to a page in each site of the ring, and it allows surfers to traverse the ring as desired. The ring fragment is the element which makes a ring work - everything else, however necessary, is in support of the fragment.

I've seen ring fragments which obviously took 2 minutes to create, and others which looked like they required weeks of patient efforts (see our fragment gallery for some of these that I have found searching the web).

Okay, the fragment above is a pretty standard fragment with most of the controls available to the surfer. This is always something to remember when designing your fragment: you are designing for two audiences:

  1. The fragment needs to look good on a page, otherwise webmasters will not want to add it to their sites.
  2. The fragment needs to load relatively fast, so extremely huge graphics should be avoided.
  3. It is an advertisement for your ring, so design it well. Ugly fragments do not tend to attract many webmasters to join your ring.
  4. And the primary consideration: the fragment is intended for surfers, so it needs to be obvious, convenient and full-featured.

Contrary to a number of opinions that I have heard voiced in newsgroups and lists, one excellent way to design a fragment is to use a WYSIWYG editor such as Dreamweaver or Frontpage 2000. You just have to be careful to carefully examine the resulting code when you are finished and remove anything that is not necessary. I have found that using an editor such as this makes creating the tables much easier - it reduces a job requiring a few hours to a few minutes.

What I like to do is sit on the couch with a pad of paper and a pencil and draw out my fragment until I have a sketch of exactly what I want. This usually does not take long, and it serves to quickly get down the design.

Once you've got your basic design, I've found it's a good idea to borrow a pre-existing fragment from somewhere else. The ring controls are the best place to start, as they will have a generic fragment with the proper substitution symbols.

A substitution symbol is a special word which the ring will modify later on. For example, one ring system might have a special word of "***ring id***". When that ring fragment is emailed to a ring member that text will be replaced with a ring id. It is always a good idea to use these substitution symbols, as that ensures that when your new members receive their HTML code the fragment is all ready for them to insert in their pages. The less work they have to do the more likely it is that they will do it all correctly.

What I will typically do is take the code from the ring form and paste it into my editor (Frontpage 2000), then modify it as needed. I am careful to maintain the substitution symbols.

An example of what you will wind up with is shown below.

<center>
<table BORDER="3" CELLPADDING="0" WIDTH="640" HEIGHT="120" 
 BGCOLOR="#66FFFF" bordercolor="#CC0000">
  <tr>
    <td width="20%">
     <a href="http://www.ring-master.com/cgi-bin/ringlink/prev.pl?ringid=demo;
      siteid=$::siteid">
      <img SRC="back.jpg" ALT="Click here for the previous site in the 
       demonstration Webring" BORDER="0" width="190" height="120">
     </a>
    </td>
    <td HEIGHT="0" width="60%">
      <p align="center">
      <font color="#CC0000">This </font>
      <a href="http://www.ring-master.com/cgi-bin/ringlink/home.pl?ringid=demo" 
       target="_top"><font color="#CC0000">$::ringtitle</font></a><br>
      <font color="#CC0000">site owned by</font><br>
      <a href="mailto:$::wmemail"><font color="#CC0000">$::wmname</font></a><br>
      <a href="http://www.ring-master.com/cgi-bin/ringlink/prev5.pl?ringid=demo;
       siteid=$::siteid"><font color="#CC0000">Previous 5 Sites</font></a>
      <font color="#CC0000">  |  </font>
      <a href="http://www.ring-master.com/cgi-bin/ringlink/prev.pl?ringid=demo;
       siteid=$::siteid"><font color="#CC0000">Previous</font></a><br>
      <a href="http://www.ring-master.com/cgi-bin/ringlink/next5.pl?ringid=demo;
       siteid=$::siteid"><font color="#CC0000">Next 5 Sites</font></a>
      <font color="#CC0000">  |  </font>
      <a href="http://www.ring-master.com/cgi-bin/ringlink/next.pl?ringid=demo;
       siteid=$::siteid" target="_top"><font color="#CC0000">Next</font></a><br>
      <a href="http://www.ring-master.com/cgi-bin/ringlink/rand.pl?ringid=demo"
       target="_top">
      <font color="#CC0000">Random</font></a><font color="#CC0000">  |  </font>
      <a href="http://www.ring-master.com/cgi-bin/ringlink/list.pl?ringid=demo"
       target="_top"><font color="#CC0000">List</font></a></p>
    </td>
    <td width="20%"><a href="http://www.ring-master.com/cgi-bin/ringlink/next.pl?
     ringid=demo;siteid=$::siteid">
    <img SRC="next.jpg" ALT="Click here for the next site in the demo Webring" 
     BORDER="0" width="190" height="120"></a></td>
  </tr>
</table>
</center>

Once you've got the fragment looking good (and be sure and test it on a page), replace the generic fragment in the ring with your own.

Now it's a good idea to sign up a dummy site to the ring so you get the email with the fragment. Insert this fragment onto a web page and test it carefully (you will have to add or activate your test site to the ring before testing). It is important to check each link as well as any graphic images.

As for graphic images, what I tend to do is display them on the Ring join or description page with instructions for ring members to download them to their own servers. This is very important if:

  1. You are explicitly paying for bandwidth, then you need to remember if you load them from your server you will pay for each display of the graphics.

  2. If you are using Angelfire, GeoCities or Xoom you cannot load them from your site at all. These hosts explicitly prevent this from occurring.

  3. It's not a good idea to encourage bandwidth stealing anyway, so requiring someone to load the graphics locally gets them into the habit of doing this.

Personally, since I run my own web server I just set up the ring fragments to load the graphics from my own site. This makes it very simple for new ring members and it's not really that much bandwidth.

You will most definitely want to spend a few minutes to optimize your graphics for size. It's a good idea to make them as small as possible to reduce the load on your members (or your) host system.  See "Graphics Optimization" for more information.

As for designs, the sky is the limit. You can design your ring fragment however you want. Some people put a single picture over the controls, some have a few graphics in a table. Others use image maps (this is very cool) with hotspots for each control. Occasionally the ring fragment is simply text links. Animated GIFs are fine (keep the size down though), and I've seen a few rings with Java applets embedded in the fragment (these are very nice indeed). I suppose even flash would be appropriate on, say, a flash ring.

Some final notes: your ring fragment is an extension of your ring onto each member site. You should spend some time on it to make it look good, just like you spend time on your site and other forms of promotion.

 

Hot Links Index Email