Mise à jour des exemples de liens externes

tinytypo.html

@@ -118,12 +118,12 @@ <h3>Autres enrichissements typographiques</h3>
 	<p>Tailles de texte&nbsp;:</p>
 
 	<ul>
-		<li><code>.smaller</code>&nbsp;: <span class="smaller">smaller</span></li>
-		<li><code>.small</code>&nbsp;: <span class="small">small</span></li>
-		<li>texte de base</li>
-		<li><code>.big</code>&nbsp;: <span class="big">big</span></li>
-		<li><code>.bigger</code>&nbsp;: <span class="bigger">bigger</span></li>
 		<li><code>.biggest</code>&nbsp;: <span class="biggest">biggest</span></li>
+		<li><code>.bigger</code>&nbsp;: <span class="bigger">bigger</span></li>
+		<li><code>.big</code>&nbsp;: <span class="big">big</span></li>
+		<li>texte de base</li>
+		<li><code>.small</code>&nbsp;: <span class="small">small</span></li>
+		<li><code>.smaller</code>&nbsp;: <span class="smaller">smaller</span></li>
 	</ul>
 </section>
 
@@ -137,7 +137,7 @@ <h2>Ancres et liens</h2>
 
 	<ul>
 		<li><a href="">Lien interne</a></li>
-		<li><code>.external</code>&nbsp;: <a href="" rel="external" class="external">Lien externe</a></li>
+		<li><code>.external</code>&nbsp;: <a href="https://justinjackson.ca/words_fr.html" rel="external" class="external">Lien externe</a></li>
 		<li><code>.mailto</code>&nbsp;: <a href="mailto:adresse@courriel.net" title="Écrire à adresse@courriel.net" class="mailto">Ecrivez-nous&nbsp;!</a></li>
 		<li><code>.tel</code>&nbsp;: <a href="tel:+33141592653" class="tel">+33 1 41 59 26 53</a></li>
 		<li><code>.download</code>&nbsp;: <a href="" download class="download">Document à télécharger <small class="ext">(<abbr title="Document PDF">PDF</abbr> &ndash; 215&nbsp;Ko)</small></a></li>
@@ -148,14 +148,14 @@ <h2>Ancres et liens</h2>
 
 	<ul>
 		<li><a href="" hreflang="en">Lien interne</a></li>
-		<li><code>.external</code>&nbsp;: <a href="" rel="external" class="external" hreflang="en">Lien externe</a></li>
+		<li><code>.external</code>&nbsp;: <a href="https://justinjackson.ca/words.html" rel="external" class="external" hreflang="en">Lien externe</a></li>
 		<li><code>.mailto</code>&nbsp;: <a href="mailto:adresse@courriel.net" title="Écrire à adresse@courriel.net" class="mailto">Ecrivez-nous&nbsp;!</a></li>
 		<li><code>.tel</code>&nbsp;: <a href="tel:+33141592653" class="tel">+33 1 41 59 26 53</a></li>
 		<li><code>.download</code>&nbsp;: <a href="" download class="download" hreflang="en">Document à télécharger <small class="ext">(<abbr title="Document PDF">PDF</abbr> &ndash; 215&nbsp;Ko)</small></a></li>
 		<li><code>.audio</code>&nbsp;: <a href="" class="audio" hreflang="en">Document audio <small class="ext">(<abbr title="Fichier Ogg">Ogg</abbr> &ndash; 12&nbsp;min)</small></a></li>
 	</ul>
 
-	<p>Les <a href="">liens internes</a> et les <a href="http://checklists.opquast.com/11/criteria/687/" title="Bonne pratique Opquast N&#176;188" rel="external" class="external">liens externes</a> sont différenciés. Lorsqu'elle différe de la page d'origine, mieux vaut spécifier la langue de destination&nbsp;: voici la <a href="http://www.w3.org/Translations/WCAG20-fr/" rel="external" class="external">version française</a> des <a href="http://www.w3.org/TR/WCAG20/" title="Web Content Accessibility Guidelines" hreflang="en" rel="external" class="external"><abbr title="Web Content Accessibility Guidelines" lang="en">WCAG</abbr>&nbsp;2.0</a>. Exemple de lien vers un document&nbsp;: <a href="https://data.oqs-cdn.com/checklists/11/Opquast-Quality-Best-practices_V2-2010.pdf" download class="download pdf">Bonnes pratiques Opquast <small class="ext">(<abbr title="Document PDF">PDF</abbr> &ndash; 215&nbsp;Ko)</small></a>. Pour en savoir plus, voir cet article sur la <a href="http://letrainde13h37.fr/43/signaletique-hyperliens/" rel="external" class="external">signalétique des hyperliens</a>.</p>
+	<p>Les <a href="">liens internes</a> et les <a href="https://checklists.opquast.com/oqs-v3/criteria/les-hyperliens-internes-et-externes-sont-differencies" title="Bonne pratique Opquast N&#176;188" rel="external" class="external">liens externes</a> sont différenciés. Lorsqu'elle différe de la page d'origine, mieux vaut spécifier la langue de destination&nbsp;: voici la <a href="http://www.w3.org/Translations/WCAG20-fr/" rel="external" class="external">version française</a> des <a href="http://www.w3.org/TR/WCAG20/" title="Web Content Accessibility Guidelines" hreflang="en" rel="external" class="external"><abbr title="Web Content Accessibility Guidelines" lang="en">WCAG</abbr>&nbsp;2.0</a>. Exemple de lien vers un document&nbsp;: <a href="https://data.oqs-cdn.com/checklists/11/Opquast-Quality-Best-practices_V2-2010.pdf" download class="download pdf">Bonnes pratiques Opquast <small class="ext">(<abbr title="Document PDF">PDF</abbr> &ndash; 215&nbsp;Ko)</small></a>. Pour en savoir plus, voir cet article sur la <a href="http://letrainde13h37.fr/43/signaletique-hyperliens/" rel="external" class="external">signalétique des hyperliens</a>.</p>
 
 	<p>Ancre de retour en haut de page&nbsp;: <a href="#top">#top</a></p>
 </section>
@@ -203,7 +203,7 @@ <h6>Titre&nbsp;6 avec <a href="">lien</a> <small>et small</small></h6>
 	<p>Ci-dessus, titre de niveau&nbsp;6&nbsp;: balise <code>&lt;h6&gt;</code>, avec <code>&lt;a&gt;</code> et <code>&lt;small&gt;</code>.</p>
 
 	<hr>
-	<p>Il est possible —&nbsp;par exemple pour respecter scrupuleusement une charte graphique dont la hiérarchie des titres de coïncide pas avec la réalité du document&nbsp;HTML&nbsp;— de styler d'autres éléments HTML comme des titres, avec <code>.h1</code>, <code>.h2</code>, <code>.h3</code>, etc.</p>
+	<p>Il est possible —&nbsp;par exemple lorsque l'habillage graphique ne coïncide pas parfaitement avec la réalité du document&nbsp;HTML&nbsp;— de styler d'autres éléments HTML comme des titres, avec <code>.h1</code>, <code>.h2</code>, <code>.h3</code>, etc.</p>
 
 	<strong class="h1">Comme&nbsp;h1</strong>
 	<p>Ci-dessus, balise avec sélecteur CSS <code>.h1</code>.</p>