ADVICE ON WEB FILES

  AP22 13:26 24 Oct 03
Locked

I am new to web design so please forgive any silly questions! I have created a web site in MS Word 2002. When you save a page (say myweb) as html it creates a document called myweb.html (or htm) and also creates a linked separate folder called myweb_files in which images are stored.

I then tried importing my saved html file (myweb.html) into ACEHTML (so I could clean it up), created another new folder called Myweb and saved the clean file as a new html file. I tried to load this into IExplorer which it did OK but without the images. I therefore copied across to the new myweb folder the myweb_files file (that contained the original images) but this copied across the old myweb.htm file as well.

What am I doing wrong? How can I re-link the images to the new html file?
Can I use an mhtl file instead that seems to archive everything in one folder?

  Forum Editor 13:38 24 Oct 03

to your question in our WebDesign forum, so I'll move you there now.

  Taran 14:33 24 Oct 03

It's a while since I fooled with AceHTML, but here we go.

Create a folder on your desktop or anywhere convenient to you and call it whatever you like - for this example I'll call the folder MySite.

Double click the MySite folder to open it a create a new folder inside it called images (note, no capital letter in the folder name).

Copy your image(s) from the Word created site into the images folder you made in your MySite folder.

Now copy the Word created .htm files into your MySite folder.

Open AceHTML.

The second tab from the bottom left of the screen, just above the Windows taskbar Start button is called File Manager. Click on it.

At the top of the File Manager panel is a drop down list box with AceHTML 5 selected by default. Click the drop down arrow and use the file browser to find and open your MySite folder.

Now double click the .htm file you want to work on to open it up.

Search through the code in your page for an inserted image HTML tag, which will look something like this:

<IMG SRC="myweb_files/imagename.jpg" HEIGHT="243" WIDTH="340" BORDER="1" ALT="Title of your picture">

You have to change the bit where it says <IMG SRC="myweb_files/imagename.jpg" to reflect the name of the folder your file is in.

Remember you copied the image you eant to use to the images folder in your MyWeb folder.

Change this:

<IMG SRC="myweb_files/imagename.jpg"

to this:

<IMG SRC="images/imagename.jpg"

The image tag breaks down as follows:

src=""

height=""

width=""

border=""

ALT=""

src="" is where you put the folder name then the filename of your image in relation to the web root folder, so src="images/imagename.jpg" will display a picture called imagename.jpg that is in the folder called images in your web folder.

height="" and width="" are for you to alter the size of an image if you want to specify a certain size.

border="" allows you to set the value of border="0" if you don't want a line around the edge of your image or border="1" will put a 1 pixel wide line around it.

ALT="" is where you put the title of the picture or some descriptive text. This creates a pop up tooltip onscreen with the text you type into the "" portion of the ALT tag. It looks nice and visually impaired people who use software that 'reads' a web page can use the ALT tag to tell them what your pictures are of.

Save the changes you make to your image path and you're done.

Regards

Taran

  Pesala 18:36 24 Oct 03

Taran, when people are new to web design, I suspect that all but a very few will want to know about HTML code. Sooner or later, as I have found, one needs to learn a bit, but it really is too much to begin with.

Why not encourage people to use products like NOF or Serif Webplus that do all the HTML coding for you? I even found it quite easy to edit an existing web page in Open Office and save the changes. No need for coding at all.

  Taran 18:50 24 Oct 03

I answered based on the question parameters.

AP22 asked how to do this using a particular program , in this case AceHTML.

The steps I've outlined are one of a couple of ways to do what was requested using that program.

I agree that newcomers may be daunted with code, which is why I explained what the tags were and what they did at so much length.

I also agree that NetObjects, Serif, FrontPage and any one of a number of other programs are far better suited to newcomers, however, AceHTML is free (although there is a paid for version) and its output is superb if you can get your head around it.

It is not a WYSIWYG editor but more a code generating/manipulating application, a bit like the excellent CoffeeCup HTML Editor.

Yes, AP22 could well be better off using a friendlier program but if he or she wants to be able to do what was asked, the steps I've outlined are how to achieve the result using the software they currently have.

It means there is no need at this point to buy or source (and then learn) alternative software and the task in hand can be completed.

Regards

Taran

  AP22 21:16 24 Oct 03

Thanks, Pesala, for your interest and helpful advice. However, Taran is quite right in his response. In fact he exactly answered what I asked and I found it very helpful.

  Pesala 00:55 25 Oct 03

However, when you're an expert it is all too easy to overwhelm newbies. It seems my fears were groundless as you seem happy with using code.

I've developed an extensive website with hardly any knowledge of HTML coding. I'm gradually picking up bits up as I go along, but I am much more comfortable with the DTP approach.

This thread is now locked and can not be replied to.

Best phone camera 2016/2017: Galaxy S7 vs iPhone 7 vs Google Pixel vs HTC 10 Evo vs OnePlus 3T vs…

1995-2015: How technology has changed the world in 20 years

The Pantone Colour of the Year 2017 is Green

Super Mario Run preview | Hands-on first impressions of Super Mario Run: Mario's iPhone & iPad…