Backspaces: tutorials

Math on the Web · 2008-07-20

One of my favorite challenges to my friends is “Send me an equation”. It sounds like a dumb thing, but after a bit of thought, you’ll agree that

Math Is A Second Class Citizen On The Web!

The Math Typesetting for the Internet page has a good discussion on the issues.

So what to do?! MathML? HTML/CSS? ASCII stunts? Equation Editors? LaTeX Tools? JavaScript?

The fact is that it’s not at all easy to make a choice. So here’s the road I took:

Notation: I decided on TeX notation. It’s the standard and I decided I’d be ignorant not knowing it!
Tools: LaTeXiT, TextMate and similar tools are good at equation creation, producing images/pdf helping visualize/debug the LaTeX source.
Plugins: I decided to not use plugins: I’d need a different one for each blog, wiki, forum and so on. They also often require root access.
Images: I similarly decided not to use static images: they are inflexible and hard to manage, and also loose the basic TeX source.
LaTeX2HTML: I did not want to use LaTeX2HTML (or similar) because my blog (and wiki and forum) all have their own markdown language that I did not want to “escape” by inserting raw HTML.
LaTeX Source: I wanted to retain the LaTeX source in the HTML so that in the future I might use the equation in a different tool.

This led fairly quickly to a very nifty solution: CodeCogs has created a LaTeX Equation Editor and a web service for rendering the results! Sixth Form Mathematics & Law blogs on using the CodeCogs facility for dynamic images created by a server.

The idea is quite elegant: send a LaTeX equation in a URL to a server which converts it, dynamically, to a tiny image. The LaTeX segment below is rendered into the equation following it.

\int_{-\infty}^{\infty}e^{-x^{2}}dx=\sqrt{\pi}

$\int_{-\infty}^{\infty}e^{-x^{2}}dx=\sqrt{\pi}$

Click on the LaTeX code above to see the CodeCogs URL used and the result of its use as a stand-alone image.

Here’s the Textile markdown used in this article:

!http://www.codecogs.com/eq.latex?
\int_{-\infty}^{\infty}e^{-x^{2}}dx=\sqrt{\pi}!

The following can be used instead and allows blanks in the LaTeX source:

== <img src=
http://www.codecogs.com/eq.latex?
\int_{-\infty}^{\infty}e^{-x^{2}}dx=\sqrt{\pi}
/> ==

Note that the line breaks after the “?” in the above URLs are used to fit on the page, they do not occur in the HTML/Textile source.

Comment

XHTML/CSS: The Quiet Web Revolution · 2004-10-09

While updating my ancent website (started in the 1995’s .. so very html 1.0), I decided to look into the current state of the art of web publishing.

Imagine my surprise when I found that the cruddy table based mess the .com sites used to achieve their unnatural, pixel perfect goals had been replaced by a very clean separation of content and structure (xhtml) and the looks and style of the page (css).

I put together several examples for a talk to our local technical team. Here’s the talk’s “slides” .. pages of reference material and demos.

Note: The talk included considerable CSS magic by making simple changes in the style sheet using CSSEdit and having immediate response in the preview page. So some of that is missing for folks just looking at these pages.

The Basics

Here we look at old html and new xhtml and css.

Before we start: Some of The Heros

These folks, and many others, brought order back from the chaos of the early, table-centric (read “Gawd Awful”) mess our poor web wandered into. Notice how design played a strong role in achieving this revolution. Techies — be humbled.

The Tutorial

Note: During this part, I used the very simple document discussed above, simply changing its style sheet. Between step 1 and 2 I added a bit more material to show the impact of the styling.

Help: The Great CSS Community

Here’s the tip of the help iceburg. My recent experiences converting to xhtml/css and then Textpattern as a CMS really made me appreciate all the help out there. Angels, we thank you!

Complexity Workshop · 2003-04-10

After our move to Santa Fe, we decided to start Complexity Workshop, a small applied complexity science company.

Our first stunt was to write a set of Agent Based Modeling tutorials, showing how to write simple simulations in NetLogo and Repast.