Ressources pratiques pour codeurs débutants Voici toute une sélection de liens pratiques, générateurs de code, palettes de couleurs automatiques et tout ce qui peut concerner un codeur débutant ou un poil paresseux. Usage abusif tout à fait recommandé !
|
Introduction
Vous avez du mal à coder un tableau ? Les classes CSS vous prennent la tête et vous aimeriez bien aller plus vite ? Vous codez en indentant proprement votre code et en sautant des lignes, mais sur ForumActif c'est une catastrophe ? Voici la solution à vos problèmes : ressources, générateurs, tous les liens pratiques pour affronter le codage l'esprit léger.
Les liens
Générateurs de CSS
- CSS3 Generator
Le CSS3, c'est cette version des CSS qui vous permet de faire des bordures arrondies, d'ombrer un texte ou une boite, et un certain nombre d'autres propriétés à l'usage variable. Le CSS3 generator vous permet de générer votre code CSS de manière à ce qu'il soit compatible avec la majorité des navigateurs. La version nécessaire des navigateurs est d'ailleurs indiquée via une infobulle quand on survole l'icône correspondante.
Un autre générateur : CSS3 Generator, même nom, un fonctionnement un peu différent, mais tout aussi pratique. - Ultimate CSS Gradient Generator
Un générateur de dégradés en CSS ! Plus besoin de faire des images pour ça, le CSS s'en occupe tout seul
- CSS Type Set
Vous avez un texte, vous voulez lui donner une apparence particulière, ce générateur le fait pour vous, vous n'avez qu'à jouer avec les différentes options, regarder le résultat, puis récupérer le code CSS correspondant.
Générateur similaire : CSS Txt fait pareil, sauf qu'il génère aussi du HTML avec, pas toujours très pertinent, je l'ai vu utilisé à de mauvaises fins sur certains sites XD (les gens ne sachant pas trop distinguer le CSS du HTML...) - Générateur de menus CSS
Choisissez votre modèle, personnalisez-le avec vos liens, et récupérez votre code. Très sympa pour faire des menus un peu plus stylés que trois liens côte à côte.
Un autre générateur de menus CSS - Border-radius
Clair, net et précis. Vous arrivez sur une page avec un cadre, à chaque coin un petit champ, vous indiquez les dimensions pour l'arrondi de chaque, le code CSS s'affiche, il ne vous reste plus qu'à le copier-coller. - CSS Warp
Ce générateur vous permet de créer un texte suivant une ligne courbe ! - Prefix My CSS
Marre de devoir écrire à chaque fois tout le CSS nécessaire à une compatibilité maximale ? Ce petit générateur le fera à votre place, vous pourrez vous contenter d'écrire les propriétés CSS3 et il ajoutera le reste. - Générateur de Ruban
Un générateur de rubans/bandeaux pour vos sites en full CSS3. Très classe ! - Button Maker
Vous voulez créer un effet "bouton" sur du texte ? Voici qui va vous aider. Vous réglez les options, et quand votre bouton vous plait, vous cliquez sur "View the CSS".
Un autre générateur de bouton - Générateur de colonnes de magasine
Grosso modo, ce générateur vous permettra de créer une page façon magasine, avec une mise en page du texte en colonnes. - Spritebox
Si vous êtes débutant, vous ne comprendrez pas forcément XD Cet outil vous permettra par exemple de gérer l'effet de rollover en CSS : Une seule image vous permettra d'afficher un menu, mais aussi l'état "survolé" des boutons, voire l'état "cliqué". Le tout passant par le positionnement CSS. Évidemment, pour pouvoir utiliser cet outil, vous devez au moins avoir saisi le fonctionnement de ce genre de choses
Générateurs de HTML
- Générateur de Tableaux
Les tableaux, c'est à la mode, en particulier pour réaliser des messages d'accueil convenablement structurés. Le problème, c'est que ça demande un peu d’entraînement, et que du coup c'est compliqué à utiliser, surtout pour un débutant. Avec ce générateur, et une maîtrise relative de l'anglais, vous pourrez vous faciliter la tâche !
Autres générateurs
- Générateur de faux texte
Vous savez, ces Lorem Ipsum dont vous vous demandez où diable ils peuvent sortir, mais qui sont bien pratiques vous remplir une page et voir le rendu final. Voici un générateur parmi d'autres, qui a l'avantage d'être en français pour les réfractaires à la langue de Shakespeare. Et en bonus, il y a même une explication sur l'historique du fameux texte ^^
Autres générateurs : Lien - Générateur d'onglets
Ce générateur vous permettra de créer des onglets à la couleur et à la forme que vous souhaiterez. Une fois tous vos réglages terminés, vous pourrez télécharger l'image finale de l'onglet ! - Kuler, générateur de... nuances ?
Les couleurs, ça ne se choisit pas au petit bonheur de la chance, il y a des règles que les spécialistes du domaine nous voient éhontément bafouer au fil de nos designs et choix de couleurs en CSS. Ce générateur vous sauvera la mise en vous donnant une palette de couleurs à partir d'une teinte de base ou d'une image !
Autres générateurs : Color Sheme Designer | Color Explorer (lire un article sur cet outil) - Rounded Cornr, générateur de coins arrondis
Un générateur de coins arrondis, donc, sous un format image, pour ceux qui trouvent plus sécuritaire d'utiliser un format compatible avec tous les navigateurs.
Autres ressources
- Compresseur de HTML
Celui là, certains ne comprendront pas forcément à quoi il sert, mais je m'explique. Sous ForumActif (et, je suppose, sous Xooit aussi), lorsque le HTML est autorisé dans les messages, les sauts de ligne sont toujours pris en compte, ce qui veut dire que même sans <br />, ça saute une ligne.
Pour ceux qui codent au petit bonheur de la chance en mélangeant HTML et bbcode, ça ne sera pas très utile. Mais pour ceux qui, comme moi, font de beaux codes bien indentés et tout pour voir ce qui se passe, ceci provoque généralement un affichage avec des sauts de lignes gigantesques. D'où l'intérêt de tout compresser. Bon, notepad++ le fait aussi, mais un outil online vaincra la flemme de ceux qui refusent de l'installer chez eux XD
Conclusion
Le web fourmille de petits outils tels que ceux ci pour rendre la vie plus facile aux codeurs et apprentis codeurs. Si vous trouvez d'autre outils de cet acabit, simples d'utilisation et adaptés à l'usage qu'en font les administrateurs de forums, n'hésitez pas à les proposer à votre tour dans ce sujet !
Et pour aller plus loin en termes de ressources...
- Outil de vérification de duplicate content
Voilà qui plairait à certains fanatiques du référencement... mais aussi ceux ayant peur du plagiat. Car qui dit duplicate content, dit copie conforme d'un de vos textes sur le World Wide Web, ce qui n'est pas toujours très bon signe - Find Icons
Un moteur de recherche d'icônes, traduit en français, avec gestion des favoris, convertisseur d'icône et autres outils bien pratiques. A utiliser sans vergogne ^^ (Lire l'article de blog à ce sujet) - What Font Is
Un outil d'identification de police d'écriture sur une image ! Evidemment, il ne peut pas faire de miracles, mais voici quelque chose de bien pratique quand les gens ne créditent pas les polices qu'ils utilisent et qu'on a envie d'avoir la même :3 (Lire l'article de blog à ce sujet) - Syntaclet
Un marque-page (ou favori) magique ! Mettez le dans vos favoris, et lorsqu'une page contient du code, cliquez dessus ! Il mettra aussitôt de la coloration syntaxique & co sur ledit code, le rendant bien plus agréable à lire ! (Mais ça marche pas sur l'Enae ;_; ) - Ressources graphiques diverses
L'article de l'Enae recensant diverses ressources graphiques pour votre plus grand bonheur.
