Skip to content
FR EN

Handbook of Sustainable Design of Digital Services

MENU
← go back
Frontend    ODD#12     ODD#13    

Is a CSS alternative available for an animation ?

Recommendation 

user Experience

B People

B Planet

B Prosperity

Difficulty

**

Priority

High

Récurrence

OnUpdate

Tests

What animations could be replaced by a CSS alternative?

Precisions

The information transmitted to the user by the animations can also be managed by CSS mechanisms which are less heavy and therefore more resource efficient.

Use Case

Source code / CHROME: console

Additional elements

Operational issues related to the project

Posts

Rule for assessing the level of compliance of the criterion

Number of animations analyzed / Number of animations

Life cycle

Réalisation

20 other criteria related to the recommendation: Implement technical solutions with the lowest impact

Recommendation Essential

UI

Is a clean version available for prints ?

Recommendation

user Experience

Is the service suitable for different accessibility media formats ?

Recommendation

UI

Are the animations necessary, desired by the user ?

Recommendation

UI

Is the service developed in accordance with RGAA recommendations ?

Recommendation

UI

Are the fonts used not loaded only for a small number of objects ?

Recommendation

UI

If printing, is an ink saving font installed ?

Recommendation

UI

Do you limit the number of fonts loaded for the service ?

Advice

UI

Are you reducing the number of pictograms used in the service ?

Advice

UI

Is a video the only solution for the expected illustration ?

Recommendation

UI

Are videos or animations outside the active area automatically paused / stopped ?

Recommendation

UI

Is it really a user action that triggers the "play" ?

Advice

UI

Is the definition of the sound suitable ?

Advice

UI

Does the lazy load bring a gain (weight of the page, CPU resource) ?

Recommendation

UI

Is formatting in css preferred, to limit the use of images ?

Advice

UI

Are CSS sprites implemented to limit the flow of image fetching ?

Advice

UI

Are alternative image formats made available through srcset ?

Recommendation

UI

Do all images have a text alternative ?

Advice

UI

Is the definition of the image reduced and adapted to its objective (illustration, contractual, ...) ?

Recommendation

UI

Are image resizing processed upstream and statically (server side) ?

Recommendation

UI

Have the different image formats available been evaluated to select only the most effective ?