Working with URLs

URL's (or Uniform Resource Locators!) describe a way of addressing external resources, such as web pages, images, media files, and the like. URLs can either be referenced in a RELATIVE or ABSOLUTE mode
Difference Between RELATIVE and ABSOLUTE
RELATIVEA relative URL is a link to the external resource, which is dependant upon the location of the file calling the link. For example, if you have a webpage stored on the root of your C: drive, called "page1.html", and you wish to create a link to another webpage, page2.html, which is also located on the root of the C: drive, you might create a link in page1.html as follows:

<A HREF="page2.html">Go to page 2</A>

ABSOLUTEAn absolute URL links directly to the external resource, irrespective of the location of the page linking to it. For example, linking to our "page2.html" example above using "absolute" addressing would result in:

<A HREF="C:\page2.html">Go to page 2</A>

In both the above examples, the links would link to the same "page2" file, the difference is, is that if you move your files to another location (i.e. C:\Webpages\MySite), without changing your absolute links, they won't work (as they'll still be referencing "C:\page2.html"). For this reason, always use the RELATIVE mode of addressing for URLs within your own website, that way, when you come to upload your finished site, all your links will work correctly
But what if I need to link to resources that are not located in the same "directory"? In the relative example above, both page1.html and page2.html were located in the same directory (folder), so linking between them was easy. If page2.html is now put in a lower directory (a sub folder), called "folder", for example, we can still link to it from page1.html (contained in a higher, "parent" directory), as follows:

<A HREF="folder/page2.html">Go down to page 2</A>

The same principle applies if page2.html is two sub-directories lower than the "calling" page:

<A HREF="folder/pages/page2.html">Go down to page 2</A>

Now, if the situation is reversed - let's assume that our "page2.html" file is one directory lower than the "page1.html" file, and we want to add a link in "page2.html" that sends us back to "page1.html" (in a higher directory), we link to it with the addition of a "../" string. This tells browsers to navigate up a directory:

<A HREF="../page1.html">Go up to page 1</A>

Likewise, if "page1.html" is two directories higher, we would use "../../", and so on:

<A HREF="../../page1.html">Go up to page 1</A>

To aid in the process of using "relative" addressing, each time you locate a file using "Browse" buttons in The WebWizard (for example, when inserting an image, style sheet, or media file), a copy of the file is placed into a "working sub folder" of the WebWizard's install folder (usually C:\Program Files\WebWizard). You can set these working sub folders via the settings toolbar button. Example:
You wish to insert an image from your computer, located at C:\Webpages\images\myimage.jpg"
1) Click the "Insert Image" toolbar button, then click "Browse" to locate the image.
2) The image is then "copied" into the images working sub folder (usually "images/"), allowing you to link to it using:

<IMG SRC="images/myimage.jpg">

3) When you come to upload you finished webpage, simply upload the contents of your working sub folders too, and all your links to external resources should remain intact!

What characters are allowed/not allowed in URLs?
  • Any alpha-numeric character is valid in an URL, other characters need to be "URL encoded" (use the "Remove/Convert HTML" toolbar button to achieve this)
  • Spaces are not generally allowed in URLs, again, these should be "URL encoded", and converted to "%20", as some browser won't handle them otherwise. Example:

    <A HREF="new page.html">Click me</A>

    .. some browsers would link to "new page.html", others would attempt to link to "new" (stopping at first "space". To get around this, the link should look like this:

    <A HREF="new%20page.html">Click me</A>

  • Also, be aware that some webservers are case sensitive, so that if your file was called "MyPage.html", and you attempted to link to "mypage.html", you would see a "404 - Note Found" error.

    We therefore advise the following: Keep filenames simple, all in lowercase, not containing spaces or any form of punctuation.. and you should do alright!

  • Next Topic: Working with Tabs >