Accueil
Poésie
Mathématique
philosophie
Mobile
Action
Démonstration

J'ai grandis avec des coutumes multidirectionnelles, qui induisent des logiques multidirectionnelles.
Avec l'aire du numérique qui remplace l'analogique, j'ai vu les savoirs se perdre et même devenir incompréhensible car ne pouvant être perçue en utilisant une logique unidirectionnelle. Je pense que ceci est induit par le fait que les langages actuels sont tous unidirectionnels et que les langages par l'utilisations d'internet remplacent de plus en plus les contacts humains.
J'ai essayé de créer plusieurs techniques pour contrer cet effet. La création d'un alphabet css3, n'en est qu'une de plus.

Le but est de créer des effets en associant plusieurs causes, sens du terme, forme de lettre, mouvement de lettre, son différent de celui de la lettre attendue. L'effet final n'est que l'équilibre du tout et n'a de sens que dans le tout. Un langage multidirectionnel à la hauteur de l'homme en opposition aux langages unidirectionnels qui nous abaissent à la servilité des animaux.
Des millénaires d'évolution, perdus en une génération.

alphabet css3

L'indentation, c'est le mal
Ce n'est pas parce que les machines ne peuvent pas classer le contenue de nos échanges,
que nous devons les abandonner, quitte à ne plus être référencé sur les moteurs de recherches

1- lettre c noire

.arc_gauche{
width: 20px;
height: 40px;
border: 0px;
border-top: 3px solid black;
border-left: 3px solid black;
border-top-left-radius: 40px;
border-bottom-left-radius:2em;
margin-left: 50px;
}
...sortie head entre dans body..
div class="arc_gauche"

2- lettre j bleu

.arc_double_droit{
width: 20px;
height: 40px;
border: 0px;
border-top: 3px solid blue;
border-right: 3px solid blue;
border-top-left-radius: 40px;
border-bottom-right-radius:40px;
margin-left: 50px;
}
...sortie head entre dans body..
div class="arc_double_droit"

3- lettre o bicolore

.arc_double_couleur{
width: 20px;
height: 40px;
border: 0px;
border-bottom: 3px solid #3366FF;
border-left: 3px solid #CC6699;
border-top: 3px solid #3366FF;
border-right: 3px solid #CC6699;
border-top-left-radius:40px;
border-top-right-radius:40px;
border-bottom-right-radius:40px;
border-bottom-left-radius:40px;
margin-left: 50px;
}
...sortie head entre dans body..
div class="arc_double_couleur"

4- lettre l bicolore

.trait_vertical{
width: 3px;
height: 40px;
margin-left: 50px;
}
.varie {
background: -webkit-linear-gradient(180deg, #009999, #FF3300);
background: -o-linear-gradient(180deg, #009999, #FF3300);
background: -moz-linear-gradient(180deg, #009999, #FF3300);
background: linear-gradient(180deg, #009999, #FF3300);
}
...sortie head entre dans body..
div class="trait_vertical varie"



5- lettre composée en associations

.petit_arc_double_couleur{
position:absolute;
width: 10px;
height: 20px;
border: 0px;
border-bottom: 3px solid #3366FF;
border-left: 3px solid #CC6699;
border-top: 3px solid #3366FF;
border-right: 3px solid #CC6699;
border-top-left-radius:20px;
border-top-right-radius:20px;
border-bottom-right-radius:20px;
border-bottom-left-radius:20px;
margin-left: 50px;
}
.trait_vertical{
position:absolute;
width: 3px;
height: 40px;
margin-left: 50px;
}
.varie {
background: -webkit-linear-gradient(180deg, #009999, #FF3300); /* pour Safari */
background: -o-linear-gradient(180deg, #009999, #FF3300); /* pour Opera */
background: -moz-linear-gradient(180deg, #009999, #FF3300); /* pour Firefox */
background: linear-gradient(180deg, #009999, #FF3300); /* Standard */
}
...sortie head entre dans body..
2 div pour ne pas mélanger les caractéristiques
En déplaçant à l'aide de top ou left on crée le q, le d, le b
div class="petit_arc_double_couleur"
div class="trait_vertical varie"



6- lettre composée en associations 2, le dernier qui parle a raison

div class="petit_arc_double_couleur" style="margin-left:36px"
div class="trait_vertical varie"



7- l'héritage

div class="penche60
div class="petit_arc_double_couleur" style="margin-left:36px" fin div
div class="trait_vertical varie" fin div
fin div donnant heritage



8- Mouvement en 2 temps, 1 au clique 5px vers la gauche, 2 au passage souris vers la droite
En application pour que le mot se mette en forme qu'au clique de souris

div class="trait_penche" onMouseDown=""



9- Montre1

.montre1{
position:absolute;
width: 40px;
height: 40px;
border: 0px;
border-bottom: 3px solid #3366FF;
border-top-left-radius:40px;
border-top-right-radius:40px;
border-bottom-right-radius:40px;
border-bottom-left-radius:40px;
margin-left: 50px;
}
...sortie head entre dans body..
div class="montre1"



10- Montre2

.montre2{
position:absolute;
width: 20px;
height: 40px;
border: 0px;
border-left: 3px solid #CC6699;
border-top-left-radius:40px;
border-top-right-radius:40px;
border-bottom-right-radius:40px;
border-bottom-left-radius:40px;
margin-left: 50px;
}
...sortie head entre dans body..
div class="montre2"



11- Montre3

.montre3{
position:absolute;
width: 20px;
height: 40px;
border: 0px;
border-top: 3px solid #3366FF;
border-top-left-radius:20px;
border-top-right-radius:20px;
border-bottom-right-radius:20px;
border-bottom-left-radius:20px;
margin-left: 50px;
}
...sortie head entre dans body..
div class="montre3"



12- Montre4

.montre4{
position:absolute;
width: 20px;
height: 40px;
border: 0px;
border-right: 3px solid #3366FF;
border-top-left-radius:20px;
border-top-right-radius:10px;
border-bottom-right-radius:80px;
border-bottom-left-radius:20px;
margin-left: 50px;
}
...sortie head entre dans body..
div class="montre4"



13- Montre5

...sortie head entre dans body..
div class="montre4"
div class="montre1" style="margin-top:-35px ; margin-left:50px"





14- Montre6, application : le dernier qui parle a raison

...sortie head entre dans body..
div class="montre1" style="margin-top:-35px ; margin-left:50px"
div class="montre4"





15- Le positionement

Nous pouvons posisioner les lettres sous différentes formes.
Faire en sorte que la même lettre soit utile à plusieurs mots, ou qu'encore le même mot soit le noeud de plusieurs associations de mots.
Pour cela, nous allons définir une zone de travail dans laquelle nous placerons nos lettres et nos dessins.

.mon_humeur{
width: 600px;
height: 200px;
background-color: #F5FFFA;
margin-left: 50px;
}
...sortie head entre dans body..
div class="mon_humeur"
mes div des lettres et dessins
div class="montre4"
fermeture du div humeur












16- Première application

Nous pouvons posisioner les lettres sous différentes formes.
Faire en sorte que la même lettre soit utile à plusieurs mots, ou qu'encore le même mot soit le noeud de plusieurs associations de mots.
Pour cela, nous allons définir une zone de travail dans laquelle nous placerons nos lettres et nos dessins.

.boucle1{
width: 20px;
height: 20px;
border: 0px;
border-bottom: 3px solid #3366FF;
border-left: 3px solid #CC6699;
border-top: 3px solid #3366FF;
border-top-left-radius:20px;
border-top-right-radius:20px;
border-bottom-right-radius:20px;
border-bottom-left-radius:20px;
margin-left: 50px;
}
.mon_humeur{
position:absolute;
width: 600px;
height: 200px;
background-color: #F5FFFA;
margin-left: 50px;
}
.sortie_droite{
position:absolute;
width: 20px;
height: 20px;
border: 0px;
border-left: 3px solid #3366FF;
border-bottom: 3px solid #3366FF;
border-top-left-radius:20px;
border-top-right-radius:10px;
border-bottom-right-radius:80px;
border-bottom-left-radius:20px;
margin-left: 50px;
}
...sortie head entre dans body..
div class="mon_humeur"
mes div des lettres et dessins
div class="mon_humeur">
div class="boucle1" style="margin-top:45px ; margin-left:50px">
div class="sortie_droite" style="margin-left:20px">
/div> /div> /div>
fermeture des 3 div humeur étant le dernier.
Au passage de la souris ou au clique sur telle lettre, ou telle lettre,
les lettres vont s'assembler de telle manière ou de telle manière selon la lettre sélectionnée.
Nous pouvons faire aussi apparaitre de nouvelles lettres selon l'enchainement de clique.
ou bien même faire jouer tel son ou tel son.















17- application baton simplifiée avec un trait horizontal et un trait vertical pour brique de construction

div class="mon_humeur1"
div class="trait_vertical1" style="margin-top:45px ; margin-left:50px ; background:black"
div class="trait_horizontal1" style="background:black"
div class="trait_vertical1" style="background:black; margin-left:20px"
div class="trait_horizontal1" style="background:black; margin-top:20px; margin-left:-20px"
div class="trait_vertical1" style="background:black"
div class="trait_horizontal1" style="background:black; margin-top:20px"
div class="trait_vertical1" style="background:black; margin-left:20px; margin-top:-20px"
/div /div /div /div /div /div /div
div class="trait_vertical1" style="margin-top:45px ; margin-left:100px ; background:black"
div class="trait_horizontal1" style="background:black"
div class="trait_vertical1" style="background:black; margin-left:20px"
div class="trait_vertical1" style="background:black; margin-top:20px; margin-left:-20px"
div class="trait_horizontal1" style="background:black; margin-top:20px"
div class="trait_vertical1" style="background:black; margin-left:20px; margin-top:-20px"
/div /div /div /div /div /div
div class="trait_vertical1" style="margin-top:45px ; margin-left:150px ; background:black"
div class="trait_horizontal1" style="background:black"
div class="trait_vertical1" style="background:black; margin-left:20px"
div class="trait_vertical1" style="background:black; margin-top:20px; margin-left:-20px"
div class="trait_vertical1" style="background:black; margin-left:20px"
/div /div /div /div /div
div class="trait_horizontal1" style="margin-top:45px ; margin-left:200px ; background:black"
div class="trait_vertical1" style="background:black; margin-left:10px"
div class="trait_horizontal1" style="background:black; margin-top:40px; margin-left:-20px"
div class="trait_vertical1" style="background:black; margin-left:20px; margin-top:-20px"
/div /div /div /div
div class="trait_vertical1" style="margin-top:45px ; margin-left:250px ; background:black"
div class="trait_horizontal1" style="background:black"
div class="trait_vertical1" style="background:black; margin-left:20px"
div class="trait_vertical1" style="background:black; margin-top:20px; margin-left:-20px"
div class="trait_horizontal1" style="background:black; margin-top:20px"
div class="trait_vertical1" style="background:black; margin-left:20px; margin-top:-20px"
/div /div /div /div /div /div
div class="trait_vertical1" style="margin-top:45px ; margin-left:300px ; background:black"
div class="trait_horizontal1" style="background:black; margin-top:40px"
div class="trait_vertical1" style="background:black; margin-left:20px; margin-top:-40px"
div class="trait_vertical1" style="background:black; margin-top:20px; margin-left:-20px"
div class="trait_vertical1" style="background:black; margin-left:20px"
/div /div /div /div /div
div class="trait_vertical1" style="margin-top:45px ; margin-left:350px ; background:black"
div class="trait_horizontal1" style="background:black"
div class="trait_vertical1" style="background:black; margin-left:20px"
div class="trait_vertical1" style="background:black; margin-top:20px; margin-left:-20px"
div class="trait_horizontal1" style="background:black"
div class="trait_vertical1" style="background:black; margin-left:15px"
/div /div /div /div /div /div
/div















18- baton simplifiée affiché au clique et explications de dévelopements humains (incompréhensible pour les machines et autres moteurs de recherches)

Selon la distance le texte est compréhensible seulement par l'esprit humain, ainsi il est aisé de mettre en forme une série de petites lettres, en prenant un peu de distance ces lettres créent une forme générale donnant le vrai texte.
Nous pouvons aussi incorporer des décorations en forme de lettre sur le bord des lettres identifiées par l'esprit humain pour contrer d'éventuelles reconnaissances de formes. Nous pouvons Encore créer nos lettres en incorporant une partie possédant la couleur de fond du support, en exemple si la barre verticale de droite du O est de même couleur que le fond, il apparait un C à l'oeil.
Nous pouvons créer des V en formes d'oiseaux, .... En d'autres mots, utiliser la logique multidirectionnelle de l'esprit humain pour augmenter la puissance de nos communications.
Nous pouvons créer des lunettes ne laissant passer que certaines couleurs, ainsi le texte lu par l'esprit humain sera différent selon la paire de lunette portée et les lieux cliqués.
Exemple au clique.