HTML and CSS Code Beautifier: The Tabifier

2005-05-12 22:51 - Programming

I've been working on this tool for a while. It's not quite done yet, but it's definetly at a useful stage. I call it the tabifier, but in truth it's a code beautifier.

The overarching design goal for this tool was to beautify HTML code without breaking it. This is of course not totally possible, but I've strived to get as close as possible. There are great HTML beautifiers out there like HTML Tidy but they generally do too much. When I take an ugly HTML page that someone else has written and I don't know, I want to pass it through a beautifier to make it easier to work with. Things like tidy, though, will drastically alter the code, often making it more work to turn the result of the beautification back into something that displays like the original than it would be to just plain fix it.

Hence the tabifier! I call it that because it's primary goal is to simply indent sections, with tabs, to be easier to read. It also lowercases tag and attribute names, because I've gotten used to that since I started working with XHTML.

Comments:

very usefull - but found a minor bug (probably easy to fix)
2010-11-12 03:19 - cfloor

crashes the tabifier (firefox 3.6.12) works fine.

thanks for your work!

second try posting html-code, sorry
2010-11-12 03:23 - cfloor

[img src="xxx" /] works fine

[img src="xxx"/] crashes on firefox 3.6.12 (didnt try other browsers)

(replace brackets to tag-brackets of course)

Slashes Fixed
2010-11-29 09:37 - arantius
Thanks for the report, this is now fixed.

Post a comment:

Username
Password
  If you do not have an account to log in to yet, register your own account. You will not enter any personal info and need not supply an email address.
Subject:
Comment:

You may use Markdown syntax in the comment, but no HTML. Hints:

  • An empty line between text will create a paragraph boundary.
  • Use angle braces around a plain URL to auto-link it: <http://www.example.com/>.
  • Use this format to create a link with different text showing: [An Example](http://www.example.com/).
  • Use backticks (``), not leading spaces to enclose a code block.

If you are attempting to contact me, ask me a question, etc, please send me a message through the contact form rather than posting a comment here. Thank you. (If you post a comment anyway when it should be a message to me, I'll probably just delete your comment. I don't like clutter.)