L'essentiel de Dreamweaver CC 2017

Tirer parti de la documentation

Testez gratuitement nos 1324 formations

pendant 10 jours !

Tester maintenant Afficher tous les abonnements
L'outil d'aide à l'écriture en code s'est considérablement enrichi dans les versions les plus récentes de Dreamweaver. Vous y trouverez également des liens vers des sites de référence.
06:06

Transcription

L'outil d'aide à l'écriture est assez multiple parce qu'il va nous permettre un côté un peu auto-complete de nos propositions, un choix d'aide parmi une sélection et puis surtout une aide en ligne aussi, qui va être complémentaire. Donc ici, en HTML, si je tape sur une balise par exemple article, déjà je vois que c'est un HTMLelement donc je sais qu'il existe si j'écris articles ça existe plus, si j'écris article, ça existe. Donc Contrôle, Espace ou Commande, Espace pour faire revenir ce petit infobulle, qui me dit : the article element find a self, et si je survole j'ai la suite de l'information qui va pouvoir m'aider. Alors jusque là pas trop, mais dès l'instant où je vais taper espace, à ce moment là j'ai toute une aide qui me permet de taper de l'information au niveau des attributs. Alors certains attributs sont directs comme par exemple Acess Key, si je tape Acess Key je passe directement à l'intérieur des guillemets je vais pouvoir donner sa valeur, mais si je tape quelque chose comme class par exemple, il me dit, et bien moi, dans les fichiers que j'ai de liés à ce document, j'ai fond et specialfond est-ce que tu veux en utiliser un? Donc c'est vraiment un outil qui va pouvoir nous aider à pouvoir écrire rapidement. Dans le cas où je vais écrire des mots composés comme aria par exemple, il me dit et bien, aria, tu as la possibilité de choisir si tu veux aria-checked, aria-autocomplete, alors je vais pouvoir prendre un élément, et là si cet élément peut avoir des valeurs de type TrueFile, il va me dire et bien, c'est False ou c'est True, donc ça va pouvoir m'aider si c'est complètement ouvert, non, il va me laisser le curseur libre. Donc ici, un outil d'aide à l'écriture qui va être assez sympathique puisque il va me permettre rapidement de taper dans le code et pouvoir éviter les erreurs de syntaxe, les erreurs d'écriture. Côté JavaScript, ici on a également cette aide qui est apportée, si je prends par exemple un document, ici il me dit document, et là vous voyez, c'est un peu plus riche, il me donne une information, et sur le côté droit il me dit à qui ça s'adresse donc là on parle du document, l'objet document, mais je pourrais avoir le Document avec un D majuscule qui serait la fonction. Et juste en dessous maintenant, j'ai each web page loaded in the browser has its one et si bien entendu je survole j'ai l'intégralité de l'information. Et si maintenant je clique sur ce petit curseur ici, ça m'indique l'adresse où je vais aller, et bien entendu si je clique je me rends à cette adresse là et je peux avoir un complément d'information pour pouvoir mieux appréhender mon écriture de code. Ceci fonctionne pour tous les objets et propriétés c'est à dire que si par exemple je prends comme j'ai fait au dessus, body. (alors là je parle de l'élément) className ici si je viens dans className vous voyez je peux naviguer avec directement les curseurs du clavier, alors là il me dit le className c'est un string qui est attendu si je prends le clientHeight, à ce moment là c'est un number et return et puis là je vais pouvoir naviguer et me déplacer directement dans la partie ad hoc de l'information. Alors ça, ça marche pour JavaScript, ça marche pour PHP, et ça fonctionne relativement bien sur l’intégralité des propriétés classe, noms d'objets, et même librairies, alors dans les librairies les plus usitées, si je prends un jQuery par exemple ici vous voyez, je vois que je peux avoir accès à l'objet, si je prends la fonction ajax ici, et bien ajax, j'ai directement la possibilité de pouvoir accéder pareillement à l'aide en ligne de jQuery concernant ajax, donc c'est assez complémentaire à tout éditeur de code, et c'est relativement réactif. Côté css également, l'aide intervient donc ici si je vais par exemple taper URL, je vais reprendre différemment voila je tape URL ici, et dès l'instant où je vais taper URL soit je peux parcourir pour aller chercher mon image, soit je peux aller la chercher dans une bibliothèque soit je peux venir récupérer le fichier qui est lié dans ce dossier et puis je m’aperçois qu'il fait 4 pixels sur 4 pixels, je vois l’aperçu de cet élément, je peux donc le valider directement, et donc c'est assez explicatif explicite sur le travail, ce qui est intéressant aussi regardez, si je fais un marging ici, et que ce marging je peux le mettre en auto, si je le mets de 10 pixels, regardez, si j'ai mis 10, il me dit : toutes tes marges hautes, droites, gauches et fond vont faire 10 pixels. Alors je pourrais mettre 10vw là il me dit, attention voilà nous allons faire ça, mais si je reviens maintenant et que je place une deuxième valeur, de 2vw alors là il me dit regarde le top va faire 10, le right 2, le bottom 10 et le left 2 et si je rajoute un 10vw par exemple ici, et bien là vous voyez qu'il me re-indique quelles sont les valeurs les valeurs qu'elles vont faire, alors si au lieu de mettre 10 je mets 8 maintenant, pour être plus explicite voilà, il me montre quelle est la valeur qui fera 8 quelles sont les valeurs qui feront 2 et quelle est la valeur qui fera 10. si je mets maintenant 4 pixels, une autre valeur, voila il me ré-indique toutes ces valeurs là donc ça va vraiment m'aider à pouvoir écrire de manière automatique et précise, si maintenant j'arrive sur le border, le border il me dit regarde, il te faut la largeur le style et la couleur, si je veux les écrire vraiment dans l'ordre, vous voyez donc, c'est une aide qui est assez complète dans le sens où elle va vraiment m'aider à pouvoir écrire mon style de manière secure, je sais que je vraiment être dans les règles du wr3 puisque ça va vraiment se placer en tant que compagnon d'écriture, et si des fois il disparaît comme là, c'est le cas, vous faites Contrôle, Espace et il revient, alors là, est-ce que je vais utiliser une valeur qui serait définie, est-ce que je vais utiliser le sélecteur de couleur, je vais pouvoir récupérer ma couleur, je vais passer en hexadécimal, je valide, et puis une fois que j'ai terminé maintenant ici il me reste à placer le fameux Solid, le fameux dashed, doted, et vous voyez donc ces parties là vont venir m'aider à écrire, alors soit j'utilise la souris soit j'utilise que le clavier, soit je les utilise tous les deux conjointement. C'est à vous de voir mais vous voyez que vraiment à ce niveau là, on a une véritable aide d'écriture, et puis surtout on a toujours la possibilité de partir en ligne pour avoir plus d'informations dès que cela devient probant.

L'essentiel de Dreamweaver CC 2017

Prenez en main l’environnement de travail de Dreamweaver. Créez des documents, utilisez les CSS, gérez les liens hypertexte, les fichiers multimédia, les formulaires, etc.

7h28 (98 vidéos)
Aucun commentaire n´est disponible actuellement
 
Thématiques :
Design web
Standards du web
Spécial abonnés
Date de parution :30 janv. 2017

Votre formation est disponible en ligne avec option de téléchargement. Bonne nouvelle : vous ne devez pas choisir entre les deux. Dès que vous achetez une formation, vous disposez des deux options de consultation !

Le téléchargement vous permet de consulter la formation hors ligne et offre une interface plus conviviale. Si vous travaillez sur différents ordinateurs ou que vous ne voulez pas regarder la formation en une seule fois, connectez-vous sur cette page pour consulter en ligne les vidéos de la formation. Nous vous souhaitons un excellent apprentissage avec cette formation vidéo.

N'hésitez pas à nous contacter si vous avez des questions !