Conseil technique d'inté Web : en 2020 comment réalise-t-on ce type de footer (bord haut incliné) ?

Salut salut,

Je voulais vous demander un petit conseil technique sur la manière d’intégrer le footer ci-dessous avec les outils dont on dispose en 2020 (dessin de polygones ? bordures inclinées ? etc.).

Au début des années 2000, il me semble qu’on utilisait des images. Or ce n’est probablement pas la meilleure façon de faire et cette dernière a sans doute été remplacée depuis par au moins une technique plus adéquate.

Merci d’avance.

PS : le footer est en noir.

Il y a surement plus simple mais perso j’utiliserais en CSS la propriété clip-path

Plusieurs possibilités me viennent à l’esprit pour faire ce genre de choses :

• un SVG bien placé (d’autant plus si la ligne n’est pas droite comme ici, mais courbe) ;
• la propriété CSS clip-path ;
• un usage habile de pseudo-éléments correctement positionnés couplés avec la propriété CSS transform (en utilisant sa fonction rotate, par exemple).

Je confirme l’usage de clip-path, c’est plutôt simple à utiliser : https://codepen.io/chriscoyier/pen/MWjgMbO

Ok c’est bien ce que je pensais donc, dessin d’un polygone. Effectivement c’est pas mal du tout, rapide à utiliser, c’est fait ! merci bien

du coup j’ai quasiment fini d’intégrer mon site perso jsp si tu t’en rappelles je vais checker si ça se comporte correctement en responsive. J’ai utilisé bcp le grid layout donc il y a moyen que ça aille un petit peu plus vite que sans je pense. La dernière étape ce sera d’utiliser certaines fonctionnalités que Laravel met à notre disposition pour virer la redondance des components (layouts Laravel) etc. qui gèrent l’affichage des sections du design etc. (je m’y suis un peu mal pris dès le début donc je dois faire des réajustements / grosses modifs à ce niveau)

edit : en fait je vais plutôt faire l’inverse (commencer par améliorer l’utilisation que je fais des Laravel components etc. et finir par checker le responsive) (car j’ai peur que ça casse le responsive)