53

Is there a language I can use to write my website's HTML, which:

  • converts to HTML without having to write the HTML directly
  • has all the power of HTML
  • is less verbose than HTML and XML

For example, it should be to HTML what CoffeeScript is to JS.

Also, what is your experience with whatever you suggest?

Also have a look at Comparison of web template engines and Scala Tags

Alex
  • 8,518
  • 4
  • 28
  • 40
  • 2
    The general answer to this question is "templating". For a huge list that compares them on a feature-base, see [this wikipedia page](http://en.wikipedia.org/wiki/Comparison_of_web_template_engines) – MarioDS Sep 23 '14 at 09:50
  • Most of these recommended programs leave off ARIA attributes, unique id, tooltips, rel, id/name matching pairs,HTML5 validation in form fields, microdata, and much more. It is a bad idea to expect software to write good HTML code for you as most of it is incomplete, from my experience. If the "templating" software allows you to write your OWN custom HTML templates, then yes, that seems like a option. An example of why this is bad is the 15 years spent by Microsoft to try and deliver Web Standards HTML in ASP.NET which only until recently was finally on par with" best practices" in HTML. – Stokely Jun 16 '21 at 22:41

7 Answers7

42

A good choice is Haml. In Haml, you write highly structured markup that resembles a stripped-down form of HTML, and where common things have easy shortcuts. For example, adding an element, div, id, or class is done just by changing one character.

It even lets you pass variables in and operate on them in the language of your choice by deferring to a scripting language, so it's actually more powerful than HTML since the implicit scripting makes it Turing-complete.

Here's an example:

  %body
    #header
      %h1 Bob Loblaw's Law Blog
      %h2 by Bob Loblaw
    #content
      - @entries.each do |entry|
        .entry
          %h3.title= entry.title
          %p.date= entry.posted
    #footer
      %p
        All content copyright © Bob Loblaw.

This becomes something like:

<div id='header'>
  <h1>Bob Loblaw's Law Blog</h1>
  <h2>by Bob Loblaw</h2>
</div>
<div id='content'>
  <div class='entry'>
    <h3 class='title'>You don't need double-talk; you need Bob Loblaw</h3>
    <p class='date'>Tuesday, October 31, 2006</p>
  </div>
  <div class='entry'>
    <h3 class='title'>Why should you go to jail for a crime someone else noticed?</h3>
    <p class='date'>Friday, August 11, 2006</p>
  </div>
</div>
<div id='footer'>
  <p>
    All content copyright © Bob Loblaw.
  </p>
</div>
Electric Coffee
  • 11,733
  • 9
  • 70
  • 131
John Feminella
  • 303,634
  • 46
  • 339
  • 357
14

A friend and I just started Layx: a new layout language based on Cassowary, the constraint solving toolkit that Apple is using for their user interfaces. It's only for web now, but it will be multiplatform -mobile natively- someday.

It is designed to be extremely simple and easy (like python), and as asked, it compiles internally to HTML, dynamically, as the interface has to be updated if layers have to be moved or resized.

It's a really new project -alpha version-, so try it knowing that.

Project website: http://www.layx.org/

Online demo: http://www.layx.org/demo/

Open Source repository: http://github.com/layxlang/layx

I hope it helps and feedback is always welcome!

Regards

EDIT (8 Jan, 2015): Open source link added

EDIT (15 Jan, 2015): Demo link added

axelbrz
  • 783
  • 1
  • 7
  • 16
8

I know the question is old but I got to it searching for answers, and I thought I would update the replies with my own.

As already pointed, the question asks primarily for template engines (not so much languages) as the point is generating HTML.

If the objective is to be consistent with CoffeeScript, then CoffeeKup is the way to go. Personally, among the ones that I have seen, in the search for terseness, Pug is the one that looks best to me, it is heavily influenced by Haml (accepted and top answer), and improves it (IMHO) in several aspects: more terse, more elegant and clear (subjective, fair enough) and does not require Ruby, as it is JavaScript based.

PD: Hiccup is a good candidate for Clojure friends.

Trylks
  • 1,458
  • 2
  • 18
  • 31
8

You're essentially asking for a lightweight markup language that can be converted to HTML, popular/well-known examples of which include BBCode, Markdown, and MediaWiki markup.

jwodder
  • 54,758
  • 12
  • 108
  • 124
5

You can define your website as XML using your own custom format, and then convert to HTML using XSLT. Done it in the past :)

Chris Dennett
  • 22,412
  • 8
  • 58
  • 84
  • 15
    He said *less* verbose than HTML/XML. – jwodder Jul 07 '11 at 01:01
  • XML is as verbose as you want it. It's just tags. The hard part is just writing the XSLT, but you only need to do it once. Then you generate your site from the XML and upload. – Chris Dennett Jul 07 '11 at 01:03
  • i just updated the question cause of that answer ;D – Alex Jul 07 '11 at 01:03
  • 11
    While I can appreciate that this is a valid solution, it pains me to imagine trying to do this. This is like building a house by creating a factory which builds generic houses. It eventually turns out that the factory has made specific assumptions about how to build houses, assumptions which are only valid with respect to building a very specific kind of house, which is also the one you currently want. But if you want to build a slightly different house, it turns out you have to significantly retool the factory. Alternatively, you could just, you know, build a house by _building a house_. ;) – John Feminella Jul 07 '11 at 03:10
3

You may be looking for something like this:

http://code.google.com/p/zen-coding/

Though I seem to recall someone already answered this question a while ago.

arkigos
  • 362
  • 1
  • 8
2

You can try Processing.js. You'll still need a HTML shell to host the canvas, but you can actually code your site with Processing/Java.

rogers
  • 366
  • 2
  • 10