Share
Cet article décrit une approche pour la rédaction de didacticiels pas à pas. Bien que l’accent soit mis ici sur les NETTUTS, une grande partie de l’approche peut être appliquée à n’importe quel site. Si vous envisagez d'écrire des tutoriels pour NETTUTS, vous devriez lire / parcourir cet article. Le rédacteur en chef Sean Hodge a également publié un article parallèle sur PSDTUTS, qui a en fait inspiré celui-ci..
NETTUTS est entièrement consacré aux tutoriels pour le développement Web. Cela signifie un codage basé sur un navigateur Web, qui nécessite au moins une compréhension du HTML, de certains CSS et de certains langages de codage Web. Tout le reste dépend de ce que votre tutoriel couvrira. Cela pourrait être le codage de plate-forme CMS / blog, PHP, les librairies JavaScript, les frameworks CSS, les bases de données, etc..
Vous aurez probablement remarqué que les didacticiels les plus populaires se concentrent sur le développement Web ayant un élément design-y. Il peut donc être utile de savoir utiliser un logiciel graphique tel que Photoshop ou Fireworks. Au moins, sachez comment obtenir une capture d'écran, car il s'agit du minimum que vous souhaitez inclure dans votre didacticiel pour les éléments visuels..
Vous n'êtes pas obligé d'être vraiment formel, mais vous devez planifier votre tutoriel et appliquer une liste de contrôle. Voici une liste de contrôle suggérée, mais n'hésitez pas à la modifier à votre guise:
Il existe plusieurs façons de publier sur NETTUTS. Une solution consiste à envoyer vos fichiers de démonstration, votre code source, votre texte de didacticiel et vos images (regroupés ensemble) au moyen du lien de formulaire de la page Instructions de didacticiel. De cette façon, vous obtiendrez une réponse beaucoup plus tôt, mais vous aurez beaucoup de travail à faire si cela ne convient pas aux NETTUTS. (Ceci est toujours recommandé si vous n'avez jamais soumis de tutoriel.)
Facilitez-vous la vie. Au lieu de rédiger un code de démonstration et un didacticiel, commencez par présenter une idée. Ceci est en fait recommandé si vous avez déjà envoyé un didacticiel complet, même s'il n'a pas été publié:
Dans les deux cas, si une démo présente un potentiel, mais que le tutoriel nécessite du travail, je vais essayer de travailler avec vous de manière limitée pour améliorer le texte. Cependant, je ne peux pas l'écrire pour vous. Un tas d'extraits de code et du texte décrivant uniquement ce qui se passe de manière fonctionnelle ne constituent pas un didacticiel..
Au fur et à mesure que le nombre de lecteurs de NETTUTS augmentera, j'aurai moins de temps pour évaluer si un tutoriel est adapté à NETTUTS. Simplifiez-moi la vie, donnez-moi envie d'utiliser votre tutoriel et votre démo:
Mettez-vous à ma place et réfléchissez à ce qui me donne envie d'accepter votre tutoriel. Ne me lancez pas une série si vous n’avez pas déjà accepté et publié un tutoriel. Il en va de même pour les séries intersites (c.-à-d. Partie 1 pour PSDTUTS, Partie 2 pour NETTUTS).
En fin de compte, le tutoriel est destiné aux lecteurs du site, pas à moi. Si le titre du didacticiel les attire et s'ils ont lu le didacticiel après avoir visionné la démonstration ou même le visuel initial (image, diagramme, etc.), ils souhaitent apprendre. Bien que vous n'ayez pas besoin de tenir à la main et de décrire chaque ligne de code comme si un lecteur n'avait encore jamais codé, vous devez décrire les lignes de code liées spécifiquement aux bibliothèques, plugins ou techniques spéciales que vous utilisez..
Le plus gros problème avec les soumissions jusqu'à présent: utiliser une bibliothèque de code ou un plug-in, afficher un extrait de code mais ne pas décrire les lignes de code pertinentes. Dire «voici le code pour faire X» ne suffit pas. Pourquoi un lecteur s’embêterait-il avec votre tutoriel si vous ne divulguez pas la procédure à suivre??
Avant de soumettre le texte réel du didacticiel, commencez par lire certains des didacticiels de Collis. Bien que ce soit bien d’avoir son propre style, il ne faut pas oublier que la plupart des lecteurs de sites ont une expérience (ou beaucoup) de la programmation Web. Parlez-leur, pas à eux. (Je suis un type prolixe, qui vient du fait d'avoir été assistant d'enseignement / instructeur de laboratoire pour des étudiants non informaticiens suivant un cours obligatoire en informatique.)
Il existe déjà une page de didacticiel contenant un lien vers un ZIP de didacticiel vierge. Consultez cette page et utilisez ce modèle ZIP.
Savez-vous vraiment ce que vous voulez faire comme tutoriel? Je n'ai choisi personne ici, mais quelques soumissions m'ont donné l'impression que la personne désirait simplement avoir la plume d'avoir été publiée sur un site comme NETTUTS. La description de leur tutoriel et de leur code de démonstration était vague, et malgré le fait que je leur dise quoi essayer, ils ne mordirent pas..
L'un des meilleurs moyens de planifier et de créer un didacticiel consiste à dessiner vos idées et à décrire les fonctionnalités ainsi que ce que vous démontrez. Les tutoriels NETTUTS étant pilotés par le code, vous devez également disposer d’un code fonctionnel. Voici le processus que je préfère pour créer un tutoriel - mais n'oubliez pas la liste de contrôle mentionnée plus haut:
Ce serait bien que votre démo fonctionne dans tous les navigateurs, mais ce n’est pas toujours possible. Certaines bibliothèques de code, par exemple jQuery, ne prennent tout simplement pas en charge les navigateurs plus anciens. Au minimum, votre code devrait fonctionner pour les navigateurs pris en charge par les bibliothèques que vous utilisez..
Soit dit en passant, malgré les protestations exprimées par certains lecteurs de NETTUTS, Firefox 3 n’est pas très répandu au moment de la rédaction de cet article. C'est aussi un buggy et encore une mémoire, selon certains utilisateurs de Twitter et Plurk. Nous devrons examiner la compatibilité des navigateurs au cas par cas, mais essayez de couvrir les navigateurs stables les plus récents. Indiquez si votre code ne fonctionne pas quelque part qu'il devrait, et pourquoi c'est.
Browsershots, un outil qui vous permet de tester votre code dans plusieurs navigateurs (virtuels) pour Linux, Windows, Mac OS et BSD, est un outil qui vous aidera à tester plusieurs navigateurs..
Contrairement à PSDTUTS, notre site soeur, il n’est pas toujours facile de créer des images sexy en matière de développement Web. Néanmoins, les éléments visuels rendent un didacticiel plus intéressant et aident à illustrer les concepts. Les visuels de votre didacticiel sont donc indispensables et vous devrez peut-être faire preuve de créativité. Voici quelques options:
Intégrez les éléments visuels le plus souvent et le plus tôt possible dans votre didacticiel. La plupart des tutoriels que j'ai refusés jusqu'à présent n'avaient aucune image. Il n’est pas si difficile de prendre une capture d’écran de votre application en cours d’utilisation ou de créer une maquette d’écran dans Photoshop, ou tout ce qui est pertinent. Vous n'avez pas besoin de dizaines de visuels, mais même quelques captures d'écran judicieusement sélectionnées peuvent suffire.
Remarque: Si vous utilisez des éléments visuels d’autres sources - dans votre texte de didacticiel ou dans votre démo - vous devez disposer d’une autorisation explicite ou implicite et citer les sources. Par exemple, vous pouvez utiliser des images d’une source telle que Flickr, sous une licence commerciale CC appropriée..
En plus de créditer les images, assurez-vous de créditer toutes les bibliothèques de code, les sources, etc. Cela ne signifie pas que vous pouvez présenter le code de quelqu'un d'autre comme étant le vôtre, les créditer.
En plus des tutoriels, nous publions un article par semaine sur le développement Web. Les contributions d'articles sont une fois toutes les deux semaines. Les articles de ressources sont de bons candidats, tels que mon article CSS Grid Frameworks - bien que le vôtre ne soit pas nécessairement aussi long.
Ma préférence est d’accepter les emplacements pour des articles d’écrivains / blogueurs expérimentés, bien que vous n’ayez pas besoin de rédiger un tutoriel car le style est différent..
J'essaie de répondre à tout le monde le plus rapidement possible, même si certaines semaines, le nombre de soumissions est suffisamment important pour que je puisse facilement perdre le fil. Rassurez-vous, je répondrai bien que vous puissiez me donner un coup de coude si vous n'avez pas eu de nouvelles dans quelques semaines après avoir soumis une idée ou un tutoriel..
Je suis impatient de poursuivre les idées et les soumissions des lecteurs de NETTUTS. Si vous ne savez pas par où commencer, les tutoriels de Collis ici à NETTUTS et à PSDTUTS sont un excellent modèle à suivre, à la fois en termes de captures d'écran, de codage et de style d'écriture..
Accentsconagua