1 line
16 KiB
JSON
1 line
16 KiB
JSON
[{"uuid":"f919a77a-7419-41dc-b680-59cc6cd5b947","slug":"20230102-la-balise-rel-me-en-html","title":"La balise rel me en HTML","category":"Journal geek","author":"cedric@abonnel.fr","cover":"","published":true,"published_at":"2023-01-09 22:50:10","created_at":"2023-01-09 22:50:10","updated_at":"2023-01-09 22:50:10","tags":[],"plain":"Édition du 2 janvier 2023 La balise en HTML est utilisée pour indiquer un lien vers une page Web appartenant à la même personne ou à la même organisation qui a créé la page actuelle. Cette balise est souvent utilisée pour relier un profil en ligne, comme un profil sur un réseau social ou un blog personnel, à un site Web principal ou à un site Web professionnel. Voici un exemple de l'utilisation de la balise : Dans cet exemple, la balise indique que le lien vers le compte Twitter de John Doe appartient à la même personne ou à la même organisation qui a créé la page Web actuelle. La balise peut être utilisée en combinaison avec d'autres balises de lien, telles que ou , pour indiquer la relation entre différentes pages Web. Elle peut également être utilisée avec la balise pour indiquer la version préférée d'une page Web parmi plusieurs versions similaires."},{"uuid":"ee3696c6-15aa-4285-8eb8-a2c6c8eb4c17","slug":"20230208-code-d-entite-html","title":"Code d'entité HTML, le codage tout terrain","category":"Journal geek","author":"cedric@abonnel.fr","cover":"","published":true,"published_at":"2023-02-08 20:52:32","created_at":"2023-02-08 20:52:32","updated_at":"2023-02-08 20:52:32","tags":[],"plain":"Un code d'entité HTML est un code spécial utilisé pour afficher des caractères spéciaux ou des caractères non latins dans un document HTML. Il se compose généralement d'un \"&\" suivi d'un nom ou d'un numéro, et se termine par un \";\". Par exemple, le code d'entité HTML pour le symbole de l'euro est . Lorsque ce code est utilisé dans un document HTML, il sera affiché comme €. Les codes d'entité HTML peuvent être utilisés à la place des caractères spéciaux dans le contenu de votre page pour éviter les problèmes de codage ou pour garantir que les caractères s'affichent correctement sur tous les navigateurs. Il existe deux types de codes d'entité HTML: les codes d'entité nommés et les codes d'entité numériques. Les codes d'entité nommés utilisent des noms pour représenter les caractères spéciaux tels que pour ©, les codes d'entité numériques utilisent des numéros pour représenter les caractères spéciaux tels que pour © Voir : \nhttps://www.w3.org/TR/xml-entity-names/ - Liste des caractères, symboles, représentations... définie en XML"},{"uuid":"81d594cb-295f-4cab-b333-975108afbdc8","slug":"creer-un-magazine-html-css","title":"HTML / CSS : Créer un magazine","category":"Informatique","author":"cedric@abonnel.fr","cover":"","published":true,"published_at":"2023-02-28 20:02:45","created_at":"2023-02-28 20:02:45","updated_at":"2023-02-28 20:02:45","tags":[],"plain":"Suivez le cours en ligne depuis l'adresse https:projects.raspberrypi.org/en/projects/magazine/ La réalisation s'effectue depuis le site https:trinket.io/embed/html/cef5e64bc0 Ci-dessous le corrigé."},{"uuid":"6b910135-e557-4a2e-9259-1f3c8d33bc9f","slug":"diaporama-css3-html5-javascript","title":"Diaporama HTML5/CSS3/JavaScript","category":"Informatique","author":"cedric@abonnel.fr","cover":"","published":true,"published_at":"2023-03-19 07:33:12","created_at":"2023-03-19 07:33:12","updated_at":"2023-03-19 07:33:12","tags":[],"plain":"<note important>Page en cours d'écriture</note> Besoin\nLe besoin exprimé est de créer un diaporama en HTML5/CSS3/JavaScript avec les caractéristiques suivantes :\nPour chaque diapo, un titre et une description s'affichent.\nIl peut y avoir un fichier audio opus associé à la diapo. Si il existe un fichier audio, le lire et passer à la diapo suivante à la fin de la lecture du fichier audio sinon passer à la diapo suivante au bout de 3 secondes.\nIl faudra également afficher un titre pour le diaporama, une liste de toutes les diapos disponibles avec leur titre.\nL'affichage du titre de la diapo en cours et de son descriptif ne s'affichera pas sur la diapo ainsi que le contrôleur audio.\nLes scripts et css complémentaires seront dans des fichiers séparés.\nLa liste des diapo se trouve dans un fichier json.\nIl peut y avoir jusqu'à 200 photos. Le diaporama doit avoir un en-tête avec le titre du diaporama, une image qui prend toute la largeur à 80%, la liste des diapositives sur le côté droit, le titre et la description de la diapositive en cours en dessous de l'image et de la liste. L'utilisateur doit pouvoir cliquer sur un élément de la liste des diapositives pour passer directement à cette diapositive. Analyse\nPour créer un diaporama en HTML5/CSS3/JavaScript, voici les grandes étapes :\nCréer une page HTML pour votre diaporama. Cette page contiendra un conteneur pour afficher les diapositives, un titre pour le diaporama, une liste de toutes les diapos avec leurs titres, et éventuellement un contrôleur audio.\nÉcrire le CSS pour styliser votre page. Vous pouvez utiliser des frameworks tels que Bootstrap ou Materialize pour faciliter le processus.\nÉcrire le code JavaScript pour récupérer les données des diapositives à partir d'un fichier JSON et les afficher dans le diaporama. Vous pouvez utiliser la méthode Fetch pour récupérer les données du fichier JSON.\nAjouter un événement pour passer à la diapositive suivante après la fin de la lecture de l'audio, ou après 3 secondes si aucun fichier audio n'est associé à la diapositive.\nPour masquer le titre de la diapo en cours et son descriptif sur la diapo, vous pouvez ajouter une classe CSS pour cacher ces éléments.\nPour le contrôleur audio, vous pouvez utiliser la balise audio HTML5 et ajouter des événements pour démarrer et arrêter la lecture. Principe de fonctionnement\nAfficher et masquer les diapos\nDans le code CSS, chaque diapositive est définie comme un élément avec la classe . Toutes les diapositives sont initialement masquées en utilisant la propriété CSS . Ensuite, la diapositive en cours est affichée en utilisant la classe , qui a la propriété CSS . De cette façon, une seule diapositive est affichée à la fois. Lorsque l'utilisateur clique sur un élément de la liste des diapositives, le script JavaScript met à jour la diapositive en cours en cachant la diapositive précédente et en affichant la nouvelle diapositive. Cela se fait en ajoutant et en supprimant la classe sur les éléments correspondants. La propriété CSS permet de définir le type d'affichage d'un élément. La valeur est l'un des types d'affichage les plus courants en HTML. Elle permet de créer un élément en tant que bloc qui occupe toute la largeur de son conteneur et qui commence sur une nouvelle ligne. Lorsque vous utilisez sur un élément, cela signifie qu'il sera affiché sous la forme d'un bloc rectangulaire qui occupe toute la largeur de son conteneur. Cela peut être utile pour afficher des éléments tels que des paragraphes, des titres, des boutons, des images, des divs, etc. Dans le cas du diaporama, l'utilisation de permet d'afficher la diapositive en cours en tant que bloc rectangulaire à l'intérieur du conteneur de diaporama. Cela permet de faire en sorte que la diapositive remplisse tout l'espace disponible et soit parfaitement visible pour l'utilisateur. Modifier le code HTML avec JavaScript\nLe code JavaScript est utilisé pour ajouter, supprimer, modifier ou réorganiser les éléments HTML et les propriétés de ces éléments, afin de créer des pages web interactives et dynamiques. Le code HTML est modifié par JavaScript en utilisant le Document Object Model (DOM). Le DOM est une représentation hiérarchique des éléments HTML d'une page web, qui peut être manipulée en utilisant des scripts JavaScript. Lorsque le script JavaScript est exécuté, il peut accéder aux éléments HTML existants sur la page web en utilisant des sélecteurs de document, tels que , , , etc. Il peut également créer de nouveaux éléments HTML en utilisant des méthodes telles que , , , etc. Le script JavaScript peut ensuite modifier les propriétés des éléments HTML, telles que le contenu du texte, les attributs, les styles CSS, etc. Il peut également ajouter des écouteurs d'événements pour répondre aux interactions de l'utilisateur, tels que les clics de souris, les saisies clavier, les mouvements de la souris, etc. Dans notre code JavaScript, nous utilisons pour sélectionner l'élément HTML avec la classe et la classe dans le document. Cette méthode retourne un seul élément HTML qui correspond au premier élément correspondant au sélecteur CSS spécifié. Nous utilisons cette méthode pour récupérer la diapositive en cours et modifier sa propriété pour la rendre visible, tout en masquant toutes les autres diapositives. Cela nous permet de créer l'effet de transition entre les diapositives dans le diaporama. et le code HTML :"},{"uuid":"c8928307-4ff6-4aed-8846-63acaa0f0ebb","slug":"conseils-d-usage","title":"01 - Conseils d'usage","category":"Informatique","author":"cedric@abonnel.fr","cover":"","published":true,"published_at":"2023-05-30 07:07:44","created_at":"2023-05-30 07:07:44","updated_at":"2023-05-30 07:07:44","tags":[],"plain":"Évitez les liens suspects dans les e-mails, accédez directement aux sites officiels\nIl est préférable de ne pas se précipiter et de ne pas cliquer sur les liens proposés dans les mails. Au lieu de cela, il est recommandé d'accéder au portail client en utilisant l'adresse que vous connaissez habituellement. Ouvrez un navigateur Internet séparé et saisissez manuellement l'adresse officielle du site web dans la barre d'adresse. Cela garantit que vous accédez directement au site réel et non à une version potentiellement falsifiée. Pour faciliter l'accès au site web légitime, enregistrez l'adresse officielle dans vos signets ou favoris. Ainsi, vous pourrez y accéder rapidement et éviter les erreurs de saisie d'adresse. Lorsque vous saisissez l'adresse manuellement, assurez-vous de vérifier attentivement que vous avez correctement orthographié le nom de domaine. Les cybercriminels peuvent utiliser des noms de domaine similaires pour créer des sites Web trompeurs. Soyez particulièrement vigilant avec les fautes de frappe courantes ou les remplacements de caractères (par exemple, \"rn\" à la place de \"m\" dans \"amazon\"). 1 adresse-mail dédiée pour 1 site\nUtiliser une adresse e-mail dédiée à chaque site ou inscription est une bonne pratique pour protéger votre vie privée et réduire les risques de phishing. Voici quelques avantages de cette approche :\nIsolation des communications : En utilisant une adresse e-mail unique pour chaque site ou service, vous pouvez isoler les communications et les notifications liées à ce compte spécifique. Cela rend plus facile la gestion des e-mails et vous permet de filtrer les messages indésirables plus facilement.\nDétection rapide des tentatives de phishing : Si vous commencez à recevoir des e-mails suspects ou non sollicités sur une adresse spécifique, cela peut indiquer une tentative de phishing ou une violation de données. Vous pourrez ainsi réagir rapidement en prenant les mesures appropriées pour sécuriser vos comptes.\nProtection de la vie privée : En utilisant des adresses e-mail dédiées, vous limitez les chances que votre adresse principale soit exposée à des tiers non fiables. Cela peut aider à réduire le spam et les e-mails non sollicités. L'utilisation d'un gestionnaire de mots de passe peut faciliter la gestion de plusieurs adresses e-mail ou alias. Il vous permet de stocker en toute sécurité vos informations et d'accéder facilement aux différentes adresses e-mail associées à vos comptes. Cependant, rappelez-vous qu'il est toujours important d'être vigilant et de prendre d'autres mesures de sécurité, telles que l'utilisation de mots de passe forts et uniques pour chaque compte, la vérification de l'authenticité des e-mails reçus et la sensibilisation aux techniques de phishing. Une méthode courante pour avoir une adresse e-mail dédiée par site est d'utiliser le symbole \"+\" dans votre adresse e-mail existante. Voici comment cela fonctionne :\nCommencez avec une adresse e-mail principale : Tout d'abord, vous devez avoir une adresse e-mail principale à partir de laquelle vous allez créer des adresses dédiées. Par exemple, supposons que votre adresse principale soit \"exemple@gmail.com\".\nUtilisez le symbole \"+\" : Lorsque vous vous inscrivez sur un site, ajoutez le symbole \"+\" suivi d'un identifiant unique avant le signe \"@\" dans votre adresse e-mail principale. Par exemple, si vous vous inscrivez sur un site appelé \"siteexemple.com\", vous pouvez utiliser l'adresse \"exemple+siteexemple@gmail.com\".\nRecevez les e-mails sur votre adresse principale : Les e-mails envoyés à votre adresse dédiée avec le symbole \"+\" seront automatiquement acheminés vers votre adresse principale. Vous recevrez donc tous les e-mails sur votre boîte de réception principale (\"exemple@gmail.com\"). Cette méthode vous permet de créer des adresses e-mail dédiées pour chaque site ou service auquel vous vous inscrivez, tout en les faisant tous atterrir dans votre boîte de réception principale. Cela vous aide à garder une trace de l'origine des e-mails et à identifier tout site ou service qui pourrait partager votre adresse e-mail avec des tiers non autorisés. Il est important de noter que tous les fournisseurs de services de messagerie ne prennent pas en charge le symbole \"+\". Dans ce cas, vous pouvez envisager d'utiliser des services de messagerie tiers qui offrent des fonctionnalités d'alias d'e-mail pour créer des adresses dédiées. N'oubliez pas que l'utilisation de cette méthode ne garantit pas une sécurité absolue, et il est toujours essentiel de rester vigilant face aux tentatives de phishing et de prendre d'autres mesures de sécurité pour protéger vos informations personnelles en ligne. Afficher les messages en texte brut\nPour améliorer la sécurité des e-mails est d'afficher les messages en texte brut plutôt qu'en format HTML. Voici les avantages de cette approche :\nÉlimination des contenus potentiellement dangereux : L'affichage des e-mails en texte brut désactive l'exécution automatique de contenu potentiellement dangereux, tels que les scripts ou les images malveillantes. Cela réduit le risque de téléchargement involontaire de logiciels malveillants ou de l'ouverture de liens nuisibles.\nProtection contre les techniques de dissimulation : Certains e-mails de phishing utilisent des techniques sophistiquées pour dissimuler des liens ou des pièces jointes malveillantes dans le format HTML. En affichant les e-mails en texte brut, vous pouvez voir directement les adresses e-mail et les liens tels qu'ils sont écrits, ce qui facilite la détection des anomalies ou des tentatives de tromperie.\nRéduction des risques de suivi : Les e-mails HTML peuvent contenir des balises de suivi invisibles qui permettent aux expéditeurs de savoir si vous avez ouvert l'e-mail et si vous avez cliqué sur les liens. En affichant les e-mails en texte brut, vous pouvez éviter ce type de suivi indésirable. Pour activer l'affichage des e-mails en texte brut, consultez les paramètres de votre client de messagerie ou de votre application de messagerie. Les étapes précises peuvent varier en fonction du logiciel que vous utilisez, mais recherchez des options telles que \"affichage en texte brut\" ou \"désactiver le formatage HTML\". Cependant, notez que l'affichage des e-mails en texte brut peut également désactiver certains aspects de mise en forme ou d'affichage visuel. Si vous décidez d'activer cette option, soyez prêt à accepter ces compromis pour améliorer la sécurité de vos communications par e-mail."}] |