Procod

HTML Authoring with m4

For my websites, I wanted:

• some common elements (e.g. logo, sidebar) to appear on all pages
• avoid using frames
• be able to easily modify elements sidewide
• correctly factorize information; do not duplicate the same thing in multiple places
• a solution which works on Windows too

I used to use Macromedia Dreamweaver for HTML authoring. Dreamweaver has these two features, templates and library items, which are sopposed to solve the problems presented above. But I think these features in Dreamweaver are hard to use, fragile and inflexible. I wanted a better solution, and I realized: I just need a macro processor.

I decided to use m4, a macro processor coming from the Unix world, which is also available on Windows. This was my first contact with m4, and I'm very happy I found and used it. M4 made authoring my site significantly simpler.

You can find here the m4 files I used for generating the Procod and PicoStorage sites:

• header.hi
• main.hi
• sidebar.hi
• footer.hi
• page.hi
• index.ht
• m4html.ht
• iniState.txt
• generate.sh

I also used CSS to somehow separate the content from the presentation: pico_yellow.css

More, I wanted to give the user feedback on the sidebar about which page he is viewing: the link on the sidebar pointing to the current page should be disabled, and showed differently. A neat solution was to do this client-side by using a small javascript: pico.js