Unknotting
the web
Whether or not website design is a leisure pursuit remains to be seen

Articles about technical incompetence don’t appeal to me. I resent the suggestion that being useless at carpentry or rewiring a plug is OK because the author’s real skills lie with the liberal arts. An intellectual can’t be expected to change a tap washer.

Leaving aside my intellectual prowess – a long way aside! – when I decided to make this website that was what I keenly wanted to do. I didn’t want to read Beowulf in old English, or decode the films of Lars von Trier. Despite my advanced age I wanted to take a new piece of software by the scruff of the neck and put together something useful for the Internet. I was pretty confident, too. After all I know Quark Xpress inside out and that’s a pretty heavy DTP (desktop publishing) package.

Well, there is a hero here but it isn’t me. Regard what follows as a cautionary tale.

To begin with all I knew was this: you arranged information in files (called pages) in an interesting and attractive manner, you created links between the files so that users could “turn the pages”, you then transferred this material to a remote computer so that others could look at it whenever they wanted.

Merely a disk messenger
My only practical experience was supplying new stuff to Phil Hoyle who created Belmont’s first site www.belmontrpc.supanet.com, for the Parish Council but was unable to give it the attention he would have liked. I recorded stuff in Word as a PDF (of which more later) on a CD and dropped it through Phil’s letterbox.

This led to MY FIRST BIG MISTAKE. Taking the plunge with my own website I told myself if all else failed I could base it entirely on PDFs. No way, José

Clearly I needed some instruction. Liz Kelso, Belmont Rural’s parish clerk, and manager of the South Wye Learning Centre, said there were impromptu opportunities at the Centre and elsewhere in Hereford. I could also take an online course on website design which had the benefit of being self-paced.

But I’ve never liked exposing myself as a complete novice – even to an online course. So I looked for a book. Knowing I would end up using one form of proprietary software or another, I scanned the titles at Waterstone’s and came up with “FrontPage for Windows”. This was MY SECOND – NOT QUITE SO BIG – MISTAKE. I read the bits for novices and decided, hey, I can manage this at least.

FrontPage not the answer
So I bought Microsoft’s FrontPage. THIRD – REALLY QUITE BIG – MISTAKE.

Backed by more than ten years’ experience of using DTP software and knowing that the Belmont Rural Parish Plan would eventually appear on the website I started converting my Parish Plan files into what I hoped would look like web pages. They didn’t. I was treating FrontPage as if it was DTP. Why was

everything so difficult, so non-intuitive? And why were the results so clunky? There is a reason for this but I won’t try and explain. Nor will I list my approach as a Big Mistake. It’s a learning experience most go through.

In the end the Plan pages looked half plausible, even though – as designs – they were strictly ground zero. I was on the brink of putting together a home page - the Open Sesame to the site - supposed to draw people in by virtue of its brilliant layout.

Then I heard about a forthcoming Hereford website course. Not for techies. Rather to do with ethical and legal aspects of websites. Not entirely sure this was what I wanted but no doubt it would come in handy. Talking to someone about this course I mentioned my courtship of FrontPage. Dreamweaver was better, I was told.

You know what thought did
I’d heard of Dreamweaver. Supposedly the pros’ choice with mucho functionality (computerspeak for ‘more features than you’ll ever use in two lifetimes’) But what the heck, I’d partially digested FrontPage. This would count for something with Dreamweaver. An assumption that proved to be MY FOURTH BIG MISTAKE.

Following close on, came MY FIFTH BIG MISTAKE. Buying the guide “Dreamweaver MX 2004 for Dummies”. Nothing wrong with the book, really, except it just didn’t have the detail I needed.

During the course I received confirmation of My First Biggest Mistake – imagining I could build up a site out of PDFs. A PDF (don’t bother with translating the initials) is a means of converting any file into a fixed format which can be read even if the reader lacks the software with which the file was originally created. All you need is Adobe Acrobat and that’s free.

Trouble is PDFs add up to a lot of kilobytes. And one of the obligations on website designers is to allow for users who may have an oldish computer with a slow processor and not much RAM.

Problems of PDFs
My trouble was I had material that could only be transferred as PDFs. As far as converting this stuff into HTML – the language on which Dreamweaver is based – well, life is too short.

Troubled by this and other considerations I bought Dreamweaver and opened it up. Theoretically FrontPage had prepared me, in reality I hardly knew where to start. It was like jumping from multiplication tables to differential calculus. And the jargon! What, for goodness sake, was “Behaviour”? Or “Head tags”? Or “Assets”?

Only a third of the screen space is devoted to the area for designing things. The rest carries panels leading into arcane functions I could only guess at. And I am not, as I mentioned before, unfamiliar with difficult software. Quark is not easy.

What’s more, Dreamweaver allows you to shrink that tiny design space still further by showing the code behind your design. Code! That took me back to the early nineties when you tweaked your computer’s boot-up by changing DOS commands in the jolly old autoexec.bat file. Had the invention of Windows passed by Dreamweaver?

Cometh the moment...
Well, in the end I learned Dreamweaver (which is, of course, Windows software) – or a tiny part of it. Enough to go back over the pages I had designed and seek to improve them. But I must confess I had some help. Because of…

….THE ONLY THING I DID RIGHT STRAIGHT OFF. Belmont Rural was about to release one of its quarterly newsletters and in it I mentioned my struggles with Dreamweaver. Jon Wilson, of Oulton Avenue, saw this, contacted the Parish Council chairman and said he could help.

Jon designs websites for a living. What’s more, like most other designers, he prefers to work in code rather than my preference which is to push recognisable pictures and text round the screen to try for a satisfactory pattern in WYSIWYG – what you see is what you get. He’s well equipped to explain anything. Except, perhaps, the question, “Where do you start?”

Jon humoured me. He told me lots of stuff which I had difficulty remembering. But one thing stuck. “Use tables.” Nomenclature was typical of the problems I’d faced. For me a table is typically a spreadsheet. A Dreamweaver table is recognisably a table but its associated strategy is quite different.

Jon also helped me retire "Dreamweaver for dummies" by lending me all 1081 pages of "Dreamweaver 3 Bible".

Tables turn things round
Discovering that strategy helped a lot. Finally I was ready to acquire some server space and download my cobbled-up pages. In my own defence I was poorly instructed on this. After a struggle the pages were visible, after an even greater struggle the links worked but I couldn’t get the pix to show. Here was another Dreamweaver anomaly. A picture in Dreamweaver is an image, but an image can also be text. Heigh, ho.

I emailed Jon with this problem which I’d worked on for several days. His response was wonderful. An email at 1.10 pm saying “Just moving the files around.” Then another at 1.17 pm “Looks OK now.”

Later there was a problem with the email link. Jon’s reaction, “It’s not your problem, it’s at the server end.” But communication with the server was horribly slow and involved computer-generated responses in the first and even second instance. After losing my rag I paid for a visit from Belmont’s computer specialist (IT Systems and Services, 31 Blackthorn Close.Tel: 351498). “It’s at the server end,” was the repeated verdict.

And so it was. They did have the grace to apologise for “any inconvenience”.

That’s probably enough on the genesis of www.belmontrural.co.uk . I wish I could have worked it out myself, but a DIY approach to Dreamweaver (FrontPage was much easier) is a tough row to hoe. On the other hand what you teach yourself tends to stick. Then, when something drastic arises, you’re in a better state to ask the right questions.

Comments welcome. Click here

HOME

Do as I say, not as I did
L-plate tips on what to avoid
when creating a website

Fancy creating a website? If so, you may end up with Dreamweaver.

I haven't mastered more than 10 percent of this complex piece of software but I have at least managed to put together this somewhat crude website. Most of the work I did myself, but at two critical points I had to call in experts. Both problems had more to do with web procedures than Dreamweaver itself and I'll explain what these problems were later on. In the meantime I thought it might be useful - while the struggles are still fresh in my mind - to list a few tips that help reduce Dreamweaver to a manageable size during the first crucial hours, days or weeks.

There is a need for such an approach. The Dreamweaver guides I've looked at aim to turn the reader into an expert site designer. As a result they mention, early on, features which are not only hard to understand, they're not even necessary. The beginner is less concerned with becoming an expert than with simply getting something recognisable on to the screen. The learner doesn't need to plan out the site map in advance - just one page will be enough, provided pictures and text hang together in a desirable way.

THE PRIMACY OF THE TABLE So, do not, as I did, start typing words into the white area in the centre of the screen. Go to Insert and click on Table. This triggers a pop-up asking you to specify the number of columns and rows. In each case choose one and click OK. A vaguely defined rectangle will appear and you are now free to type some words in it.

Big deal. These words could have been typed outside your one-cell table and the difference would have been barely perceptible at this stage. It's later on, when you wanted to do something useful with these words you'd have noticed the difference.

Delete your one-cell table and insert another. This time specify two columns. Into the first of the two cells type in the words "This space could contain a headline". Lay the cursor in the second cell, go to Insert and click on Image. Import a photo from wherever you keep photos. It will almost certainly be too large and will distort your two-cell table so it is unrecognisable.

Delete the photo, find out how to make a smaller version, save this version and import it into second cell. It will still be too big. Persist until photo and text can co-exist satisfactorily, side by side.

This done, lay the cursor outside the table on the right-hand side. Go to Insert, choose Table, and specify one column. The result will be a two-cell table resting over a one-cell table. Into the latter type the words "This space could contain an article". There you have the simplest combination of elements that make up a coherent webpage. Like so:

This space could contain a headline

Why tables? Because they are easier to manipulate than text and pictures floating unrestricted on the design space.

AN EXAMPLE OF TABLE MANIPULATION Instead of the table, above, let's give it four columns and fill outer cells with colour:

Then let's put a single-cell table on top and another beneath. We then fill these new cells with colour too:

This space could contain a headline

It's horrible, I know, but the principles involved are recognisably those used in many websites. Especially when we tidy it up

This space could contain a headline

All based on tables. Learn to love the table.

FONTS AND IMAGES. I was astonished to find that Dreamweaver came with only four fonts. I immediately added two or three I felt to be indispensable. A few weeks later I was replacing all the headlines I'd composed in Cooper Black with boring old Arial. No good writing a witty headline if someone accessing the site can't read it because they don't have the font.

But, I told myself, I've seen all sorts of exotic typefaces on the web. Where did they come from? This has to do with nomenclature. An image is a pic, right? But in Dreamweaver an image can also be text.

The word "website" on Belmont Rural's home page uses the font Cataneo. Not your everyday typeface, yet no one should have trouble viewing it. All you do is create a text box in your graphics package (in this case Fireworks which came with Dreamweaver), use any font you like and then export the result as an image to Dreamweaver. Result a 31 kb picture.

MORE ABOUT IMAGES. It's essential your image files have low, low values. Jon, who helped when I got stuck with Belmont Rural, sometimes gets them down to 1 kb. But how do you shrink them to such a degree without totally losing their quality? Jon's tip - use the free service on www.jpegwizard.com.

You find yourself fiddling about a lot with pix. I found it was worth doing this work in an interim folder and then - when satisfied - tranferring the work to the image folder and incorporating it into the page. That way all the failed experiments can be cleaned up without risk.

LOADING THE WEBSITE I was underinformed about the relationship between text files and image files prior to loading the website. Unfortunately I had created two separate folders - one for files and one for images - instead of having the image folder within the file folder. To compensate, Dreamweaver scattered extra images among the text files. Not surprisingly, when I uploaded, the pictures did not show in the web pages. Jon tweaked the site externally to overcome this problem.

I created an image folder within the file folder but fatally gave it the same name as the folder outside. Cleaning up the hard disc site and the remote site afterwards was quite tricky since some images were uniquely in one folder and some in the other and it was quite easy, given the naming booboo I'd made, to delete the wrong image

CUT OFF FROM THE REMOTE With my permission, my grandson was allowed to install Zone Alarm on my computer as a more efficient firewall than that provided by Windows. Alas, this cut access to the website and uninstalling Zone Alarm did not re-establish access. Some tinkering was needed.

No one dare run a computer these days without a firewall and so I re-activated the Windows wall. And got cut off again! The solution is to add another port with a designated link to the website. So far I have been unable to find out whether a similar option is possible with Zone Alarm. The problem at the ZA website is too much info rather than too little.

EMAIL LINK. I did everything I was told and this did not happen. Both Jon and another adviser tried, failed and said the problem lay with the server. By deluging the server with complaining emails I finally got them to agree. Moral: the beginner isn't wrong all the time

HOME