Lost margin and links with table formatting

[sofry]

I wrote this webpage with FrontPage:
http://jimthompson.net/boating/Celes.../MyNoonSun.htm

I want to carry it on my T2 and read it with iSilo. But if I download it with table formatting turned on, then a few seconds after opening the document in iSilo the right margin snaps out to the right, off the right side of the screen, and the internal bookmark hotlinks do not work.

If I download it with table formatting turned off, the margins and links are fine.

I am using version 3.35.

Thanks, Jim

iSilo-friendly celestial navigation notes:
http://jimthompson.net/boating/Celes...ationNotes.htm

Using iSilo to write clinical practice guidelines:
http://www.jimthompson.net/palmpda/iSilo/isilo.htm

[Alexander Turcic]

Jim,

I had a look at your page and also tried to convert it to iSilo. Seems like iSilo really chokes on the untidy FrontPage html source.

The only thing I would do is use something like HtmlTidy to clean the code, check for errors, and see if iSilo likes that better.

One error I spotted which is maybe the reason why iSilo does not follow the navigation bookmark:

<p><a href="#My sight data">My sight data<br>
</a><a href="#Reduction results">My noon sight's reduction<br>
</a>

You should not use <br> inside the <a>...</a> sequence; instead, use it afterwards

Give it a try and tell me if you need more help. Btw, DreamWeaver comes with a tool that not only cleans up your HTML code, but also looks for syntax errors like the ones above.

Greets
Alex

[sofry]

Originally Posted by Alexander

I had a look at your page and also tried to convert it to iSilo. Seems like iSilo really chokes on the untidy FrontPage html source. One error I spotted which is maybe the reason why iSilo does not follow the navigation bookmark:

<p><a href="#My sight data">My sight data<br>
</a><a href="#Reduction results">My noon sight's reduction<br>
</a>

You should not use <br> inside the <a>...</a> sequence; instead, use it afterwards. Alex

That's really interesting. I use 1st Page 2000 to write and maintain my handheld-friendly pages at the Celestial Navigation Notes link, but of course hand-writing HTML is more labour-intensive than just WYSIWYG with FrontPage, so normally I blast out pages in FP. But I had no idea that FP wrote actual HTML blunders like inserting that <br>. What are people using to write handheld-friendly webpages?

[Alexander Turcic]

Originally Posted by sofry

What are people using to write handheld-friendly webpages?

I would recommend that you learn the use of strict XHTML and Cascade Style Sheets (CSS). This keeps the code *very* clean, is easy for offline parsers like iSilo to parse, and can be more easily customized for mobile formatted handhelds.

Have a look at the code of http://www.turcic.com/index.htm, which was my first attempt to write in xhtml+css. I didn't use any special html editor; used Ultraedit, which is my favorite editor for any text documents. If you can afford it, I would recommend the new Dreamweaver MX 2004, which has nice support for xhtml + css as well.

[sofry]

Thanks for the direction. After all these years of using FrontPage I finally broke down and bought Dreamweaver MX 2004 today. Very, very nice. I especially like the menu item that automatically cleans up HTML written by Word. Wow. Sweet.

I've also got the demo version of UltraEdit. It will be very handy I think for quick HTML edits, and as a NotePad super replacement.

[Alexander Turcic]

Cool! Let me know if you need any help.

Alex

[Alexander Turcic]

Btw., one of the most impressive web sites I know that shows the potential of Cascade Style Sheets is CSSZengarden. It is a demonstration of what can be accomplished visually through CSS–based design. The idea: always the same html code, only different CSS Style-Sheet. Have a look, I guarantee you'll be impressed!

[sofry]

CSSZengarden -- great link. I've started documenting my experience with DW at:
http://www.jimthompson.net/FrontpageDreamweaver.htm

[Alexander Turcic]

sofry, interesting read!

To answer your last question, "But should I be using tables at all if I want to write for both desktop browsers and handheld computers?" - try to learn how to use divisions, <div id="main">...</div> together with the appropriate CSS to avoid tables completely for layout purposes.

Tables are generally rendered more slowly on browsers and offer less freedom than CSS. With CSS, you can do pixel-exact positioning, relative positioning, etc. The index of http://www.turcic.com doesn't use a single table for instance.

[sofry]

"The index of http://www.turcic.com doesn't use a single table for instance."

And it's gorgeous too. I've got to learn how to do that.

For now perhaps you would not mind answering this? When I use iSiloX to convert your home page http://www.turcic.com to read with iSilo on my Tungsten T2, it comes out in very readable text, without graphics and colours. How did you do that?

[sofry]

Originally Posted by sofry

"For now perhaps you would not mind answering this? When I use iSiloX to convert your home page http://www.turcic.com to read with iSilo on my Tungsten T2, it comes out in very readable text, without graphics and colours. How did you do that?

I've just answered my own question: it comes out so readable because the css style sheet is not active on the handheld.

So that generates another question: can I use css styles on a webpage AND see the same formatting on the handheld after iSiloX conversion? If not, then what is the workaround?

[Alexander Turcic]

Originally Posted by sofry

I've just answered my own question: it comes out so readable because the css style sheet is not active on the handheld.

So that generates another question: can I use css styles on a webpage AND see the same formatting on the handheld after iSiloX conversion? If not, then what is the workaround?

Try to use inline CSS inline in the <head> section of your html, like:

<style type="text/css">
<!--
body
{
	background: #FFFFFF;
	color: #000000;
}
.
.
.
-->
</style>

I think iSiloX parses the CSS this way; it only ignored my external CSS.

[sofry]

Originally Posted by Alexander

Try to use inline CSS....

Thanks for the heads up on inline CSS styling. I think AvantGo's site advocates that approach too.

I asked this question on the little-used iSilo Forums. iSilo points out that iSiloX should be able to handle basic CSS external styling. They noticed that in my case DW simply had inserted a concrete reference to the style sheet on my hard drive, not a relative reference to the local folder containing the webpage, so I had to edit each page's reference to the style sheet from
<link href=" file:///D|/DreamWeaver/Sites/CN_Notes/CN_Notes.css " rel="stylesheet" type="text/css">
to
<link href="CN_Notes.css " rel="stylesheet" type="text/css">
ie, deleting the phrase in bold type.

When I did that, iSilox found and correctly parsed the appropriate styles in CN_Notes.css for the handheld version, and all the formatting came back. Sweet.

[Alexander Turcic]

Originally Posted by sofry

<link href=" file:///D|/DreamWeaver/Sites/CN_Notes/CN_Notes.css " rel="stylesheet" type="text/css">
to
<link href="CN_Notes.css " rel="stylesheet" type="text/css">
ie, deleting the phrase in bold type.

Makes sense. Glad you got it working!