Présentation

Sass Swing est un framework CSS moderne et complet de conception de page internet, propre et le plus léger possible. Il utilise les dernières spécificités CSS et SCSS.

Son objectif est de permettre une expérience utilisateur unifiée avec un design cohérent et d'améliorer l'accessibilité et l'expérience utilisateur au maximum. Sass Swing utilise autant que possible les éléments sémantique HTML natifs tout en tenant compte des bonnes pratiques générales.

Une conception web, gracieuse, rapide simplement et facilement.

Sass Swing est totalement responsive et adaptatif. Il se base sur une conception de page en mobile-first. Il saura adapter automatiquement vos sites web quelque soit l'appareil de l'utilisateur et le niveau de zoom de l'affichage. Les meilleures pratiques de mise en page sont gérées afin que vous ayez à faire le moins de modifications possible pour la mise en page, afin d'accélérer le développement.

Pour une lecture la plus fluide possible, le rythme vertical entre les différents éléments constituant une page est automatique. La taille des polices, des images, ainsi que les marges internes et externes sont dynamiques et sauront s'adapter en toute circonstance.

Sass Swing utilise la méthodologie BEM pour le nommage des classes. À l'instar de nombreux framework CSS tel que Bootstrap, Tailwind ou autres, Sass Swing contient que très peu de classes utilitaires. Il est livré avec 2 thèmes cohérents : Light & Dark facilement modifiable, qui permettent de personnaliser l'affichage de nombreux éléments natifs comme les boutons, les liens, les formulaires, les tableaux ect...

Dans le but, de rester le plus léger possible, Sass Swing comprend des composants réactifs n'utilisant pas de scripts Javascript, tel que les barres de navigation, des éléments rétractable ect...

L'accessibilité numérique

L'accès pour tous à internet quel que soit le handicap d'une personne est indispensable. C'est primordial. Nous nous devons de fournir des pages lisibles pour accompagner ces personnes en situation de handicap et ne pas les exclure du monde digital. L'accessibilité constitue un enjeu social, politique et commercial fondamental pour garantir sans discrimination l'accès à l'information et aux services en ligne.

C'est pourquoi le framework Sass Swing se veut novateur, dans le sens où vous pouvez consacrer plus de temps à affiner l'accessibilité de vos pages. Sass Swing se focalise sur les bonnes pratiques d'écriture du code HTML en suivant la spécification WAI-ARIA. Vous retrouverez dans tous les exemples de code de cette documentation l'utilisation des attributs wai-aria lorsque cela s'avère nécessaire pour augmenter l'expérience utilisateur.

Pourquoi ne pas négliger l'accessibilité de son site web ?

1. Le nombre de personnes avec un handicap représente plus d' 1 millard de personnes, soit environ 10% de la population globale
2. L'accessibilité sur le web est exigée par la loi dans de nombreux pays
3. L'accessibilité est également un besoin pour les personnes âgées (que nous deviendrons tous) dont les capacités s'amenuisent avec l’âge.
4. L’accessibilité du web bénéficie également aux personnes sans handicap (utilisation d'un téléphone mobile, d'une montre connecté, une personne ayant une connexion internet lente...)
5. L’accessibilité représente un gros avantage pour les entreprises (amélioration et satisfaction de l'expérience utilisateur, amélioration de sa marque, augmentation de parts de marché...)

Des composants supplémentaires pour aller encore plus loin.

En complément, Sass Swing fournit des composants additionnels qui ne sont pas inclus dans la version de base par défaut. Vous aurez par exemple accès à un fil d'Ariane, un menu de pagination, des badges, des panneaux de notification, des classes d'animations ect...

Certains de ces composants utilisent une ou plusieurs classes Javascript pour assurer leur bon fonctionnement. Pour les utiliser vous devrez les importer, dans votre fichier SCSS ou importer le fichier CSS disponible en sus. Et bien sûr lier le fichier javascript fournit par Sass Swing

Des fonctionnalités Javascript, pratiques et inédites

Pour augmenter les expériences utilisateur et faciliter le développement d'applications modernes, Sass Swing propose quelques classes Javascript sous forme de module USM configurables dans votre code HTML au format JSON simplement et directement grâce à des propriétés spécifiques.

Afin d'ajouter de l'interactivité, ces scripts, vous permettront entre autres,dans les prochaines versions, de paginer, trier et filtrer des tableaux. De gérer des animations au scroll. D'afficher des notifications à l'utilisateur. De faire des "glisser/déposer" (drag & drop). D'étendre l'élément "Select" ect...

Des modèles de page, pour une conception accélérée.

Pour aller encore plus vite dans la réalisation de vos projets, Sass Swing vous propose plusieurs modèles de base répondant à diverses fonctionnalités.