codium

An alternativ way to code your HTML. A way to code more easily and with a good flexibility.

This is just a concept so currently no software can compile this language. To be clear, in this concept we suppose that a browser is smart enough to understand this code. That's it that's all.

Forget about <p> <i> <a> <e> <b> <div> <article> <main> <header> <ul> <li> ....

Here, you can create customs elements like you wish:

[ menu ]  
    [ menu-list ]  
        Lorem 01  
    [/ menu-list ]  
    [ menu-list ]  
        Lorem 02  
    [/ menu-list ]  
[/ menu ]

Every element is a [ block ] And here a way to give them some goodies:

[ top | class='dark' | data='$valeur' ]

[/ top ]

Yeah you can pass some variable if you need.

Another exemple:

OldSchool:

<a href='pub.html' class='pub' >
	<img src='img/pub.png' alt='For Free Pub' />
</a>

NewSchool:

[ pub | src='img/pub.png'| href='pub.html' | alt='For Free Pub' /]

A block can be a link, an image or BOTH!

Different ways = more flexibility:

[ p | text='Lorem ipsum dolor sit iaculis neque mollis in.' /]

 [ p ] Lorem ipsum dolor sit iaculis neque mollis in. [/ p ]

[ p ] Lorem ipsum dolor sit iaculis neque mollis in. [/ ]

Oh! And you can forget about <doctypte> <head> <body> <html> what you need to do is:

[ head
    | charset='utf-8'
    | title='bonjour'
    | src='../css/main.css'
/]

or if you want:

// head
[ charset='utf-8' | title='bonjour'	| src='../css/main.css' /]

and in the bottom of your site:

//foot
[
    | src='../js/plugins.js'
    | src='../js/script.js'
/]

Last exemple:

[ table | class='fancy' ]
    [ table-row ]
        [ table-col ]
            01
        [/ table-col ]
        [ table-col | class='win']
            02
        [/ table-col ]
        [ table-col ]
            03
        [/ table-col ]
    [/ table-row ]
[/ table ]

Exemple:

And about the semantic? Well I suppose that each element can be define in an other file in jSon:

{ 
    "content": {
        "role": "main",
        "type": "list",
        "rel": "me"
    }
}

Not sure about this part... need time to think about it

tomagladiator / codium

codium

About