Using HTML Editor Software

After learning to write HTML ourselves, and understanding the structure and rules we can now graduate to using HTML editor software, which allows us to use a range of short cuts for generating relevant code.

Mac : PageSpinner (available as unlimited trial version) (Pagespinner support page)
PC : Try the free Notetab Light.

WSYIWYG (What You See Is What You Get) software such as Dreamweaver or Frontpage cannot be used to create your project. We emphasise the use of simple HTML editor software so the rules and structure of HTML are absorbed as much as possible.

To Install Pagespinner
Create a new folder on your desktop called ‘Other Apps’. ( We do not have permission to install applications into the official applications folder)
Download Pagespinner. (See also The Pagespinner FAQ)
find your downloaded application, double click, and drag the Pagespinner folder into your ‘Other Apps’ folder. Go inside the folder, click Pagespinner and explore.

Some PageSpinner Tips:
The Opening menu offers suggestions for :
New Empty HTML page – which gives you a blank page, with the necessary tags, to start a page from.
New Page Assistant – choose an example template ( eg a page with some tables in it, or a page with a long list of sample editable links included )

Or, from the menu at the top of the screen, clicking File and ‘New Empty Page’ will also get you started..

– Choose ‘Window’ then ‘setup’ then ‘select browser’ and choose Firefox. This will allow you to test your page in Firefox by pressing the navy icon in the far top right of the Pagespinner code window.

– Generally you will work within PageSpinner using page for writing text and code within, and keep a smaller ‘HTML Assistant’ window open beside it. Find this using Pagespinner -> Window -> HTML assistant. The HTML Assistant can also be used to easily insert necessary code for transforming parts of the page.

– When starting a new page, use the pull-down menu in the HTML Assistant window and choose ‘document body’. This will give you options for defining the text colour, background colour or a background image for your page.

– Want to quickly change the colour of particular text? Highlight your text, then from the top screen menu choose ‘text’, then ‘text colour’ and ‘other’ if you wish to use a colour other than the ones they suggest.

– Want to quickly formatting text or photos to be centred? Highlight the text, then click on the ‘centre text’ icon. Change the code from ‘center’ to ‘left’ or ‘right’ if need be.

– Note, to delete any code or text from a page, you need to highlight the text, then press ‘command + delete’.


Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: