@jjlmoya/utils-health 1.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +60 -0
- package/src/category/i18n/en.ts +60 -0
- package/src/category/i18n/es.ts +60 -0
- package/src/category/i18n/fr.ts +60 -0
- package/src/category/index.ts +22 -0
- package/src/category/seo.astro +15 -0
- package/src/components/PreviewNavSidebar.astro +116 -0
- package/src/components/PreviewToolbar.astro +143 -0
- package/src/data.ts +28 -0
- package/src/env.d.ts +5 -0
- package/src/index.ts +36 -0
- package/src/layouts/PreviewLayout.astro +117 -0
- package/src/pages/[locale]/[slug].astro +146 -0
- package/src/pages/[locale].astro +251 -0
- package/src/pages/index.astro +4 -0
- package/src/tests/faq_count.test.ts +19 -0
- package/src/tests/locale_completeness.test.ts +42 -0
- package/src/tests/mocks/astro_mock.js +2 -0
- package/src/tests/no_h1_in_components.test.ts +48 -0
- package/src/tests/schemas_fulfillment.test.ts +23 -0
- package/src/tests/seo_length.test.ts +22 -0
- package/src/tests/title_quality.test.ts +55 -0
- package/src/tests/tool_validation.test.ts +17 -0
- package/src/tool/binauralTuner/bibliography.astro +14 -0
- package/src/tool/binauralTuner/component.astro +687 -0
- package/src/tool/binauralTuner/i18n/en.ts +187 -0
- package/src/tool/binauralTuner/i18n/es.ts +187 -0
- package/src/tool/binauralTuner/i18n/fr.ts +187 -0
- package/src/tool/binauralTuner/index.ts +27 -0
- package/src/tool/binauralTuner/seo.astro +14 -0
- package/src/tool/binauralTuner/ui.ts +18 -0
- package/src/tool/bloodUnitConverter/bibliography.astro +14 -0
- package/src/tool/bloodUnitConverter/component.astro +915 -0
- package/src/tool/bloodUnitConverter/i18n/en.ts +227 -0
- package/src/tool/bloodUnitConverter/i18n/es.ts +250 -0
- package/src/tool/bloodUnitConverter/i18n/fr.ts +218 -0
- package/src/tool/bloodUnitConverter/index.ts +27 -0
- package/src/tool/bloodUnitConverter/seo.astro +14 -0
- package/src/tool/bloodUnitConverter/ui.ts +38 -0
- package/src/tool/bmiCalculator/bibliography.astro +14 -0
- package/src/tool/bmiCalculator/component.astro +415 -0
- package/src/tool/bmiCalculator/i18n/en.ts +217 -0
- package/src/tool/bmiCalculator/i18n/es.ts +221 -0
- package/src/tool/bmiCalculator/i18n/fr.ts +217 -0
- package/src/tool/bmiCalculator/index.ts +27 -0
- package/src/tool/bmiCalculator/seo.astro +14 -0
- package/src/tool/bmiCalculator/ui.ts +21 -0
- package/src/tool/breathingVisualizer/bibliography.astro +14 -0
- package/src/tool/breathingVisualizer/component.astro +636 -0
- package/src/tool/breathingVisualizer/i18n/en.ts +206 -0
- package/src/tool/breathingVisualizer/i18n/es.ts +206 -0
- package/src/tool/breathingVisualizer/i18n/fr.ts +206 -0
- package/src/tool/breathingVisualizer/index.ts +27 -0
- package/src/tool/breathingVisualizer/seo.astro +14 -0
- package/src/tool/breathingVisualizer/ui.ts +31 -0
- package/src/tool/caffeineTracker/bibliography.astro +14 -0
- package/src/tool/caffeineTracker/component.astro +1210 -0
- package/src/tool/caffeineTracker/i18n/en.ts +198 -0
- package/src/tool/caffeineTracker/i18n/es.ts +198 -0
- package/src/tool/caffeineTracker/i18n/fr.ts +198 -0
- package/src/tool/caffeineTracker/index.ts +27 -0
- package/src/tool/caffeineTracker/logic.ts +31 -0
- package/src/tool/caffeineTracker/seo.astro +14 -0
- package/src/tool/caffeineTracker/ui.ts +36 -0
- package/src/tool/daltonismSimulator/bibliography.astro +14 -0
- package/src/tool/daltonismSimulator/component.astro +383 -0
- package/src/tool/daltonismSimulator/i18n/en.ts +188 -0
- package/src/tool/daltonismSimulator/i18n/es.ts +218 -0
- package/src/tool/daltonismSimulator/i18n/fr.ts +168 -0
- package/src/tool/daltonismSimulator/index.ts +27 -0
- package/src/tool/daltonismSimulator/seo.astro +14 -0
- package/src/tool/daltonismSimulator/ui.ts +20 -0
- package/src/tool/digestionStopwatch/bibliography.astro +14 -0
- package/src/tool/digestionStopwatch/component.astro +627 -0
- package/src/tool/digestionStopwatch/i18n/en.ts +173 -0
- package/src/tool/digestionStopwatch/i18n/es.ts +173 -0
- package/src/tool/digestionStopwatch/i18n/fr.ts +173 -0
- package/src/tool/digestionStopwatch/index.ts +27 -0
- package/src/tool/digestionStopwatch/logic.ts +63 -0
- package/src/tool/digestionStopwatch/seo.astro +14 -0
- package/src/tool/digestionStopwatch/ui.ts +20 -0
- package/src/tool/epworthSleepinessScale/bibliography.astro +14 -0
- package/src/tool/epworthSleepinessScale/component.astro +528 -0
- package/src/tool/epworthSleepinessScale/i18n/en.ts +217 -0
- package/src/tool/epworthSleepinessScale/i18n/es.ts +217 -0
- package/src/tool/epworthSleepinessScale/i18n/fr.ts +217 -0
- package/src/tool/epworthSleepinessScale/index.ts +27 -0
- package/src/tool/epworthSleepinessScale/seo.astro +14 -0
- package/src/tool/epworthSleepinessScale/ui.ts +27 -0
- package/src/tool/hydrationCalculator/bibliography.astro +14 -0
- package/src/tool/hydrationCalculator/component.astro +694 -0
- package/src/tool/hydrationCalculator/i18n/en.ts +217 -0
- package/src/tool/hydrationCalculator/i18n/es.ts +222 -0
- package/src/tool/hydrationCalculator/i18n/fr.ts +199 -0
- package/src/tool/hydrationCalculator/index.ts +27 -0
- package/src/tool/hydrationCalculator/seo.astro +14 -0
- package/src/tool/hydrationCalculator/ui.ts +28 -0
- package/src/tool/pelliRobsonTest/bibliography.astro +14 -0
- package/src/tool/pelliRobsonTest/component.astro +653 -0
- package/src/tool/pelliRobsonTest/i18n/en.ts +205 -0
- package/src/tool/pelliRobsonTest/i18n/es.ts +205 -0
- package/src/tool/pelliRobsonTest/i18n/fr.ts +205 -0
- package/src/tool/pelliRobsonTest/index.ts +27 -0
- package/src/tool/pelliRobsonTest/seo.astro +14 -0
- package/src/tool/pelliRobsonTest/ui.ts +21 -0
- package/src/tool/peripheralVisionTrainer/bibliography.astro +14 -0
- package/src/tool/peripheralVisionTrainer/component.astro +678 -0
- package/src/tool/peripheralVisionTrainer/i18n/en.ts +224 -0
- package/src/tool/peripheralVisionTrainer/i18n/es.ts +224 -0
- package/src/tool/peripheralVisionTrainer/i18n/fr.ts +211 -0
- package/src/tool/peripheralVisionTrainer/index.ts +27 -0
- package/src/tool/peripheralVisionTrainer/seo.astro +14 -0
- package/src/tool/peripheralVisionTrainer/ui.ts +26 -0
- package/src/tool/readingDistanceCalculator/bibliography.astro +14 -0
- package/src/tool/readingDistanceCalculator/component.astro +588 -0
- package/src/tool/readingDistanceCalculator/i18n/en.ts +202 -0
- package/src/tool/readingDistanceCalculator/i18n/es.ts +215 -0
- package/src/tool/readingDistanceCalculator/i18n/fr.ts +193 -0
- package/src/tool/readingDistanceCalculator/index.ts +31 -0
- package/src/tool/readingDistanceCalculator/seo.astro +14 -0
- package/src/tool/readingDistanceCalculator/ui.ts +18 -0
- package/src/tool/screenDecompressionTime/bibliography.astro +14 -0
- package/src/tool/screenDecompressionTime/component.astro +671 -0
- package/src/tool/screenDecompressionTime/i18n/en.ts +225 -0
- package/src/tool/screenDecompressionTime/i18n/es.ts +247 -0
- package/src/tool/screenDecompressionTime/i18n/fr.ts +225 -0
- package/src/tool/screenDecompressionTime/index.ts +27 -0
- package/src/tool/screenDecompressionTime/seo.astro +14 -0
- package/src/tool/screenDecompressionTime/ui.ts +32 -0
- package/src/tool/tinnitusReliever/bibliography.astro +14 -0
- package/src/tool/tinnitusReliever/component.astro +581 -0
- package/src/tool/tinnitusReliever/i18n/en.ts +161 -0
- package/src/tool/tinnitusReliever/i18n/es.ts +161 -0
- package/src/tool/tinnitusReliever/i18n/fr.ts +161 -0
- package/src/tool/tinnitusReliever/index.ts +27 -0
- package/src/tool/tinnitusReliever/seo.astro +14 -0
- package/src/tool/tinnitusReliever/ui.ts +9 -0
- package/src/tool/ubeCalculator/bibliography.astro +14 -0
- package/src/tool/ubeCalculator/component.astro +683 -0
- package/src/tool/ubeCalculator/i18n/en.ts +200 -0
- package/src/tool/ubeCalculator/i18n/es.ts +200 -0
- package/src/tool/ubeCalculator/i18n/fr.ts +196 -0
- package/src/tool/ubeCalculator/index.ts +27 -0
- package/src/tool/ubeCalculator/seo.astro +14 -0
- package/src/tool/ubeCalculator/ui.ts +26 -0
- package/src/tool/waterPurifier/bibliography.astro +14 -0
- package/src/tool/waterPurifier/component.astro +628 -0
- package/src/tool/waterPurifier/i18n/en.ts +167 -0
- package/src/tool/waterPurifier/i18n/es.ts +167 -0
- package/src/tool/waterPurifier/i18n/fr.ts +167 -0
- package/src/tool/waterPurifier/index.ts +27 -0
- package/src/tool/waterPurifier/seo.astro +14 -0
- package/src/tool/waterPurifier/ui.ts +18 -0
- package/src/tools.ts +19 -0
- package/src/types.ts +72 -0
|
@@ -0,0 +1,218 @@
|
|
|
1
|
+
import type { WithContext, SoftwareApplication, FAQPage, HowToThing } from 'schema-dts';
|
|
2
|
+
import type { ToolLocaleContent } from '../../../types';
|
|
3
|
+
import type { DaltonismSimulatorUI } from '../ui';
|
|
4
|
+
|
|
5
|
+
const slug = 'simulador-daltonismo';
|
|
6
|
+
const title = 'Simulador de Daltonismo: Visión con Deficiencia de Color';
|
|
7
|
+
const description =
|
|
8
|
+
'Simula cómo perciben el color las personas con daltonismo. Visualiza protanopia, deuteranopia, tritanopia y más con tu propia imagen o la muestra incluida.';
|
|
9
|
+
|
|
10
|
+
const faqData = [
|
|
11
|
+
{
|
|
12
|
+
question: '¿Qué es el daltonismo?',
|
|
13
|
+
answer:
|
|
14
|
+
'El daltonismo es una deficiencia en la percepción del color causada por la ausencia o disfunción de uno o más tipos de conos en la retina. Los conos son las células fotorreceptoras responsables de detectar longitudes de onda específicas de luz. La forma más común afecta a la distinción entre rojo y verde.',
|
|
15
|
+
},
|
|
16
|
+
{
|
|
17
|
+
question: '¿Cuántas personas son daltónicas?',
|
|
18
|
+
answer:
|
|
19
|
+
'Aproximadamente un 8% de los hombres y un 0,5% de las mujeres de origen europeo presentan algún tipo de deficiencia en la visión del color. En términos globales, esto afecta a unos 300 millones de personas en todo el mundo.',
|
|
20
|
+
},
|
|
21
|
+
{
|
|
22
|
+
question: '¿Cuál es la diferencia entre protanopia y deuteranopia?',
|
|
23
|
+
answer:
|
|
24
|
+
'La protanopia implica la ausencia completa de conos L (sensibles al rojo), por lo que los colores rojos aparecen oscuros o negros. La deuteranopia implica la ausencia de conos M (sensibles al verde), causando que rojos y verdes sean indistinguibles aunque no aparezcan necesariamente oscuros.',
|
|
25
|
+
},
|
|
26
|
+
{
|
|
27
|
+
question: '¿Existe cura para el daltonismo?',
|
|
28
|
+
answer:
|
|
29
|
+
'No existe cura médica establecida. Sin embargo, existen gafas y lentes de contacto con filtros especiales que pueden ayudar a algunas personas a distinguir mejor ciertos colores. Las aplicaciones digitales y el diseño accesible son las mejores herramientas de apoyo actualmente disponibles.',
|
|
30
|
+
},
|
|
31
|
+
];
|
|
32
|
+
|
|
33
|
+
const howToData = [
|
|
34
|
+
{
|
|
35
|
+
name: 'Selecciona el tipo de daltonismo',
|
|
36
|
+
text: 'Haz clic en uno de los botones de tipo: Normal, Protanopia, Deuteranopia, Tritanopia, Protanomalía, Deuteranomalía o Acromatopsia.',
|
|
37
|
+
},
|
|
38
|
+
{
|
|
39
|
+
name: 'Observa la muestra de colores',
|
|
40
|
+
text: 'La herramienta muestra automáticamente una paleta de colores de referencia junto a la simulación del tipo seleccionado.',
|
|
41
|
+
},
|
|
42
|
+
{
|
|
43
|
+
name: 'Sube tu propia imagen',
|
|
44
|
+
text: 'Haz clic en "Subir imagen" o arrastra un archivo de imagen para simular cómo la percibirían personas con cada tipo de daltonismo.',
|
|
45
|
+
},
|
|
46
|
+
{
|
|
47
|
+
name: 'Compara original y simulado',
|
|
48
|
+
text: 'La vista dividida muestra la imagen original a la izquierda y la simulación a la derecha para una comparación directa.',
|
|
49
|
+
},
|
|
50
|
+
];
|
|
51
|
+
|
|
52
|
+
const faqSchema: WithContext<FAQPage> = {
|
|
53
|
+
'@context': 'https://schema.org',
|
|
54
|
+
'@type': 'FAQPage',
|
|
55
|
+
mainEntity: faqData.map((item) => ({
|
|
56
|
+
'@type': 'Question',
|
|
57
|
+
name: item.question,
|
|
58
|
+
acceptedAnswer: { '@type': 'Answer', text: item.answer },
|
|
59
|
+
})),
|
|
60
|
+
};
|
|
61
|
+
|
|
62
|
+
const howToSchema: WithContext<HowToThing> = {
|
|
63
|
+
'@context': 'https://schema.org',
|
|
64
|
+
'@type': 'HowTo',
|
|
65
|
+
name: title,
|
|
66
|
+
description,
|
|
67
|
+
step: howToData.map((step, i) => ({
|
|
68
|
+
'@type': 'HowToStep',
|
|
69
|
+
position: i + 1,
|
|
70
|
+
name: step.name,
|
|
71
|
+
text: step.text,
|
|
72
|
+
})),
|
|
73
|
+
};
|
|
74
|
+
|
|
75
|
+
const appSchema: WithContext<SoftwareApplication> = {
|
|
76
|
+
'@context': 'https://schema.org',
|
|
77
|
+
'@type': 'SoftwareApplication',
|
|
78
|
+
name: title,
|
|
79
|
+
description,
|
|
80
|
+
applicationCategory: 'HealthApplication',
|
|
81
|
+
operatingSystem: 'Web',
|
|
82
|
+
offers: { '@type': 'Offer', price: '0', priceCurrency: 'EUR' },
|
|
83
|
+
};
|
|
84
|
+
|
|
85
|
+
export const content: ToolLocaleContent<DaltonismSimulatorUI> = {
|
|
86
|
+
slug,
|
|
87
|
+
title,
|
|
88
|
+
description,
|
|
89
|
+
faqTitle: 'Preguntas frecuentes sobre el daltonismo',
|
|
90
|
+
faq: faqData,
|
|
91
|
+
bibliographyTitle: 'Referencias científicas',
|
|
92
|
+
bibliography: [
|
|
93
|
+
{
|
|
94
|
+
name: 'Machado GM, Oliveira MM, Fernandes LAF (2009). A Physiologically-based Model for Simulation of Color Vision Deficiency',
|
|
95
|
+
url: 'https://doi.org/10.1109/TVCG.2009.113',
|
|
96
|
+
},
|
|
97
|
+
{
|
|
98
|
+
name: 'Brettel H, Vienot F, Mollon JD (1997). Computerized simulation of color appearance for dichromats',
|
|
99
|
+
url: 'https://doi.org/10.1364/JOSAA.14.002647',
|
|
100
|
+
},
|
|
101
|
+
{
|
|
102
|
+
name: 'Color Blind Awareness — Estadísticas mundiales sobre deficiencia en la visión del color',
|
|
103
|
+
url: 'https://www.colourblindawareness.org/colour-blindness/',
|
|
104
|
+
},
|
|
105
|
+
{
|
|
106
|
+
name: 'WCAG 2.1 — Criterio de éxito 1.4.3: Contraste (mínimo)',
|
|
107
|
+
url: 'https://www.w3.org/WAI/WCAG21/Understanding/contrast-minimum.html',
|
|
108
|
+
},
|
|
109
|
+
],
|
|
110
|
+
howTo: howToData,
|
|
111
|
+
schemas: [faqSchema, howToSchema, appSchema],
|
|
112
|
+
ui: {
|
|
113
|
+
labelOriginal: 'Original',
|
|
114
|
+
labelSimulated: 'Simulado',
|
|
115
|
+
btnUpload: 'Subir imagen',
|
|
116
|
+
orDrag: 'o arrastra aquí',
|
|
117
|
+
typeNormal: 'Normal',
|
|
118
|
+
typeProtanopia: 'Protanopia',
|
|
119
|
+
typeDeuteranopia: 'Deuteranopia',
|
|
120
|
+
typeTritanopia: 'Tritanopia',
|
|
121
|
+
typeProtanomaly: 'Protanomalía',
|
|
122
|
+
typeDeuteranomaly: 'Deuteranomalía',
|
|
123
|
+
typeAchromatopsia: 'Acromatopsia',
|
|
124
|
+
descNormal: 'Visión normal del color. Percepción completa del espectro visible.',
|
|
125
|
+
descProtanopia: 'Ausencia de conos L (rojos). Los tonos rojos aparecen oscuros o negros.',
|
|
126
|
+
descDeuteranopia: 'Ausencia de conos M (verdes). Rojos y verdes son indistinguibles.',
|
|
127
|
+
descTritanopia: 'Ausencia de conos S (azules). Los azules aparecen verdosos o rosados.',
|
|
128
|
+
descProtanomaly: 'Conos L deficientes. Los rojos están menos saturados y son más difíciles de distinguir.',
|
|
129
|
+
descDeuteranomaly: 'Conos M deficientes. El tipo más común, afecta a ~6% de los hombres.',
|
|
130
|
+
descAchromatopsia: 'Ausencia total de percepción del color. Solo se perciben tonos de gris.',
|
|
131
|
+
},
|
|
132
|
+
seo: [
|
|
133
|
+
{
|
|
134
|
+
type: 'summary',
|
|
135
|
+
title: 'Simulador de Daltonismo Online',
|
|
136
|
+
items: [
|
|
137
|
+
'<strong>7 tipos simulados</strong>: Normal, Protanopia, Deuteranopia, Tritanopia, Protanomalía, Deuteranomalía y Acromatopsia.',
|
|
138
|
+
'<strong>Imagen personalizada</strong>: Sube tu propia foto o usa la paleta de colores de muestra.',
|
|
139
|
+
'<strong>Comparativa visual</strong>: Vista dividida original vs. simulada en tiempo real.',
|
|
140
|
+
'<strong>Sin datos enviados</strong>: Todo el procesamiento ocurre en tu navegador, sin servidores.',
|
|
141
|
+
],
|
|
142
|
+
},
|
|
143
|
+
{ type: 'title', text: '¿Qué es el daltonismo y cómo afecta la visión?', level: 2 },
|
|
144
|
+
{
|
|
145
|
+
type: 'paragraph',
|
|
146
|
+
html: 'El <strong>daltonismo</strong>, también llamado <strong>deficiencia en la visión del color</strong> o <strong>discromatopsia</strong>, es una condición que afecta la capacidad de percibir ciertos colores de forma correcta. Fue descrita por primera vez por el químico inglés <strong>John Dalton</strong> en 1798, quien observó que él mismo y su hermano no podían distinguir ciertos colores, especialmente rojos y verdes.',
|
|
147
|
+
},
|
|
148
|
+
{
|
|
149
|
+
type: 'paragraph',
|
|
150
|
+
html: 'La condición se produce por alteraciones en los <strong>conos de la retina</strong>, las células fotorreceptoras responsables de captar diferentes longitudes de onda de luz. El ojo humano tiene tres tipos de conos: conos L (sensibles al rojo, ~570 nm), conos M (sensibles al verde, ~530 nm) y conos S (sensibles al azul, ~420 nm). Cuando uno o más tipos están ausentes o funcionan de forma deficiente, la percepción del color se ve alterada.',
|
|
151
|
+
},
|
|
152
|
+
{ type: 'title', text: 'Los 7 tipos de deficiencia en la visión del color', level: 2 },
|
|
153
|
+
{
|
|
154
|
+
type: 'table',
|
|
155
|
+
headers: ['Tipo', 'Cono afectado', 'Prevalencia (hombres)', 'Efecto principal'],
|
|
156
|
+
rows: [
|
|
157
|
+
['Protanopia', 'L (rojo) ausente', '1,01%', 'Rojos oscurecidos, confusión rojo-verde'],
|
|
158
|
+
['Protanomalía', 'L (rojo) deficiente', '1,08%', 'Rojos menos saturados'],
|
|
159
|
+
['Deuteranopia', 'M (verde) ausente', '1,27%', 'Confusión rojo-verde sin oscurecimiento'],
|
|
160
|
+
['Deuteranomalía', 'M (verde) deficiente', '4,63%', 'Tipo más común, verdes alterados'],
|
|
161
|
+
['Tritanopia', 'S (azul) ausente', '<0,01%', 'Confusión azul-verde y amarillo-rojo'],
|
|
162
|
+
['Tritanomalía', 'S (azul) deficiente', '<0,01%', 'Azules y amarillos alterados'],
|
|
163
|
+
['Acromatopsia', 'Todos los conos', '0,003%', 'Solo percepción en escala de grises'],
|
|
164
|
+
],
|
|
165
|
+
},
|
|
166
|
+
{ type: 'title', text: 'Cómo funciona la simulación de daltonismo', level: 2 },
|
|
167
|
+
{
|
|
168
|
+
type: 'paragraph',
|
|
169
|
+
html: 'Este simulador aplica <strong>matrices de transformación de color</strong> sobre los píxeles de la imagen. Cada píxel tiene valores RGB (rojo, verde, azul) que se transforman matemáticamente para simular cómo los percibiría una persona con cada tipo de deficiencia. Las matrices utilizadas están basadas en investigaciones de Machado, Oliveira y Fernandes (2009) y el modelo de Brettel, Viénot y Mollon (1997), ampliamente validados en la comunidad científica.',
|
|
170
|
+
},
|
|
171
|
+
{
|
|
172
|
+
type: 'paragraph',
|
|
173
|
+
html: 'El procesamiento se realiza <strong>completamente en tu navegador</strong> mediante el API Canvas de HTML5. Ninguna imagen es enviada a ningún servidor. El algoritmo itera por cada píxel de la imagen, aplica la matriz correspondiente al tipo de daltonismo seleccionado, y renderiza el resultado en el canvas de simulación.',
|
|
174
|
+
},
|
|
175
|
+
{ type: 'title', text: 'El daltonismo y el diseño accesible', level: 2 },
|
|
176
|
+
{
|
|
177
|
+
type: 'list',
|
|
178
|
+
items: [
|
|
179
|
+
'<strong>No uses solo el color para transmitir información:</strong> Añade iconos, patrones o texto explicativo junto a cualquier código de color.',
|
|
180
|
+
'<strong>Asegura contraste suficiente:</strong> La WCAG 2.1 exige una relación de contraste mínima de 4.5:1 para texto normal y 3:1 para texto grande.',
|
|
181
|
+
'<strong>Evita combinaciones rojo-verde:</strong> Son las más problemáticas para la mayoría de las personas con daltonismo. Opta por azul-naranja o azul-rojo.',
|
|
182
|
+
'<strong>Usa herramientas de simulación en tu flujo de trabajo:</strong> Integra simuladores de daltonismo en tus revisiones de diseño para detectar problemas antes de publicar.',
|
|
183
|
+
'<strong>Prueba con gráficas y mapas:</strong> Estos elementos visuales son especialmente propensos a problemas de accesibilidad por su dependencia del color.',
|
|
184
|
+
],
|
|
185
|
+
},
|
|
186
|
+
{
|
|
187
|
+
type: 'tip',
|
|
188
|
+
title: 'Herramienta para diseñadores y desarrolladores',
|
|
189
|
+
html: 'Este simulador es especialmente útil para <strong>comprobar la accesibilidad</strong> de diseños, capturas de pantalla de interfaces, gráficas de datos o materiales educativos. Sube tu diseño y comprueba cómo lo perciben usuarios con protanopia o deuteranopia antes de publicarlo.',
|
|
190
|
+
},
|
|
191
|
+
{ type: 'title', text: 'John Dalton: el primer científico en describir el daltonismo', level: 2 },
|
|
192
|
+
{
|
|
193
|
+
type: 'paragraph',
|
|
194
|
+
html: 'En 1798, el científico inglés <strong>John Dalton</strong> publicó <em>"Extraordinary Facts relating to the Vision of Colours"</em>, el primer estudio científico sobre la deficiencia en la visión del color. Dalton notó que él y su hermano tenían dificultades para distinguir ciertos colores, especialmente el rojo y el verde. Creía que su humor vítreo tenía un tinte azulado que filtraba ciertas longitudes de onda. Aunque estaba equivocado sobre la causa, su descripción clínica fue tan detallada y precisa que la condición lleva su nombre hasta hoy.',
|
|
195
|
+
},
|
|
196
|
+
{
|
|
197
|
+
type: 'proscons',
|
|
198
|
+
items: [
|
|
199
|
+
{
|
|
200
|
+
pro: 'Herramienta gratuita y sin registro: acceso instantáneo sin cuentas ni datos personales.',
|
|
201
|
+
con: 'La simulación es una aproximación matemática, no reproduce exactamente la experiencia subjetiva del daltonismo.',
|
|
202
|
+
},
|
|
203
|
+
{
|
|
204
|
+
pro: 'Procesamiento local: tus imágenes no salen del navegador, garantizando privacidad total.',
|
|
205
|
+
con: 'Imágenes muy grandes pueden tardar unos segundos en procesarse según el dispositivo.',
|
|
206
|
+
},
|
|
207
|
+
{
|
|
208
|
+
pro: 'Cubre los 7 tipos principales de deficiencia cromática, incluyendo la acromatopsia total.',
|
|
209
|
+
con: 'No simula condiciones adquiridas por enfermedades (como glaucoma o cataratas) que también afectan la visión del color.',
|
|
210
|
+
},
|
|
211
|
+
{
|
|
212
|
+
pro: 'Útil para diseñadores, educadores y cualquier persona que quiera entender la accesibilidad visual.',
|
|
213
|
+
con: 'No sustituye una evaluación oftalmológica profesional con tests de Ishihara u otros instrumentos clínicos.',
|
|
214
|
+
},
|
|
215
|
+
],
|
|
216
|
+
},
|
|
217
|
+
],
|
|
218
|
+
};
|
|
@@ -0,0 +1,168 @@
|
|
|
1
|
+
import type { WithContext, SoftwareApplication, FAQPage, HowToThing } from 'schema-dts';
|
|
2
|
+
import type { ToolLocaleContent } from '../../../types';
|
|
3
|
+
import type { DaltonismSimulatorUI } from '../ui';
|
|
4
|
+
|
|
5
|
+
const slug = 'simulateur-daltonisme';
|
|
6
|
+
const title = 'Simulateur de Daltonisme : Visualiser la Déficience de la Vision des Couleurs';
|
|
7
|
+
const description =
|
|
8
|
+
'Simulez la perception des couleurs des personnes daltonniennes. Visualisez protanopie, deuteranopie, tritanopie et plus encore avec votre propre image ou la palette incluse.';
|
|
9
|
+
|
|
10
|
+
const faqData = [
|
|
11
|
+
{
|
|
12
|
+
question: "Qu'est-ce que le daltonisme?",
|
|
13
|
+
answer:
|
|
14
|
+
"Le daltonisme est une déficience de la perception des couleurs causée par l'absence ou le dysfonctionnement d'un ou plusieurs types de cellules coniques dans la rétine. Les cônes sont les cellules photoréceptrices responsables de la détection de longueurs d'onde spécifiques de lumière. La forme la plus courante affecte la distinction entre le rouge et le vert.",
|
|
15
|
+
},
|
|
16
|
+
{
|
|
17
|
+
question: 'Combien de personnes sont daltonniennes?',
|
|
18
|
+
answer:
|
|
19
|
+
"Environ 8% des hommes et 0,5% des femmes d'origine européenne présentent une forme de déficience de la vision des couleurs. Mondialement, cela affecte environ 300 millions de personnes.",
|
|
20
|
+
},
|
|
21
|
+
{
|
|
22
|
+
question: "Quelle est la différence entre protanopie et deuteranopie?",
|
|
23
|
+
answer:
|
|
24
|
+
"La protanopie implique l'absence complète de cônes L (sensibles au rouge), donc les tons rouges apparaissent sombres ou noirs. La deuteranopie implique l'absence de cônes M (sensibles au vert), causant la confusion entre rouges et verts sans nécessairement les assombrir.",
|
|
25
|
+
},
|
|
26
|
+
{
|
|
27
|
+
question: 'Existe-t-il un remède contre le daltonisme?',
|
|
28
|
+
answer:
|
|
29
|
+
"Il n'existe pas de remède médical établi. Cependant, des lunettes et lentilles de contact avec des filtres spéciaux peuvent aider certaines personnes à mieux distinguer certaines couleurs. Les applications numériques et le design accessible sont les meilleurs outils de soutien actuellement disponibles.",
|
|
30
|
+
},
|
|
31
|
+
];
|
|
32
|
+
|
|
33
|
+
const howToData = [
|
|
34
|
+
{
|
|
35
|
+
name: 'Sélectionnez le type de daltonisme',
|
|
36
|
+
text: "Cliquez sur l'un des boutons de type: Normal, Protanopie, Deuteranopie, Tritanopie, Protanomalie, Deuteranomalie ou Achromatopsie.",
|
|
37
|
+
},
|
|
38
|
+
{
|
|
39
|
+
name: 'Observez la palette de couleurs',
|
|
40
|
+
text: "L'outil affiche automatiquement une palette de couleurs de référence avec la simulation du type sélectionné.",
|
|
41
|
+
},
|
|
42
|
+
{
|
|
43
|
+
name: 'Téléversez votre propre image',
|
|
44
|
+
text: 'Cliquez sur "Téléverser une image" ou faites glisser un fichier image pour simuler comment les personnes avec chaque type de daltonisme la percevraient.',
|
|
45
|
+
},
|
|
46
|
+
{
|
|
47
|
+
name: 'Comparez original et simulé',
|
|
48
|
+
text: "La vue divisée montre l'image originale à gauche et la simulation à droite pour une comparaison directe.",
|
|
49
|
+
},
|
|
50
|
+
];
|
|
51
|
+
|
|
52
|
+
const faqSchema: WithContext<FAQPage> = {
|
|
53
|
+
'@context': 'https://schema.org',
|
|
54
|
+
'@type': 'FAQPage',
|
|
55
|
+
mainEntity: faqData.map((item) => ({
|
|
56
|
+
'@type': 'Question',
|
|
57
|
+
name: item.question,
|
|
58
|
+
acceptedAnswer: { '@type': 'Answer', text: item.answer },
|
|
59
|
+
})),
|
|
60
|
+
};
|
|
61
|
+
|
|
62
|
+
const howToSchema: WithContext<HowToThing> = {
|
|
63
|
+
'@context': 'https://schema.org',
|
|
64
|
+
'@type': 'HowTo',
|
|
65
|
+
name: title,
|
|
66
|
+
description,
|
|
67
|
+
step: howToData.map((step, i) => ({
|
|
68
|
+
'@type': 'HowToStep',
|
|
69
|
+
position: i + 1,
|
|
70
|
+
name: step.name,
|
|
71
|
+
text: step.text,
|
|
72
|
+
})),
|
|
73
|
+
};
|
|
74
|
+
|
|
75
|
+
const appSchema: WithContext<SoftwareApplication> = {
|
|
76
|
+
'@context': 'https://schema.org',
|
|
77
|
+
'@type': 'SoftwareApplication',
|
|
78
|
+
name: title,
|
|
79
|
+
description,
|
|
80
|
+
applicationCategory: 'HealthApplication',
|
|
81
|
+
operatingSystem: 'Web',
|
|
82
|
+
offers: { '@type': 'Offer', price: '0', priceCurrency: 'EUR' },
|
|
83
|
+
};
|
|
84
|
+
|
|
85
|
+
export const content: ToolLocaleContent<DaltonismSimulatorUI> = {
|
|
86
|
+
slug,
|
|
87
|
+
title,
|
|
88
|
+
description,
|
|
89
|
+
faqTitle: 'Questions fréquentes sur le daltonisme',
|
|
90
|
+
faq: faqData,
|
|
91
|
+
bibliographyTitle: 'Références scientifiques',
|
|
92
|
+
bibliography: [
|
|
93
|
+
{
|
|
94
|
+
name: 'Machado GM, Oliveira MM, Fernandes LAF (2009). A Physiologically-based Model for Simulation of Color Vision Deficiency',
|
|
95
|
+
url: 'https://doi.org/10.1109/TVCG.2009.113',
|
|
96
|
+
},
|
|
97
|
+
{
|
|
98
|
+
name: 'Brettel H, Vienot F, Mollon JD (1997). Computerized simulation of color appearance for dichromats',
|
|
99
|
+
url: 'https://doi.org/10.1364/JOSAA.14.002647',
|
|
100
|
+
},
|
|
101
|
+
{
|
|
102
|
+
name: 'Color Blind Awareness — Statistiques mondiales sur la déficience de la vision des couleurs',
|
|
103
|
+
url: 'https://www.colourblindawareness.org/colour-blindness/',
|
|
104
|
+
},
|
|
105
|
+
{
|
|
106
|
+
name: 'WCAG 2.1 — Critère de succès 1.4.3 : Contraste (minimum)',
|
|
107
|
+
url: 'https://www.w3.org/WAI/WCAG21/Understanding/contrast-minimum.html',
|
|
108
|
+
},
|
|
109
|
+
],
|
|
110
|
+
howTo: howToData,
|
|
111
|
+
schemas: [faqSchema, howToSchema, appSchema],
|
|
112
|
+
ui: {
|
|
113
|
+
labelOriginal: 'Original',
|
|
114
|
+
labelSimulated: 'Simulé',
|
|
115
|
+
btnUpload: 'Téléverser une image',
|
|
116
|
+
orDrag: 'ou faites glisser ici',
|
|
117
|
+
typeNormal: 'Normal',
|
|
118
|
+
typeProtanopia: 'Protanopie',
|
|
119
|
+
typeDeuteranopia: 'Deuteranopie',
|
|
120
|
+
typeTritanopia: 'Tritanopie',
|
|
121
|
+
typeProtanomaly: 'Protanomalie',
|
|
122
|
+
typeDeuteranomaly: 'Deuteranomalie',
|
|
123
|
+
typeAchromatopsia: 'Achromatopsie',
|
|
124
|
+
descNormal: 'Vision normale des couleurs. Perception complète du spectre visible.',
|
|
125
|
+
descProtanopia: 'Cônes L (rouges) absents. Les tons rouges apparaissent sombres ou noirs.',
|
|
126
|
+
descDeuteranopia: 'Cônes M (verts) absents. Les rouges et verts sont indiscernables.',
|
|
127
|
+
descTritanopia: 'Cônes S (bleus) absents. Les bleus apparaissent verdâtres ou rosés.',
|
|
128
|
+
descProtanomaly: 'Cônes L déficients. Les rouges sont moins saturés et plus difficiles à distinguer.',
|
|
129
|
+
descDeuteranomaly: 'Cônes M déficients. Type le plus courant, affecte environ 6% des hommes.',
|
|
130
|
+
descAchromatopsia: 'Absence totale de perception des couleurs. Seulement des nuances de gris.',
|
|
131
|
+
},
|
|
132
|
+
seo: [
|
|
133
|
+
{
|
|
134
|
+
type: 'summary',
|
|
135
|
+
title: 'Simulateur de Daltonisme en Ligne',
|
|
136
|
+
items: [
|
|
137
|
+
'<strong>7 types simulés</strong>: Normal, Protanopie, Deuteranopie, Tritanopie, Protanomalie, Deuteranomalie et Achromatopsie.',
|
|
138
|
+
'<strong>Image personnalisée</strong>: Téléversez votre propre photo ou utilisez la palette de couleurs incluse.',
|
|
139
|
+
'<strong>Vue divisée</strong>: Original vs. simulé côte à côte en temps réel.',
|
|
140
|
+
'<strong>Aucune donnée envoyée</strong>: Tout le traitement se fait dans votre navigateur, sans serveurs.',
|
|
141
|
+
],
|
|
142
|
+
},
|
|
143
|
+
{ type: 'title', text: "Qu'est-ce que le daltonisme?", level: 2 },
|
|
144
|
+
{
|
|
145
|
+
type: 'paragraph',
|
|
146
|
+
html: "Le <strong>daltonisme</strong>, également appelé <strong>déficience de la vision des couleurs</strong>, est une condition qui affecte la capacité à percevoir correctement certaines couleurs. Il a été décrit pour la première fois par le chimiste anglais <strong>John Dalton</strong> en 1798, qui a observé que lui et son frère ne pouvaient pas distinguer certaines couleurs, notamment les rouges et les verts.",
|
|
147
|
+
},
|
|
148
|
+
{ type: 'title', text: 'Les 7 types de déficience de la vision des couleurs', level: 2 },
|
|
149
|
+
{
|
|
150
|
+
type: 'table',
|
|
151
|
+
headers: ['Type', 'Cône affecté', 'Prévalence (hommes)', 'Effet principal'],
|
|
152
|
+
rows: [
|
|
153
|
+
['Protanopie', 'L (rouge) absent', '1,01%', 'Rouges assombris, confusion rouge-vert'],
|
|
154
|
+
['Protanomalie', 'L (rouge) déficient', '1,08%', 'Rouges moins saturés'],
|
|
155
|
+
['Deuteranopie', 'M (vert) absent', '1,27%', 'Confusion rouge-vert sans assombrissement'],
|
|
156
|
+
['Deuteranomalie', 'M (vert) déficient', '4,63%', 'Type le plus courant, verts altérés'],
|
|
157
|
+
['Tritanopie', 'S (bleu) absent', '<0,01%', 'Confusion bleu-vert et jaune-rouge'],
|
|
158
|
+
['Tritanomalie', 'S (bleu) déficient', '<0,01%', 'Bleus et jaunes altérés'],
|
|
159
|
+
['Achromatopsie', 'Tous les cônes', '0,003%', 'Perception en niveaux de gris uniquement'],
|
|
160
|
+
],
|
|
161
|
+
},
|
|
162
|
+
{
|
|
163
|
+
type: 'tip',
|
|
164
|
+
title: 'Outil pour designers et développeurs',
|
|
165
|
+
html: "Ce simulateur est particulièrement utile pour <strong>vérifier l'accessibilité</strong> des designs, captures d'écran d'interfaces, graphiques de données ou matériaux éducatifs. Téléversez votre design et vérifiez comment les utilisateurs atteints de protanopie ou de deuteranopie le perçoivent avant de le publier.",
|
|
166
|
+
},
|
|
167
|
+
],
|
|
168
|
+
};
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import type { HealthToolEntry, ToolDefinition } from '../../types';
|
|
2
|
+
import DaltonismSimulatorComponent from './component.astro';
|
|
3
|
+
import DaltonismSimulatorSEO from './seo.astro';
|
|
4
|
+
import DaltonismSimulatorBibliography from './bibliography.astro';
|
|
5
|
+
import type { DaltonismSimulatorUI } from './ui';
|
|
6
|
+
|
|
7
|
+
export const daltonismSimulator: HealthToolEntry<DaltonismSimulatorUI> = {
|
|
8
|
+
id: 'daltonismSimulator',
|
|
9
|
+
icons: {
|
|
10
|
+
bg: 'mdi:eye',
|
|
11
|
+
fg: 'mdi:palette',
|
|
12
|
+
},
|
|
13
|
+
i18n: {
|
|
14
|
+
es: () => import('./i18n/es').then((m) => m.content),
|
|
15
|
+
en: () => import('./i18n/en').then((m) => m.content),
|
|
16
|
+
fr: () => import('./i18n/fr').then((m) => m.content),
|
|
17
|
+
},
|
|
18
|
+
};
|
|
19
|
+
|
|
20
|
+
export { DaltonismSimulatorComponent, DaltonismSimulatorSEO, DaltonismSimulatorBibliography };
|
|
21
|
+
|
|
22
|
+
export const DALTONISM_SIMULATOR_TOOL: ToolDefinition = {
|
|
23
|
+
entry: daltonismSimulator,
|
|
24
|
+
Component: DaltonismSimulatorComponent,
|
|
25
|
+
SEOComponent: DaltonismSimulatorSEO,
|
|
26
|
+
BibliographyComponent: DaltonismSimulatorBibliography,
|
|
27
|
+
};
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
---
|
|
2
|
+
import { SEORenderer } from '@jjlmoya/utils-shared';
|
|
3
|
+
import { daltonismSimulator } from './index';
|
|
4
|
+
import type { KnownLocale } from '../../types';
|
|
5
|
+
|
|
6
|
+
interface Props {
|
|
7
|
+
locale?: KnownLocale;
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
const { locale = 'es' } = Astro.props;
|
|
11
|
+
const content = await daltonismSimulator.i18n[locale]?.();
|
|
12
|
+
---
|
|
13
|
+
|
|
14
|
+
{content && <SEORenderer content={{ locale, sections: content.seo }} />}
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
export interface DaltonismSimulatorUI extends Record<string, string> {
|
|
2
|
+
labelOriginal: string;
|
|
3
|
+
labelSimulated: string;
|
|
4
|
+
btnUpload: string;
|
|
5
|
+
orDrag: string;
|
|
6
|
+
typeNormal: string;
|
|
7
|
+
typeProtanopia: string;
|
|
8
|
+
typeDeuteranopia: string;
|
|
9
|
+
typeTritanopia: string;
|
|
10
|
+
typeProtanomaly: string;
|
|
11
|
+
typeDeuteranomaly: string;
|
|
12
|
+
typeAchromatopsia: string;
|
|
13
|
+
descNormal: string;
|
|
14
|
+
descProtanopia: string;
|
|
15
|
+
descDeuteranopia: string;
|
|
16
|
+
descTritanopia: string;
|
|
17
|
+
descProtanomaly: string;
|
|
18
|
+
descDeuteranomaly: string;
|
|
19
|
+
descAchromatopsia: string;
|
|
20
|
+
}
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
---
|
|
2
|
+
import { Bibliography } from '@jjlmoya/utils-shared';
|
|
3
|
+
import { digestionStopwatch } from './index';
|
|
4
|
+
import type { KnownLocale } from '../../types';
|
|
5
|
+
|
|
6
|
+
interface Props {
|
|
7
|
+
locale?: KnownLocale;
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
const { locale = 'es' } = Astro.props;
|
|
11
|
+
const content = await digestionStopwatch.i18n[locale]?.();
|
|
12
|
+
---
|
|
13
|
+
|
|
14
|
+
{content && <Bibliography items={content.bibliography} title={content.bibliographyTitle} />}
|