JBO Site Developer 2 Help

Overview

A document list appears by default on the left side of the programme window, with the facility to change drive, directory, and filter the files. The document list may be resized by visiting the Document option on the main menu, or by dragging the vertical resizing bar to the desired position. By default, the directory displayed is that which contains the most recently opened file.
Site Developer is designed to help you create, open, edit, and save HTML web pages, CSS style sheets, Robots text files, Javascript files, and .htaccess files. You may then upload the document to your web site from within the programme using the integrated FTP module. Tags selected from the Tag List, Paragraph, Break, and Time Stamp buttons are inserted directly into the document at the current cursor position or around highlighted text. For convenience, a wide range of tags are available in the drop down list. Where tags require user information, the positions are marked with an ellipsis.
Site Developer is not a code generator and it is assumed that the user will have a basic knowledge of HTML coding. While this is desirable, it is not essential. The help package is intended to provide enough information to allow even the most reluctant user to produce a web page made up of clean code.

Style sheets

Cascading Style Sheets are an effective and recommended method of controlling the style of your web pages. You may want to use one style sheet for an entire site, thus ensuring consistent appearance in all of your pages. Alternatively, you may want to use a separate sheet for different sections of a site which would apply individual identity to each, perhaps as part of an overall image.
To create a style sheet, select Tags | CSS from the main menu. If you have another file already open, Select File | Close from the main menu. Alternatively, open an existing file. You should then decide which elements of your web page you wish to apply a style to, for example, paragraphs. If all paragraphs are to be the same, enter 'p ' in the document window. Assuming that you wish to apply font styling to your paragraph, select Font from the Tag List and click the Add button on the tool bar.
The editor window will now contain the following:
{ font-family: ... ; font-size: ... ; font-style: ... ; font-variant: ... ; font-weight: ... }

You should replace the ... content with the style data you wish to apply. Then having clicked a position in the document window to the right of the 'p', click the Paste to Document button. Your document will now look something like this: p { font-family: Lucida Sans, Arial, sans-serif; font-size: 11px; font-style: normal; font-weight: normal; font-variant: normal }
In practice, you may want to apply style to other elements of a paragraph and this is done at the editor stage by adding the approriate elements from the Tag List and compiling them in the way that you wish. If one or more of the default elements is not needed, delete it from the editor ensuring the syntax of the remainder is correct. You may of course type code directly into the editor or document window if you prefer.
The following is a copy of the basic paragraph styling code used on the JBO Software web site:
p { font-family: Lucida Sans, Arial, sans-serif; font-size: 11px; font-style: normal; line-height: normal; font-weight: normal; font-variant: normal; text-transform: none; color: black }

When you have finished coding your style sheet, save the file e.g. mystyle.css You should then link the file to the web pages to which it will apply the chosen style. Open the appropriate HTML page and add a link to the style sheet in the HEAD section of the web page e.g. To find the basic code for this link, select Tags | HTML, then select Link from the Tag List and Add it to the document. Complete the required information indicated by ... correctly and your web page will be linked to your style sheet.

HTML

Hyper-Text Markup Language provides the code which lays at the heart of your web pages. Site Developer is designed to produce code to HTML version 4.01 as defined by W3C (www.w3.org).
To create a new web page, (if you have another file already open, Select File | Close from the main menu) click the New button on the tool bar. Using New creates the basic structure of a web page in the document window, with tips on which elements should be added in the appropriate locations. Alternatively, you may open and edit an exisitng page.
To add elements to your page, select the relevant tag from the Tag List and click the Add button to create the code in the document window at the current cursor position or around any highlighted text. You should replace any ellipsis content with the appropriate data. You may of course type code directly into the editor or document window if you prefer.
In HTML mode, additional buttons are made available on the tool bar. These provide shortcuts to frequently used elements of the language and include Paragraph, Break, and Time Stamp, which add directly to the document, and Table, Anchor, and Image Builders, which add code to the Editor window. The latter may be transferred to the Document by using the Paste to Editor button.
To make complex pages easier to edit, you may at any time apply highlight to the tags by selecting Search | Highlight | Green (or a colour of your choice from those available on the menu). The document window will appear blank while highlighting is in progress, which takes a few seconds only, depending upon the size of the file and the speed of your computer. Highlighting is not preserved in the saved document.
At any point during the editing of a web page, you can see how your code will be displayed by clicking the Preview button on the tool bar. Your page will be automatically saved, then displayed in your default web browser. If your page is linked to a style sheet, ensure the path to the style sheet is correctly recorded in the Link statement. When you have finished coding your page, save the file e.g. mypage.htm (existing files are saved with the appropriate name automatically unless Save As is selected).
Should you dislike any additions which you have made to a page, selecting File | Revert will change the contents of the document window to the last saved version of the current file (bear in mind that Preview saves the file by default).
Details of the attributes available for each HTML tag are available on the HTML Library page of the Help package.

Meta tags

Meta Tags are a very important yet probably the most often neglected component of web pages. Site Developer is designed to remedy this situation without auto-generating voluble or spurious content tags.
While you may be creating a site which is personal and apparently for your own benefit, other than as an intellectual exercise it is of no practical use unless someone visits it. For most web sites 'someone' means quite simply as many people as possible. Unless your website has an address (URL) which people will instinctively know, then most of your visitors will be sent to your site by one or more search engines. Even if you personally add your site to a search engine (or pay others to do it) the search site will send out their indexing robot to index your site before it is added. Search engine robots look for the information in your Meta tags ... if you have no tags, or they are inaccurate, then your listing may either be at the bottom of a very long list, or in the wrong place altogether.
There are many tags in use but very few of these relate to the Internet. All currently used Internet related tags, as well as a range of tags used on Local Area Networks, are included in Site Developer. To add Meta Tags to an existing web page, open the relevant file and then select Tags | Meta from the main menu. Select the relevant tag from the Tag List and click the Add button to create the code in the document window. You should replace any ellipsis content with the appropriate data. You may of course type code directly into the editor or document window if you prefer. Note that Meta tags must be added to the Head of the document.
In Meta mode, an additional button is available on the tool bar. This provides a 'standard set' of Meta tags in the editor window. You may adapt this as you see fit, then click the Paste to Document button to transfer the completed code into your document at the last cursor position.
Do not be tempted to add inappropriate content details to your tags in order to try to generate extra traffic. Your site should be a pleasing experience for your visitors, not a disappointment. Having created fast and accurate web pages you should continue by using equally accurate descriptions and contents in your Meta tags. Some search engines will drop a site listing completely if they detect misleading data.
If you wish to see examples of how Meta tags are used, visit a web site such as www.jbosoftware.co.uk and select View | Page Source (or similar option) from your web browser menu. This will display the code behind the page you are viewing. Bear in mind that not all Meta tag usage is good usage.

Robots

From time to time, your site will be visited by robots (also known as bots, spiders, web crawlers, etc.) and in the case of reputable search engines, these visits will be welcome. There are however a number of other sites which send out robots and not all of these are benign. Some, for example, search for your graphic images and creates thumbnails of these on their site. Visitors to that site can then click those thumbnails and download your images from your site, using up your traffic allowance, and all without ever visiting your web site.
Happily, web robots generally conform to the Robots Exclusion Protocol. On arrival at a site, the robot will look for a file called robots.txt and if it finds it, it will limit its activities in accordance with the instructions in the file. If it does not find such a file, the robot will index whatever it wants*. There are effectively two 'commands' which may be used in a robots.txt file and these are 'User-Agent' and 'Disallow'. These commands are available from the Robots Tag List in Site Developer.
An example of their use might be:
User-agent: *
Disallow: /

In the above example, all robots (defined by the *) are prohibited from indexing the root directory (folder) and everything in it. The following is an example from www.jbosoftware.co.uk:
User-Agent: *
Disallow: /graphics/
User-agent: psbot
Disallow: /

The above example demonstrates how all robots are prohibited from indexing the contents of a directory called 'graphics', while a robot named psbot is prohibited from indexing anything. To control the actions of specific robots, you must know the name of the robot (you may have to visit the site of the sender to find this, or you may see it in the logs of your web server) for example. Your robots.txt file should be saved in the root directory of your web site.
* Robots may alse be controlled on a page by page basis using the Robots Meta Tag, e.g. (the code for this is of course included in the Meta Tag List in Site Developer).

htaccess

.htaccess files are for use with Apache web servers only. If your web site is not hosted on an Apache server, these functions will have no effect.
Your web host may not permit the use of .htaccess files on their servers. If this is the case, you should not attempt to upload such files to your web site. In some instances, your host may have disabled the use of these files and they would not function if uploaded.
If your web host uses an Apache server, and you have permission to use .htaccess files, you should ensure that you are fully aware of the consequences of using .htaccess commands. JBO Software will not be responsible for any damage or loss caused by your use of .htaccess files under any circumstances.
Training in the use of .htaccess files is available from good Apache server information web sites.
Site Developer includes a few of the most commonly used .htaccess commands but this is by no means the entire range of commands available.
Your file will automatically be named ".htaccess" on saving and no further naming (before the dot) is required.

FTP Utility

Having created or updated your web document, you may upload it to your web site using Site Developer's integrated FTP utility.
Clicking on the FTP button on the toolbar will automatically save the file (you will have the opportunity to choose a file name if it is a new file) and the FTP utility window will appear.
On first use, you must enter your server details. In the Server box, you may enter the host name (e.g. www.mywebsite.com) or the IP address of the server (e.g. 192.168.128.255). In the Directory box, you must enter the path to which the file should be uploaded. If your file is destined for the root directory (folder) of your website, just enter '/' (minus the quotes). Otherwise enter '/name' or '/name1/name2' where "name" is the directory to which the file should be uploaded.
In the User Name box, enter the name which you use to log into your web space. In the Password box, enter the password which you use to log into your web space. These will have been provided by your web hosting company or ISP. Both your user name and password will display as asterisks (i.e. *******) in the interests of security.
You have the option to Cancel until the Upload button is clicked.
When all four boxes have been completed, and if you are connected to the internet, click the Upload button to send the current file to the server. Progress details will appear in the lower pane of the utility window. After Site Developer has disconnected, the Close button becomes available and allows you to exit the utility. Checking the Auto close option allows the utility to close once data transfer is completed on a per session basis.
On exiting the utility the connection details are stored for future use and will automatically be entered into the boxes when the utility is next used.
Please note that it is the user's responsibility to ensure that an internet connection is available. Equally, you should ensure the correct remote directory (folder) is entered prior to upload. If the remote directory does not exist, you will be offered the opportunity to create it.