Many people are creating text for blogs, web pages and HTML documents. But in order for the presentation to look visually appealing and to enable a high standard of navigation by screen-reading software, it is important to include HTML markup. This enables you to create text at specific Heading levels, create bulleted or numbered lists or even insert tables and pictures.
Remembering the HTML syntax however to include in your text can be tricky. If one important character is not included, chances are that your formatting will not be present when you read the document at a later date, or maybe a link you insert will not function correctly. This is where the HTML Assistant can help.
There are many advantages of the HTML assistant:
To bring into view the HTML Assistant, hold down all three keys to the left of the Space Bar on a standard desktop keyboard, (ALT+Windows+Control), and while doing so, tap the letter H, for HTML.
A list of 19 items appears. When you press Enter on any option, you will be asked at least one question, possibly more. Remember, this is the only keystroke you need to remember to perform all HTML-related tasks.
The choices presented to you are:
Before using any of the options described below, be sure that the cursor is placed in a text composition area where you would like the code to be inserted. This could be a plain text document such as in Microsoft Notepad, or something more elaborate, for example a form field in a blogging platform or web page.
When you use any of the items in the HTML Assistant, going back into the menu will set focus to the place in the menu you had previously worked with. So if you had selected to insert a Heading at level 2, going back to the HTML Assistant will ensure that your focus is at the Heading Level 2 item in the menu.
Pressing Enter on any one of these options will ask you for the text you would like to appear on the Heading. Simply type it in and press Enter. The text is inserted surrounded by the necessary HTML code.
If text has been highlighted or selected prior to choosing one of the Heading level options, it is assumed that you would like the text to be the title of the Heading and so you will not be asked for it.
Activating this option includes a line break in the HTML.
Pressing Enter on this option will invite you to type the text for the paragraph. Please do so and press Enter. The text is inserted surrounded by the necessary HTML code. Note that if you wish to create a line break in your paragraph, press the Leasey Key followed by Enter. You will hear that a line break has been inserted and a new blank line is focused in the display area for the paragraph so it is easier to read.
If text has been highlighted or selected prior to choosing this option, it is assumed that you would like the text to comprise the paragraph and so you will not be asked for it.
Selecting this option asks for two pieces of information. You are first asked for the full URL (or web page address) of the Link you wish to create. You should type it and press Enter to move to the next stage. A good example would be http://www.mydomain.com/test.
Leasey Tip: If the URL of the page you wish to point to is a long complicated one, it may be an idea to ensure this is on the windows Clipboard first, prior to invoking the HTML Assistant. In that way, you can paste the URL into the first Edit Field when prompted.
The next question asks for the text you would like to be placed on the Link. A good example might be, "Please activate this link to contact me". Please type this and press Enter. The text is inserted surrounded by the necessary HTML code.
Selecting this option asks for two pieces of information. You are first asked for the Email address to be contained on the Link. You should type it and press Enter to move to the next stage. A good example would be support@hartgenconsultancy.com.
The next question asks for the text you would like to be placed on the Link. A good example might be, "Please Email me". Please type this and press Enter. The text is inserted surrounded by the necessary HTML code.
This is one of the more complex parts of creating HTML code because not only is it necessary to insert characters to denote and terminate a list, but also it varies depending upon the type of list you wish to create. You would under normal circumstances have to place a tag at the start and end of each list item. Leasey takes care of this for you.
A bulleted list means that a bullet will be placed at the start of each list item. A numbered list means that the figures 1, 2, 3, etc, will be placed at the start of each list item. You will observe in our documentation that we always use numbered lists where step-by-step examples are given, but bulleted lists when highlighting a series of points to consider where you should not follow a particular routine.
Go ahead and select a bulleted or numbered list option. You are asked for the first item to be placed on the list. Type it in and press Enter.
The text is inserted surrounded by the necessary HTML code.
You will also notice that characters have been placed above the text you have just typed, which indicates that a new bulleted or numbered list has begun.
Press the HTML Assistant key again. Rather than taking you back into the list of options with which you will already be familiar, Leasey knows that you are in the middle of creating a list, so she just asks you for the next item to be placed on it. Type it in and press Enter. Repeat the process as many times as necessary so as to complete your list.
You will notice each time you are asked for the next list item, you also hear this prompt: "Please Type the next Item of the Numbered List, then press Enter. To end the list, type the word, end."
So, as instructed, when you wish to end the list, into the Edit Field type the word, "end", and press Enter. Your list is now created and Leasey has terminated it with the necessary tag.
You could encounter a situation where you have already composed text and you would like it to be formatted as a list. In that case you should work through the following procedure:
A table consists of information presented in rows and columns. Initially, you need to insert column headers. Underneath the column headers you should insert information for each column in the row. This sequence is repeated until you have included all items you wish to appear in the table.
Choose the Table option from the HTML Assistant and press enter.
You will first be asked for the Table Caption. This information is important particularly for screen-reader users and should be used as a summary for the data which appears in the Table. Type in the caption and press Enter to move to the next stage.
When prompted, type the first column header and press Enter. When you press the HTML Assistant key again, Leasey knows that you are creating a table and will ask you for the next column header. Type it in and press Enter. Repeat as necessary until you have typed all your column headers. When you have completed this task, press the HTML Assistant key, and this time, type the word, "stop". Then press Enter.
You are now asked for the first item to appear at row 2, column 1, of the table. Type it in and press Enter. Press the HTML Assistant key, and type the data for row 2, column 2, etc. Keep repeating this process. Leasey is clever enough to know when you are starting a new row of the table and will remind you this is happening as you add more and more items.
When you have completed all the items in the table, press the HTML Assistant key and, when prompted, type the word, "end". Then press Enter.
Pressing Enter on this option will invite you to type the text for the Block Quote. This is generally used to emphasise a point or to quote from a particular source. Please type the text and press Enter. The text is inserted surrounded by the necessary HTML code.
If text has been highlighted or selected prior to choosing this option, it is assumed that you would like the text to comprise the block quote and so you will not be asked for it.
An image presented on a web page can be a logo or maybe a photograph. When you select the Image option from the HTML Assistant, Leasey asks you for four pieces of information. You can move through each step by pressing Enter.
First you are asked for the path to the image on your web server. Usually, images are stored in a separate folder, such as in a folder called "Images", and so you would type, "forward slash images", like this: /images
Next you are asked for the alternative text you would like to be included for the image caption. This is critical for screen-reader users. Type it in and press Enter.
Next, you are asked for two pieces of information concerning the dimensions of the picture. First you are prompted to enter the width of the image and then the height. These values are entered in pixels, however Leasey gives you some guidance in terms of how many pixels equate to 1 inch.
When the dimensions have been entered, Leasey will enter the necessary code into your text and will give a measurement approximation in inches as to the width and height of the image so it is easier to understand.
Leasey Tip: We strongly recommend that when your web page is uploaded containing images, you should ask a sighted person to visually check that the presentation is satisfactory. Hartgen Consultancy are not responsible for the content or presentation of images on web pages. If the image is not as you intend, you might try changing the dimensions.
This option should be selected in a new document containing no text. The purpose of this option is to create a new HTML document or web page with the necessary code so as to establish the page title and body text. You are prompted to enter the title. Please type it in and press Enter. You will note that the cursor is placed at a point in the document prior to the tag which terminates the body text.
This option should only be used when creating web pages outside a blogging platform, content management system, or similar. In most cases, such environments require that you enter the title in a completely different way.
A Table of Contents, as far as a webpage is concerned, is where you have a long document or web page, and you wish to create what you might call same page links to strategic points within it. This not only assists users of screen-readers to get to where they need to be, but it also means that sighted people can click on one of the links as well, which saves a good deal of scrolling.
The concept is that you will have a series of links close to the top of the document reflecting the items in the Table of Contents. In addition, each strategic point in the document will have some corresponding HTML code alongside it. When a person clicks the appropriate link in the Table of Contents, focus is moved to the anchor point within the document.
If you would like to see an example of such a Table of Contents, you can visit the J-Say page of our website at www.hartgen.org/j-say.
Move through the document and find the first heading you wish to include in the Table of Contents. We are going to ensure that each of our Table of Contents items sets focus to just below each heading.
Select the text of the heading to appear in the Table of Contents.
Go into the HTML assistant with alt control windows H, and select the option to Create an item in the Table of Contents.
The index marker is created, just below the heading.
Find the next block of text which will form an entry in the Table of Contents and select the text.
Again, go into the HTML Assistant and activate the Create an item in the Table of Contents option.
Keep repeating this process until all the headings are included in the Table of Contents
When you are ready to build the Table of Contents, move to the point in the document where this is to be displayed, probably near the top of the document.
Now go back into the html assistant, and this time, select the item, build the Table of Contents. It will be created and you will be advised when it is complete.
There is one other item on this menu, Clear the Table of Contents. Sometimes, you may want to start again with building the Table of Contents. If this applies to you, that is the item you will need. Back to Help Index.