# data[].attributes.attachment_link.title
TSW EN CORR WordPress Amilcar Cabral 2025-2026

# data[].attributes.attachment_link.title
MINI MEMO Accessibilité et directive 2025

# data[].attributes.headline
COMPLÉMENT Accessibilité du Web, concept essentiel et montant

# data[].attributes.subject
COMPLÉMENT Accessibilité du Web, concept essentiel et montant

# data[].attributes.body
Questions pour explorer et réfléchir

# data[].attributes.headline
Référence première — Lexique des règles typographiques en usage à l'Imprimerie nationale

# data[].attributes.subject
Référence première — Lexique des règles typographiques en usage à l'Imprimerie nationale

# data[].attributes.attachment_link.title
Lexique des règles typographiques | Actes Sud

# data[].attributes.headline
2025 : directive européenne Accessibilité mise en application

# data[].attributes.subject
2025 : directive européenne Accessibilité mise en application

# data[].attributes.attachment_link.title
La nouvelle directive européenne « Accessibilité » : pour des produits et des services accessibles aux personnes en situation de handicap

# data[].attributes.attachment_link.description
À partir du 28 juin 2025, une directive européenne visant à garantir l’accès à certains services et produits aux personnes en situation de handicap, entrera en vigueur. Ces produits et services répondront alors à de nouvelles exigences en matière d’accessibilité.

# data[].attributes.body
Synthèse très sommaire avec pistes pour en savoir plus...

# data[].attributes.attachment_link.description
LangLink can localize your software into any major European, Asian, Middle Eastern, African or Latin American language, including Arabic, Chinese, Dutch, French, German, Hebrew, Italian, Japanese, Korean, Portuguese, Russian, Spanish, etc.LangLink offers a complete set of software localization solutions into more than 50 languages that help you successfully launch your products in global markets.

# data[].attributes.body
Le lien ci-dessus renvoie à la chaîne Arte sur YouTube.

Pour visionnage en famille, lien temporaire TV également

# data[].attributes.attachment_link.title
L’IA va-t-elle tuer Internet ? | Documentaire 2025 | ARTE

# data[].attributes.headline
Mise en place et présentation panneau latéral droit

# data[].attributes.subject
Mise en place et présentation panneau latéral droit

# data[].attributes.headline
Changer la nature d'un bloc sous WP (par exemple, passer d'un paragraphe à un niveau de titre Hn (.... )

# data[].attributes.subject
Changer la nature d'un bloc sous WP (par exemple, passer d'un paragraphe à un niveau de titre Hn (.... )

# data[].attributes.headline
Espaces insécables et gestion des retours à la ligne (HTML & CMS)

# data[].attributes.subject
Espaces insécables et gestion des retours à la ligne (HTML & CMS)

# data[].attributes.headline
Mode « blocs » Gutenberg, Mode classique, mode HTML

# data[].attributes.subject
Mode « blocs » Gutenberg, Mode classique, mode HTML

# data[].attributes.body
Le mode d'édition des articles prédominant et par défaut sous WordPress est appelé « Gutenberg » : c’est-à-dire le mode « bloc ».

Le mode « classique » (proche d'un éditeur de texte) reste souvent préféré en entreprise cependant. On peut l'installer sous WordPress à l'aide de plugins par exemple, ou la choisir avec certains « thèmes » (layouts).

---PASSER EN HTML--

En mode Gutenberg (blocs) vous pouvez pour chaque bloc passer en mode HTML (par exemple pour ajouter des espaces insécables &nbsp; ) en cliquant sur les trois points verticaux qui apparaissent après avoir cliqué sur le bloc à modifier. Il y a parfois des bugs. Pas de panique, c'est quasi toujours récupérable.

Vous pouvez aussi passer par les trois points verticaux en haut à droite ou bien, en mode éditeur sur votre page WordPress, faire CTRL+ALT+MAJ+M (ou sur Mac : Option+Cmd+Maj+M). L’ensemble de la page apparaît en mode HTML. L’opération est réversible avec la même combinaison de touches > retour au mode bloc.

(En mode classique, deux onglets en haut à droite au-dessus de la fenêtre d'édition permettent d'alterner entre éditeur visuel et éditeur classique).

---------------------------

PS: Le saviez-vous ? L'éditeur visuel est appelé souvent aussi WYSIWYG : What you see is what you get.

# data[].attributes.body
Pour retrouver le tableau de bord ou dashboard (la page du CMS qui donne accès à tous les articles, pages, tags, à la bibliothèque, etc. via la colonne de gauche), la méthode change un peu selon la page de travail où vous vous trouvez, mais c’est tout en haut à gauche de votre écran qu'il faut chercher dans tous les cas. Cliquez le plus souvent sur le « W » encerclé (ou parfois sinon sur une flèche sortant d’un carré).

# data[].attributes.headline
Pages ou Posts/Articles : quelle différence ?

# data[].attributes.subject
Pages ou Posts/Articles : quelle différence ?

# data[].attributes.body
Les « pages » sont similaires aux « articles » (posts) dans la structure. La différenciation offre seulement une hiérarchisation parallèle parfois utile pour des usages divers dont le plus courant est de réserver les « pages » aux pages web permanentes et les « articles » à la partie blog (avec mention de la date).

# data[].attributes.attachment_link.description
Making the web more beautiful, fast, and open through great typography

# data[].attributes.attachment_link.description
Il existe 16 espaces en Unicode, dont 2 sont redondantes. Cette page teste
le rendu de 12 de ces espaces dans les navigateurs. Des résultats sont compilés
pour les principaux navigateurs.

# data[].attributes.attachment_link.title
L’espace fine insécable dans les documents HTML | Typographe futé

# data[].attributes.attachment_link.description
Application des bonnes règles typographiques pour la ponctuation française

# data[].attributes.headline
Espacement avec les signes de ponctuation et les symboles

# data[].attributes.subject
Espacement avec les signes de ponctuation et les symboles

# data[].attributes.attachment_link.readable_text
L'Office québécois de la langue française opte pour l'absence d'espace devant le point-virgule, le point d'exclamation et le point d'interrogation. Cette dernière pratique, qui est répandue dans l'usage, tend à devenir une convention, notamment en raison des limites de certains logiciels qui ne comportent pas l'espace fine (espace insécable réduite). Cela dit, si l'on dispose de l'espace fine, son emploi demeure convenable.

Dans le tableau ci-dessous, la présence d'une Espace qui lie des éléments de texte afin d'empêcher qu'ils se retrouvent sur des lignes différentes. En typographie, le terme espace insécable espace est féminin ( une espace), mais dans la langue générale et en informatique, il est de genre masculin ( un espace). est représentée, puisqu'elle n'est pas visible dans un texte, par le symbole o.

# data[].attributes.attachment_link.keywords[]
espacement avant et après les principaux signes de ponctuation et autres signes ou symboles

# data[].attributes.attachment_link.title
Espacement avec les signes de ponctuation et les symboles

# data[].attributes.attachment_link.description
Dans quels cas faut-il mettre un espacement avant ou après un signe de ponctuation ou un symbole? Trouvez les réponses sous forme de tableau pratique.

# data[].attributes.headline
     non-breaking space (espace insécable) + gestion des retours à la ligne + entités HTML

# data[].attributes.subject
     non-breaking space (espace insécable) + gestion des retours à la ligne + entités HTML

# data[].attributes.attachment_link.title
HTML espaces insécables_ gestion retours à la ligne_entités HTML

# data[].attributes.body
Click on the image above (it's a link) then on 'TRY IT YOURSELF' .

Don't forget to click 'RUN' to submit your modifications and see the result after each.

add text to be displayed inside the link but also before and after the link

Add a 'title' (appears as a tooltip by dragging the mouse)

add a 'style' attribute inside the tag (ex. style="color:green; underline:none; ..background-color:yellow;'

add a target="_blank" (so that the link opens in a new tab) together with a compulsory rel="noopener" to ensure safety (against hacking).

More as you please!

# data[].attributes.attachment_link.readable_text
More "Try it Yourself" examples below.

Definition and Usage

The <a> tag defines a hyperlink, which is used to link from one page to another.

The most important attribute of the <a> element is the href attribute, which indicates the link's destination.

By default, links will appear as follows in all browsers:

An unvisited link is underlined and blue

A visited link is underlined and purple

An active link is underlined and red

Tips and Notes

Tip: If the <a> tag has no href attribute, it is only a placeholder for a hyperlink.

Tip: A linked page is normally displayed in the current browser window, unless you specify another target.

Tip: Use CSS to style links: CSS Links and CSS Buttons.

Browser Support

Attributes

list_of_URLs
Specifies a space-separated list of URLs to which, when the link is followed, post requests with the body ping will be sent by the browser (in the background). Typically used for tracking.

referrerpolicy
no-referrer
no-referrer-when-downgrade
origin
origin-when-cross-origin
same-origin
strict-origin-when-cross-origin
unsafe-url

Specifies which referrer information to send with the link

Global Attributes

The <a> tag also supports the Global Attributes in HTML.

Event Attributes

The <a> tag also supports the Event Attributes in HTML.

More Examples

Example

How to use an image as a link:

Try it Yourself "

Related Pages

HTML tutorial: HTML Links

HTML DOM reference: Anchor Object

CSS Tutorial: Styling Links

Default CSS Settings

Most browsers will display the <a> element with the following default values:

# data[].attributes.attachment_link.description
More "Try it Yourself" examples below. The tag defines a hyperlink, which is used to link from one page to another. The most important attribute of the element is the href attribute, which indicates the link's destination.

# data[].attributes.attachment_link.readable_text
HTML is the standard markup language for creating Web pages.

What is HTML?

HTML stands for Hyper Text Markup Language

HTML is the standard markup language for creating Web pages

HTML describes the structure of a Web page

HTML consists of a series of elements

HTML elements tell the browser how to display the content

HTML elements label pieces of content such as "this is a heading", "this is a paragraph", "this is a link", etc.

A Simple HTML Document

Example Explained

The <!DOCTYPE html> declaration defines that this document is an HTML5 document

The <html> element is the root element of an HTML page

The <head> element contains meta information about the HTML page

The <title> element specifies a title for the HTML page (which is shown in the browser's title bar or in the page's tab)

The <body> element defines the document's body, and is a container for all the visible contents, such as headings, paragraphs, images, hyperlinks, tables, lists, etc.

The <h1> element defines a large heading

The <p> element defines a paragraph

What is an HTML Element?

An HTML element is defined by a start tag, some content, and an end tag:

The HTML element is everything from the start tag to the end tag:

Note: Some HTML elements have no content (like the <br> element). These elements are called empty elements. Empty elements do not have an end tag!

Web Browsers

The purpose of a web browser (Chrome, Edge, Firefox, Safari) is to read HTML documents and display them correctly.

A browser does not display the HTML tags, but uses them to determine how to display the document:

HTML Page Structure

Below is a visualization of an HTML page structure:

<html>

<body>

</body>

</html>

Note: The content inside the <body> section will be displayed in a browser. The content inside the <title> element will be shown in the browser's title bar or in the page's tab.

HTML History

Since the early days of the World Wide Web, there have been many versions of HTML:

This tutorial follows the latest HTML5 standard.

# data[].attributes.attachment_link.description
W3Schools offers free online tutorials, references and exercises in all the major languages of the web. Covering popular subjects like HTML, CSS, JavaScript, Python, SQL, Java, and many, many more.

# data[].attributes.attachment_link.description
Collection of videos from the HTML tutorial on w3schools.com

# data[].attributes.headline
A clear and useful video about HTML attributes —Have a look! (duration: 2')

# data[].attributes.subject
A clear and useful video about HTML attributes —Have a look! (duration: 2')

# data[].attributes.body
NB: la vidéo a été produite récemment par le W3C, ou Consortium du Web, qui en édicte les normes techniques internationalement reconnues sous formes de «recommandations»).

# data[].attributes.body
Traduire ce fichier oblige à traiter (avec) les balises mais aussi à une localisation poussée (format des dates, horaires) + internationalisation de l'adresse (ajout du pays), des numéros de téléphone (indicatif international systématique), ajout du fuseau horaire. N'oubliez pas au passage d'ajouter, traduire ou vérifier : 1) les espaces insécables, 2) l'attribut alt d'image, 3) l'attribut 'title' aux hyperliens....

# data[].attributes.headline
Auto-Test on "Bases HTML démarrage" (English version)

# data[].attributes.subject
Auto-Test on "Bases HTML démarrage" (English version)

# data[].attributes.attachment_link.description
Create lesson plans, presentations, quizzes, worksheets and more with AI powered apps for teachers. 

# data[].attributes.headline
WCAG - Web Content Accessibility Guidelines

# data[].attributes.subject
WCAG - Web Content Accessibility Guidelines

# data[].attributes.attachment_link.title
Règles pour l'accessibilité des contenus Web (WCAG) 2 - Vue d'ensemble

# data[].attributes.attachment_link.description
Présente le standard international des Règles pour l'accessibilité des contenus web (WCAG), notamment WCAG 2.0, WCAG 2.1 et WCAG 2.2. Les documents des WCAG expliquent comment rendre les contenus Web plus accessibles aux personnes en situation de handicap.

# data[].attributes.attachment_link.readable_text
Normal Text

The five boxing wizards jump quickly.

Large Text

The five boxing wizards jump quickly.

Graphical Objects and User Interface Components

Web accessibility testing can be difficult! The experts at WebAIM can audit your web site and provide a detailed report to help you remediate accessibility and WCAG compliance issues.

Learn more about WebAIM Evaluation Services

Explanation

Enter a foreground and background color in RGB hexadecimal format (e.g., #FD3 or #F7DA39) or choose a color using the color picker. The Lightness slider can be used to adjust the selected color.

WCAG 2.0 level AA requires a contrast ratio of at least 4.5:1 for normal text and 3:1 for large text. WCAG 2.1 requires a contrast ratio of at least 3:1 for graphics and user interface components (such as form input borders). WCAG Level AAA requires a contrast ratio of at least 7:1 for normal text and 4.5:1 for large text.

Large text is defined as 14 point (typically 18.66px) and bold or larger, or 18 point (typically 24px) or larger.

Hint: Colorzilla is an excellent tool for extracting the color value from any page element. Additionally, WAVE can analyze contrast ratios for all page text elements at once.

Use our link contrast checker to evaluate links that are identified using color alone.

# data[].attributes.headline
Pour aller plus loin en HTML tout en révisant les bases, simplement, efficacement, 2 sites classiques qui ont fait leurs preuves (recommandables et gratuits) : Free Code Camp et Codecademy.

# data[].attributes.subject
Pour aller plus loin en HTML tout en révisant les bases, simplement, efficacement, 2 sites classiques qui ont fait leurs preuves (recommandables et gratuits) : Free Code Camp et Codecademy.

# data[].attributes.headline
Les sites web McDonald's à travers le monde et la théorie de Edward T. Hall

# data[].attributes.subject
Les sites web McDonald's à travers le monde et la théorie de Edward T. Hall

# data[].attributes.body
India : https://mcdindia.com/

France : https://www.mcdonalds.fr/

Allemagne : https://www.mcdonalds.com/de

South Africa : https://www.mcdonalds.co.za/

China : https://www.mcdonalds.com.cn/

...

# data[].attributes.attachment_link.title
McDonald's® India - Delivering Happiness to Your Doorstep

# data[].attributes.attachment_link.description
The official website of McDonald's® India (North & East). The best burgers and fries. Order McDelivery® or locate the nearest restaurant for a dose of happiness.

# data[].attributes.headline
Combinaison et degrés de I18N/L10N de versions locales des sites 1) APPLE 2) LIDL 3) OXFAM 

# data[].attributes.subject
Combinaison et degrés de I18N/L10N de versions locales des sites 1) APPLE 2) LIDL 3) OXFAM 

# data[].attributes.body
Comparer diverses versions nationales pour chaque : uniformité ou différenciation de l'apparence et des contenus par-delà les seuls aspects de traduction ?

PS : La localisation peut entraîner un vaste rebranding pour des motifs liés au marché mais aussi au produit (et à son origine). Clin d'œil en lien à la leçon en classe à propos de la comparaison des sites web Lidl en Europe, notamment la différence d'image de Lidl en Allemagne (campagne évoquée) https://www.youtube.com/watch?v=RHHWlOHT6zs&list=PLY9MlSkP0qoxZIS6snNfjk9t6rFGzm3z7&index=4

# data[].attributes.attachment_link.title
Hol dir die Legenden nach Hause mit Kong Strong! | Lidl lohnt sich

# data[].attributes.body
Sélecteur CSS opacity entre 0 (transparent) et 1 (opaque), par exemple :

.9 = 90% d'opacité, donc 10% de transparence.

(on omet le zéro généralement, surtout on utilise le . (point) pour la décimale)

Application à la balise image :

<img src='..' style='opacity: .8' width=400px alt='paysage'>

# data[].attributes.attachment_link.title
Color wheel - color theory and calculator | Canva Colors

# data[].attributes.attachment_link.description
The color wheel shows the relationship between colors. Create the perfect color scheme for your next project. It’s easy and free!

# data[].attributes.body
Exploration notamment de DIV (logique de blocs empilés) et SPAN (logique dite inline, interne au texte).

Révision/exploration de l'attribut STYLE, de la balise IMG

Ajout à faire d'un hyperlien

# data[].attributes.headline
BALISE HTML HYPERLIEN  / The hyperlink tag

# data[].attributes.subject
BALISE HTML HYPERLIEN  / The hyperlink tag

# data[].attributes.body
The HTML a tag (a for 'anchor') used for hyperlinks :

<a href='https://www.rfi.fr' title='Click here!'>YOUR TXT OR DOC TO BE HYPERLINKED MUST BE HERE AN FOLLOWED BY A CLOSING TAG</a>

# data[].attributes.headline
Exercice de traduction et maniement simple sous WordPress  : (exemple de) consignes

# data[].attributes.subject
Exercice de traduction et maniement simple sous WordPress  : (exemple de) consignes

# data[].attributes.body
Selon classes, voici cependant la base à titre indicatif. Pour information.

# data[].attributes.body
Ce mémo sert surtout à vous aider à rassembler vos idées et à vous rassurer. Il peut évoluer et n'est pas contractuel pour l'évaluation du cours, qui dépend de votre classe. Néanmoins, vous y trouverez les éléments qui constituent la base d'évaluation essentielle.

# data[].attributes.headline
LOCALISER UN SITE WEB – QUI FAIT QUOI, POURQUOI ?

# data[].attributes.subject
LOCALISER UN SITE WEB – QUI FAIT QUOI, POURQUOI ?

# data[].attributes.headline
What does this cartoon say about websites?  

# data[].attributes.subject
What does this cartoon say about websites?  

# data[].attributes.body
https://xkcd.com/932/ (Another image to comment)

# data[].attributes.body
IMAGES

<img src="..." alt="..." width="..." ...>

Balise unique, ne fonctionne pas en paire

The HTML image tag

CLIQUER SUR LIEN CI-DESSUS (image) puis sur 'lTRY IT YOURSELF' :

changer width ou height > que se passe-t-il ?

supprimer width ou height et modifier le paramètre conservé : que devient l'image ?

Ajouter du texte simple sans préciser <p> ou autre avant ou après l'image sur une ligne différente.

Répéter la commande de l'image (2x la même image)

Que concluez-vous ? L'image est-elle par défaut un élément block ou inline?

NB: Vous pouvez modifier ce comportement en insérant l'image dans un <p> autonome ou encore ajoutant un attribut style avec à l'intérieur : 'display:block;'

ajouter un attribut title=' ' dans la balise img pour faire apparaître une infobulle au passage de la souris

ajouter un attribut style=' ' à l'intérieur de la balise img et y insérer le 'sélecteur CSS' opacity:.5 (ou n'importe quelle valeur décimale entre 0 et 1) > style="opacity: .75;' par exemple

Dans style, ajouter border:1px solid red;' modifier ces paramètres.... Ajouter aussi après cette expérience padding: 20px; (ou 2 ou 4 valeurs successives comme ceci: padding: 5px 10px 15px 20px; Ajouter encore ensuite un background-color;..

reprenez l'image du départ : insérez-la dans un <figcaption> comme ceci :

<figcaption>

<img.... >

<caption>légendez ici la photo</caption>

</figcaption>

Sauriez-vous ajouter un hyperlien sur l'image, pour qu'en cliquant celle-ci on soit redirigé vers une autre page web ?

# data[].attributes.attachment_link.readable_text
More "Try it Yourself" examples below.

Definition and Usage

The <img> tag defines an image in an HTML page.

The <img> tag has two required attributes: src and alt.

Note: Images are not technically inserted into an HTML page, images are linked to HTML pages. The <img> tag creates a holding space for the referenced image.

Tip: To link an image to another document, simply nest the <img> tag inside <a> tags. Try it "

Browser Support

Differences Between HTML 4.01 and HTML5

The following attributes: align, border, hspace, and vspace are not supported in HTML5.

Differences Between HTML and XHTML

In HTML the <img> tag has no end tag.

In XHTML the <img> tag must be properly closed.

Attributes

Not supported in HTML5.
Specifies the alignment of an image according to surrounding elements

pixels
Not supported in HTML5.
Specifies the width of the border around an image

crossorigin

anonymous
use-credentials

Allow images from third-party sites that allow cross-origin access to be used with canvas

pixels
Not supported in HTML5.
Specifies the whitespace on left and right side of an image

ismap

Specifies an image as a server-side image-map

sizes

Specifies image sizes for different page layouts

srcset

Specifies the URL of the image to use in different situations

pixels
Not supported in HTML5.
Specifies the whitespace on top and bottom of an image

Global Attributes

The <img> tag also supports the Global Attributes in HTML.

Event Attributes

The <img> tag also supports the Event Attributes in HTML.

Insert images from different locations
How to insert images from another folder or from another web site.

Make a hyperlink of an image
How to add a hyperlink to an image.

Create an image map
How to create an image map, with clickable regions. Each region is a hyperlink.

Related Pages

HTML tutorial: HTML Images

HTML DOM reference: Image Object

CSS Tutorial: Styling Images

Default CSS Settings

Most browsers will display the <img> element with the following default values:

# data[].attributes.attachment_link.description
More "Try it Yourself" examples below. The tag defines an image in an HTML page. The tag has two required attributes: src and alt. Note: Images are not technically inserted into an HTML page, images are linked to HTML pages. The tag creates a holding space for the referenced image.

# data[].attributes.headline
Examining a website: The Abell Foundation

# data[].attributes.subject
Examining a website: The Abell Foundation

# data[].attributes.body
Repérer les éléments à localiser et difficultés prévisibles de traduction.

# data[].attributes.attachment_link.description
The Abell Foundation is committed to creating opportunities for all Baltimoreans to thrive.

# data[].attributes.headline
THE WEBSITE LOCALIZATION STRATEGY WORKSHOP

# data[].attributes.subject
THE WEBSITE LOCALIZATION STRATEGY WORKSHOP

# data[].attributes.headline
Ten GenAI impacts on the I18N/L10N sector

# data[].attributes.subject
Ten GenAI impacts on the I18N/L10N sector

# data[].attributes.body
Consulter le PDF ici : https://csa-research.com/Portals/0/Documents/2025%20Trends.pdf?ver=2024-12-26-064426-693

# data[].attributes.headline
VIDEO:  Website Localization Strategy  (2'42")

# data[].attributes.subject
VIDEO:  Website Localization Strategy  (2'42")

# data[].attributes.body
Forget the ad about the company itself and have another look at the strategy used to "localize" a website in this neat presentation.

# data[].attributes.attachment_link.title
How to build a content localization strategy in 5 steps

# data[].attributes.body
I18N: Internationalisation

L10N: Localisation

LSP: Language Service Provider

The localization industry has been booming for the past two decades, generating tens of billions of dollars in revenue.

# data[].attributes.body
There are many career paths in localization! Here's a bunch of interesting career advice.

# data[].attributes.attachment_link.title
How To Kickstart Your Localization Career: Tips From 6 Hiring Managers

# data[].attributes.headline
FORMATS DE COLLABORATION À LA TRADUCTION DE SITES WEB 

# data[].attributes.subject
FORMATS DE COLLABORATION À LA TRADUCTION DE SITES WEB 

# data[].attributes.attachment_link.title
A guide to image file formats and image file types | Adobe Acrobat

# data[].attributes.attachment_link.description
Confused about image file formats? Our comprehensive guide explains the different types of image file formats and when to use them.

# data[].attributes.headline
CC BY SA NC ND: Creative Commons Licenses decoded

# data[].attributes.subject
CC BY SA NC ND: Creative Commons Licenses decoded

# data[].attributes.attachment_link.description
Creative Commons licenses give everyone from individual creators to large institutions a standardized way to grant the public permission to use their creative work under copyright law. From the reuser’s perspective, the presence of a Creative Commons license on a copyrighted work answers the question, What can I do with this work? The CC License…

# data[].attributes.body
Canva.com (free version)

For those familiar with Photoshop or tech-savvy and eager to learn: Photopea.com

If you want to learn Photopea, look for Photoshop tutorials on YouTube (the learning curve is steep for Photoshop, you'll need time for this).

Advanced Photoshop users: check Photopea. For most use cases, it perfectly works.

Otherwise: Canva is great and still improving, besides it is considered as professional software.

# data[].attributes.attachment_caption
Portrait de Philippe Thureau-Dangin, esprit curieux du Courrier international et inspirateur de Voxeurop

# data[].attributes.headline
Des projets journalistiques multilingues : transversalité des approches et des regards

# data[].attributes.subject
Des projets journalistiques multilingues : transversalité des approches et des regards

# data[].attributes.body
La base n'est pas dans vos compétences techniques. Elle est dans votre projet et votre regard inquisiteur et anticipateur pour un apport unique, une voix singulière.

# data[].attributes.attachment_link.readable_text
Philippe Thureau-Dangin nous a quittés le 12 septembre, prématurément. Nos pensées les plus sincères vont d'abord à sa famille, sa femme et ses enfants. Nous pensons ensuite à la perte pour le monde des médias, celui des idées, de l'édition, de la création littéraire, tant de domaines mêlés, dont il était l'une des figures, singulière et inspirante ; il faisait incontestablement partie des précurseurs dans le journalisme de la transversalité des approches et des regards, des bâtisseurs d'un monde dans lequel les limites de l'esprit et des frontières éculées auraient enfin cédé. C'était un pourfendeur né d'idées reçues.

En tant qu'anciens journalistes de Courrier international et aventuriers de l'extraordinaire saga de ce journal pas comme les autres, nous voulons rendre hommage à Philippe Thureau-Dangin, qui nous a non seulement en partie formés en tant que jeunes journalistes européens, mais a également contribué à aiguillonner ce décentrage de la pensée qui demeure une boussole.

De la rédaction en chef de Courrier international à la direction de la rédaction et de la publication, Philippe Thureau-Dangin bousculait en effet l'approche traditionnelle du journalisme, ne se contentant jamais des vieilles ficelles du métier. L'esprit fin, curieux, rapide, aimant la contradiction, tout en ayant ses rugosités, et bien sûr ses détracteurs, il prenait les choses de la presse et de l'information au sérieux et avec exigence mais sans se prendre, lui, au sérieux. Le journalisme, en quelque sorte, comme un art.

Grâce à lui, un projet de média européen voit le jour, Presseurop, financé via un appel à projet européen, au sein même de Courrier international, un site précurseur d'information quotidienne en 10 langues, qui rassemblera des journalistes de toute l'Europe. Cinq ans plus tard, le projet s'éteint faute de financements, mais inspire Voxeurop, qui naît à sa suite et en reprend le flambeau. Voilà près de dix ans que nous faisons vivre l'héritier de Presseurop. Philippe Thureau-Dangin soutenait notre projet, dont il était donateur.

Je m'inscris

Il est très difficile de parler de Philippe Thureau-Dangin au passé. Il ne se situait jamais dans le passé bien qu'il aimât l'Histoire, il était résolument tourné vers l'avenir. Vers les signaux faibles, les clés plus souterraines, du monde en devenir, des évolutions qui émergeaient, l'anticipation au quotidien (les anciens de Courrier comprendront) et que nous essayions de repérer dans nos presses "étrangères" respectives.

Nous savions intuitivement que nous construisions ensemble brique par brique un journalisme résolument moderne et affranchi des barrières linguistiques, davantage transnational d'ailleurs qu'international. Un journalisme différent, collaboratif plus que comparatif, dont la trame disait que nos destins et nos défis par-delà les frontières sont avant tout communs. Un "pari humaniste et pluriel".

Le pari était audacieux. Mais Philippe Thureau-Dangin n'était pas à un pari audacieux près. Dans cette complexité par nature insondable, il semblait naviguer particulièrement avec aisance et élégance, avec le lendemain pour phare, comme nous l'avions consigné dans le livre des 20 ans de Courrier international :"1991-2011. Une contre-histoire".

Ce fut une époque formidablement foisonnante et inspirante de nos vies professionnelles respectives. Nous lui devons beaucoup, lui qui approchait seulement le "sommet de la vie"*. Nous sommes honorés d'avoir travaillé à ses côtés. Merci, l'Ami.

*Son dernier essai, paru aux éditions Les Presses de la Cité, en 2024 Au sommet de la vie, est un hommage aux forces vives de la vieillesse.

# data[].attributes.attachment_link.title
Adieu à Philippe Thureau-Dangin, esprit curieux et inspirateur de Voxeurop

# data[].attributes.attachment_link.description
L’ancien directeur de Courrier international est décédé le 12 septembre à 70 ans. Figure atypique du paysage médiatique français et européen, il avait été, entre autres, à l’origine de Presseurop, dont Voxeurop est l’héritier.

# data[].attributes.headline
Règles OPQUAST de la qualité web (bonnes pratiques du web)

# data[].attributes.subject
Règles OPQUAST de la qualité web (bonnes pratiques du web)

# data[].attributes.body
L'Opquast est un site de référence et organisme de certification important du web francophone.

Une large partie des bonnes pratiques listées concernent directement la rédaction web, parfois directement la traduction multilingue. D'autres, en lien à ces aspects de rédaction et traduction ou non, dépendent d'abord des compétences spécifiques d'autres membres de l'équipe web.

En cliquant sur une fiche, vous accédez à une description détaillée et à des recommandations.

Une liste non détaillée est ici : https://res.cloudinary.com/opquast/image/upload/checklists/OPQUAST-CHECKLIST-FR_2025.pdf

# data[].attributes.attachment_link.description
245 règles pour améliorer vos sites et applications numériques - Version 5 - 2025-2030

# data[].attributes.headline
ASTUCE: Chercher sur Google une commande HTML ou CSS > choisir l'entrée sur w3schools

# data[].attributes.subject
ASTUCE: Chercher sur Google une commande HTML ou CSS > choisir l'entrée sur w3schools

# data[].attributes.body
C'est le site de référence et pédagogique du W3C (le consortium du web). Simple, pratique, avec souvent une fenêtre dite "bac à sable" pour tester et, plus bas, tous les compléments possibles listés (attributs de balise...).

ASTUCE IMPORTANTE: passer par le moteur de recherches Google en premier, le moteur interne de recherche sur W3Schools ne guidant pas forcément vers les pages idoines. Par exemple, googler how to change the background color in HTML et ajouter W3schools dans votre recherche ou bien sélectionner simplement le site W3schools.com parmi les résultats.

# data[].attributes.attachment_link.description
W3Schools offers free online tutorials, references and exercises in all the major languages of the web. Covering popular subjects like HTML, CSS, JavaScript, Python, SQL, Java, and many, many more.

# data[].attributes.body
The website offers many free articles and an interesting newsletter around the L10N branch: to get a sense of what's happening there.

# data[].attributes.attachment_link.title
The Latest Language Industry News | MultiLingual

# data[].attributes.attachment_link.description
The latest language industry news is selected by experienced MulitLingual staff and updated almost daily. This is the best way to stay up to date.

# data[].attributes.headline
Key podcast about the localization industry

# data[].attributes.subject
Key podcast about the localization industry

# data[].attributes.body
To stay alert on the transformations and debates especially among large LSPs (The Multilingual Magazine's podcast)

# data[].attributes.attachment_link.description
The MultiLingual News podcast publishes audio recordings of daily language and culture news articles originally published on multilingual.com.

# data[].attributes.headline
Passionnant Atelier des médias -  RFI - Podcast

# data[].attributes.subject
Passionnant Atelier des médias -  RFI - Podcast

# data[].attributes.attachment_link.readable_text
Retour à l'accueil

/ Podcasts

/Atelier des médias

L'Atelier des médias une émission d'entretiens et de reportages à l'écoute des r/évolutions des médias à l'ère numérique. Elle est présentée par Steven Jambot et réalisée par Simon Decreuze. Contact : atelier@rfi.fr

# data[].attributes.attachment_link.description
L'Atelier des médias une émission d'entretiens et de reportages à l'écoute des r/évolutions des médias à l'ère numérique. Elle est présentée par Steven Jambot et réalisée par Simon Decreuze. Contact :...

# data[].attributes.attachment_caption
The NiemanLab is an essential source about the evolution of editorial web contents in a journalistic perspective.

# data[].attributes.headline
Évolutions des contenus éditoriaux et innovations journalistiques

# data[].attributes.subject
Évolutions des contenus éditoriaux et innovations journalistiques

# data[].attributes.body
Recevoir la NL du NiemanLab en cliquant sur l'image, ça vaut le coup de la parcourir régulièrement. Site lui-même d'accès gratuit, produit en lien à l'université d'Harvard.

# data[].attributes.attachment_link.description
The Daily Digest Nearly 70,000 people get our newsletter, The Daily Digest, which goes out at 3 p.m. ET Mondays through Thursdays. It includes both our own stories and our curated rundown of the most interesting stories in digital media over the previous 24 hours. Sign up below. …

# data[].attributes.headline
Quelques réflexions partagées sur la traduction générale (extraits)

# data[].attributes.subject
Quelques réflexions partagées sur la traduction générale (extraits)

# data[].attributes.body
Le métier de traduction ne se réduit évidemment pas à un savoir-faire technique. Une petite sélection de rappels superbes par trois traducteur.ices de premier plan pour attiser la flamme et entretenir l'esprit.

# data[].attributes.headline
Wikicommons images: easy to use, but a few steps are expected from you

# data[].attributes.subject
Wikicommons images: easy to use, but a few steps are expected from you

# data[].attributes.body
For a wikicommons image you found on Wikipedia:

you need to go to the corresponding wikicommons page then check the info on that page:

in the 'summary' section, spot the description and, most importantly, the author

in the 'licensing' section, check the requirements, you can then often convert them into an abbreviated Creative Commons license.

Insert the required mentions into your web page.

NB: in case authoring the image was not required (no -BY), a good practice on (good) websites is still to mention the source.

The required mentions must be visible on your web page, either in the caption, or elsewhere on your page.

ALT: Don't forget in parallel to write an ALT text, with blind visitors en mind. (Remember: This ALT text won't appear on your website, unless the image can't be displayed, yet it is an essential feature of the web + of accessibility).

# data[].attributes.headline
IMAGE: Retrieve & insert image info into your web page (CMS / HTML file)

# data[].attributes.subject
IMAGE: Retrieve & insert image info into your web page (CMS / HTML file)

# data[].attributes.body
Check the link above

retrieve the image with a jpg screen capture (the vector image presented here would otherwise need specific treatment)

check the image license and retrieve the proposed (half-hidden) snippet

insert your image file into your web page via the CMS or the <img> tag in HTML

add the proposed snippet for the license (only through the HTML/<>/text tab if you use a CMS)

Check that the requested proper attribution now appears on the page next to the image.

# data[].attributes.attachment_link.description
Illustration vectorielle d'une page de calendrier.

# data[].attributes.headline
COMPRENDRE WORDPRESS ET AUTRES CMS (Content Management Systems)

# data[].attributes.subject
COMPRENDRE WORDPRESS ET AUTRES CMS (Content Management Systems)

# data[].attributes.headline
How to curate hyperlinks in website translation

# data[].attributes.subject
How to curate hyperlinks in website translation

# data[].attributes.body
Ce document est souvent plus facile à comprendre après une ou deux sessions.

# data[].attributes.headline
The language industry and GenAI disruption

# data[].attributes.subject
The language industry and GenAI disruption