Suivez-nous sur X
|
|
|
0,
A,
B,
C,
D,
E,
F,
G,
H,
I,
J,
K,
L,
M,
N,
O,
P,
Q,
R,
S,
T,
U,
V,
W,
X,
Y,
Z,
ALL
|
|
0,
A,
B,
C,
D,
E,
F,
G,
H,
I,
J,
K,
L,
M,
N,
O,
P,
Q,
R,
S,
T,
U,
V,
W,
X,
Y,
Z
|
|
0,
A,
B,
C,
D,
E,
F,
G,
H,
I,
J,
K,
L,
M,
N,
O,
P,
Q,
R,
S,
T,
U,
V,
W,
X,
Y,
Z
|
|
A propos d'Obligement
|
|
David Brunet
|
|
|
|
Dossier : Le BBCode
(Article écrit par David Brunet - novembre 2007)
|
|
Présentation
Le BBCode (Bulletin Board Code) est une implémentation, simplifiée, du langage HTML. Il est principalement utilisé pour la mise en
forme des messages sur les forums de discussion. A l'instar du HTML, les éléments de marquage du BBCode sont appelés "balises".
Ces balises sont entre crochets [ et ] suivant le modèle [balise]texte[/balise]. Le slash "/" avant le nom de la balise indique
la fermeture d'une balise préalablement ouverte : mise à part de rares exceptions, toutes les balises ouvertes doivent
être refermées. Enfin, certaines balises ont des propriétés (ou "attributs") dont les valeurs y sont attachées via le signe "=",
comme ceci : [balise=attribut]texte[/balise].
On trouve le BBCode notamment sur des sites Amiga comme Amiga Impact ou
Amiga World. L'activation de l'utilisation du BBCode est déterminée par l'administrateur
du site. Les forums de ces sites sont généralement gérés par un logiciel de forum
du style phpBB, Invision Board ou PunBB. Ces derniers utilisent donc le BBCode pour mettre en page les messages mais ils
l'implémentent à leur sauce : phpBB propose par exemple de lier chaque série de caractères formant une émoticône à une
émoticône graphique, ce qui n'est pas possible avec le BBCode de base. De plus, pourquoi ces sites n'utilisent pas simplement
le HTML qui semble plus complet ? Cela est dû, dans un premier temps, à la légèreté/simplicité du BBCode qui se focalise
quasi uniquement sur les balises de mise en page. Et deuxièmement, cela est dû à la faiblesse du HTML en matière de sécurité :
il est aisé, pour un pirate, de rentrer dans la base de données d'un site et de copier/effacer quasiment n'importe quelle
information. C'est moins évident avec du BBCode mais, malheureusement, des intrusions sont toujours possibles, tout
comme des attaques type "Denial of Service" ou des corruptions de base de données.
Les balises BBCode
Lorsque vous éditez un message sur un forum gérant le BBCode, il y a parfois une aide pour
mettre en forme votre texte (police, couleur, etc.) mais celle-ci n'est pas toujours présente ou n'est
pas assez complète. Le site Amiga Impact propose, par exemple, un éditeur de message reprenant les principales
fonctions de ce que le BBCode peut offrir.
Notez bien que toutes les balises BBCode citées ci-dessous ne sont pas forcément compatibles avec tous les forums
et les navigateurs.
Comme dit plus haut, une bonne partie des balises BBCode sont issues du HTML, en voici donc les plus courantes :
Gras, italique, souligné et barré
- Mettre en gras : [b]gras[/b]
- Mettre en italique : [i]italique[/i]
- Souligner un texte : [u]souligner[/u]
- Barrer un texte : [s]barrer[/s] ou [strike]barrer[/strike]
Couleurs et tailles
- Mettre en rouge : [color=red]rouge[/color] ou [color=#ff0000]rouge[/color]
- Mettre en bleu : [color=blue]bleu[/color] ou [color=#0000ff]bleu[/color]
- Mettre en blanc : [color=white]blanc[/color] ou [color=#ffffff]blanc[/color]
- Mettre une petite taille de police : [size=small]petite taille[/size]
- Mettre une grande taille de police : [size=large]grande taille[/size]
- Mettre une taille de police de 9 pixels de haut : [size=9px]9 pixels[/size]
- Mettre une taille de police de 15 pixels de haut : [size=15px]15 pixels[/size]
- Mettre une taille de police de 24 pixels de haut : [size=24px]24 pixels[/size]
La couleur doit être donnée sous la forme d'un nom de couleur reconnu par le HTML ("blue", "red", "white" - voir
l'annexe pour la liste de noms de couleurs gérées) ou bien selon le codage RGB du genre "#ff0000".
L'unité de mesure de taille diffère suivant chaque variante de BBCode, cela peut désigner des pixels (9px, 15px...), des points
ou des tailles absolues (small, large, xx-large...). Vérifiez aussi que votre navigateur est capable d'afficher les
tailles de police que vous inscrivez.
Résultat sur Amiga Impact avec Sputnik bêta 3 : quelques balises ne sont pas reconnues
Les liens, images et adresses électroniques
- Insérer un lien hypertexte : [url]URL du lien[/url] ou [url=URL du lien]titre du lien[/url]
- Insérer une image : [img]URL de l'image[/img]
- Insérer un lien hypertexte avec image : [url=URL du lien][img]URL de l'image[/img][/url]
- Insérer une adresse électronique : [email]monadresse@yahoo.fr[/email]
Normalement, si le BBCode est utilisable dans un forum, vous n'avez plus besoin d'utiliser la balise [URL] pour créer un lien.
Il suffit alors de tapez l'URL directement. Si le site ne commence pas par "www", vous devez utiliser l'adresse
"http://" complete.
Citations et texte à espacement fixe
- Citer un texte : [quote="auteur"]texte cité[/quote] ou [quote]texte cité[/quote]
- Insérer du texte à espacement fixe : [code]texte à espacement fixe[/code]
Les listes
- Créer une liste à puces :
[list]
[*]Pain
[*]Vin
[*]Boursin
[/list]
- Créer une liste ordonnée :
[list=a]
[*]D'abord
[*]Ensuite
[*]Enfin
[/list]
- Créer une liste ordonnée numérique :
[list=1]
[*]Kick Off 2
[*]PES 7
[*]FIFA 2008
[/list]
Comme avec le HTML, vous devez inclure la balise de fermeture [/list] quand vous terminez une liste.
Effets sur le texte
- Mettre un texte en exposant : [sup]exposant[/sup]
- Mettre un texte en indice : [sub]indice[/sub]
- Centrer un texte : [center]centrer[/center]
- Faire défiller un texte : [scroll]défiller[/scroll]
- Faire remonter un texte : [updown]remonter[/updown]
- Mettre un effet miroir sur un texte : [flipv]effet miroir[/flipv]
- Flouter un texte : [blur]flouter[/blur]
- Afficher un texte caché [hide=titre]caché[/hide]
- Faire un dégradé de couleur : [fade]dégradé[/fade]
Insertion de Flash
- Insérer une animation Flash : [embed-flash(width,height)]animation Flash[/embed-flash]
Combinaisons de balises
On peut évidemment faire des combinaisons de balises BBCode, comme on le ferait avec du HTML.
- Mettre du texte en gras, en rouge et de grande taille : [b][color=red][size=24px]gras rouge et grand[/size][/color][/b]
- Texte défilant en diagonale: [updown][scroll]Texte[/scroll][/updown]
Pensez à refermez les balises dans l'ordre où elles ont été ouvertes.
Conclusion
Participer à un forum et écrire des messages est très facile, mais il est utile de maîtriser quelques BBCode pour mettre
en gras certains mots ou pour insérer une image afin de mieux se faire comprendre.
Le BBCode n'est parfois pas compatible suivant les sites Web ou les navigateurs utilisés. Le BBCode a été créé avant
l'apparition de l'Internet et il montre peu à peu ses limites (il ne suit pas les normes du XHTML 1.0 Transitional par
exemple), c'est pourquoi des alternatives comme les XBBcode, Wikicodes ou carrément le XHTML lui-même lui sont de
plus en plus préférés.
Annexe
Voici la liste des noms de couleurs gérées par le HTML et le BBCode :
AliceBlue AntiqueWhite Aqua
Aquamarine Azure Beige
Bisque Black BlanchedAlmond
Blue BlueViolet Brown
BurlyWood CadetBlue Chartreuse
Chocolate Coral CornflowerBlue
Cornsilk Crimson Cyan
DarkBlue DarkCyan DarkGoldenrod
DarkGray DarkGreen DarkKhaki
DarkMagenta DarkOliveGreen DarkOrange
DarkOrchid DarkRed DarkSalmon
DarkSeaGreen DarkSlateBlue DarkSlateGray
DarkTurquoise DarkViolet DeepPink
DeepSkyBlue DimGray DodgerBlue
Firebrick FloralWhite ForestGreen
Fuchsia Gainsboro GhostWhite
Gold Goldenrod Gray
Green GreenYellow Honeydew
HotPink IndianRed Indigo
Ivory Khaki Lavender
LavenderBlush LawnGreen LemonChiffon
LightBlue LightCoral LightCyan
LightGoldenrodYellow LightGray LightGreen
LightPink LightSalmon LightSeaGreen
LightSkyBlue LightSlateGray LightSteelBlue
LightYellow Lime LimeGreen
Linen Magenta Maroon
MediumAquamarine MediumBlue MediumOrchid
MediumPurple MediumSeaGreen MediumSlateBlue
MediumSpringGreen MediumTurquoise MediumVioletRed
MidnightBlue MintCream MistyRose
Moccasin NavajoWhite Navy
OldLace Olive OliveDrab
Orange OrangeRed Orchid
PaleGoldenrod PaleGreen PaleTurquoise
PaleVioletRed PapayaWhip PeachPuff
Peru Pink Plum
PowderBlue Purple Red
RosyBrown RoyalBlue SaddleBrown
Salmon SandyBrown SeaGreen
SeaShell Sienna Silver
SkyBlue SlateBlue SlateGray
Snow SpringGreen SteelBlue
Tan Teal Thistle
Tomato Turquoise Violet
Wheat White WhiteSmoke
Yellow YellowGreen
Soutenez le travail de l'auteur
|
|
|