Partage

créer ses propres balises HTML

Et ces propres attributs aussi pendant qu'on y est =)

Sujet résolu
10 mai 2012 à 11:09:49

Bonjour à tous !

Je suis en train de travailler sur ma petite application PHP et l'envie me démange de fairte pas mal de trucs qui me parraîssent interdit.

Exemple: je veux que sur un lien, ou un bouton, je puisse souligner une lettre qui indique un raccourci. Ca donnerait par exemple:

<a href="www.google.com">
     Faire une <sc>r</sc>echerche
</a>


La lettre "r" serait donc soulignée d'après une règle css simplicime, et je peux aussi créer un script qui fait marcher automatiquement le raccourci.

Je pourrait aussi utiliser un attribut:
<a href="www.google.com" shortcut="r">
     Faire une recherche
</a>


et avec un peu de jquery, c'est très facile d'aller souligner la lettre qui faut et rendre le raccourci effectif..

Mais je sais pas si j'ai le droit de faire tout ça... Puis-je ajouter des balises et des attributs que j'invente ? Si oui, quelle est la meilleure façon de faire ainsi ?

Merci ! =)

Vous êtes demandeur·se d'emploi ?
Sans diplôme post-bac ?

Devenez Développeur·se web junior

Je postule
Formation
courte
Financée
à 100%
Staff 10 mai 2012 à 11:20:24

En html, tu n'as pas le droit, non.

Si c'est précisément pour un raccourci clavier, tu as l'attribut "accesskey".
Pas d'aide concernant le code par MP ni par mail, le forum est là pour ça :) Postez votre code html et css (bouton '</>') !!
10 mai 2012 à 11:22:05

Non non c'est pour plein de choses.... C'est dommage parce que c'est très pratique...

Pourquoi exactement, en fait ? Y'a une bonne raison ?
10 mai 2012 à 11:28:38

Comment le navigateur serait censé savoir à quoi ça correspond et comment le rendre ?
Ce n'est pas parce que vous ne savez pas vous servir d'un marteau qu'il faut planter des clous au tournevis.
10 mai 2012 à 11:32:54

Bonjour,

Tu peux utiliser tes propres attribus en css3 tout en restant valide MAIS ils doivent absolument commencer par data- !
cf http://www.alsacreations.com/article/l [...] -dataset.html

David
10 mai 2012 à 11:34:41

très interessant, djaps. C'est ce que je cherchais, merci beaucoup ! :)
Staff 10 mai 2012 à 11:37:25

Ah tiens, c'est vrai, les attributs data-*, je les avais oubliés. Accessibles par js aussi, d'ailleurs.
Pas d'aide concernant le code par MP ni par mail, le forum est là pour ça :) Postez votre code html et css (bouton '</>') !!
10 mai 2012 à 11:46:57

Si tu veux des raisons, il y à l'accessibilité et la sémantique. Je te laisse méditer la dessus. ; )
10 mai 2012 à 12:46:28

L'accessibilité ? Tu veux dire que d'autres comprennent ma cuisine ? Quand j'utilise ces attributs maison, c'est pour des choses très précises (genre identifier dans un tableau une ligne que je viens d'éditer avec justEdit="true" par exemple... Je trouve que ça rend le code beaucoup plus clair...
Pareil pour les balises, si j'en invente c'est pour encore une fois que le code soit plus clair (et plus rapide à taper) que l'utilisation de classes à ralonge...
10 mai 2012 à 15:27:27

OK. Intéressant :) Donc non pour les balises maisons, mais oui pour les attributs maisons avec data- !

Merci pour vos réponses !
27 juin 2014 à 11:17:38

Tu peux le faire en Css :

<a href="www.google.com">
     Faire une <sc>r</sc>echerche
</a>

et dans le css :

sc
{
  text-decoration: underline;
}

@+


UsurukiPickles coming soon !
22 avril 2015 à 23:24:54

LeMyd13 a écrit:

Tu peux le faire en Css :

<a href="www.google.com">
     Faire une <sc>r</sc>echerche
</a>

et dans le css :

sc
{
  text-decoration: underline;
}

@+

Bonjour,

Je pars quelques mois et à mon retour tombe sur ça. Et personne pour corriger ce jeune fougueux qui tente le diable.

Alors, en espérant que ceci tombe sous les yeux des concernés.

Autant le html5 permet effectivement de créer des balises à l'arrache, autant il faut (je me répète) se demander si on veut que son site soit sémantiquement correct et accessible pour une certaine population de visiteurs.

Si la réponse est : "je m'en fous". Alors go, faites n'importe quoi. Tant que vous testez un minimum sur divers navigateurs et que ça passe. Tant mieux pour vous.

Si la réponse est : "Ouais, je veux que mon site soit accessible par/pour n'importe qui". Alors tenez vous en aux balises fournies et utilisez les id et class qui existent pour personnaliser le contenu. C'est simple, rapide, tout le monde connait et javascript et ses apis manient ça très bien et proprement.

Sincèrement, qu'est-ce qui ne va pas avec ça par exemple :

<a href="www.google.com">
     Faire une <span class="exemple">r</span>echerche
</a>
a{
    text-decoration:none;
}
.exemple{
    text-decoration:underline;
}

-
Edité par TheSlider 22 avril 2015 à 23:28:38

23 avril 2015 à 8:16:44

Et pourquoi pas tout simplement

<a href="www.google.com" class="r">
     Faire une recherche
</a>

Au lieu de shortcut="r" ? Pas forcément très élégant mais cela conviendrait non ?

24 avril 2015 à 13:39:12

TheSlider a écrit:

LeMyd13 a écrit:

Tu peux le faire en Css :

<a href="www.google.com">
     Faire une <sc>r</sc>echerche
</a>

et dans le css :

sc
{
  text-decoration: underline;
}

@+

Bonjour,

Je pars quelques mois et à mon retour tombe sur ça. Et personne pour corriger ce jeune fougueux qui tente le diable.

Alors, en espérant que ceci tombe sous les yeux des concernés.

Autant le html5 permet effectivement de créer des balises à l'arrache, autant il faut (je me répète) se demander si on veut que son site soit sémantiquement correct et accessible pour une certaine population de visiteurs.

Si la réponse est : "je m'en fous". Alors go, faites n'importe quoi. Tant que vous testez un minimum sur divers navigateurs et que ça passe. Tant mieux pour vous.

Si la réponse est : "Ouais, je veux que mon site soit accessible par/pour n'importe qui". Alors tenez vous en aux balises fournies et utilisez les id et class qui existent pour personnaliser le contenu. C'est simple, rapide, tout le monde connait et javascript et ses apis manient ça très bien et proprement.

Sincèrement, qu'est-ce qui ne va pas avec ça par exemple :

<a href="www.google.com">
     Faire une <span class="exemple">r</span>echerche
</a>
a{
    text-decoration:none;
}
.exemple{
    text-decoration:underline;
}

-Edité par TheSlider le 22 avril 2015 à 23:28:38

Oui, je suis d'accord avec toi. C'est clair que je ne code plus pareil qu'il y a 1 ans et que jamais je ne ferais une telle erreur maintenant, non seulement le code n'est pas valide, mais ce n'est vraiment pas propre. je m'excuse pour cette stupide réponse de ma part. 

-
Edité par Usuruki 24 avril 2015 à 13:41:40

UsurukiPickles coming soon !
Anonyme
17 octobre 2015 à 14:21:00

Snool a écrit:

Et pourquoi pas tout simplement

<a href="www.google.com" class="r">
     Faire une recherche
</a>

Au lieu de shortcut="r" ? Pas forcément très élégant mais cela conviendrait non ?


Pour éviter les classes à rallonge justement, puis data-shortcut="r" va bien de toutes façons :)
17 octobre 2015 à 21:00:54

Bonsoir. Normale qu'il faut respecter ce qui existe déjà, déjà pour des raisons déjà évoquées mais aussi pour tout ceux qui programme les navigateurs, ils perdrai un temps fous a faire que leurs navigateurs soit compatible avec d'autres et il y a aussi les développeurs web qui serai obliger de s'adapter a chaque navigateur comme pour IE6. C'est pour s'a qu'un jour on a inventé le w3c qui fait des recommandations pour respecter des norme. Si tu veut faire a ta sauce il existe le xml, la tu peut inventer ton propre html. Le xml est surtout utilise pour partager des données structurées.
17 octobre 2015 à 21:08:49

Déterrage de topic allo ?

-Oui vous êtes bien sur un topic déterrerait qui date de un plusieurs mois

Ps : J'ai report pour ce qui n'aurait pas compris l'humour :D !

14 avril 2018 à 16:10:27

Slt le monde j'ai moi mm cherchais a savoir si on pouvait créé nos propre balise html  et J'suis tombé sur un truque du genre web component? Y'a quelqu'un ici q pourrait m'aider ?? Merci d'avance
Sni-d
Staff 14 avril 2018 à 17:45:11

Bonjour,

merci de ne pas remonter un sujet de 2012, d'autant qu'il est marqué comme résolu.

Crée un nouveau sujet décrivant ton problème (et avec plus d'infos que "quelqu'un pourrait m'aider ?").

Pas d'aide concernant le code par MP ni par mail, le forum est là pour ça :) Postez votre code html et css (bouton '</>') !!