Un grand merci à Juba Tala pour ce travail remarquable. Ce manuel de référence de la grammaire amazighe est une ressource précieuse, claire et rigoureuse — un vrai service rendu à notre langue et à celles et ceux qui souhaitent l'apprendre ou l'approfondir.
Pour le faire vivre et le rendre encore plus accessible, je me suis permis d'en réaliser une adaptation sous forme de site web interactif (navigation par chapitres, alphabet, Tifinagh, quiz…). Tout le contenu s'inspire directement de votre manuel, et vous y êtes bien sûr cité comme source :
👉 https://anzart.github.io/tajerrumt-tamazight/
Le projet est ouvert : toute correction, suggestion ou contribution pour l'améliorer est la bienvenue. J'espère que cette adaptation vous plaira et pourra servir au plus grand nombre.
Azul. Ayyuz ! Le travail accompli est remarquable : code propre, design soigné, interactivité bien pensée. Je vais vous communiquer ultérieurement quelques suggestions d'amélioration qui le rendront encore plus robuste, accessible et agréable à utiliser.
1. Accessibilité - rendre l’app utilisable par tous. * Tabs (onglets) : ajouter les rôles ARIA * Alphabet interactif : annoncer le changement * Glossaire : annoncer les résultats * Navigation au clavier : Vérifiez que toutes les zones interactives sont atteignables avec la touche Tab et activables avec Espace / Entrée (c’est déjà le cas pour les boutons).
2. Performance - chargement et fluidité * Polices Google Fonts : alléger le chargement. Vous chargez quatre polices avec plusieurs variantes (Bricolage Grotesque, Newsreader, JetBrains Mono, Noto Sans Tifinagh). Cela représente un poids non négligeable. * Arrière‑plan étoilé : réduire les calculs CSS * Minification du CSS / JS. Bien que l’app soit mono-fichier, vous pouvez minifier le CSS et le JS inline (en retirant les commentaires, espaces, etc.) pour diminuer le poids du fichier * Service Worker (offline). Pour une utilisation hors ligne, ajoutez un Service Worker qui met en cache la page et les polices.
3. Fonctionnalités - enrichir l’expérience * Convertisseur de nombres : étendre la plage actuellement limité à 999. . * Alphabet : ajouter la prononciation audio. Si vous disposez d’enregistrements, liez chaque lettre à un fichier audio. * Quiz : suivre les erreurs et proposer un rattrapage. Le score est affiché, mais on ne sait pas quelles questions ont été ratées. * Recherche plein texte. La recherche du glossaire est efficace. Pourquoi ne pas l’étendre à tout le contenu de la page ? * Export PDF / impression. Ajoutez un bouton « Imprimer » qui déclenche window print. * Mode sombre / clair. Vous avez déjà un thème sombre (c’est le design actuel). Proposez un basculement vers un thème clair en inversant les couleurs. * Le contenu est actuellement en français et en tamazight. Préparez le terrain pour une version en anglais ou en arabe, en externalisant les chaînes de caractères.
4. Code et maintenance - qualité et évolutivité * Modulariser le JavaScript. Le script est long (plus de 400 lignes). Séparez les responsabilités : alphabet, tabs, numbers, glossary, quiz, navigation. Cela facilitera les modifications futures et les tests. * Utiliser des écouteurs d’événements avec délégation. Au lieu d’attacher un click sur chaque tuile de l’alphabet, utilisez la délégation sur le conteneur alpha-grid (économie de mémoire et meilleure performance). * Gestion des erreurs. Ajoutez une validation pour les nombres négatifs.
* Noms de variables. Certaines variables sont en kabyle (ex. tamsertit), d’autres en français ou anglais. Pour faciliter la reprise, privilégiez l’anglais ou le français de manière cohérente dans le code (les noms de fonctions, variables, etc.). * Validation HTML / CSS. Passez le code dans le validateur W3C pour corriger les éventuelles erreurs (ex. attributs style non valides, balises fermées, etc.).
5. UI/UX - peaufiner l’expérience utilisateur * Indicateur de progression de lecture. Pour une meilleure lisibilité, vous pourriez ajouter un pourcentage ou une estimation du temps de lecture. * Menu latéral : indiquer la section active plus clairement. Sur mobile, le menu est masqué ; un indicateur visuel dans la topbar aiderait l’utilisateur à savoir où il se trouve. * Animation des révélations. Les éléments reveal apparaissent au défilement. C’est agréable, mais sur mobile, cela provoque des scintillements. * Lien « Commencer » (scroll-cue). La flèche qui invite à défiler est subtile. Ajoutez un aria-label="Défiler vers le contenu" pour l’accessibilité. Tableaux : sticky headers. Les tableaux sont larges et défilent horizontalement. Assurez-vous que le fond des th reste visible ; un fond plus opaque pourrait améliorer la lisibilité lors du défilement horizontal).
6. Sécurité * Politique de sécurité du contenu (CSP). Ajoutez une balise pour limiter les sources de scripts, styles, et polices.
Azul fell-awen,
RépondreSupprimerUn grand merci à Juba Tala pour ce travail remarquable. Ce manuel de référence de la grammaire amazighe est une ressource précieuse, claire et rigoureuse — un vrai service rendu à notre langue et à celles et ceux qui souhaitent l'apprendre ou
l'approfondir.
Pour le faire vivre et le rendre encore plus accessible, je me suis permis d'en réaliser une adaptation sous forme de site web interactif (navigation par chapitres, alphabet, Tifinagh, quiz…). Tout le contenu s'inspire directement de votre
manuel, et vous y êtes bien sûr cité comme source :
👉 https://anzart.github.io/tajerrumt-tamazight/
Le projet est ouvert : toute correction, suggestion ou contribution pour l'améliorer est la bienvenue. J'espère que cette adaptation vous plaira et pourra servir au plus grand nombre.
Tanemmirt tameqqrant pour votre travail. 🙏
Azul. Ayyuz ! Le travail accompli est remarquable : code propre, design soigné, interactivité bien pensée. Je vais vous communiquer ultérieurement quelques suggestions d'amélioration qui le rendront encore plus robuste, accessible et agréable à utiliser.
Supprimer1. Accessibilité - rendre l’app utilisable par tous.
Supprimer* Tabs (onglets) : ajouter les rôles ARIA
* Alphabet interactif : annoncer le changement
* Glossaire : annoncer les résultats
* Navigation au clavier : Vérifiez que toutes les zones interactives sont atteignables avec la touche Tab et activables avec Espace / Entrée (c’est déjà le cas pour les boutons).
2. Performance - chargement et fluidité
* Polices Google Fonts : alléger le chargement. Vous chargez quatre polices avec plusieurs variantes (Bricolage Grotesque, Newsreader, JetBrains Mono, Noto Sans Tifinagh). Cela représente un poids non négligeable.
* Arrière‑plan étoilé : réduire les calculs CSS
* Minification du CSS / JS. Bien que l’app soit mono-fichier, vous pouvez minifier le CSS et le JS inline (en retirant les commentaires, espaces, etc.) pour diminuer le poids du fichier
* Service Worker (offline). Pour une utilisation hors ligne, ajoutez un Service Worker qui met en cache la page et les polices.
3. Fonctionnalités - enrichir l’expérience
* Convertisseur de nombres : étendre la plage actuellement limité à 999. .
* Alphabet : ajouter la prononciation audio. Si vous disposez d’enregistrements, liez chaque lettre à un fichier audio.
* Quiz : suivre les erreurs et proposer un rattrapage. Le score est affiché, mais on ne sait pas quelles questions ont été ratées.
* Recherche plein texte. La recherche du glossaire est efficace. Pourquoi ne pas l’étendre à tout le contenu de la page ?
* Export PDF / impression. Ajoutez un bouton « Imprimer » qui déclenche window print.
* Mode sombre / clair. Vous avez déjà un thème sombre (c’est le design actuel). Proposez un basculement vers un thème clair en inversant les couleurs.
* Le contenu est actuellement en français et en tamazight. Préparez le terrain pour une version en anglais ou en arabe, en externalisant les chaînes de caractères.
4. Code et maintenance - qualité et évolutivité
* Modulariser le JavaScript. Le script est long (plus de 400 lignes). Séparez les responsabilités : alphabet, tabs, numbers, glossary, quiz, navigation. Cela facilitera les modifications futures et les tests.
* Utiliser des écouteurs d’événements avec délégation. Au lieu d’attacher un click sur chaque tuile de l’alphabet, utilisez la délégation sur le conteneur alpha-grid (économie de mémoire et meilleure performance).
* Gestion des erreurs. Ajoutez une validation pour les nombres négatifs.
* Noms de variables. Certaines variables sont en kabyle (ex. tamsertit), d’autres en français ou anglais. Pour faciliter la reprise, privilégiez l’anglais ou le français de manière cohérente dans le code (les noms de fonctions, variables, etc.).
* Validation HTML / CSS. Passez le code dans le validateur W3C pour corriger les éventuelles erreurs (ex. attributs style non valides, balises fermées, etc.).
5. UI/UX - peaufiner l’expérience utilisateur
* Indicateur de progression de lecture. Pour une meilleure lisibilité, vous pourriez ajouter un pourcentage ou une estimation du temps de lecture.
* Menu latéral : indiquer la section active plus clairement. Sur mobile, le menu est masqué ; un indicateur visuel dans la topbar aiderait l’utilisateur à savoir où il se trouve.
* Animation des révélations. Les éléments reveal apparaissent au défilement. C’est agréable, mais sur mobile, cela provoque des scintillements.
* Lien « Commencer » (scroll-cue). La flèche qui invite à défiler est subtile. Ajoutez un aria-label="Défiler vers le contenu" pour l’accessibilité.
Tableaux : sticky headers. Les tableaux sont larges et défilent horizontalement. Assurez-vous que le fond des th reste visible ; un fond plus opaque pourrait améliorer la lisibilité lors du défilement horizontal).
6. Sécurité
* Politique de sécurité du contenu (CSP). Ajoutez une balise pour limiter les sources de scripts, styles, et polices.