RISC OS HTML creation (2000)

An article written for RISC World about web development.

Published , updated by Richard GoodwinFiled under Projects

I've tried to keep this as close to the original as possible to retain its historical context, but using a modern CMS will have change the formatting slightly.  For instance images use the original files but appear larger on the page. URLs aren't linked as most no longer work.

This is also the "extended cut" of the original article, so contains bits that didn't get edited out.

RG, 2019

Internet newsgroups abound with questions on how to edit and create a web site, or in the case of the RISC OS groups it's usually worded as what's the best program to edit my web site? Of course it's a little like asking how long is a piece of string? because it really depends on what you want to achieve, and how much you want to pay; so, to try and help with this perennial problem, I'll try and go through all the options one by one. In this article I'll attempt to cover the following:

Browsers

Although many people might bemoan the fact that RISC OS lacks a browser that can handle all the bells and whistles of modern PC browsers, when you start to look into how RISC OS machines support the Internet it's actually quite surprising just how much software there is. No matter which method you use to edit your site you're going to need a Web browser to check the results, and there are now five main contenders to choose from. Looking at these is a good starting place before delving into the nitty-gritty of the editing, but we already start to face the problem of cost versus functionality.

Most users will have a copy of Fresco to try things out with, either because they're using the Ant suite to get onto the Internet, or they use the Voyager software to access the ArgoNet service[1], or because of the number of file-only copies around on magazine CDs (these can test sites on your hard drive but not fetch pages from the Internet). Fresco supports HTML very well - for instance, you can have text flowing around right-aligned tables - but sadly prone to crashing. Acorn themselves released Browse, a more solid but slightly less complete browser which is no longer under development. The rising star is Webster XL, a PD browser turned commercial and fast becoming very good with respect to standards support, if a little slow due to it's core program being written in BASIC (it was however the first RISC OS browser to support both JavaScript and font faces, and hopefully will get speeded up soon). For the fiscally challenged there's PD browser ArcWeb, which again probably won't get too many updates and has limited support for things like tables, but does the job for the right price (i.e. free) and runs on machines where memory is tight. New kid on the block is Oregano, which at the time of writing has yet to be shown to the world at large, but is looking pretty good - a fast, commercial browser developed for NCs which should challenge Fresco's supremacy. Waiting in the wings there's also Webite which is being developed separately after parent program Termite bit the dust, and projects to port the Open Source version of Netscape's browser ("Mozilla").

For testing I always try to use as many browsers as possible; I'd recommend testing using Fresco (the free file-only version at least), ArcWeb (again, free), and if you can afford it one of the other commercial browsers. The occasional test with a PC browser would help - even if your target audience is the RISC OS community, some might have better access at work, school or university where their only option is a PC. Netscape's browser can do things like completely blank a page if you forget to close a table properly, so it's best to find out sooner rater than later.

WYSIWYG editing

Editing HTML using a WYSIWYG editor (which I'm sure you already know stands for What You See Is What You Get) is the most painless way to create a web site, as you generally get the ease of use of a standard word processor or DTP package, but you can access more advanced features like frames, tables and JavaScript doohickeys. When you save your site to disk, it'll look exactly the same in your web browser as it did in the editor - well, mostly.

 
WebMaster, (Web)Spider and SiteWriter in action

RISC OS has three such editors in circulation, namely WebMaster from IMS (http://www.ims-cdc.demon.co.uk/), Spider from Fabis (http://www.fabis.co.uk/) and the newly-released SiteMaster from DanSoft (http://www.dansoft.co.nz/). Unlike the more competitive PC market, where there are two free high-profile editors (Netscape Composer and Microsoft FrontPage), all of the above are commercial pieces of software. WebMaster and Spider are very similar products - personally I found Spider to be the nicer to use of the two, although both products have been improved upon since the early models I used. Apart from drawing flack for the non-standard user interface (which I understand will be completely re-written by the time your read this), SiteMaster seems to aim more at designing with style rather than standard DTP-like editing, using tables to position precisely. It will be interesting to see if this approach pays off; some have voiced concerns about this on the newsgroups, but commercial PC software such as Adobe's GoLive gives much the same functionality, but for more money.

Why should you use a WYSIWYG editor? Well, it's very, very easy to use one to get a site designed quickly, but scores over using a DTP package in that you not only get more advanced options, you also get some form of site management built in - you can generally check the site for internal consistency (making sure links don't go to pages that don't exist for instance), and even upload the pages that have changed directly to your webspace for you. So why wouldn't you use them? Cost issues aside - you have to pay for one of these packages, over the free source editors or the DTP/word processing packages that you might already have - WYSIWYG editors generally generate bad HTML, or at least too much HTML in an effort not to slip up. The example I usually use is an email I was sent from Microsoft Outlook:

<DIV><FONT color=#000000 size=2>Just to let you know that I'll be out of the
office on Thursday 23 from 11 am to approx 2 pm</FONT></DIV>
<DIV><FONT color=#000000 size=2> </FONT></DIV>
<DIV><FONT color=#000000 size=2>Anne</FONT></DIV>

count: 239 bytes

Almost half of this code is unnecessary - if you were to code this by hand, it would be more like...

<font size="2">
Just to let you know that I'll be out of the
office on Thursday 23 from 11 am to approx 2 pm
<P> 
<P>Anne
</font>

count: 134 bytes

...a clear saving, which might not look like much but added together over a large page can substantially affect the download time of your web site. I'm not saying RISC OS editors are quite this bad, but consider Netscape Composer - to do a paragraph break it would often do things like <center>&nbsp</center> instead of a simple <p>, and due to a bug in the Netscape browser's rendering it didn't even display properly!

In summary, if you're pretty serious about web design, have some money to spend, but don't have the time to sit down and learn HTML first, then you'll probably be better off with a WYSIWYG editor. Everyone else, read on!

Using DTP packages

DTP packages and other word processors have a big advantage - you've probably already got one so you don't have to spend any more money, and you're probably comfortable using it. If you want to publish existing information your information will probably be saved in a format that loads into your package, perhaps because that's what you used to type it in in the first place. However, you might not win any awards for great design this way, and if you're using older software you might have to upgrade to a later version, or perhaps in the worst case even ditch your software altogether.

Case in point: Impression. Once the DTP package for the Acorn range of computers, you can even get the Junior version for free from the Computer Concepts web site (http://www.cconcepts.co.uk/). However, for web design it sucks. As standard it doesn't come with any HTML functionality; you can add extra modules into it to give rudimentary HTML loading and saving, but it only really works with stuff that's already in HTML format or if you're starting from scratch, and even then it's a pain. If you want to convert an existing document it doesn't do simple things like convert headlines and sub-headings into the HTML equivalent (<H1>, <H2> etc.), and it doesn't encode "dangerous" characters into safe equivalents - it allows smart quotes, pound signs and even triangular brackets through unaltered, which will play havoc with your document when it's viewed in a web browser, especially on a PC where the character mapping is different.

On the other hand, the TechWriter/EasyWriter range (I'll shorten it to just Writer) is absolutely superb for saving as HTML. I regularly one at work to take Microsoft Word documents and save them as sane, simple HTML - Word itself not only goes overboard with the HTML tags in an attempt to render the document exactly the same in a web browser as it is in the word processor, it also (as of Office 2000) adds a huge amount of Internet Explorer-only XML. And it still fails. It should be remembered that a DTP document is fixed width - you set the page to A4, and that's it - whereas a web page is as wide as the browser window, which can vary wildly. Writer can load an HTML file and import all the images so the DTP version is very close to the web browser version however.

So, I obviously use Writer for any HTML that's predominantly text based, right? Wrong. I've been using Impression for years, I love the ease of the user interface, I know all the keyboard shortcuts, and I've programmed up the abbreviation dictionary to automatically correct common typos. Writer is a whole new learning curve, and I find the user interface a bit fiddly. So what's the solution? Well, I'm lucky in that I have the option to use both - Writer can import Impression files that have been saved as plain text with embedded commands, so I write using Impression and then get Writer to make a fair fist of converting it. There are third-party Impression DDF to HTML converters out there - I wrote one myself called Imp2HTML, or there's DDF2HTML by John Alldred (http://www.protovale.co.uk/john/) - so in the end it's whatever works for you.

If you have a HTML enabled word processor, try it; I think even modern versions of the schools' favourite, PenDown, can do the trick if called upon. If what comes out the other end is okay, then use it. If not, then you might have to go for a more modern program, and you might want to ask a few questions and even try and get hold of some example output before you part with your hard-earned cash. It's certainly easier than teaching a class full of kids HTML though.

Using the source

Up until very recently even in the PC and Mac community you couldn't really call yourself a proper web designer unless you did the macho thing and hit the raw HTML source instead of using those namby-pamby WYSIWYG editors. Now the likes of Dreamweaver has both modes, and even FrontPage can do a source mode, the days of plain old text editors is going a little more out of fashion. However, it's cheap, and still a very good way to get good, clean HTML - if you know what you're doing.

You have all you need to get started built into (or included with) your machine - the text editor Edit. However, apart from the occasional quick chop and change and a very nice, easy to use advanced search and replace facility, if you're going to be using a text editor for any length of time Edit will fast become very restrictive. It doesn't do the two things that you want from a text editor that does HTML - context sensitive colouring, and macros. Context sensitive colouring basically means it will pick out important chunks of text - such as HTML tags - and colour them differently from the rest of the text, making it easier to see where the tags start and the text ends. Believe me, if you're trying to find an error in a large page, this is essential. And macros allow you to quickly add common HTML sequences, for instance you might select a piece of text, click a button and that section is marked as being bold.

There are two main contenders in this field, both of them free - StrongEd and Zap. Which is the best text editor? Well, that's a whole other holy war, but my rule of thumb is that if you have to ask the question it's probably StrongEd. StrongEd is a nice, easy-to-use but powerful text editor. Zap is even more powerful, but perhaps a little more unfriendly to newcomers; it is, however, fairly essential if you also want to write programs in a "proper" language, such as C. You can get these text editors from http://home.eunet.no/~guttorvi/strong.html and http://www.zap.uk.eu.org/ respectively.

You're not constrained to just the limited HTML macros provided by the text editors however; in days of yore it was almost a rights of passage that a webmaster would write his own macro inserter. There are not so many under RISC OS as I expected - in my research for this article I could only find four, and of these I'd written three of them! (perhaps they're just so good there's no room for competition? :-) Trying not to blow my own trumpet too much, first I released the very simple HTMacroL, then the slightly more advanced HTML², and now there's HTML³ which covers most areas of HTML from simple effects to tables and even tricks with JavaScript and Server Side Includes (SSI). The other package I found was HTMLKeys by John Alldred, which offers a simple to use single window of commonly used tags. These programs all work in the same way - you edit your document in a text editor as normal, but when you click on a button in the macro program the text gets typed into your editor automatically, saving you a lot of work. John's site is at http://www.protovale.co.uk/john/, and my own programs can be found at http://www.goodwin.uk.com/richard/programs/ - just to keep up the friendly rivalry you can also get programs to check the links in your web pages from both sites, although John's (LinkCheck) is better for checking internal links, and mine (LinkSure) also checks external links if you're connected to the Internet.

 
HTML³ and HTMLKeys

Finally, there are all sorts of other free goodies to help you with creating a web site the hard way. You'll probably want to have some sort of HTML validator to find bugs in your code, and the best known of these is HTML Tidy (also known as just plain Tidy), originally written by Dave Raggett (the guy who writes the HTML specifications, so he knows what he's talking about - most of the time!). There are a number of conversions of this program to RISC OS, so the best bet is to head over to http://www.acornsearch.com/ and find the one that suits you best. There's also Validator, which is absolutely the last plug I'm giving John Alldred this article. You'll probably want to pick up InterGIF, which started out as a program to convert Sprite files to animated GIFs but is now indispensable for converting any type of file to GIF format whether animated or not (http://utter.chaos.org.uk/~pdh/software/intergif.htm), and RiscPC users can use ChangeFSI (free with your computer) to create JPEG images. If you need to have a large image with hot areas which link to web pages when clicked on, there's ImageMap 1 (freeware) and 2 (shareware) from http://www.atlantic.oaktree.co.uk/software/imagemap/. And if you're into the more advanced stuff, you should consider a visit to http://www.software.solutionsweb.co.uk/ for a CSS (Cascading Style Sheet) creator and automatic button image maker amongst other things.

If you're really serious about hand-coding you site, there is a RISC OS commercial solution - R-Comp do a suite of tools including HTMLEdit, plus other goodies such as a spell checker and imagemap creator. But more of that next issue, when I hope to be reviewing the suit in full.

1
Those lucky few who've been with ArgoNet for a long time have seen custom versions of ArcWeb, Browse and Fresco as part of the Voyager suite, although Browse was only a test version.