Converting a Word doc to Html... any good editors?
admin
I'm about to convert a massive >200 page user manual into HTML and CSS. It's in MSWord format, which has been a pain. Now I want to convert it over, make it easier to use and maintain.
MS makes a mess in its pants when it tries to write HTML. All the images are gone, the tables are in shambles, there's pee all over the floor...
I'm just starting to learn CSS, doesn't look too hard. I'm also comfortable editing HTML, so I'm wondering if anyone has an editor they prefer? I used HomeSite a few years ago, seemed pretty good, if a bit top-heavy.
MS makes a mess in its pants when it tries to write HTML. All the images are gone, the tables are in shambles, there's pee all over the floor...
I'm just starting to learn CSS, doesn't look too hard. I'm also comfortable editing HTML, so I'm wondering if anyone has an editor they prefer? I used HomeSite a few years ago, seemed pretty good, if a bit top-heavy.
Replies
http://www.ornj.net/software/araneae
It's a very simple text editor, tabs-based, with syntax highlighting and inbrowser preview. Does exactly what it should, nothing more, nothing less
I'm a Sr. Systems Engineer if any of you ever need something. Just yell.
Personally I use a program called textpad but in recent years I have started using editplus a bit more.
KDR I don't know why you mention Vim in this thread... we are talking about windows! any opportunity to pimp linux :P
HTML Tidy can fix Word HTML files to a certain degree.
I've been learning CSS, and I'm liking it. Problem is, the W3C HTML validator pops up some niggling errors, like I can't use <b> for bold, all my <img> tags have to be closed, etc. Do you guys make your code work with XHTML Strict, or do you just get close enough, and not worry about the small errors?
Also, I was wondering what's a good method of adding a common header & footer to all HTML pages? I don't want to put it explicitly in every file (for ease of editing), nor use frames. I can't figure out how to embed text within a CSS file. Maybe some way to load another HTML within a <div>?
Thanks for your help.
I think a tag without closing tag can be denoted with <.../>, that way you don't have to close 'em.
Best way to put a common header and footer on everything is a script. Batch is powerful enough (use piping!) for that.
Unless you're going to become a webdesigner, or your code causes some serious flaws with web-browsers don't worry about little things like using pt or px for fonts, or <b> or <strong> for style coding and stuff like that. When people are viewing your website for a non-webdesign position I highly doubt they're going to right click and view source then start browsing your code for errors. Otherwise the CSS stuff and closing tags streamlines your work.
Another thing that streamlines your work is Dreamweaver as it can parse your color and color code it, along with close tags for you, or delete extraneous tags.
@Chadwick: Do you not want to use frames, or not want to use both frames and iframes (iframes are different than frames in that they can exist within a <div> and call up another html document, plus be controlled by <a href> links within the called page and the original main page).
I was trying the validation route, thinking this will make the pages readable on more browsers, past and future. The doc has to be accessible-friendly. It's part of the specification for our system architecture, which will have other users in the near future.
I'm including another CSS for printing, hopefully that'll help make it print well, though I'm sticking to a fairly vanilla design so maybe that's not necessary. The mandate is to make a document that will last a long time, so the simpler and more standardized the better.
What is piping? I've used a program in the past called BatchReplaceEM which let me batch find/replace across multiple html files. Worked OK. But CSS seems so much more elegant.
Oh, I'm also looking for an HTML editor that will let me assign custom code wrappings to hotkeys. E.g. I select a few lines of text, press Ctrl-L, and it spits out:
<font class="small">Code:</font><hr /><pre><ol class=decimal>
<il>first line of text
<il>second line of text
<il>etc.
</ol></pre><hr />
Or even more commonly, specific replacements for <i> like Ctrl-B = <ital class="foo">, etc., so I can quickly tie selected text blocks to classes in my CSS.
Araneae is great, I like the simplicity of it. Just need this custom-hotkeying as well.
Thanks again for all the help. Coding is cool, isn't it? I'm actually digging it.
As for validation, I'd download a Text Only Browser and see how it displays in there for printing purposes, either that or make a seperate file for printing. Like a 'Printable Version' button that pops up a printable version.
What is this for anyway, that it has to maintain cross-browser compatibility for an extended period of time?
Edit: you could also use Dreamweaver...which has a Find and Replace feature that can access every page in a site and then replace that found object with another set of text.
Like lets say you marked up everything you wanted to have a specific style with <^~> and </^~> tags. Since this is worthless code, and wouldn't show up in any real code, you could use find and replace to replace every ^~ with style="blah". This would essentially replace all the open and close tags with the correct code... ^.^
Before:
<font class="small">Code:</font><hr /><pre><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<~^>Testing my theory</~^>
<~^>of the lovely idea</~^>
<~^>of Dreamweaver find</~^>
<~^>and replace.<~^>
<body>
</body>
</html></pre><hr />
After:
<font class="small">Code:</font><hr /><pre>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<style="blah">Testing my theory</style="blah">
<style="blah">of the lovely idea</style="blah">
<style="blah">of Dreamweaver find</style="blah">
<style="blah">and replace.<style="blah">
<body>
</body>
</html>
</pre><hr />
Works, so long as you choose "Source Code" and then 'Replace All'. Hmm, you may have to set up seperate tags for certain things now that I look at it. One for open and then for close.
My website uses a batch script to assemble the headers, footer and page content and it validates before I upload it, after that the host completely butchers the HTML with their ad code that causes roughly fifty validation errors.
I've just written a new batchfile:
@echo off
echo Generating...
ren ..\output\*.htm *.src
for %%F in (*.src) do (
echo %%F
type head.txt >> ..\output\%%F
type %%F >> ..\output\%%F
type foot.txt >> ..\output\%%F
)
ren ..\output\*.src *.htm
The idea is that you put the part that changes from page to page into the pagename.src files in a sourcefiles directory (e.g. homepage\source) and it'll generate the files in the ..\output directory (when placed in homepage\source that ends in homepage\output). The header and footer go into head.txt and foot.txt.
Maybe that sounds a bit complicated but all you have to do to make a new page is to write the relevant bits into the .src file and run the batch.
Is <style="blah"> even a valid tag?
[/ QUOTE ]
Actually it should be <p class="blah"> now that I look at it with proper CSS styling defining what blah is.
I always use div, not p...
[/ QUOTE ]
Thats umm...quite pointless. Any particular reason? Because even professionals still use <p> paragraphs and link styles to them, in conjuction with the use of <h> headers.
[ QUOTE ]
I always use div, not p...
[/ QUOTE ]
Thats umm...quite pointless. Any particular reason? Because even professionals still use <p> paragraphs and link styles to them, in conjuction with the use of <h> headers.
[/ QUOTE ]
They both come with unwanted attributes. I really can't understand why theres no null tag to use with CSS. I'd almost consider using something like <u> and neutralizing its effect in the CSS, if that didn't ruin the look of the unstyled content.
CSS in general seems rather badly designed, in my opinion though. Now, don't get me wrong, it's still a great timesaver, but it really pisses me off when there's a property I want to set, and no corresponding property in CSS (vertical align [I think?] comes to mind)
They both come with unwanted attributes. I really can't understand why theres no null tag to use with CSS. I'd almost consider using something like <u> and neutralizing its effect in the CSS, if that didn't ruin the look of the unstyled content.
CSS in general seems rather badly designed, in my opinion though. Now, don't get me wrong, it's still a great timesaver, but it really pisses me off when there's a property I want to set, and no corresponding property in CSS (vertical align [I think?] comes to mind)
[/ QUOTE ]
Like what unwanted attributes, missing elements...and what would you do with a null tag? Highly confused
Anyhow the doc is meant to be used by anyone who uses the system to create/edit/deliver content. Which could include those who need accessibility features to "read" it (large fonts, braille, text to speech, etc.). It'll probably evolve into another format by then, but I might as well start it off on the right foot. Also it will likely start out with client-only access, but will eventually get into the public realm.
If I understand this correctly, I think you'd want a null tag so that browsers that don't support CSS would just ignore the tag, displaying the contents as plain text. But if CSS is supported, the .css file would parse that null tag and add a style to the text inside it.
So then I guess a good idea for me might be to use vanilla tags, like <p class="harry">, then use the CSS to replace those with new styling for a more refined look in browsers that support CSS. Sounds like that just might work.
So now I'm looking for a fairly simple text editor, ala Araneae, except with customizable hotkeyable styles. That would rock my world. Well at least until I take off for the break.
As for the types of things I'd use a null tag for: as Eric said, it displays poorly, but more than that-- usually collections of font styles I don't want to apply to the entire paragraph or margins I want to apply to more than one paragraph and divs won't work (CSS loses some of its functionality when you're doing class="leftmarginsmall box header strong" :P). It's not common, but it usually comes up in something. If I had access to my last project I'd give you a specific example, but it was lost in a server mishap =/
Actually, come to think of it, <font> might be a good null tag...
[edit] Oh, and as for your document, your description screams out 'PDF' to me, since they're designed to look and work identically on most machines, are generally uneditable by ene users, and have a number of features that are useful for reference material like bookmarks and such. Just make sure you make good PDFs if you go that route. So many people seem to hate the format because of slow load/display times, unselectable text and such, virtually all of which generally comes down to the person who made the file not doing it well.
I'm still highly confused. I'd probably need an example, because I'm not quite seeing where CSS would perform that horribly. Or where a standard <div> <p> <h> or <span> wouldn't suffice. If theres any situation you can think of I guess list it and I'll see if I can code it using CSS and HTML.
Use the <span> tag to group inline-elements to format them with styles
adding code that does nothing to your website is adding extra polygons to your model that don't define anything. The only exception to this is the use of comment tags...
<div> does nothing except cause a linebreak, <span> does absolutely nothing, that's the null-tag you're looking for.
[/ QUOTE ]
Thank you, sorry that ended up derailing this thread so so much o_0
This doc has a ton of hyperlinking, it's a very useful feature. That's actually the primary impetus to move this to HTML.
Thanks again everyone for the input, much appreciated.
Dreamweaver was auto-completing incorrectly, adding semicolons to the ends of special characters (the TM one) everytime I saved the file, which then broke the W3C HTML4.1 validation.
It's been fun learning about the ins and outs of good HTML/CSS code. I can see how coders can be creative types.