Logiciels pour créer son thème
Visiteur
Boosteur Inactif
Pour les bases on commence par avoir les bons outils!
Donc je vous donne les armes pour la création d'un thème:
Firefox
On commence par avoir un bon navigateur, qui vous permettra d'y ajouter des plugins additionnels indispensables pour la création de vos thème. Si vous ne l'avez pas, Téléchargez le !
1er plugin Firefox: Firebug
Installez le ! Il vous servira à éditer les CSS via le navigateur simulant les modifications virtuelles.
Vous pouvez apprendre à vous en servir sur le Site du Zéro.
2ème plugin Firefox: Web Developer
Dans la foulée, Installez lui Web Developer
Cette extension est LA trousse à outils du développeur Web. Ses fonctionnalités se comptent par dizaines. Il gère aussi bien tout ce qui est cookie, formulaire, css, JavaScript, validation W3C, test en plusieurs résolutions. Voici un descriptif plus détaillé des menus de cette barre d'outils:
Disable
Permet de désactiver de nombreuses fonctionnalités: le cache, java, JavaScript, les couleurs de la page, etc
Cookies
Fournit différents outils sur les cookies avec entre autres, l'ajout de cookie, la visualisation du cookie du site en cours, la désactivation des cookies.
Css
Fournit différent outils pour travailler sur les CSS: leur affichage, l'édition en temps réel et plein d'autres choses.
Forms
Permet de travailler avec les formulaires des pages web. Afficher les détails de chaque formulaire, voir les champs cachés, remplir les champs, etc
Images
Permet d'afficher et de travailler sur les images de la page. Les cacher ou au contraire afficher leurs informations (taille, chemin de l'image, dimensions, texte alternatif, etc)
Information
Fournit différentes informations sur le document web en cours. Permet également de faire ressortir certains éléments (blocks) de la page pour une meilleure visibilité.
Miscellaneous
Permet principalement d'éditer le code source HTML et de voir les modifications en temps réel
Outline
Permet de surligner les éléments de son choix.
Resize
Permet de redimensionner la fenêtre pour faire des tests de résolution ou encore d'afficher la taille courante de la fenêtre pour des résolutions "exotiques"
Tools
Fournit un grand nombre d'outils en tout genre passant de la validation HTML ou des CSS, jusqu'à l'utilisation d'une console JavaScript pour détecter les erreurs, etc
View Source
Permet d'afficher soit la source entière, soit simplement la source des éléments générés (PHP, ASP, etc) ou encore d'afficher la source dans un programme externe.
Disable
Permet de désactiver de nombreuses fonctionnalités: le cache, java, JavaScript, les couleurs de la page, etc
Cookies
Fournit différents outils sur les cookies avec entre autres, l'ajout de cookie, la visualisation du cookie du site en cours, la désactivation des cookies.
Css
Fournit différent outils pour travailler sur les CSS: leur affichage, l'édition en temps réel et plein d'autres choses.
Forms
Permet de travailler avec les formulaires des pages web. Afficher les détails de chaque formulaire, voir les champs cachés, remplir les champs, etc
Images
Permet d'afficher et de travailler sur les images de la page. Les cacher ou au contraire afficher leurs informations (taille, chemin de l'image, dimensions, texte alternatif, etc)
Information
Fournit différentes informations sur le document web en cours. Permet également de faire ressortir certains éléments (blocks) de la page pour une meilleure visibilité.
Miscellaneous
Permet principalement d'éditer le code source HTML et de voir les modifications en temps réel
Outline
Permet de surligner les éléments de son choix.
Resize
Permet de redimensionner la fenêtre pour faire des tests de résolution ou encore d'afficher la taille courante de la fenêtre pour des résolutions "exotiques"
Tools
Fournit un grand nombre d'outils en tout genre passant de la validation HTML ou des CSS, jusqu'à l'utilisation d'une console JavaScript pour détecter les erreurs, etc
View Source
Permet d'afficher soit la source entière, soit simplement la source des éléments générés (PHP, ASP, etc) ou encore d'afficher la source dans un programme externe.
Notepad++
Le top des éditeurs de texte que vous trouverez, c'est le fameux Notepad ++. Prenez le fichier Binaire.
C'est un éditeur de texte très performant (pour info c'est cet éditeur qui a été utilisé pour créer phpboost )
Ouvrez le, puis ouvrez tous les fichiers css de votre thème.
Cliquez sur rechercher, mettez le code de la couleur recherchée puis cliquez sur 'rechercher dans tous les documents ouverts'. Il s'affichera tous les fichiers où se trouvent le code rentré avec la ligne du fichier.
Comme vous le voyez, il est très simple de retrouver une couleur de votre site dans le code source du thème
Ouvrez le, puis ouvrez tous les fichiers css de votre thème.
Cliquez sur rechercher, mettez le code de la couleur recherchée puis cliquez sur 'rechercher dans tous les documents ouverts'. Il s'affichera tous les fichiers où se trouvent le code rentré avec la ligne du fichier.
Comme vous le voyez, il est très simple de retrouver une couleur de votre site dans le code source du thème
Cf: Ptithom
La boîte à couleur
Adresse du site de l'éditeur : http://pourpre.com/colorbox/index.php
C'est un petit logiciel gratuit qui va vous donner le code couleur d'un pixel précis de votre écran. Pour plus d'info, cf le site ci dessus.
Cf: Ptithom
Tutoriels
Vous avez des questions sur les thèmes : " Comment créer un thème ? C'est long ? Que faut-il avoir comme logiciel ? faut-il des connaissances particulières ?"
Avec ce tutoriel "Créer un thème" vous aurez toutes vos réponses à ces questions . Et ainsi vous pourrez avoir votre propre thème personnalisé , et si vous le désirez vous pouvez le poster sur phpboost.com .
Cf: KONA
Et pour finir
Voilà, maintenant, j'aimerais préciser que les critiques font avancer! Que débutant on l'a tous été ! Les conseils sont gratuit, n'hésitez pas à en demander. A vos claviers ...
Nous ferons du mieux que nous pourrons pour vous aidez, et vous faire avancer
D'autres outils
- Colorjack (Merci à Reidlos)
- Colormatch (Merci à Reidlos)
- Ajaxload (Merci à Gsgsd)
Pour les utilisateurs de GNU/Linux il y a aussi:
- Agave (Merci à Soupaloignon)
MAJ faites le: 10/09/09 par Swan.
Édité par Visiteur Le 19/12/2009 à 18h26
el_chorizo Membre non connecté
Booster Roquette
- Booster Roquette
- Voir le profil du membre el_chorizo
- Inscrit le : 29/11/2007
je vais en exposer quelque uns:
- Le site du Zero ==> Tutos officiels et tutos de membres du site.
- www.openweb.eu.org ==> Tutos xhtml/css
- Alsacréations Tutoriels XHTML, CSS, Accessibilité, Javascript
Édité par el_chorizo Le 28/07/2009 à 20h35
Avant de poster Chercher sur le forum - Consulter la Documentation - Consulter la FAQ
Pensez à mettre votre sujet en réglé !
Pensez à mettre votre sujet en réglé !
Visiteur
Boosteur Inactif
ReidLos Membre non connecté
- Modérateur
- Voir le profil du membre ReidLos
- Inscrit le : 27/02/2009
- Site internet
- Groupes :
- Equipe Développement
renaudpro Membre non connecté
Booster Missile
- Booster Missile
- Voir le profil du membre renaudpro
- Inscrit le : 27/09/2008
- Groupes :
Visiteur
Boosteur Inactif
C'est toi .. C'est moi, personnellement OSEF tant que c'est fait.
Le but de ce topic c'est l'aide !
el_chorizo Membre non connecté
Booster Roquette
- Booster Roquette
- Voir le profil du membre el_chorizo
- Inscrit le : 29/11/2007
swan :
Merci el_chorizo, Mais le but est de débuter sur des bases simples. Et pas de former des graphistes confirmés
C'est sur .
Mais bon au moins connaitre les bases c'est toujours un plus je pense .
En tous cas nous sommes la pour aider , peux importe du niveau de l'utilisateur !!
Édité par el_chorizo Le 28/07/2009 à 20h49
Avant de poster Chercher sur le forum - Consulter la Documentation - Consulter la FAQ
Pensez à mettre votre sujet en réglé !
Pensez à mettre votre sujet en réglé !
Visiteur
Boosteur Inactif
Bon pour le notpad en environnement graphique c'est mieux pour la coloration syntaxique.
Édité par Visiteur Le 28/07/2009 à 21h24
ClassikD Membre non connecté
Booster Fronde
- Booster Fronde
- Voir le profil du membre ClassikD
- Inscrit le : 27/07/2009
- Site internet
http://www.adobe.com/fr/designcenter/video_workshop/
Des tutoriels vidéos assez complets qui permettent d'apprendre à utiliser les logiciels de la gamme Adobe (Photoshop, Illustrator, Flash etc..)
Gsgsd Membre non connecté
Booster Fusée
- Booster Fusée
- Voir le profil du membre Gsgsd
- Inscrit le : 07/12/2007
- Site internet
Vous souhaitez que vos membres contribuent ou ajoutent du contenu sur votre site ?
La solution => le module contribution !
La solution => le module contribution !
Visiteur
Boosteur Inactif
ReidLos Membre non connecté
- Modérateur
- Voir le profil du membre ReidLos
- Inscrit le : 27/02/2009
- Site internet
- Groupes :
- Equipe Développement
Visiteur
Boosteur Inactif
Gsgsd Membre non connecté
Booster Fusée
- Booster Fusée
- Voir le profil du membre Gsgsd
- Inscrit le : 07/12/2007
- Site internet
ReidLos :
Donc si je lui done une couleur il va me sortir une palette de couleur qui s'accorderont sur un site ?
Vous souhaitez que vos membres contribuent ou ajoutent du contenu sur votre site ?
La solution => le module contribution !
La solution => le module contribution !
ReidLos Membre non connecté
- Modérateur
- Voir le profil du membre ReidLos
- Inscrit le : 27/02/2009
- Site internet
- Groupes :
- Equipe Développement
Répondre
Vous n'êtes pas autorisé à écrire dans cette catégorie