Restored linebreaks in French Getting Started

samples/fr/Premiers pas/index.html

@@ -18,14 +18,22 @@ <h2>Suivez le guide !</h2>
         -->
 
         <p>
-            Bienvenue dans cette version préliminaire de Brackets, le nouvel éditeur open source adapté au Web de demain. Nous attachons une grande importance aux normes et cherchons à créer des outils plus adaptés aux langages JavaScript, HTML et CSS ainsi qu’aux autres technologies du Web ouvert. Il s’agit là de notre modeste première contribution.
+            Bienvenue dans cette version préliminaire de Brackets, le nouvel éditeur open source adapté au Web de
+            demain. Nous attachons une grande importance aux normes et cherchons à créer des outils plus adaptés aux
+            langages JavaScript, HTML et CSS ainsi qu’aux autres technologies du Web ouvert. Il s’agit là de notre
+            modeste première contribution.
         </p>
 
         <!--
             WHAT IS BRACKETS?
         -->
         <p>
-            <em>Brackets se distingue des éditeurs traditionnels,</em> notamment par son écriture en JavaScript, HTML et CSS. Autrement dit, la plupart des utilisateurs de Brackets ont les compétences nécessaires pour modifier et étendre l’éditeur. En fait, nous utilisons Brackets tous les jours pour son propre développement. Brackets propose aussi des fonctionnalités uniques, comme l’Edition rapide ou l’Aperçu en direct, que vous ne trouverez pas forcément dans d’autres éditeurs. Pour en savoir plus sur l’utilisation de ces fonctionnalités, poursuivez votre lecture.
+            <em>Brackets se distingue des éditeurs traditionnels,</em> notamment par son écriture en JavaScript, HTML
+            et CSS. Autrement dit, la plupart des utilisateurs de Brackets ont les compétences nécessaires pour
+            modifier et étendre l’éditeur. En fait, nous utilisons Brackets tous les jours pour son propre
+            développement. Brackets propose aussi des fonctionnalités uniques, comme l’Edition rapide ou l’Aperçu
+            en direct, que vous ne trouverez pas forcément dans d’autres éditeurs. Pour en savoir plus sur
+            l’utilisation de ces fonctionnalités, poursuivez votre lecture.
         </p>
 
 
@@ -36,55 +44,119 @@ <h2>Nous testons actuellement quelques nouveautés.</h2>
         -->
         <h3>Edition rapide des codes CSS et JavaScript</h3>
         <p>
-            Vous ne risquez plus de perdre de vue le contexte en passant d’un document à un autre. Lorsque vous modifiez un fichier HTML, utilisez le raccourci <kbd>Cmd/Ctrl + E</kbd> pour ouvrir un éditeur rapide intégré qui affiche l’ensemble du code CSS associé. Peaufinez votre CSS, puis appuyez sur <kbd>Echap</kbd> pour revenir au format HTML, ou laissez simplement les règles CSS ouvertes afin qu’elles deviennent partie intégrante de l’éditeur HTML. En appuyant sur <kbd>Echap</kbd> en dehors d’un éditeur intégré rapide, tous les éditeurs sont réduits.
+            Vous ne risquez plus de perdre de vue le contexte en passant d’un document à un autre. Lorsque vous
+            modifiez un fichier HTML, utilisez le raccourci <kbd>Cmd/Ctrl + E</kbd> pour ouvrir un éditeur rapide
+            intégré qui affiche l’ensemble du code CSS associé. Peaufinez votre CSS, puis appuyez sur <kbd>Echap</kbd>
+            pour revenir au format HTML, ou laissez simplement les règles CSS ouvertes afin qu’elles deviennent partie
+            intégrante de l’éditeur HTML. En appuyant sur <kbd>Echap</kbd> en dehors d’un éditeur intégré rapide, tous
+            les éditeurs sont réduits.
         </p>
 
-        <samp> Une petite démonstration ? Placez le curseur de la souris sur la balise <!-- <samp> --> au-dessus et tapez <kbd>Cmd/Ctrl + E</kbd>. L’éditeur rapide de CSS doit s’afficher en haut. Sur la droite, vous pouvez voir la liste des règles CSS applicables à la balise. Il vous suffit de faire défiler ces règles avec <kbd>Alt + Haut/Bas</kbd> pour trouver celle que vous souhaitez modifier. </samp> <a href="screenshots/quick-edit.png"> <img alt="Capture d’écran de la fonction Edition rapide CSS" src="screenshots/quick-edit.png" /> </a>
+        <samp>
+            Une petite démonstration ? Placez le curseur de la souris sur la balise <!-- <samp> --> au-dessus et
+            tapez <kbd>Cmd/Ctrl + E</kbd>. L’éditeur rapide de CSS doit s’afficher en haut. Sur la droite, vous pouvez
+            voir la liste des règles CSS applicables à la balise. Il vous suffit de faire défiler ces règles avec
+            <kbd>Alt + Haut/Bas</kbd> pour trouver celle que vous souhaitez modifier.
+        </samp>
+
+        <a href="screenshots/quick-edit.png">
+            <img alt="Capture d’écran de la fonction Edition rapide CSS" src="screenshots/quick-edit.png" />
+        </a>
 
         <p>
-            Vous pouvez utiliser le même raccourci pour le code JavaScript afin d’afficher le corps d’une fonction. Pour ce faire, placez le curseur sur le nom de la fonction que vous appelez. Les éditeurs intégrés ne peuvent pas encore être imbriqués. Vous ne pouvez donc utiliser l’édition rapide que lorsque le curseur se trouve dans un éditeur « plein écran ».
+            Vous pouvez utiliser le même raccourci pour le code JavaScript afin d’afficher le corps d’une fonction.
+            Pour ce faire, placez le curseur sur le nom de la fonction que vous appelez. Les éditeurs intégrés ne
+            peuvent pas encore être imbriqués. Vous ne pouvez donc utiliser l’édition rapide que lorsque le curseur
+            se trouve dans un éditeur « plein écran ».
         </p>
 
         <!--
             LIVE PREVIEW
         -->
         <h3>Affichage des modifications HTML et CSS en direct dans le navigateur</h3>
         <p>
-            Depuis des années, nous pratiquons tous la fameuse technique « Enregistrer/Actualiser » : apporter des modifications à l’éditeur, enregistrer, basculer vers le navigateur, puis actualiser la page pour voir le résultat. Avec Brackets, cette longue procédure appartient au passé.
+            Depuis des années, nous pratiquons tous la fameuse technique « Enregistrer/Actualiser » : apporter des
+            modifications à l’éditeur, enregistrer, basculer vers le navigateur, puis actualiser la page pour voir
+            le résultat. Avec Brackets, cette longue procédure appartient au passé.
         </p>
         <p>
-            Brackets se connecte <em>en direct</em> à votre navigateur local et transmet les mises à jour du code HTML et CSS au fur et à mesure que vous le modifiez. Des outils accessibles depuis le navigateur permettent certes d’obtenir un résultat similaire, mais avec Brackets, vous n’avez pas besoin de copier et coller à nouveau le code final dans l’éditeur. Le navigateur lit votre code, mais c’est l’éditeur qui le fait vivre !
+            Brackets se connecte <em>en direct</em> à votre navigateur local et transmet les mises à jour du code
+            HTML et CSS au fur et à mesure que vous le modifiez. Des outils accessibles depuis le navigateur permettent
+            certes d’obtenir un résultat similaire, mais avec Brackets, vous n’avez pas besoin de copier et coller
+            à nouveau le code final dans l’éditeur. Le navigateur lit votre code, mais c’est l’éditeur qui le
+            fait vivre !
         </p>
 
         <h3>Surlignement en direct des éléments HTML et règles CSS</h3>
         <p>
-            Avec Brackets, vous pouvez facilement visualiser les effets des modifications du code HTML et CSS sur la page. Lorsque vous placez le curseur sur une règle CSS, Brackets surligne les éléments concernés dans le navigateur. De même, lorsque vous modifiez un fichier HTML, Brackets surligne les éléments HTML correspondants dans le navigateur.
+            Avec Brackets, vous pouvez facilement visualiser les effets des modifications du code HTML et CSS sur
+            la page. Lorsque vous placez le curseur sur une règle CSS, Brackets surligne les éléments concernés
+            dans le navigateur. De même, lorsque vous modifiez un fichier HTML, Brackets surligne les éléments
+            HTML correspondants dans le navigateur.
         </p>
 
-        <samp> Si vous avez installé Google Chrome, vous pouvez dès maintenant tester cette fonctionnalité. Cliquez sur l’icône représentant un éclair en haut à droite de la fenêtre Brackets ou utilisez la combinaison <kbd>Cmd/Ctrl + Alt + P</kbd>. Lorsque le module Aperçu en direct est activé sur un document HTML, tous les documents CSS associés peuvent être modifiés en temps réel. L’icône passe du gris au doré une fois que Brackets a établi la connexion à votre navigateur. Placez maintenant le curseur de la souris sur la balise <!-- <img> --> au-dessus. Vous constatez qu’un surlignement bleu apparaît autour de l’image dans Chrome. Utilisez ensuite la combinaison <kbd>Cmd/Ctrl + E</kbd> pour ouvrir les règles CSS définies. Essayez de faire passer l’épaisseur de la bordure de 1 px à 10 px, ou de changer la couleur d’arrière-plan de « dimgray » à « hotpink ». Si Brackets et votre navigateur s’exécutent côte à côte, ce dernier affiche immédiatement les modifications. Plutôt sympathique, non ? </samp>
+        <samp>
+            Si vous avez installé Google Chrome, vous pouvez dès maintenant tester cette fonctionnalité.
+            Cliquez sur l’icône représentant un éclair en haut à droite de la fenêtre Brackets ou utilisez la
+            combinaison <kbd>Cmd/Ctrl + Alt + P</kbd>. Lorsque le module Aperçu en direct est activé sur un document
+            HTML, tous les documents CSS associés peuvent être modifiés en temps réel. L’icône passe du gris au doré
+            une fois que Brackets a établi la connexion à votre navigateur.
+
+            Placez maintenant le curseur de la souris sur la balise <!-- <img> --> au-dessus. Vous constatez qu’un
+            surlignement bleu apparaît autour de l’image dans Chrome. Utilisez ensuite la combinaison
+            <kbd>Cmd/Ctrl + E</kbd> pour ouvrir les règles CSS définies. Essayez de faire passer l’épaisseur de
+            la bordure de 1 px à 10 px, ou de changer la couleur d’arrière-plan de « dimgray » à « hotpink ».
+            Si Brackets et votre navigateur s’exécutent côte à côte, ce dernier affiche immédiatement les
+            modifications. Plutôt sympathique, non ?
+        </samp>
 
         <p class="note">
-            A l’heure actuelle, le module Aperçu en direct de Brackets ne fonctionne que pour le code HTML et CSS. Cependant, dans cette version, les modifications apportées aux fichiers JavaScript sont automatiquement rechargées lorsque vous enregistrez. Nous travaillons activement à la prise en charge du module Aperçu en direct pour le langage JavaScript. La fonctionnalité Aperçu en direct n’est disponible qu’avec Google Chrome, mais nous souhaitons à l’avenir déployer cette fonctionnalité sur l’ensemble des navigateurs.
+            A l’heure actuelle, le module Aperçu en direct de Brackets ne fonctionne que pour le code HTML et CSS.
+            Cependant, dans cette version, les modifications apportées aux fichiers JavaScript sont
+            automatiquement rechargées lorsque vous enregistrez. Nous travaillons activement à la prise en charge
+            du module Aperçu en direct pour le langage JavaScript. La fonctionnalité Aperçu en direct
+            n’est disponible qu’avec Google Chrome, mais nous souhaitons à l’avenir déployer cette fonctionnalité
+            sur l’ensemble des navigateurs.
         </p>
 
         <h3>Affichage rapide</h3>
         <p>
-            Pour ceux d’entre nous qui n’ont pas encore mémorisé les équivalents en couleur des valeurs HEX ou RVB, Brackets permet d’afficher rapidement et facilement la couleur utilisée. Dans votre code CSS ou HTML, placez simplement le curseur sur n’importe quelle valeur colorimétrique ou dégradé, et Brackets affiche automatiquement un aperçu de la couleur ou du dégradé. Procédez de même pour les images : placez simplement le curseur sur le lien de l’image dans l’éditeur Brackets pour afficher une miniature de cette image.
+            Pour ceux d’entre nous qui n’ont pas encore mémorisé les équivalents en couleur des valeurs HEX ou RVB,
+            Brackets permet d’afficher rapidement et facilement la couleur utilisée. Dans votre code CSS ou HTML,
+            placez simplement le curseur sur n’importe quelle valeur colorimétrique ou dégradé, et Brackets
+            affiche automatiquement un aperçu de la couleur ou du dégradé. Procédez de même pour les
+            images : placez simplement le curseur sur le lien de l’image dans l’éditeur Brackets pour afficher une
+            miniature de cette image.
         </p>
 
-        <samp> Testez l’affichage rapide par vous-même : placez le curseur sur la balise <!-- <body> --> en haut du document et appuyez sur <kbd>Cmd/Ctrl + E</kbd> pour ouvrir un éditeur rapide CSS. A présent, placez le curseur sur l’une des valeurs de couleur du code CSS. Vous pouvez également tester cette fonctionnalité sur un dégradé : ouvrez un éditeur rapide CSS sur la balise <!-- <html> -->, puis placez le curseur sur l’une des valeurs de l’image d’arrière-plan. Pour essayer l’aperçu avec une image, placez le curseur sur la capture d’écran insérée plus haut dans le document. </samp>
+        <samp> 
+            Testez l’affichage rapide par vous-même : placez le curseur sur la balise <!-- <body> --> en haut du
+            document et appuyez sur <kbd>Cmd/Ctrl + E</kbd> pour ouvrir un éditeur rapide CSS. A présent, placez
+            le curseur sur l’une des valeurs de couleur du code CSS. Vous pouvez également tester cette
+            fonctionnalité sur un dégradé : ouvrez un éditeur rapide CSS sur la balise <!-- <html> -->,
+            puis placez le curseur sur l’une des valeurs de l’image d’arrière-plan. Pour essayer l’aperçu
+            avec une image, placez le curseur sur la capture d’écran insérée plus haut dans le document.
+        </samp>
 
         <h3>Vous en voulez plus ? Jetez un œil du côté des extensions !</h3>
         <p>
-            En plus de tous les atouts déjà intégrés à Brackets, notre communauté de développeurs, qui ne cesse de s’agrandir, a mis au point plus d’une centaine d’extensions qui offrent des fonctionnalités très pratiques. Si vous avez besoin d’une fonction qui ne se trouve pas dans Brackets, il est fort probable qu’un utilisateur ait créé l’extension qu’il vous faut. Pour parcourir la liste des extensions disponibles ou en rechercher une en particulier, cliquez sur <strong>Fichier > Extension Manager</strong>, puis ouvrez l’onglet « Disponible ». Lorsque vous trouvez l’extension qui vous convient, il vous suffit de cliquer sur le bouton Installer correspondant.
+            En plus de tous les atouts déjà intégrés à Brackets, notre communauté de développeurs, qui ne cesse de
+            s’agrandir, a mis au point plus d’une centaine d’extensions qui offrent des fonctionnalités très
+            pratiques. Si vous avez besoin d’une fonction qui ne se trouve pas dans Brackets, il est fort probable
+            qu’un utilisateur ait créé l’extension qu’il vous faut. Pour parcourir la liste des extensions
+            disponibles ou en rechercher une en particulier, cliquez sur <strong>Fichier &gt; Extension
+            Manager</strong>, puis ouvrez l’onglet « Disponible ». Lorsque vous trouvez l’extension qui vous
+            convient, il vous suffit de cliquer sur le bouton Installer correspondant.
         </p>
 
         <!--
             LET US KNOW WHAT YOU THINK
         -->
         <h2>Participer</h2>
         <p>
-            Brackets est un projet open source. Des développeurs web du monde entier participent à l’amélioration de l’éditeur de code. Nombreux sont ceux qui créent des extensions afin de développer les possibilités de Brackets. Donnez-nous votre avis, partagez vos idées ou participez directement au projet.
+            Brackets est un projet open source. Des développeurs web du monde entier participent à l’amélioration
+            de l’éditeur de code. Nombreux sont ceux qui créent des extensions afin de développer les possibilités
+            de Brackets. Donnez-nous votre avis, partagez vos idées ou participez directement au projet.
         </p>
         <ul>
             <li><a href="http://brackets.io">Brackets.io</a></li>