From 900ea256eed9c1c79133fed17d984e64e53bce1e Mon Sep 17 00:00:00 2001 From: peter_rabbit <pierrejarriges@gmail.com> Date: Fri, 5 Feb 2021 12:37:33 +0100 Subject: [PATCH] feat:semantic meta data json-ld & RDFa --- build.js | 11 +++ config.js | 2 +- public/education/education.js | 35 +++++++- public/education/index.html | 5 +- public/games/games.js | 16 +++- public/games/index.html | 5 +- public/index.html | 86 ++++++++++++++++++- public/main.js | 15 +++- public/software-development/index.html | 9 +- .../software-development.js | 33 ++++++- src/generic-components/image-carousel.js | 1 + src/home-page-components/news-articles.js | 12 ++- .../education/components/game-studio-club.js | 16 +++- .../education/components/popularization.js | 17 +++- src/pages/education/meta.json | 62 +++++++++++++ src/pages/games/components/game-article.js | 13 ++- src/pages/games/meta.json | 12 +++ .../components/service-section.js | 10 ++- .../components/software-articles.js | 20 ++++- src/pages/software-development/meta.json | 13 ++- 20 files changed, 365 insertions(+), 28 deletions(-) diff --git a/build.js b/build.js index d72f789..f8c26af 100644 --- a/build.js +++ b/build.js @@ -130,6 +130,15 @@ function getPageHtml(pageName, pageMeta) { ); } }; + + const setJsonLdScript = function () { + const jsonLd = pageMeta.json_ld; + html = html.replace( + html.match(new RegExp(`<script.+json.+>[^<]+</script>`, "g"))[0], + `<script type="application/ld+json">${JSON.stringify(jsonLd)}</script>` + ); + }; + setMeta("description", pageMeta.description); pageMeta.image && setMeta("image", pageMeta.image); setTitle(); @@ -151,6 +160,8 @@ function getPageHtml(pageName, pageMeta) { .replace(/"/g, "") }"/>` ); + + setJsonLdScript(); return html; } diff --git a/config.js b/config.js index 763d9d7..6f9f8c6 100644 --- a/config.js +++ b/config.js @@ -9,6 +9,6 @@ module.exports = { website_title: "Kuadrado website template", build: { protected_dirs: ["assets", "style", "articles"], - default_meta_keys: ["title", "description", "image", "open_graph"], + default_meta_keys: ["title", "description", "image", "open_graph", "json_ld"], }, }; diff --git a/public/education/education.js b/public/education/education.js index 41c04c0..1c26ac3 100644 --- a/public/education/education.js +++ b/public/education/education.js @@ -10,7 +10,7 @@ module.exports = { website_title: "Kuadrado website template", build: { protected_dirs: ["assets", "style", "articles"], - default_meta_keys: ["title", "description", "image", "open_graph"], + default_meta_keys: ["title", "description", "image", "open_graph", "json_ld"], }, }; @@ -202,12 +202,13 @@ class GameStudioClub { render() { return { tag: "section", + typeof: "EducationalOrganization", contents: [ { tag: "div", class: "title-banner game-banner", id: "game-studio-club", // anchor id - contents: [{ tag: "h2", contents: "Game Studio Club" }], + contents: [{ tag: "h2", contents: "Game Studio Club", property: "name" }], }, { tag: "div", @@ -222,6 +223,7 @@ class GameStudioClub { class: "big", contents: "Apprendre à créer un <blue>jeu vidéo</blue> de A à Z", + property: "headline", }, { tag: "strong", @@ -242,10 +244,12 @@ class GameStudioClub { { tag: "div", class: "info-item", + property: "about", contents: [ { tag: "strong", contents: "Ça se passe où ?" }, { tag: "span", + contents: "Dans nos locaux,<br/><em>32 rue Simon Vialet, passage du Cheminou<br/>07240 Vernoux en Vivarais</em>", }, @@ -254,6 +258,7 @@ class GameStudioClub { { tag: "div", class: "info-item", + property: "about", contents: [ { tag: "strong", contents: "Pour qui ?" }, { @@ -266,6 +271,7 @@ class GameStudioClub { { tag: "div", class: "info-item", + property: "about", contents: [ { tag: "strong", @@ -275,11 +281,13 @@ class GameStudioClub { tag: "a", href: "tel:+33475780872", contents: "04 75 78 08 72", + property: "telephone", }, { tag: "a", href: "mailto:contact@kuadrado-software.fr", contents: "contact@kuadrado-software.fr", + property: "email", }, ], }, @@ -288,6 +296,7 @@ class GameStudioClub { { tag: "div", class: "list-wrapper", + property: "hasPart", contents: [ { tag: "ul", @@ -296,20 +305,24 @@ class GameStudioClub { return { tag: "li", class: "learning-theme", + typeof: "ListItem", contents: [ { tag: "strong", class: "title", contents: li.title, + property: "name", }, { tag: "img", alt: `learning theme image ${li.title}`, src: `${images_url}${li.image}`, + property: "image", }, { tag: "div", class: "details", + property: "description", contents: [ li.comment && { tag: "div", @@ -336,6 +349,7 @@ class GameStudioClub { { tag: "div", class: "infos-inscriptions full-row", + property: "about", contents: [ { tag: "div", @@ -522,7 +536,7 @@ const VULGARISATION_THEMES = [ "Quels sont les outils ?", "Les métiers du jeu vidéo", "Du pixelart à l'industrie lourde", - "Qu'est-ce qu'un moteur de jeu ?" + "Qu'est-ce qu'un moteur de jeu ?", ], }, ]; @@ -531,12 +545,15 @@ class Popularization { render() { return { tag: "section", + typeof: "EducationalOrganization", contents: [ { tag: "div", class: "title-banner popu-banner", id: "popularization", // anchor id - contents: [{ tag: "h2", contents: "Vulgarisation numérique" }], + contents: [ + { tag: "h2", contents: "Vulgarisation numérique", property: "name" }, + ], }, { tag: "div", @@ -550,16 +567,19 @@ class Popularization { tag: "h3", class: "big", contents: "<blue>S'approprier</blue> l'informatique", + property: "headline", }, { tag: "strong", contents: "Pour <blue>découvrir et échanger</blue> autour des <blue>outils numériques</blue> que nous utilisons tous les jours !", + property: "alternativeHeadline", }, { tag: "p", contents: "<em>Des animations d'un journée ouvertes à tous organisées en partenariat avec les structures demandeuses</em>", + property: "description", }, ], }, @@ -590,11 +610,13 @@ class Popularization { tag: "a", href: "tel:+33475780872", contents: "04 75 78 08 72", + property: "telephone", }, { tag: "a", href: "mailto:contact@kuadrado-software.fr", contents: "contact@kuadrado-software.fr", + property: "email", }, ], }, @@ -607,24 +629,29 @@ class Popularization { { tag: "ul", class: "learning-themes", + property: "hasPart", contents: VULGARISATION_THEMES.map(li => { return { tag: "li", + typeof: "ListItem", class: "learning-theme " + li.class, contents: [ { tag: "strong", class: "title", contents: li.title, + property: "name", }, { tag: "img", alt: `learning theme image ${li.title}`, src: `${images_url}${li.image}`, + property: "image", }, { tag: "div", class: "details", + property: "description", contents: [ { tag: "div", diff --git a/public/education/index.html b/public/education/index.html index 407dad4..a80643e 100644 --- a/public/education/index.html +++ b/public/education/index.html @@ -23,8 +23,11 @@ <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1" /> <link rel="icon" type="image/svg+xml" href="/favicon.svg" /> <link href="/style/style.css" rel="stylesheet" /> + <script type="application/ld+json">{"@context":"https://schema.org","type":"WebPage","description":"Animations autour de la création de jeux vidéos, vulgarisation numérique. Découvrez nos initiatives pédagogiques.","image":["https://kuadrado-software.fr/assets/images/brain.svg","https://kuadrado-software.fr/assets/images/brain.png","https://kuadrado-software.fr/assets/images/game_studio_banner.png","https://kuadrado-software.fr/assets/images/popularization_banner.png"],"keywords":"Animations, pédagogie, éducation, vulgarisation, popularization, numérique, Ardèche, Rhone-Alpes, apprendre, learn, gamedev, coding","name":"Kuadrado Software - Pédagogie","url":"https://kuadrado-software.fr/education","@graph":[{"@type":"EducationalOrganization","name":"Game Studio Club","url":"https://kuadrado-software.fr/education/#game-studio-club","address":"32 rue Simon Vialet, 07240 Vernoux en Vivarais, France","email":"contact@kuadrado-software.fr","parentOrganization":{"type":"Corporation","description":"Créations numériques, jeu vidéo, web, software et pédagogie. Made in Ardèche, Vernoux en Vivarais.","image":["https://kuadrado-software.fr/assets/images/logo_kuadrado.svg","https://kuadrado-software.fr/assets/images/logo_kuadrado.png","https://kuadrado-software.fr/assets/images/logo_kuadrado_txt.svg","https://kuadrado-software.fr/assets/images/logo_kuadrado_txt.png"],"keywords":"Entreprise, Ardèche, numérique, jeux vidéos, gamedev, software, pédagogie, Rhone-Alpes, éthique, software, développemnt, développement durable","name":"Kuadrado Software","url":"https://kuadrado-software.fr","location":"07240 Vernoux en Vivarais, France","email":"contact@kuadrado-software.fr","logo":"https://kuadrado-software.fr/assets/images/logo_kuadrado.png"}},{"@type":"EducationalOrganization","name":"Vulgarisation numérique","url":"https://kuadrado-software.fr/education/#popularization","address":"32 rue Simon Vialet, 07240 Vernoux en Vivarais, France","email":"contact@kuadrado-software.fr","parentOrganization":{"type":"Corporation","description":"Créations numériques, jeu vidéo, web, software et pédagogie. Made in Ardèche, Vernoux en Vivarais.","image":["https://kuadrado-software.fr/assets/images/logo_kuadrado.svg","https://kuadrado-software.fr/assets/images/logo_kuadrado.png","https://kuadrado-software.fr/assets/images/logo_kuadrado_txt.svg","https://kuadrado-software.fr/assets/images/logo_kuadrado_txt.png"],"keywords":"Entreprise, Ardèche, numérique, jeux vidéos, gamedev, software, pédagogie, Rhone-Alpes, éthique, software, développemnt, développement durable","name":"Kuadrado Software","url":"https://kuadrado-software.fr","location":"07240 Vernoux en Vivarais, France","email":"contact@kuadrado-software.fr","logo":"https://kuadrado-software.fr/assets/images/logo_kuadrado.png"}}]}</script> </head> - <body> + <!-- The vocab attribute defines the standard vocabulary used for RDFa standard. + The DOM may contain properties such as "typeof" and "property" accordinly to the schema.org vocabulary --> + <body vocab="https://schema.org/"> <!-- The H1 tag will be never seen but it's necessary for SEO --> <main><h1 style="visibility: hidden">Kuadrado Software | Pédagogie</h1></main> </body> diff --git a/public/games/games.js b/public/games/games.js index 04696c3..ef1c0d9 100644 --- a/public/games/games.js +++ b/public/games/games.js @@ -10,7 +10,7 @@ module.exports = { website_title: "Kuadrado website template", build: { protected_dirs: ["assets", "style", "articles"], - default_meta_keys: ["title", "description", "image", "open_graph"], + default_meta_keys: ["title", "description", "image", "open_graph", "json_ld"], }, }; @@ -69,6 +69,7 @@ class ImageCarousel { contents: [ { tag: "img", + property: "image", alt: `image carousel ${images[showImageIndex].replace(/\.[A-Za-z]+/, "")}`, src: images[showImageIndex], }, @@ -292,6 +293,8 @@ class TeamMember { return { tag: "div", class: "team-member", + typeof: "Person", + property: "author", contents: [ { tag: "div", @@ -301,6 +304,7 @@ class TeamMember { tag: "img", alt: `ìmage team member ${title}`, src: images.map(im => `${path}/images/${im}`)[0], + property: "image", }, ], }, @@ -308,16 +312,19 @@ class TeamMember { tag: "h3", class: "team-member-title", contents: title, + property: "name", }, { tag: "strong", class: "team-member-subtitle", contents: subtitle, + property: "jobTitle", }, { tag: "p", class: "team-member-body", contents: getArticleBody(body), + property: "description", }, ], }; @@ -333,10 +340,13 @@ class GameArticle { const { title, tags, body, subtitle, images, path, team_subarticles } = this.props; return { tag: "article", + typeof: "VideoGame", + additionalType: "Article", class: "game-article", contents: [ { tag: "h2", + property: "name", class: "game-title", contents: title, }, @@ -344,17 +354,19 @@ class GameArticle { tag: "div", class: "game-tags", contents: tags.map(tag => { - return { tag: "span", contents: tag }; + return { tag: "span", contents: tag, property: "about" }; }), }, { tag: "h3", class: "game-subtitle", contents: subtitle, + property: "alternativeHeadline", }, { tag: "div", class: "game-description", + property: "description", contents: getArticleBody(body), }, new ImageCarousel({ images: images.map(img => `${path}/images/${img}`) }).render(), diff --git a/public/games/index.html b/public/games/index.html index 044c36e..d1ec0a4 100644 --- a/public/games/index.html +++ b/public/games/index.html @@ -25,8 +25,11 @@ <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1" /> <link rel="icon" type="image/svg+xml" href="/favicon.svg" /> <link href="/style/style.css" rel="stylesheet" /> + <script type="application/ld+json">{"@context":"https://schema.org","type":"WebPage","description":"Création de jeux vidéos indépendants. Jeux web, PC et projets en cours de développement","image":["https://kuadrado-software.fr/assets/images/game_controller.svg","https://kuadrado-software.fr/assets/images/game_controller.png"],"keywords":"gamedev, pixelart, jeux vidéo, création, video games, indépendants, indie gamedev","name":"Kuadrado Software - Jeux","url":"https://kuadrado-software.fr/games"}</script> </head> - <body> + <!-- The vocab attribute defines the standard vocabulary used for RDFa standard. + The DOM may contain properties such as "typeof" and "property" accordinly to the schema.org vocabulary --> + <body vocab="https://schema.org/"> <!-- The H1 tag will be never seen but it's necessary for SEO --> <main><h1 style="visibility: hidden">Kuadrado Software | Jeux</h1></main> </body> diff --git a/public/index.html b/public/index.html index cbb4bda..c870e55 100644 --- a/public/index.html +++ b/public/index.html @@ -35,8 +35,92 @@ <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1" /> <link rel="icon" type="image/svg+xml" href="/favicon.svg" /> <link href="/style/style.css" rel="stylesheet" /> + <script type="application/ld+json"> + { + "@context": "https://schema.org", + "@graph": [ + { + "type": "WebPage", + "description": "Créations numériques, jeu vidéo, web, software et pédagogie. Made in Ardèche, Vernoux en Vivarais.", + "image": [ + "https://kuadrado-software.fr/assets/images/logo_kuadrado.svg", + "https://kuadrado-software.fr/assets/images/logo_kuadrado.png", + "https://kuadrado-software.fr/assets/images/logo_kuadrado_txt.svg", + "https://kuadrado-software.fr/assets/images/logo_kuadrado_txt.png" + ], + "keywords": "Entreprise, Ardèche, numérique, jeux vidéos, gamedev, software, pédagogie, Rhone-Alpes, éthique, news", + "name": "Kuadrado Software - Accueil", + "url": "https://kuadrado-software.fr" + }, + { + "type": "WebPage", + "description": "Création de jeux vidéos indépendants. Jeux web, PC et projets en cours de développement", + "image": [ + "https://kuadrado-software.fr/assets/images/game_controller.svg", + "https://kuadrado-software.fr/assets/images/game_controller.png" + ], + "keywords": "gamedev, pixelart, jeux vidéo, création, video games, indépendants, indie gamedev", + "name": "Kuadrado Software - Jeux", + "url": "https://kuadrado-software.fr/games" + }, + { + "type": "WebPage", + "description": "Développement web, moteur de jeux, outillage logiciel, retrouvez nos projets en détail", + "image": [ + "https://kuadrado-software.fr/assets/images/meca_proc.svg", + "https://kuadrado-software.fr/assets/images/meca_proc.png" + ], + "keywords": "développement, development, web, logiciel, software, R&D, service, service numérique, Ardèche, Rhone-Alpes, prestation, création", + "name": "Kuadrado Software - Développement web et logiciel", + "url": "https://kuadrado-software.fr/software-development" + }, + { + "type": "WebPage", + "description": "Animations autour de la création de jeux vidéos, vulgarisation numérique. Découvrez nos initiatives pédagogiques.", + "image": [ + "https://kuadrado-software.fr/assets/images/brain.svg", + "https://kuadrado-software.fr/assets/images/brain.png", + "https://kuadrado-software.fr/assets/images/game_studio_banner.png", + "https://kuadrado-software.fr/assets/images/popularization_banner.png" + ], + "keywords": "Animations, pédagogie, éducation, vulgarisation, popularization, numérique, Ardèche, Rhone-Alpes, apprendre, learn, gamedev, coding", + "name": "Kuadrado Software - Pédagogie", + "url": "https://kuadrado-software.fr/education" + } + ], + "type": "Corporation", + "additionalType": "WebSite", + "description": "Créations numériques, jeu vidéo, web, software et pédagogie. Made in Ardèche, Vernoux en Vivarais.", + "image": [ + "https://kuadrado-software.fr/assets/images/logo_kuadrado.svg", + "https://kuadrado-software.fr/assets/images/logo_kuadrado.png", + "https://kuadrado-software.fr/assets/images/logo_kuadrado_txt.svg", + "https://kuadrado-software.fr/assets/images/logo_kuadrado_txt.png" + ], + "keywords": "Entreprise, Ardèche, numérique, jeux vidéos, gamedev, software, pédagogie, Rhone-Alpes, éthique, software, développemnt, développement durable", + "name": "Kuadrado Software", + "url": "https://kuadrado-software.fr", + "location": "07240 Vernoux en Vivarais, France", + "email": "contact@kuadrado-software.fr", + "logo": "https://kuadrado-software.fr/assets/images/logo_kuadrado.png", + "subOrganization": [ + { + "@type": "EducationalOrganization", + "name": "Game Studio Club", + "url": "https://kuadrado-software.fr/education/#game-studio-club" + }, + { + "@type": "EducationalOrganization", + "name": "Vulgarisation numérique", + "url": "https://kuadrado-software.fr/education/#popularization" + } + ] + } + </script> </head> - <body> + <!-- The vocab attribute defines the standard vocabulary used for RDFa standard. + The DOM may contain properties such as "typeof" and "property" accordinly to the schema.org vocabulary --> + <body vocab="https://schema.org/"> <!-- The H1 tag will be never seen but it's necessary for SEO --> <main><h1 style="visibility: hidden">Kuadrado Software</h1></main> </body> diff --git a/public/main.js b/public/main.js index b9f7aa1..5debd47 100644 --- a/public/main.js +++ b/public/main.js @@ -10,7 +10,7 @@ module.exports = { website_title: "Kuadrado website template", build: { protected_dirs: ["assets", "style", "articles"], - default_meta_keys: ["title", "description", "image", "open_graph"], + default_meta_keys: ["title", "description", "image", "open_graph", "json_ld"], }, }; @@ -69,6 +69,7 @@ class ImageCarousel { contents: [ { tag: "img", + property: "image", alt: `image carousel ${images[showImageIndex].replace(/\.[A-Za-z]+/, "")}`, src: images[showImageIndex], }, @@ -187,11 +188,18 @@ class NewsArticles { renderArticle(articleData) { return { tag: "article", + typeof: "Article", contents: [ { tag: "div", class: "date", - contents: [{ tag: "time", contents: getArticleDate(articleData.date) }], + contents: [ + { + tag: "time", + property: "datePublished", + contents: getArticleDate(articleData.date), + }, + ], }, { tag: "div", @@ -200,6 +208,7 @@ class NewsArticles { { tag: "h3", contents: articleData.title, + property: "headline", }, ], }, @@ -210,6 +219,7 @@ class NewsArticles { { tag: "strong", contents: articleData.subtitle, + property: "alternativeHeadline", }, ], }, @@ -220,6 +230,7 @@ class NewsArticles { { tag: "p", contents: getArticleBody(articleData.body), + property: "articleBody", }, ], }, diff --git a/public/software-development/index.html b/public/software-development/index.html index 7595545..3e0cced 100644 --- a/public/software-development/index.html +++ b/public/software-development/index.html @@ -2,7 +2,7 @@ <html lang="fr" prefix="og: https://ogp.me/ns#"> <head> <meta charset="utf-8" /> - <title>Kuadrado Software | Software</title> + <title>Kuadrado Software | Développement web et logiciel</title> <meta name="description" content="Développement web, moteur de jeux, outillage logiciel, retrouvez nos projets en détail."/> <meta name="author" content="Kuadrado Software" /> <meta name="image" content="https://kuadrado-software.fr/assets/images/meca_proc.png"/> @@ -23,10 +23,13 @@ <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1" /> <link rel="icon" type="image/svg+xml" href="/favicon.svg" /> <link href="/style/style.css" rel="stylesheet" /> + <script type="application/ld+json">{"type":"WebPage","description":"Développement web, moteur de jeux, outillage logiciel, retrouvez nos projets en détail","image":["https://kuadrado-software.fr/assets/images/meca_proc.svg","https://kuadrado-software.fr/assets/images/meca_proc.png"],"keywords":"développement, development, web, logiciel, software, R&D, service, service numérique, Ardèche, Rhone-Alpes, prestation, création","name":"Kuadrado Software - Développement web et logiciel","url":"https://kuadrado-software.fr/software-development"}</script> </head> - <body> + <!-- The vocab attribute defines the standard vocabulary used for RDFa standard. + The DOM may contain properties such as "typeof" and "property" accordinly to the schema.org vocabulary --> + <body vocab="https://schema.org/"> <!-- The H1 tag will be never seen but it's necessary for SEO --> - <main><h1 style="visibility: hidden">Kuadrado Software | Software</h1></main> + <main><h1 style="visibility: hidden">Kuadrado Software | Développement web et logiciel</h1></main> </body> <script type="text/javascript" src="./software-development.js"></script> </html> diff --git a/public/software-development/software-development.js b/public/software-development/software-development.js index d6dbbd5..0c1344b 100644 --- a/public/software-development/software-development.js +++ b/public/software-development/software-development.js @@ -10,7 +10,7 @@ module.exports = { website_title: "Kuadrado website template", build: { protected_dirs: ["assets", "style", "articles"], - default_meta_keys: ["title", "description", "image", "open_graph"], + default_meta_keys: ["title", "description", "image", "open_graph", "json_ld"], }, }; @@ -69,6 +69,7 @@ class ImageCarousel { contents: [ { tag: "img", + property: "image", alt: `image carousel ${images[showImageIndex].replace(/\.[A-Za-z]+/, "")}`, src: images[showImageIndex], }, @@ -318,14 +319,18 @@ class ServiceSection { tag: "section", class: "page-contents-center", id: "service-section", + typeof: "Service", + additionalType: "Organization", contents: [ { tag: "h3", contents: "<blue>Nos compétences</blue> pour votre besoin <blue>numérique</blue>", + property: "slogan", }, { tag: "p", + property: "description", contents: ` La demande numérique est omniprésente et de nombreuses entreprises ont besoin de bénéficier d'outils spécifiques réalisés sur mesure, applications web et mobiles, site statiques, logiciels, ERP, etc, mais n'ont pas forcément les compétences chez elles, @@ -340,6 +345,7 @@ class ServiceSection { contents: [ { tag: "strong", + property: "slogan", contents: "Des solutions <blue>sur mesure, légères, simples, maintenables, scalables et écologiques</blue>", }, @@ -353,7 +359,7 @@ class ServiceSection { tag: "ul", class: "skill-themes", contents: SKILL_THEMES.map(item => { - return { tag: "li", contents: item }; + return { tag: "li", contents: item, property: "about" }; }), }, { @@ -363,6 +369,7 @@ class ServiceSection { const [title, img] = item; return { tag: "li", + property: "about", contents: [ { tag: "strong", @@ -389,11 +396,13 @@ class ServiceSection { tag: "a", href: "mailto:contact@kuadrado-software.fr", contents: "contact@kuadrado-software.fr", + property: "email", }, { tag: "a", href: "tel:+33475780872", contents: "04 75 78 08 72", + property: "telephone", }, ], }, @@ -424,26 +433,32 @@ class SoftwareArticle { return { tag: "article", class: "software-article", + typeof: "SoftwareApplication", + additionalType: "Article", contents: [ { tag: "h2", class: "software-title", contents: title, + property: "name", }, { tag: "time", class: "software-date", contents: getArticleDate(date), + property: "datePublished", }, { tag: "h3", class: "software-subtitle", contents: subtitle, + property: "alternativeHeadline", }, { tag: "div", class: "software-description", contents: getArticleBody(body), + property: "description", }, new ImageCarousel({ images: images.map(img => `${path}/images/${img}`) }).render(), { @@ -469,7 +484,11 @@ class SoftwareArticle { { tag: "ul", contents: technical.stack.map(tech => { - return { tag: "li", contents: tech }; + return { + tag: "li", + contents: tech, + property: "about", + }; }), }, ], @@ -484,6 +503,7 @@ class SoftwareArticle { { tag: "div", contents: technical.version, + property: "version", }, ], }, @@ -492,7 +512,11 @@ class SoftwareArticle { class: "detail", contents: [ { tag: "label", contents: "License" }, - { tag: "div", contents: technical.license }, + { + tag: "div", + contents: technical.license, + property: "license", + }, ], }, { @@ -507,6 +531,7 @@ class SoftwareArticle { href: technical.repository, target: "_blank", contents: "Dépôt code source", + property: "url", }, ], }, diff --git a/src/generic-components/image-carousel.js b/src/generic-components/image-carousel.js index e9cd779..d3a9ada 100644 --- a/src/generic-components/image-carousel.js +++ b/src/generic-components/image-carousel.js @@ -44,6 +44,7 @@ class ImageCarousel { contents: [ { tag: "img", + property: "image", alt: `image carousel ${images[showImageIndex].replace(/\.[A-Za-z]+/, "")}`, src: images[showImageIndex], }, diff --git a/src/home-page-components/news-articles.js b/src/home-page-components/news-articles.js index 71b8d82..7d17aa2 100644 --- a/src/home-page-components/news-articles.js +++ b/src/home-page-components/news-articles.js @@ -33,11 +33,18 @@ class NewsArticles { renderArticle(articleData) { return { tag: "article", + typeof: "Article", contents: [ { tag: "div", class: "date", - contents: [{ tag: "time", contents: getArticleDate(articleData.date) }], + contents: [ + { + tag: "time", + property: "datePublished", + contents: getArticleDate(articleData.date), + }, + ], }, { tag: "div", @@ -46,6 +53,7 @@ class NewsArticles { { tag: "h3", contents: articleData.title, + property: "headline", }, ], }, @@ -56,6 +64,7 @@ class NewsArticles { { tag: "strong", contents: articleData.subtitle, + property: "alternativeHeadline", }, ], }, @@ -66,6 +75,7 @@ class NewsArticles { { tag: "p", contents: getArticleBody(articleData.body), + property: "articleBody", }, ], }, diff --git a/src/pages/education/components/game-studio-club.js b/src/pages/education/components/game-studio-club.js index 3c3fffe..04c1f41 100644 --- a/src/pages/education/components/game-studio-club.js +++ b/src/pages/education/components/game-studio-club.js @@ -81,12 +81,13 @@ class GameStudioClub { render() { return { tag: "section", + typeof: "EducationalOrganization", contents: [ { tag: "div", class: "title-banner game-banner", id: "game-studio-club", // anchor id - contents: [{ tag: "h2", contents: "Game Studio Club" }], + contents: [{ tag: "h2", contents: "Game Studio Club", property: "name" }], }, { tag: "div", @@ -101,6 +102,7 @@ class GameStudioClub { class: "big", contents: "Apprendre à créer un <blue>jeu vidéo</blue> de A à Z", + property: "headline", }, { tag: "strong", @@ -121,10 +123,12 @@ class GameStudioClub { { tag: "div", class: "info-item", + property: "about", contents: [ { tag: "strong", contents: "Ça se passe où ?" }, { tag: "span", + contents: "Dans nos locaux,<br/><em>32 rue Simon Vialet, passage du Cheminou<br/>07240 Vernoux en Vivarais</em>", }, @@ -133,6 +137,7 @@ class GameStudioClub { { tag: "div", class: "info-item", + property: "about", contents: [ { tag: "strong", contents: "Pour qui ?" }, { @@ -145,6 +150,7 @@ class GameStudioClub { { tag: "div", class: "info-item", + property: "about", contents: [ { tag: "strong", @@ -154,11 +160,13 @@ class GameStudioClub { tag: "a", href: "tel:+33475780872", contents: "04 75 78 08 72", + property: "telephone", }, { tag: "a", href: "mailto:contact@kuadrado-software.fr", contents: "contact@kuadrado-software.fr", + property: "email", }, ], }, @@ -167,6 +175,7 @@ class GameStudioClub { { tag: "div", class: "list-wrapper", + property: "hasPart", contents: [ { tag: "ul", @@ -175,20 +184,24 @@ class GameStudioClub { return { tag: "li", class: "learning-theme", + typeof: "ListItem", contents: [ { tag: "strong", class: "title", contents: li.title, + property: "name", }, { tag: "img", alt: `learning theme image ${li.title}`, src: `${images_url}${li.image}`, + property: "image", }, { tag: "div", class: "details", + property: "description", contents: [ li.comment && { tag: "div", @@ -215,6 +228,7 @@ class GameStudioClub { { tag: "div", class: "infos-inscriptions full-row", + property: "about", contents: [ { tag: "div", diff --git a/src/pages/education/components/popularization.js b/src/pages/education/components/popularization.js index c07378a..adbfa51 100644 --- a/src/pages/education/components/popularization.js +++ b/src/pages/education/components/popularization.js @@ -47,7 +47,7 @@ const VULGARISATION_THEMES = [ "Quels sont les outils ?", "Les métiers du jeu vidéo", "Du pixelart à l'industrie lourde", - "Qu'est-ce qu'un moteur de jeu ?" + "Qu'est-ce qu'un moteur de jeu ?", ], }, ]; @@ -56,12 +56,15 @@ class Popularization { render() { return { tag: "section", + typeof: "EducationalOrganization", contents: [ { tag: "div", class: "title-banner popu-banner", id: "popularization", // anchor id - contents: [{ tag: "h2", contents: "Vulgarisation numérique" }], + contents: [ + { tag: "h2", contents: "Vulgarisation numérique", property: "name" }, + ], }, { tag: "div", @@ -75,16 +78,19 @@ class Popularization { tag: "h3", class: "big", contents: "<blue>S'approprier</blue> l'informatique", + property: "headline", }, { tag: "strong", contents: "Pour <blue>découvrir et échanger</blue> autour des <blue>outils numériques</blue> que nous utilisons tous les jours !", + property: "alternativeHeadline", }, { tag: "p", contents: "<em>Des animations d'un journée ouvertes à tous organisées en partenariat avec les structures demandeuses</em>", + property: "description", }, ], }, @@ -115,11 +121,13 @@ class Popularization { tag: "a", href: "tel:+33475780872", contents: "04 75 78 08 72", + property: "telephone", }, { tag: "a", href: "mailto:contact@kuadrado-software.fr", contents: "contact@kuadrado-software.fr", + property: "email", }, ], }, @@ -132,24 +140,29 @@ class Popularization { { tag: "ul", class: "learning-themes", + property: "hasPart", contents: VULGARISATION_THEMES.map(li => { return { tag: "li", + typeof: "ListItem", class: "learning-theme " + li.class, contents: [ { tag: "strong", class: "title", contents: li.title, + property: "name", }, { tag: "img", alt: `learning theme image ${li.title}`, src: `${images_url}${li.image}`, + property: "image", }, { tag: "div", class: "details", + property: "description", contents: [ { tag: "div", diff --git a/src/pages/education/meta.json b/src/pages/education/meta.json index 0432e78..1b5659b 100644 --- a/src/pages/education/meta.json +++ b/src/pages/education/meta.json @@ -5,5 +5,67 @@ "open_graph": { "title": "Kuadrado Software | Pédagogie", "description": "Animations autour de la création de jeux vidéos, vulgarisation numérique. Découvrez nos initiatives pédagogiques." + }, + "json_ld": { + "@context": "https://schema.org", + "type": "WebPage", + "description": "Animations autour de la création de jeux vidéos, vulgarisation numérique. Découvrez nos initiatives pédagogiques.", + "image": [ + "https://kuadrado-software.fr/assets/images/brain.svg", + "https://kuadrado-software.fr/assets/images/brain.png", + "https://kuadrado-software.fr/assets/images/game_studio_banner.png", + "https://kuadrado-software.fr/assets/images/popularization_banner.png" + ], + "keywords": "Animations, pédagogie, éducation, vulgarisation, popularization, numérique, Ardèche, Rhone-Alpes, apprendre, learn, gamedev, coding", + "name": "Kuadrado Software - Pédagogie", + "url": "https://kuadrado-software.fr/education", + "@graph": [ + { + "@type": "EducationalOrganization", + "name": "Game Studio Club", + "url": "https://kuadrado-software.fr/education/#game-studio-club", + "address": "32 rue Simon Vialet, 07240 Vernoux en Vivarais, France", + "email": "contact@kuadrado-software.fr", + "parentOrganization": { + "type": "Corporation", + "description": "Créations numériques, jeu vidéo, web, software et pédagogie. Made in Ardèche, Vernoux en Vivarais.", + "image": [ + "https://kuadrado-software.fr/assets/images/logo_kuadrado.svg", + "https://kuadrado-software.fr/assets/images/logo_kuadrado.png", + "https://kuadrado-software.fr/assets/images/logo_kuadrado_txt.svg", + "https://kuadrado-software.fr/assets/images/logo_kuadrado_txt.png" + ], + "keywords": "Entreprise, Ardèche, numérique, jeux vidéos, gamedev, software, pédagogie, Rhone-Alpes, éthique, software, développemnt, développement durable", + "name": "Kuadrado Software", + "url": "https://kuadrado-software.fr", + "location": "07240 Vernoux en Vivarais, France", + "email": "contact@kuadrado-software.fr", + "logo": "https://kuadrado-software.fr/assets/images/logo_kuadrado.png" + } + }, + { + "@type": "EducationalOrganization", + "name": "Vulgarisation numérique", + "url": "https://kuadrado-software.fr/education/#popularization", + "address": "32 rue Simon Vialet, 07240 Vernoux en Vivarais, France", + "email": "contact@kuadrado-software.fr", + "parentOrganization": { + "type": "Corporation", + "description": "Créations numériques, jeu vidéo, web, software et pédagogie. Made in Ardèche, Vernoux en Vivarais.", + "image": [ + "https://kuadrado-software.fr/assets/images/logo_kuadrado.svg", + "https://kuadrado-software.fr/assets/images/logo_kuadrado.png", + "https://kuadrado-software.fr/assets/images/logo_kuadrado_txt.svg", + "https://kuadrado-software.fr/assets/images/logo_kuadrado_txt.png" + ], + "keywords": "Entreprise, Ardèche, numérique, jeux vidéos, gamedev, software, pédagogie, Rhone-Alpes, éthique, software, développemnt, développement durable", + "name": "Kuadrado Software", + "url": "https://kuadrado-software.fr", + "location": "07240 Vernoux en Vivarais, France", + "email": "contact@kuadrado-software.fr", + "logo": "https://kuadrado-software.fr/assets/images/logo_kuadrado.png" + } + } + ] } } diff --git a/src/pages/games/components/game-article.js b/src/pages/games/components/game-article.js index edd332a..689ff6d 100644 --- a/src/pages/games/components/game-article.js +++ b/src/pages/games/components/game-article.js @@ -13,6 +13,8 @@ class TeamMember { return { tag: "div", class: "team-member", + typeof: "Person", + property: "author", contents: [ { tag: "div", @@ -22,6 +24,7 @@ class TeamMember { tag: "img", alt: `ìmage team member ${title}`, src: images.map(im => `${path}/images/${im}`)[0], + property: "image", }, ], }, @@ -29,16 +32,19 @@ class TeamMember { tag: "h3", class: "team-member-title", contents: title, + property: "name", }, { tag: "strong", class: "team-member-subtitle", contents: subtitle, + property: "jobTitle", }, { tag: "p", class: "team-member-body", contents: getArticleBody(body), + property: "description", }, ], }; @@ -54,10 +60,13 @@ class GameArticle { const { title, tags, body, subtitle, images, path, team_subarticles } = this.props; return { tag: "article", + typeof: "VideoGame", + additionalType: "Article", class: "game-article", contents: [ { tag: "h2", + property: "name", class: "game-title", contents: title, }, @@ -65,17 +74,19 @@ class GameArticle { tag: "div", class: "game-tags", contents: tags.map(tag => { - return { tag: "span", contents: tag }; + return { tag: "span", contents: tag, property: "about" }; }), }, { tag: "h3", class: "game-subtitle", contents: subtitle, + property: "alternativeHeadline", }, { tag: "div", class: "game-description", + property: "description", contents: getArticleBody(body), }, new ImageCarousel({ images: images.map(img => `${path}/images/${img}`) }).render(), diff --git a/src/pages/games/meta.json b/src/pages/games/meta.json index 794d9d7..20f7ef2 100644 --- a/src/pages/games/meta.json +++ b/src/pages/games/meta.json @@ -10,5 +10,17 @@ "https://kuadrado-software.fr/assets/images/game_studio_banner.png", "https://kuadrado-software.fr/assets/images/popularization_banner.png" ] + }, + "json_ld": { + "@context": "https://schema.org", + "type": "WebPage", + "description": "Création de jeux vidéos indépendants. Jeux web, PC et projets en cours de développement", + "image": [ + "https://kuadrado-software.fr/assets/images/game_controller.svg", + "https://kuadrado-software.fr/assets/images/game_controller.png" + ], + "keywords": "gamedev, pixelart, jeux vidéo, création, video games, indépendants, indie gamedev", + "name": "Kuadrado Software - Jeux", + "url": "https://kuadrado-software.fr/games" } } diff --git a/src/pages/software-development/components/service-section.js b/src/pages/software-development/components/service-section.js index 7eed014..db4e647 100644 --- a/src/pages/software-development/components/service-section.js +++ b/src/pages/software-development/components/service-section.js @@ -39,14 +39,18 @@ class ServiceSection { tag: "section", class: "page-contents-center", id: "service-section", + typeof: "Service", + additionalType: "Organization", contents: [ { tag: "h3", contents: "<blue>Nos compétences</blue> pour votre besoin <blue>numérique</blue>", + property: "slogan", }, { tag: "p", + property: "description", contents: ` La demande numérique est omniprésente et de nombreuses entreprises ont besoin de bénéficier d'outils spécifiques réalisés sur mesure, applications web et mobiles, site statiques, logiciels, ERP, etc, mais n'ont pas forcément les compétences chez elles, @@ -61,6 +65,7 @@ class ServiceSection { contents: [ { tag: "strong", + property: "slogan", contents: "Des solutions <blue>sur mesure, légères, simples, maintenables, scalables et écologiques</blue>", }, @@ -74,7 +79,7 @@ class ServiceSection { tag: "ul", class: "skill-themes", contents: SKILL_THEMES.map(item => { - return { tag: "li", contents: item }; + return { tag: "li", contents: item, property: "about" }; }), }, { @@ -84,6 +89,7 @@ class ServiceSection { const [title, img] = item; return { tag: "li", + property: "about", contents: [ { tag: "strong", @@ -110,11 +116,13 @@ class ServiceSection { tag: "a", href: "mailto:contact@kuadrado-software.fr", contents: "contact@kuadrado-software.fr", + property: "email", }, { tag: "a", href: "tel:+33475780872", contents: "04 75 78 08 72", + property: "telephone", }, ], }, diff --git a/src/pages/software-development/components/software-articles.js b/src/pages/software-development/components/software-articles.js index e8ce2ab..7e589bd 100644 --- a/src/pages/software-development/components/software-articles.js +++ b/src/pages/software-development/components/software-articles.js @@ -15,26 +15,32 @@ class SoftwareArticle { return { tag: "article", class: "software-article", + typeof: "SoftwareApplication", + additionalType: "Article", contents: [ { tag: "h2", class: "software-title", contents: title, + property: "name", }, { tag: "time", class: "software-date", contents: getArticleDate(date), + property: "datePublished", }, { tag: "h3", class: "software-subtitle", contents: subtitle, + property: "alternativeHeadline", }, { tag: "div", class: "software-description", contents: getArticleBody(body), + property: "description", }, new ImageCarousel({ images: images.map(img => `${path}/images/${img}`) }).render(), { @@ -60,7 +66,11 @@ class SoftwareArticle { { tag: "ul", contents: technical.stack.map(tech => { - return { tag: "li", contents: tech }; + return { + tag: "li", + contents: tech, + property: "about", + }; }), }, ], @@ -75,6 +85,7 @@ class SoftwareArticle { { tag: "div", contents: technical.version, + property: "version", }, ], }, @@ -83,7 +94,11 @@ class SoftwareArticle { class: "detail", contents: [ { tag: "label", contents: "License" }, - { tag: "div", contents: technical.license }, + { + tag: "div", + contents: technical.license, + property: "license", + }, ], }, { @@ -98,6 +113,7 @@ class SoftwareArticle { href: technical.repository, target: "_blank", contents: "Dépôt code source", + property: "url", }, ], }, diff --git a/src/pages/software-development/meta.json b/src/pages/software-development/meta.json index 2cac728..6eec1bc 100644 --- a/src/pages/software-development/meta.json +++ b/src/pages/software-development/meta.json @@ -1,9 +1,20 @@ { - "title": "Kuadrado Software | Software", + "title": "Kuadrado Software | Développement web et logiciel", "description": "Développement web, moteur de jeux, outillage logiciel, retrouvez nos projets en détail.", "image": "https://kuadrado-software.fr/assets/images/meca_proc.png", "open_graph": { "title": "Kuadrado Software | Software", "description": "Développement web, moteur de jeux, outillage logiciel, retrouvez nos projets en détail." + }, + "json_ld": { + "type": "WebPage", + "description": "Développement web, moteur de jeux, outillage logiciel, retrouvez nos projets en détail", + "image": [ + "https://kuadrado-software.fr/assets/images/meca_proc.svg", + "https://kuadrado-software.fr/assets/images/meca_proc.png" + ], + "keywords": "développement, development, web, logiciel, software, R&D, service, service numérique, Ardèche, Rhone-Alpes, prestation, création", + "name": "Kuadrado Software - Développement web et logiciel", + "url": "https://kuadrado-software.fr/software-development" } } -- GitLab