Publié le 21/01/2011
Auteur fobec
Réseaux sociaux
0 partages
0 tweets
0 plus
0 commentaires

MAJ - Coloration des exemples et codes sources

Sur le site fobec.com, les tutoriels contiennent généralement des codes sources pour rendre l'exemple plus concret. Afin d'en améliorer la lisibilité, nous avons mis en place une coloration syntaxique par langage de programmation sur les portions de code source.

Principe de la coloration syntaxique

Les copies d'écran ci-dessous reprennent le script PHP de l'article sur le dessin de graphique sans flash avec la librairie GD, à gauche le code source sans formatage, à droite coloration syntaxique spécifique au PHP. Le principe consiste à appliquer une couleur différente en fonction du type de texte (variable, string, nom de fonction, ...).
1082_none1082_highlight

Utiliser la coloration dans les articles de vos sites internet

La coloration syntaxique améliore la lisibilité d'un code source en mettant en évidence les structures du langage de programmation. Ainsi nous vous demandons de mettre en couleur les scripts présentés dans vos articles à l'aide de l'outil en ligne csHighlight.

Comment fait-on ?
- coller le code source dans la zone de texte,
- sélectionner le langage de programmation,
- cocher la colorisation "feuille CSS",
- lancer le formatage "bouton coloriser"
- copier le texte "apercu" puis coller directement dans l'éditeur d'article du site.

Choix technologique

La coloration syntaxique s'obtient en délimitant les mots clés avec des balises couleur. En langage HTML, le balisage s'obtient en ajoutant des balises span autour des portions de texte.
Il existe 2 techniques pour réaliser la coloration syntaxique:
- le balisage dynamique en Javascript,
- un formatage statique dans le code HTML de l'article.
Nous avons opté pour la deuxième solution pour accélérer l'affichage des pages du site. En effet, le balisage est immédiatement contenu dans le code HTML chargé par le navigateur web. Dans le cas d'une coloration via javascript un délai est nécessaire pour que les fonctions analysent puis colorisent le code source.

Ajouter un commentaire

Les champs marqués d'un * sont obligatoires, les adresses emails se sont pas publiées.

A lire aussi

Réseaux sociaux
Présentation de l'article
Catégorie
news - nos-realisations
Mise a jour
21/01/2011
Visualisation
vu 3300 fois
Public
Internaute
Auteur de la publication
Fobec
Admin
Auteur de 261 articles
|BIO_PSEUDO|
Commentaires récents

Publié par olibul dans CMS

var
fn: string;

begin

Result:= False;
if strFont <> \'\' then begin

// Tester le nom: si affectation directe à TFont, modifications aléatoires

Publié par Amal dans tuto

pour moi j'ai créé une liste déroulante en liaisant avec la base de donnée déja existant mais la valeur sélectionné ne peut pas etre afficher jamais et...

Publié par Kal747 dans php5

Merci pour l'info !

Publié par web agency cms Typo3 dans tuto

De nombreux articles sur le web parlent des CMS (Content Management System) et tentent de lister les meilleurs d'entres-eux.
Mais très souvent, sauf quelques rares libres blancs, ces article...

Publié par FOBEC dans CMS

Un chronomètre, des challenges et l'affichage des meilleurs scores sont prévus. Si ça vous intéresse, laissez moi un p'tit mot !!!