ç5

Prévoir une page dans un navigateur avec Dreamweaver

Ce tutoriel va illustrer la prévisualisation des pages dans un navigateur avec Dreamweaver CS5

Lorsque vous travaillez sur une page, vous arrivez à un point où vous voulez voir à quoi il ressemblera dans un navigateur. Vous n'avez pas à utiliser un autre navigateur pour cela, comme Dreamweaver fournit un des options de prévisualisation dans les navigateurs uniquement dans ce but.

Ouvrons la page index.html en mode Création. Pour le droit de l'ensemble des trois boutons d'affichage est une autre vue marquée Affichage en direct. Cliquez-le et vous verrez votre page en mode Affichage en direct.

Affichage en direct Dreamweaver

Il s'agit d'un mode d'affichage non modifiable, c'est à dire vous ne pouvez pas modifier le contenu de la page en mode Création en même temps. Cependant, vous pouvez toujours faire des changements dans le mode Code, et (comme nous le verrons plus tard), vous pouvez suivre les liens vers d'autres pages, et même éditer ces pages. Affichage en direct est également très utile pour visualiser le code en direct.

Ce qui aurait aussi souvent de l'intérêt est de voir comment se comportent vos pages dans des navigateurs spécifiques tels que Firefox, Internet Explorer et Safari. Pour ce faire, utilisez la fonction Aperçu dans le navigateur.

Pour utiliser cette fonctionnalité, cliquez sur le menu Fichier et sélectionnez Aperçu dans le navigateur.

Aperçu dans les navigateurs

Vous verrez alors un menu déroulant qui comprend une liste des navigateurs installés.

Liste des navigateurs installés Dreamweaver

Choisissez dans la liste et vous verrez un aperçu de votre page dans ce navigateur. Ici, j'ai choisi Internet Chrome.

Vous pouvez aussi utiliser la fonction de prévisualisation d'une page web dans un navigateur avec Dreamweaver en utilisant le bouton avec l'icône Globe:

Icône navigateur dans Dreamweaver

Je peux voir exactement ce à quoi ma page web va ressembler dans Google Chrome. Si vous êtes à la recherche de l'usage généralisé de vos pages Web, vous aurez bien besoin de les tester dans un certain nombre de navigateurs, et en plusieurs versions de certains de ces navigateurs. Tous les utilisateurs n'ont pas forcément la dernière version d'un navigateur!

Pour soutenir les essais avec d'autres navigateurs, vous pouvez les télécharger et les installer sur votre PC.

Cependant, à partir de Dreamweaver, vous pouvez maintenant accéder à une nouvelle installation appelée Adobe BrowserLab. Cela vous donne accès à l'essai en utilisant les différents navigateurs et systèmes d'exploitation. Vous y accéder en utilisant l'option sur le menu déroulant à partir de l'Aperçu dans le navigateur dans le menu Fichier, même si vous devez être connecté à l'Internet car il est un service en ligne.

Vous avez besoin de votre ID Adobe pour vous connecter, mais ensuite vous avez accès à une gamme de navigateurs. Au moment de la rédaction de la liste comme le montre ici.

Adobe Browserlab

Modifier la liste des navigateurs

 

Dans la prévisualisation d'une page, Dreamweaver vous propose les navigateurs déjà installés sur votre ordinateur antérieurement à l'installation de Dreamweaver. C'est-à-dire, si vous avez installé un autre navigateur web après l'installation de Dreamweaver, vous devez l'ajouter à la liste des navigateurs dans Dreamweaver.

Pour ce faire, allez à l'icône Globe comme pour prévisualiser la page et vous aurez le même menu déroulant qui contient la liste des navigateurs installés, puis cliquez sur Modifier liste des navigateurs:

Modifier la liste des navigateurs

Vous serez alors amené à aux préférences Dreamweaver avec l'onglet Aperçu dans le navigateur. vous pouvez aussi accéder à cette option dans Edition > Préférences > Aperçu dans le navigateur:

Préférences modifier liste navigateurs Dreamweaver

Pour ajouter un nouveau navigateur, cliquez sur l'icône "+" puis parcourez votre ordinateur jusqu'au dossier d'installation du navigateur et double-cliquez sur son icône.

Vous pouvez aussi très facilement déterminer le navigateur par défaut et les navigateurs secondaires dans cette même option des préférences de prévisualisation.

Pour prévisualiser la page web dans le navigateur principal, appuyez sur F12.

   

 

   

 

 

Extras Dreamweaver

Autres fonctions Dreamweaver

Référencement de site

-