Utiliser l'espace 3D - Tutoriel vidéo Découvrir le Material Design | LinkedIn Learning, anciennement Lynda.com

<!DOCTYPE html> <html lang="fr"> <head> <meta name="pageKey" content="d_learning_course_video_guest">  <meta name="linkedin:pageTag" content="view_video"> <meta name="locale" content="fr_FR"> <meta id="config" data-app-version="2.0.2217" data-call-tree-id="AAYnm5uZGQANUHFrDd8pkw==" data-multiproduct-name="learning-guest-frontend" data-service-name="learning-guest-frontend" data-browser-id="8e262ca2-9e91-4329-84ba-8aacc702a33a" data-enable-page-view-heartbeat-tracking data-page-instance="urn:li:page:learning_course_video_guest;hq+Gh3bhS5uHMnPEcBi0Sg==" data-disable-jsbeacon-pagekey-suffix="false" data-member-id="0"> <link rel="canonical" href="https://fr.linkedin.com/learning/decouvrir-le-material-design/utiliser-l-espace-3d">     <link rel="manifest" href="/homepage-guest/manifest.json" crossorigin="use-credentials">  <script> function getDfd() {let yFn,nFn;const p=new Promise(function(y, n){yFn=y;nFn=n;});p.resolve=yFn;p.reject=nFn;return p;} window.lazyloader = getDfd(); window.tracking = getDfd(); window.impressionTracking = getDfd(); window.ingraphTracking = getDfd(); window.appDetection = getDfd(); window.pemTracking = getDfd(); </script>  <link rel="icon" href="https://static.licdn.com/aero-v1/sc/h/444zstxv7s91nepfm5et6ofge"> <title>Utiliser l'espace 3D - Tutoriel vidéo Découvrir le Material Design | LinkedIn Learning, anciennement Lynda.com</title> <meta name="robots" content="noarchive, max-image-preview:large"> <meta name="description" content="Gérez les ombres qui vont matérialiser les positions et les mouvements des éléments dans l'espace 3D."> <meta property="og:site_name" content="LinkedIn"> <meta name="twitter:site" content="@LI_Learning"> <meta name="twitter:card" content="summary"> <meta name="litmsProfileName" content="learning-guest-frontend"> <meta property="og:title" content="Utiliser l&#39;espace 3D - Tutoriel vidéo Découvrir le Material Design | LinkedIn Learning, anciennement Lynda.com"> <meta name="twitter:title" content="Utiliser l&#39;espace 3D - Tutoriel vidéo Découvrir le Material Design | LinkedIn Learning, anciennement Lynda.com"> <meta property="og:description" content="Gérez les ombres qui vont matérialiser les positions et les mouvements des éléments dans l'espace 3D."> <meta name="twitter:description" content="Gérez les ombres qui vont matérialiser les positions et les mouvements des éléments dans l'espace 3D."> <meta property="og:image" content="https://media.licdn.com/dms/image/v2/C4E0DAQHmfjhrdAXUDg/learning-public-crop_675_1200/learning-public-crop_675_1200/0/1567116760377?e=2147483647&v=beta&t=nhUL5C790IK-OIx-KruL22CpBgg4aoscoJEv-9vzdMw"> <meta name="twitter:image" content="https://media.licdn.com/dms/image/v2/C4E0DAQHmfjhrdAXUDg/learning-public-crop_675_1200/learning-public-crop_675_1200/0/1567116760377?e=2147483647&v=beta&t=nhUL5C790IK-OIx-KruL22CpBgg4aoscoJEv-9vzdMw">  <meta property="og:url" content="https://fr.linkedin.com/learning/decouvrir-le-material-design/utiliser-l-espace-3d"> <meta property="og:type" content="website"> <meta name="clientSideIngraphs" content="1" data-gauge-metric-endpoint="/learning-guest/api/ingraphs/gauge" data-counter-metric-endpoint="/learning-guest/api/ingraphs/counter"> <link rel="stylesheet" href="https://static.licdn.com/aero-v1/sc/h/ht747kcql13u92j1q4t75l0s"> <script type="application/ld+json"> {"@context":"http://schema.org/","@type":"VideoObject","name":"Utiliser l'espace 3D - Découvrir le Material Design","author":{"@type":"Person","name":"Didier Mazier","url":"https://fr.linkedin.com/learning/instructors/didier-mazier"},"thumbnailUrl":"https://media.licdn.com/dms/image/v2/C4E0DAQHmfjhrdAXUDg/learning-public-crop_675_1200/learning-public-crop_675_1200/0/1567116760377?e=2147483647&v=beta&t=nhUL5C790IK-OIx-KruL22CpBgg4aoscoJEv-9vzdMw","description":"Découvrez les règles du Material Design ainsi que ses outils en ligne. Repensez les interfaces de vos sites et optimisez l’expérience utilisateur grâce à de bonnes pratiques.","duration":"PT5M54S","datePublished":"2015-04-16","uploadDate":"2015-04-16","requiresSubscription":false,"isAccessibleForFree":true,"contentUrl":"https://fr.linkedin.com/learning/decouvrir-le-material-design/utiliser-l-espace-3d","interactionCount":1988,"interactionStatistic":[{"@type":"InteractionCounter","interactionType":"http://schema.org/WatchAction","userInteractionCount":1988}],"transcript":"Pour pouvoir présenter les objets en trois dimensions, c'est-à dire par rapport à une largeur, une longueur et également une hauteur, il va falloir mettre en place une modélisation spatiale de ces objets en trois dimensions. Nous allons pouvoir le faire en gérant l'élévation de ces objets, en mettant en place des ombres qui vont donner des indications sur cette élévation et puis nous allons voir comment vont être gérés les rapports entre les objets. À la base, nous avons une élévation qui est calculée entre la face supérieure d'un objet et l'objet qui se trouve immédiatement inférieur ou le fond. Nous voyons ici que, dans le cas qui se trouve inférieur, nous avons un objet qui se trouve à 2 DP, par abus de langage on peut parler de pixels mais rappelons qu'il s'agit de pixels indépendants de la densité. Donc nous avons ici un objet qui se trouve avec une élévation de 2 pixels par rapport au fond, et puis nous avons ici un objet qui se trouve avec une élévation de 6 pixels par rapport à l'objet qui se trouve en dessous et de 8 pixels par rapport au fond. Ce sont les ombres, qui sont gérées ici, qui vont nous donner une indication des élévations relatives de ces différents éléments. Alors bien entendu, il va y avoir différentes élévations et celles-ci vont être structurées de façon cohérente. Vous retrouverez d'ailleurs toutes ces indications dans le système de guidelines, c'est-à-dire de guides de bonnes pratiques qui est publié, bien entendu, par Google. Nous avons d'une part, ce qu'on appelle la barre de l'application qui elle se trouve avec une élévation de 4 pixels, ce qui veut dire qu'elle sera au-dessus de tout le reste. Nous allons avoir les cartes qui elles se trouvent avec une élévation de 2 pixels, donc qui seront immédiatement sous la barre d'application et nous aurons des éléments qui pourront être des éléments flottants, qui sont figurés ici au milieu, et qui flotteront à une hauteur de 8 pixels par rapport au fond. Bien entendu, l'élévation va dépendre de l'interaction. Nous voyons ici que nous avons un élément qui se trouve au repos à 2 pixels. Nous le voyons ici en plan, en perspective et en coupe. Et puis, lorsqu'il y aura une action du doigt qui va presser cet élément, il y aura une élévation de 6 pixels supplémentaires par rapport à sa position initiale. C'est cette élévation qui va donner à l'utilisateur une indication sur l'interaction qui est en cours. Alors bien entendu, ces élévations peuvent varier en fonction des différents périphériques, que ce soit un téléphone, une télé ou voire un ordinateur de bureau, mais c'est quelque chose qui devra être adapté et toujours cohérent, c'est-à-dire invariable. Nous voyons ici la différence entre ce que l'on appelle un bouton haut et puis ce qu'on appelle un bouton flottant. Nous avons à gauche un bouton qui peut être intégré à l'intérieur de certains éléments et qui donc va faire partie de ces éléments. Il se trouve avec une hauteur de 2 pixels au repos et une élévation supplémentaire de 6 pixels, ce qui porte à 8 pixels son élévation totale, lorsqu'il y a une action. Dans le cas d'un bouton flottant, celui-ci se trouve à la base à 8 pixels et il a, lorsqu'il y a une interaction, une élévation supplémentaire de 6 pixels, ce qui le porte à 14 pixels. Bien entendu, ce sont les ombres qui vont nous donner des indications sur le niveau d'élévation des différents éléments. Vous voyez qu'ici, sans absolument aucune ombre, nous n'avons pas d'idée sur l'élévation des différents éléments. Tout se trouve placé au même niveau. Si nous avons des ombres, comme c'est le cas ici, nous voyons que nous avons un niveau. Il y a la carte bleue et le bouton rouge qui sont placés au même niveau par rapport au fond blanc et au fond gris. Si par contre nous faisons encore varier les ombres, et bien nous nous rendons compte ici que nous avons deux niveaux, c'est-à-dire que nous avons le niveau bleu et nous avons le niveau magenta d'un bouton qui est un bouton flottant par rapport aux autres éléments. Sans les ombres dans le cas d'un agrandissement d'un élément, comme c'est ici le cas, nous n'avons aucune indication s'il s'agit d'un agrandissement ou s'il s'agit d'une élévation. Lorsqu'ici nous allons mettre en place une ombre pour le deuxième état et bien nous voyons que nous avons une élévation très claire par rapport au premier état. L'agrandissement de la forme est donc lié au fait qu'elle est surélevée. Il s'agit donc d'un phénomène optique. Si ici nous avons des ombres qui sont identiques pour le premier et le second état, et bien nous voyons que nous avons une forme qui a été augmentée, qui a été agrandie mais qui n'a pas été élevée. Ceci démontre clairement que sans les ombres, nous ne pouvons pas travailler dans un espace 3D et nous ne pouvons pas matérialiser un modèle spatial. Va se poser, enfin, le problème de l'interrelation entre les éléments. Nous avons ici un bouton intégré à du contenu et nous allons procéder à partir de sa position initiale à un défilement du contenu vers le bas. Le bouton va dans ce cas être lié au contenu, remonté jusqu'à disparaître du contenu. Dans le cas d'un bouton qui lui est un bouton flottant, nous allons faire défiler le contenu vers le bas mais le bouton flottant restera en place. Nous avons donc, en plus des niveaux d'élévation, une différence de comportement selon qu'un élément est intégré au contenu ou qu'il flotte au-dessus de ce contenu. Nous avons donc, avec ce système, mis en place un modèle spatial 3D qui est cohérent et qui va permettre à l'utilisateur de toujours avoir les mêmes repères."} </script>  </head> <body dir="ltr">   <a href="#main-content" class="skip-link btn-md btn-primary absolute z-11 -top-[100vh] focus:top-0"> Passer au contenu principal </a> <header class="header base-detail-page__header px-mobile-container-padding bg-color-background-container global-alert-offset sticky-header"> <nav class="nav pt-1.5 pb-2 flex items-center justify-between relative flex-nowrap babymamabear:py-1.5 nav--minified-mobile " aria-label="Principal"> <a href="https://fr.linkedin.com/learning/?trk=learning-course_nav-header-logo" class="nav__logo-link link-no-visited-state z-1 mr-auto min-h-[52px] flex items-center babybear:z-0 hover:no-underline focus:no-underline active:no-underline babymamabear:mr-3" data-tracking-control-name="learning-course_nav-header-logo" data-tracking-will-navigate> <div class="learning-logo"> <icon class="learning-logo__inbug onload" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/4zqr0f9jf98vi2nkijyc3bex2"></icon> <span class="learning-logo__text" aria-hidden="true">Learning</span> <span class="sr-only">LinkedIn Learning</span> </div> </a> <section class="search-bar relative flex flex-grow h-[40px] bg-cool-gray-20 min-w-0 max-w-full mx-4 rounded-sm babymamabear:mx-0 babymamabear:mb-1.5 babymamabear:bg-color-transparent babymamabear:w-full babymamabear:flex babymamabear:flex-wrap search-bar--minified-mobile" data-current-search-type="LEARNING"> <button class="search-bar__placeholder papabear:hidden text-input w-full mt-1.5 !pl-[14px] border-1 border-solid border-color-border-faint rounded-[2px] h-[40px] max-h-[40px] flex items-center overflow-hidden cursor-text" data-tracking-control-name="learning-course_search-switcher-opener"> <icon class="text-color-icon w-3 h-3 mr-1" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/397vrsk6op88l4981ji1xe1qt"></icon> <div class="search-bar__full-placeholder font-sans text-md text-color-text max-w-[calc(100%-40px)] text-left whitespace-nowrap overflow-hidden text-ellipsis">  Chercher des compétences, sujets ou logiciels  </div> <span class="sr-only">Étendre la recherche</span> </button> <div class="switcher-tabs__trigger-and-tabs babymamabear:flex"> <button aria-expanded="false" class="switcher-tabs__placeholder flex !h-full !py-0 !pl-2 !pr-1.5 border-r-1 border-solid border-r-color-border-faint babymamabear:hidden tab-md papabear:tab-vertical papabear:justify-start cursor-pointer" data-tracking-control-name="learning-course_switcher-tabs-placeholder" aria-describedby="switcher-description"> <span class="switcher-tabs__placeholder-text m-auto"></span> <icon class="switcher-tabs__caret-down-filled onload pointer-events-none block my-auto min-h-[24px] min-w-[24px] h-[24px] babymamabear:hidden" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/7asbl4deqijhoy3z2ivveispv"></icon> </button> <div id="switcher-description" class="hidden">Ce bouton affiche le type de recherche actuellement sélectionné. Il permet de détailler la liste des options de recherche, qui modifieront les termes saisis pour correspondre à la sélection actuelle.</div>  <div class="switcher-tabs hidden z-[1] w-auto min-w-[160px] mb-1.5 py-1 absolute top-[48px] left-0 border-solid border-1 border-color-border-faint papabear:container-raised babymamabear:static babymamabear:w-[100vw] babymamabear:h-[48px] babymamabear:p-0 overflow-y-hidden overflow-x-auto md:overflow-x-hidden"> <ul class="switcher-tabs__list flex flex-1 items-stretch papabear:flex-col" role="tablist"> <li class="switcher-tabs__tab h-[44px] babymamabear:basis-1/2" role="presentation"> <button aria-controls="jobs-search-panel" aria-selected="false" class="switcher-tabs__button w-full h-full tab-md papabear:tab-vertical papabear:justify-start cursor-pointer " data-switcher-type="JOBS" data-tracking-control-name="learning-course_switcher-tabs-jobs-search-switcher" id="job-switcher-tab" role="tab"> Emplois </button> </li> <li class="switcher-tabs__tab h-[44px] babymamabear:basis-1/2" role="presentation"> <button aria-controls="people-search-panel" aria-selected="false" class="switcher-tabs__button w-full h-full tab-md papabear:tab-vertical papabear:justify-start cursor-pointer " data-switcher-type="PEOPLE" data-tracking-control-name="learning-course_switcher-tabs-people-search-switcher" id="people-switcher-tab" role="tab"> Personnes </button> </li> <li class="switcher-tabs__tab h-[44px] babymamabear:basis-1/2" role="presentation"> <button aria-controls="learning-search-panel" aria-selected="true" class="switcher-tabs__button w-full h-full tab-md papabear:tab-vertical papabear:justify-start cursor-pointer tab-selected" data-switcher-type="LEARNING" data-tracking-control-name="learning-course_switcher-tabs-learning-search-switcher" id="learning-switcher-tab" role="tab"> LinkedIn Learning </button> </li> </ul> <button aria-label="Fermer" class="switcher-tabs__cancel-btn papabear:hidden block w-6 h-6 m-auto text-color-text-low-emphasis" data-tracking-control-name="learning-course_switcher-tabs-cancel-search-switcher" type="button"> <icon class="switcher-tabs__cancel-icon block w-3 h-3 m-auto onload" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cs55jggk4p3uqh9ozxdmpvjg7"></icon> </button> </div> </div> <section class="base-search-bar w-full h-full" data-searchbar-type="PEOPLE" aria-labelledby="people-switcher-tab" id="people-search-panel" role="tabpanel"> <form class="base-search-bar__form w-full flex babymamabear:mx-mobile-container-padding babymamabear:flex-col" role="search" action="/pub/dir" data-tracking-control-name="learning-course_people-search-bar_base-search-bar-form"> <section class="dismissable-input text-input !pr-3 bg-color-transparent flex items-center h-[40px] min-w-0 relative babybear:w-full babybear:mb-1 search-input"> <input aria-label="Prénom " autocomplete="on" class="dismissable-input__input font-sans text-md text-color-text bg-color-transparent flex items-center flex-1 focus:outline-none placeholder:text-color-text-secondary" data-tracking-control-name="learning-course_people-search-bar_first-name_dismissable-input" maxlength="500" name="firstName" placeholder="Prénom " type="search"> <button class="dismissable-input__button text-color-text h-[40px] min-w-[24px] w-[24px] -mr-2 opacity-0 transition-opacity duration-[0.1s] disabled:invisible focus:opacity-100" data-tracking-control-name="learning-course_people-search-bar_first-name_dismissable-input-clear" type="button"> <label class="sr-only">Effacer le texte</label> <icon class="dismissable-input__button-icon" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cs55jggk4p3uqh9ozxdmpvjg7"></icon> </button> </section> <section class="dismissable-input text-input !pr-3 bg-color-transparent flex items-center h-[40px] min-w-0 relative babybear:w-full babybear:mb-1 search-input"> <input aria-label="Nom " autocomplete="on" class="dismissable-input__input font-sans text-md text-color-text bg-color-transparent flex items-center flex-1 focus:outline-none placeholder:text-color-text-secondary" data-tracking-control-name="learning-course_people-search-bar_last-name_dismissable-input" maxlength="500" name="lastName" placeholder="Nom " type="search"> <button class="dismissable-input__button text-color-text h-[40px] min-w-[24px] w-[24px] -mr-2 opacity-0 transition-opacity duration-[0.1s] disabled:invisible focus:opacity-100" data-tracking-control-name="learning-course_people-search-bar_last-name_dismissable-input-clear" type="button"> <label class="sr-only">Effacer le texte</label> <icon class="dismissable-input__button-icon" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cs55jggk4p3uqh9ozxdmpvjg7"></icon> </button> </section> <input name="trk" value="learning-course_people-search-bar_search-submit" type="hidden"> <button class="base-search-bar__submit-btn block basis-[40px] flex-shrink-0 cursor-pointer babymamabear:invisible babymamabear:ml-[-9999px] babymamabear:w-[1px] babymamabear:h-[1px]" aria-label="Rechercher" data-tracking-control-name="learning-course_people-search-bar_base-search-bar-search-submit" type="submit"> <icon class="base-search-bar__search-icon onload mx-auto" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cb5bsr4tsn2r4sjg9e3ls4tjl"></icon> </button> </form> </section> <section class="base-search-bar w-full h-full" data-searchbar-type="JOBS" aria-labelledby="job-switcher-tab" id="jobs-search-panel" role="tabpanel"> <form class="base-search-bar__form w-full flex babymamabear:mx-mobile-container-padding babymamabear:flex-col" role="search" action="/jobs/search" data-tracking-control-name="learning-course_jobs-search-bar_base-search-bar-form"> <code id="i18n_aria_live_text_no-suggestions" style="display: none"></code> <code id="i18n_aria_live_text_one-suggestion" style="display: none"></code> <code id="i18n_aria_live_text_multiple-suggestions" style="display: none"></code> <section class="dismissable-input text-input !pr-3 bg-color-transparent flex items-center h-[40px] min-w-0 relative babybear:w-full babybear:mb-1 typeahead-input keywords-typeahead-input text-input"> <input aria-autocomplete="list" aria-controls="job-search-bar-keywords-typeahead-list" aria-haspopup="listbox" aria-label="Rechercher des emplois ou des entreprises" autocomplete="off" class="dismissable-input__input font-sans text-md text-color-text bg-color-transparent flex items-center flex-1 focus:outline-none placeholder:text-color-text-secondary" data-tracking-control-name="learning-course_dismissable-input" id="job-search-bar-keywords" maxlength="500" name="keywords" placeholder="Rechercher des emplois ou des entreprises" role="combobox" type="search">  <div class="typeahead-input__dropdown container-lined absolute top-[calc(100%+3px)] left-0 w-full rounded-b-md rounded-t-none z-[10] overflow-hidden max-w-none babybear:min-w-full babybear:bottom-0 babybear:overflow-y-auto"> <template class="typeahead-item-template"> <li class="typeahead-input__dropdown-item py-1.5 px-2 hover:cursor-pointer hover:bg-color-surface-new-hover hover:border-y-2 hover:border-solid hover:border-color-container-primary" role="option"> <span class="typeahead-input__dropdown-text font-sans text-sm font-bold text-color-text"></span> </li> </template> <ul class="typeahead-input__dropdown-list w-full" id="job-search-bar-keywords-typeahead-list" role="listbox"></ul> </div>  <button class="dismissable-input__button text-color-text h-[40px] min-w-[24px] w-[24px] -mr-2 opacity-0 transition-opacity duration-[0.1s] disabled:invisible focus:opacity-100" data-tracking-control-name="learning-course_dismissable-input-clear" type="button"> <label class="sr-only">Effacer le texte</label> <icon class="dismissable-input__button-icon" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cs55jggk4p3uqh9ozxdmpvjg7"></icon> </button> </section>  <code id="i18n_aria_live_text_no-suggestions" style="display: none"></code> <code id="i18n_aria_live_text_one-suggestion" style="display: none"></code> <code id="i18n_aria_live_text_multiple-suggestions" style="display: none"></code> <section class="dismissable-input text-input !pr-3 bg-color-transparent flex items-center h-[40px] min-w-0 relative babybear:w-full babybear:mb-1 typeahead-input location-typeahead-input"> <input aria-autocomplete="list" aria-controls="job-search-bar-location-typeahead-list" aria-haspopup="listbox" aria-label="Lieu" autocomplete="off" class="dismissable-input__input font-sans text-md text-color-text bg-color-transparent flex items-center flex-1 focus:outline-none placeholder:text-color-text-secondary" data-tracking-control-name="learning-course_dismissable-input" id="job-search-bar-location" maxlength="500" name="location" placeholder="Lieu" role="combobox" value="Île de Hong Kong" type="search">  <div class="typeahead-input__dropdown container-lined absolute top-[calc(100%+3px)] left-0 w-full rounded-b-md rounded-t-none z-[10] overflow-hidden max-w-none babybear:min-w-full babybear:bottom-0 babybear:overflow-y-auto"> <template class="typeahead-item-template"> <li class="typeahead-input__dropdown-item py-1.5 px-2 hover:cursor-pointer hover:bg-color-surface-new-hover hover:border-y-2 hover:border-solid hover:border-color-container-primary" role="option"> <span class="typeahead-input__dropdown-text font-sans text-sm font-bold text-color-text"></span> </li> </template> <ul class="typeahead-input__dropdown-list w-full" id="job-search-bar-location-typeahead-list" role="listbox"></ul> </div>  <button class="dismissable-input__button text-color-text h-[40px] min-w-[24px] w-[24px] -mr-2 opacity-0 transition-opacity duration-[0.1s] disabled:invisible focus:opacity-100" data-tracking-control-name="learning-course_dismissable-input-clear" type="button"> <label class="sr-only">Effacer le texte</label> <icon class="dismissable-input__button-icon" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cs55jggk4p3uqh9ozxdmpvjg7"></icon> </button> </section> <input name="geoId" value="102817007" type="hidden"> <input name="trk" value="learning-course_jobs-search-bar_search-submit" type="hidden"> <button class="base-search-bar__submit-btn block basis-[40px] flex-shrink-0 cursor-pointer babymamabear:invisible babymamabear:ml-[-9999px] babymamabear:w-[1px] babymamabear:h-[1px]" aria-label="Rechercher" data-tracking-control-name="learning-course_jobs-search-bar_base-search-bar-search-submit" type="submit"> <icon class="base-search-bar__search-icon onload mx-auto" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cb5bsr4tsn2r4sjg9e3ls4tjl"></icon> </button> </form> </section> <section class="base-search-bar w-full h-full" data-searchbar-type="LEARNING" aria-labelledby="learning-switcher-tab" id="learning-search-panel" role="tabpanel"> <form class="base-search-bar__form w-full flex babymamabear:mx-mobile-container-padding babymamabear:flex-col" role="search" action="/learning/search" data-tracking-control-name="learning-course_learning-search-bar_base-search-bar-form"> <section class="dismissable-input text-input !pr-3 bg-color-transparent flex items-center h-[40px] min-w-0 relative babybear:w-full babybear:mb-1 search-input"> <input aria-label="Chercher des compétences, sujets ou logiciels" autocomplete="on" class="dismissable-input__input font-sans text-md text-color-text bg-color-transparent flex items-center flex-1 focus:outline-none placeholder:text-color-text-secondary" data-tracking-control-name="learning-course_learning-search-bar_keywords_dismissable-input" maxlength="500" name="keywords" placeholder="Chercher des compétences, sujets ou logiciels" type="search"> <button class="dismissable-input__button text-color-text h-[40px] min-w-[24px] w-[24px] -mr-2 opacity-0 transition-opacity duration-[0.1s] disabled:invisible focus:opacity-100" data-tracking-control-name="learning-course_learning-search-bar_keywords_dismissable-input-clear" type="button"> <label class="sr-only">Effacer le texte</label> <icon class="dismissable-input__button-icon" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cs55jggk4p3uqh9ozxdmpvjg7"></icon> </button> </section> <input class="nav__search-uoo" name="upsellOrderOrigin" type="hidden"> <input name="trk" value="learning-course_learning-search-bar_search-submit" type="hidden"> <button class="base-search-bar__submit-btn block basis-[40px] flex-shrink-0 cursor-pointer babymamabear:invisible babymamabear:ml-[-9999px] babymamabear:w-[1px] babymamabear:h-[1px]" aria-label="Rechercher" data-tracking-control-name="learning-course_learning-search-bar_base-search-bar-search-submit" type="submit"> <icon class="base-search-bar__search-icon onload mx-auto" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cb5bsr4tsn2r4sjg9e3ls4tjl"></icon> </button> </form> </section>  <div aria-live="polite" class="search-bar__live-text sr-only" role="status"></div> </section>  <div class="nav__cta-container order-3 flex gap-x-1 justify-end min-w-[100px] flex-nowrap flex-shrink-0 babybear:flex-wrap flex-2 babymamabear:min-w-[50px] "> <a class="nav__button-tertiary btn-md btn-tertiary" href="http://fr.linkedin.com/learning/subscription/products?courseSlug=decouvrir-le-material-design&destRedirectURL=https%3A%2F%2Ffr%2Elinkedin%2Ecom%2Flearning%2Fdecouvrir-le-material-design%2Futiliser-l-espace-3d&trk=learning-course_nav-header-join&upsellTrk=lil_upsell_nav_subscription&session_redirect=https%3A%2F%2Ffr.linkedin.com%2Flearning%2Fdecouvrir-le-material-design%3Ftrk%3Dlearning-topics_learning-search-card_search-card" data-tracking-control-name="lil_upsell_nav_subscription" data-tracking-impression-name="lil_upsell_nav_subscription" data-test-live-nav-primary-cta data-tracking-will-navigate> Démarrer mon essai gratuit </a> <a class="nav__button-secondary btn-md btn-secondary-emphasis" href="https://www.linkedin.com/learning-login/?redirect=https%3A%2F%2Fwww%2Elinkedin%2Ecom%2Flearning%2Fdecouvrir-le-material-design%3Ftrk%3Dlearning-topics_learning-search-card_search-card%26trk%3Dlearning-topics_learning-search-card_search-card&fromSignIn=true&session_redirect=https%3A%2F%2Ffr.linkedin.com%2Flearning%2Fdecouvrir-le-material-design%3Ftrk%3Dlearning-topics_learning-search-card_search-card&trk=learning-course_nav-header-signin" data-tracking-control-name="learning-course_nav-header-signin" data-tracking-will-navigate> S’identifier </a> <a aria-label="S’identifier" class="nav__link-person papabear:hidden mamabear:hidden" data-tracking-control-name="learning-course_nav-header-signin" data-tracking-will-navigate href="https://www.linkedin.com/learning-login/?redirect=https%3A%2F%2Fwww%2Elinkedin%2Ecom%2Flearning%2Fdecouvrir-le-material-design%3Ftrk%3Dlearning-topics_learning-search-card_search-card%26trk%3Dlearning-topics_learning-search-card_search-card&fromSignIn=true&session_redirect=https%3A%2F%2Ffr.linkedin.com%2Flearning%2Fdecouvrir-le-material-design%3Ftrk%3Dlearning-topics_learning-search-card_search-card&trk=learning-course_nav-header-signin"> <img class="inline-block relative rounded-[50%] w-4 h-4 bg-color-entity-ghost-background" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/9c8pery4andzj6ohjkjp54ma2" data-ghost-classes="bg-color-entity-ghost-background" data-ghost-url="https://static.licdn.com/aero-v1/sc/h/9c8pery4andzj6ohjkjp54ma2" alt> </a> </div>   </nav> </header>  <div class="cta-banner "> <div class="enterprise-nav"> <div class="enterprise-nav__content-wrapper"> <p id="enterprise-nav-solutions" class="enterprise-nav__content" tabindex="-1"> Solutions pour : </p> <a href="https://learning.linkedin.com/fr-fr/for-entire-companies?src=li-learning-nav&trk=learning-course_enterprise-nav" aria-labelledby="enterprise-nav-solutions business-nav-business" class="enterprise-nav__content" data-tracking-control-name="learning-course_enterprise-nav" data-tracking-will-navigate="true" id="business-nav-business">Entreprise</a> <a href="https://learning.linkedin.com/fr-fr/for-higher-education?src=li-learning-nav&trk=learning-course_enterprise-nav" aria-labelledby="enterprise-nav-solutions business-nav-education" class="enterprise-nav__content" data-tracking-control-name="learning-course_enterprise-nav" data-tracking-will-navigate="true" id="business-nav-education">Enseignement supérieur</a> <a href="https://learning.linkedin.com/fr-fr/for-governments?src=li-learning-nav&trk=learning-course_enterprise-nav" aria-labelledby="enterprise-nav-solutions business-nav-government" class="enterprise-nav__content" data-tracking-control-name="learning-course_enterprise-nav" data-tracking-will-navigate="true" id="business-nav-government">Administration publique</a> <a href="/learning/subscription/teams?veh=lil_upx&src=li-learning-nav&trk=learning-course_enterprise-nav" aria-labelledby="enterprise-nav-solutions business-nav-buy" class="enterprise-nav__content" data-test-live-enterprise-upsell="true" data-tracking-control-name="learning-course_enterprise-nav" data-tracking-will-navigate="true" data-tracking-impression-name="lil_upsell_learning-course_enterprise-nav_teambuy" id="business-nav-buy">Acheter pour mon équipe</a> </div> </div>   </div> <main class="main papabear:flex papabear:w-content-max-w papabear:mx-auto papabear:pt-desktop-content-top-margin mamabear:pt-desktop-content-top-margin " id="main-content" role="main"> <section class="core-rail mx-auto papabear:w-core-rail-width mamabear:max-w-[790px] babybear:max-w-[790px]"> <p class="pre-headline"> Dans le cours : <a href="https://fr.linkedin.com/learning/decouvrir-le-material-design?trk=course_title" data-tracking-control-name="course_title" data-tracking-will-navigate="true" class="from-the-course__link">Découvrir le Material Design</a> </p> <section class="top-card"> <section class="top-card-layout container-lined overflow-hidden babybear:rounded-[0px]"> <section class="top-card__video-wrapper"> <div class="top-card__video">  <div class="share-native-video"> <video class="share-native-video__node video-js" crossorigin="anonymous" data-sources="[{"src":"https://dms.licdn.com/playlist/vid/v2/C560DAQGk-zZtvnRBqw/learning-original-video-vbr-540/learning-original-video-vbr-540/0/1598794713338?e=2147483647&v=beta&t=L_AlCeJpQwGX7RK7HwTsvoHhDKcsLcv0-ZF5hPapZKU#.mp4"}]" data-poster-url="https://media.licdn.com/dms/image/v2/C4E0DAQHmfjhrdAXUDg/learning-public-crop_675_1200/learning-public-crop_675_1200/0/1567116760377?e=2147483647&v=beta&t=nhUL5C790IK-OIx-KruL22CpBgg4aoscoJEv-9vzdMw" data-captions-url="https://www.linkedin.com/ambry/?x-li-ambry-ep=AQJUsUa5VABokwAAAZNbCR05tjcQqALidQ3KC6iXwQ9c3JGfZXmohsu6sHvgmXS7Fm17NjWU1jKyaflV97jxFmVFr-87gkW_4Y2HnUa4RuB_k8Zqen0Wo4EuMOP-0beYn_Ul80l9Jd5KQS5KTnqYDUEIDXEdzFUv3zwSmzkax4sw84Q6-CHU0VpzbWt3IQUFfNpDRH2q-CIh_R_CMpQ75sJKX20FNRG-Z8t98FGqZkAxdCWC6cLfdECgG9nB19CNgKc3I5wo5pM6TMsMQ3kPDL6aEl3IElMp976NFmdpo4ClV6xv3DVwayxeW9neWHIRg1DMy8id7ZXkPQXWdaAK2buWeCmLWgr05TJrVeF5C66DYXB1PzxQVceMWa88Yvq6BGpm6VRdEeciwXAce1WsBlfMAoIwtw-nmDT2fFgVzBRfXhHH1Wx5RsO6HCJ_Vp7QDBNRMfuTRRNlMK9SoNa5iCHFwI-kkc7uXht-KvE4uIm5ADs1BsXihcLaYCII" data-digitalmedia-asset-urn="urn:li:lyndaVideo:(urn:li:lyndaCourse:401499,401508)" data-tracking-id="rXP3jFP/QTqNgM5afv5Dfg==" playsinline> </video> </div> </div> </section> <div class="top-card-layout__card relative p-2 papabear:p-details-container-padding"> <div class="top-card-layout__entity-info-container flex flex-wrap papabear:flex-nowrap"> <div class="top-card-layout__entity-info flex-grow flex-shrink-0 basis-0 babybear:flex-none babybear:w-full babybear:flex-none babybear:w-full"> <h1 class="top-card-layout__title font-sans text-lg papabear:text-xl font-bold leading-open text-color-text mb-0"> Utiliser l'espace 3D </h1> <h2 class="top-card-layout__headline break-words font-sans text-md leading-open text-color-text"> Dans le cours : <a href="https://fr.linkedin.com/learning/decouvrir-le-material-design?trk=course_title" data-tracking-control-name="course_title" data-tracking-will-navigate="true" class="from-the-course__link">Découvrir le Material Design</a> </h2>   <div class="top-card-layout__cta-container flex flex-wrap mt-0.5 papabear:mt-0 ml-[-12px]"> <a href="http://fr.linkedin.com/learning/subscription/products?courseSlug=decouvrir-le-material-design&destRedirectURL=https%3A%2F%2Ffr%2Elinkedin%2Ecom%2Flearning%2Fdecouvrir-le-material-design%2Futiliser-l-espace-3d&trk=course_info&upsellTrk=lil_upsell_course_info_subscription" data-tracking-control-name="lil_upsell_course_info_subscription" data-tracking-impression-name="lil_upsell_course_info_subscription" data-litms-tracking-control-name="lil_upsell_course_info_subscription" data-tracking-will-navigate class="top-card__upsell-link top-card-layout__cta mt-2 ml-1.5 h-auto babybear:flex-auto top-card-layout__cta--primary btn-md btn-primary" data-test-live-course-sub-upsell> Démarrer mon mois d’essai gratuit </a> <a class="buy-for-your-team-cta__link top-card-layout__cta mt-2 ml-1.5 h-auto babybear:flex-auto top-card-layout__cta--secondary btn-md btn-secondary" href="/learning/subscription/teams?veh=lil_upx&src=li-lil-upsell&trk=learning-course_buy-for-your-team-cta" data-tracking-control-name="learning-course_buy-for-your-team-cta" data-tracking-impression-name="lil_upsell_learning-course_buy-for-your-team-cta_teambuy" data-test-live-buy-for-your-team-upsell data-tracking-will-navigate> Acheter pour mon équipe </a> </div> </div>  </div>   </div> </section> </section> <div class="details mx-details-container-padding"> <div class="tabs content-tabs" data-tab-id="course-content-tabs"> <ul class="tabs__list" role="tablist">  <li class="tab flex ml-3 first-of-type:ml-0" role="presentation"> <button aria-selected="true" class="tab-button tab-md tab-selected" data-tracking-control-name="transcripts-tab" data-id="tab__button" role="tab" id="content-tabs__transcripts-btn"> Transcriptions </button> </li>  <li class="tab flex ml-3 first-of-type:ml-0" role="presentation"> <button aria-selected="false" class="tab-button tab-md " data-tracking-control-name="offline-tab" data-id="tab__button" role="tab" tabindex="-1" id="content-tabs__offline-btn" data-test-live-offline-tab> Regarder hors ligne </button> </li> </ul>  <div class="tab__panel" tabindex="0" role="tabpanel"> <section class="core-section-container my-3 transcripts">  <h2 class="core-section-container__title section-title"> Utiliser l'espace 3D </h2>  <div class="core-section-container__content break-words"> <div class="transcripts__copy"> <span class="transcripts__quotation">“</span> <p> Pour pouvoir présenter les objets en trois dimensions, c'est-à dire par rapport à une largeur, une longueur et également une hauteur, il va falloir mettre en place une modélisation spatiale de ces objets en trois dimensions. Nous allons pouvoir le faire en gérant l'élévation de ces objets, en mettant en place des ombres qui vont donner des indications sur cette élévation et puis nous allons voir comment vont être gérés les rapports entre les objets. À la base, nous avons une élévation qui est calculée entre la face supérieure d'un objet et l'objet qui se trouve immédiatement inférieur ou le fond. Nous voyons ici que, dans le cas qui se trouve inférieur, nous avons un objet qui se trouve à 2 DP, par abus de langage on peut parler de pixels mais rappelons qu'il s'agit de pixels indépendants de la densité. Donc nous avons ici un objet qui se trouve avec une élévation de 2 pixels par rapport au fond, et puis nous avons ici un objet qui se trouve avec une élévation de 6 pixels par rapport à l'objet qui se trouve en dessous et de 8 pixels par rapport au fond. Ce sont les ombres, qui sont gérées ici, qui vont nous donner une indication des élévations relatives de ces différents éléments. Alors bien entendu, il va y avoir différentes élévations et celles-ci vont être structurées de façon cohérente. Vous retrouverez d'ailleurs toutes ces indications dans le système de guidelines, c'est-à-dire de guides de bonnes pratiques qui est publié, bien entendu, par Google. Nous avons d'une part, ce qu'on appelle la barre de l'application qui elle se trouve avec une élévation de 4 pixels, ce qui veut dire qu'elle sera au-dessus de tout le reste. Nous allons avoir les cartes qui elles se trouvent avec une élévation de 2 pixels, donc qui seront immédiatement sous la barre d'application et nous aurons des éléments qui pourront être des éléments flottants, qui sont figurés ici au milieu, et qui flotteront à une hauteur de 8 pixels par rapport au fond. Bien entendu, l'élévation va dépendre de l'interaction. Nous voyons ici que nous avons un élément qui se trouve au repos à 2 pixels. Nous le voyons ici en plan, en perspective et en coupe. Et puis, lorsqu'il y aura une action du doigt qui va presser cet élément, il y aura une élévation de 6 pixels supplémentaires par rapport à sa position initiale. C'est cette élévation qui va donner à l'utilisateur une indication sur l'interaction qui est en cours. Alors bien entendu, ces élévations peuvent varier en fonction des différents périphériques, que ce soit un téléphone, une télé ou voire un ordinateur de bureau, mais c'est quelque chose qui devra être adapté et toujours cohérent, c'est-à-dire invariable. Nous voyons ici la différence entre ce que l'on appelle un bouton haut et puis ce qu'on appelle un bouton flottant. Nous avons à gauche un bouton qui peut être intégré à l'intérieur de certains éléments et qui donc va faire partie de ces éléments. Il se trouve avec une hauteur de 2 pixels au repos et une élévation supplémentaire de 6 pixels, ce qui porte à 8 pixels son élévation totale, lorsqu'il y a une action. Dans le cas d'un bouton flottant, celui-ci se trouve à la base à 8 pixels et il a, lorsqu'il y a une interaction, une élévation supplémentaire de 6 pixels, ce qui le porte à 14 pixels. Bien entendu, ce sont les ombres qui vont nous donner des indications sur le niveau d'élévation des différents éléments. Vous voyez qu'ici, sans absolument aucune ombre, nous n'avons pas d'idée sur l'élévation des différents éléments. Tout se trouve placé au même niveau. Si nous avons des ombres, comme c'est le cas ici, nous voyons que nous avons un niveau. Il y a la carte bleue et le bouton rouge qui sont placés au même niveau par rapport au fond blanc et au fond gris. Si par contre nous faisons encore varier les ombres, et bien nous nous rendons compte ici que nous avons deux niveaux, c'est-à-dire que nous avons le niveau bleu et nous avons le niveau magenta d'un bouton qui est un bouton flottant par rapport aux autres éléments. Sans les ombres dans le cas d'un agrandissement d'un élément, comme c'est ici le cas, nous n'avons aucune indication s'il s'agit d'un agrandissement ou s'il s'agit d'une élévation. Lorsqu'ici nous allons mettre en place une ombre pour le deuxième état et bien nous voyons que nous avons une élévation très claire par rapport au premier état. L'agrandissement de la forme est donc lié au fait qu'elle est surélevée. Il s'agit donc d'un phénomène optique. Si ici nous avons des ombres qui sont identiques pour le premier et le second état, et bien nous voyons que nous avons une forme qui a été augmentée, qui a été agrandie mais qui n'a pas été élevée. Ceci démontre clairement que sans les ombres, nous ne pouvons pas travailler dans un espace 3D et nous ne pouvons pas matérialiser un modèle spatial. Va se poser, enfin, le problème de l'interrelation entre les éléments. Nous avons ici un bouton intégré à du contenu et nous allons procéder à partir de sa position initiale à un défilement du contenu vers le bas. Le bouton va dans ce cas être lié au contenu, remonté jusqu'à disparaître du contenu. Dans le cas d'un bouton qui lui est un bouton flottant, nous allons faire défiler le contenu vers le bas mais le bouton flottant restera en place. Nous avons donc, en plus des niveaux d'élévation, une différence de comportement selon qu'un élément est intégré au contenu ou qu'il flotte au-dessus de ce contenu. Nous avons donc, avec ce système, mis en place un modèle spatial 3D qui est cohérent et qui va permettre à l'utilisateur de toujours avoir les mêmes repères. </p> </div> </div> </section> </div>  <div class="tab__panel" tabindex="0" role="tabpanel" hidden> <section class="core-section-container my-3 offline">  <h2 class="core-section-container__title section-title"> Téléchargez des cours et suivez des formations même en déplacement </h2>  <div class="core-section-container__content break-words"> <p class="offline__description"> Regardez des cours sur votre appareil mobile sans connexion à internet. Téléchargez des cours avec votre appli LinkedIn Learning iOS ou Android. </p> <div class="offline__link-container"> <a class="offline__link" href="https://itunes.apple.com/fr/app/apple-store/id1084807225?ls=1&pt=10746&mt=8&ct=learning_course_tab_viewoffline&trk=apple_app_store" data-tracking-control-name="apple_app_store" data-tracking-will-navigate rel="noopener noreferrer" target="_blank"> <img alt="Télécharger sur l’App Store" class="offline__image" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/emczv26hz24woii2j4aleyry"> </a> <a class="offline__link" href="https://play.google.com/store/apps/details?id=com.linkedin.android.learning&referrer=utm_source=linkedinlearning&utm_medium=mobileWeb&utm_campaign=learning_guest&hl=fr&ct=learning_course_tab_viewoffline&trk=google_play_store" data-tracking-control-name="google_play_store" data-tracking-will-navigate rel="noopener noreferrer" target="_blank"> <img alt="Télécharger sur Google Play" class="offline__image" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/535kqf5rsexfx0lucb3t6palb"> </a> </div> <div class="footer-upsell-link"> <span class="footer-upsell-link__description"> Regardez ce cours où vous voulez, quand vous voulez. </span> <a href="http://fr.linkedin.com/learning/subscription/products?courseSlug=decouvrir-le-material-design&destRedirectURL=https%3A%2F%2Ffr%2Elinkedin%2Ecom%2Flearning%2Fdecouvrir-le-material-design%2Futiliser-l-espace-3d&trk=offline_viewing&upsellTrk=lil_upsell_offline_viewing_subscription" data-tracking-control-name="lil_upsell_offline_viewing_subscription" data-tracking-impression-name="lil_upsell_offline_viewing_subscription" data-litms-tracking-control-name="lil_upsell_offline_viewing_subscription" data-tracking-will-navigate class="offline__upsell-link" data-test-live-offline-footer-sub-upsell> Commencez votre essai gratuit aujourd’hui. </a> </div> </div> </section> </div> </div> </div> </section> <section class="right-rail papabear:w-right-rail-width papabear:ml-column-gutter mamabear:max-w-[790px] mamabear:px-mobile-container-padding babybear:max-w-[790px] babybear:px-mobile-container-padding"> <section class="table-of-contents mb-4"> <h2 class="table-of-contents__header"> Table des matières </h2> <ul class="table-of-contents__list"> <li class="toc-section"> <div class="show-more-less"> <button class="show-more-less__button show-more-less__more-button show-more-less-button " aria-expanded="false" data-tracking-control-name="learning-course_toc-section_show_more"> Introduction <icon class="show-more-less__button--chevron show-more-less-button-icon" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cyolgscd0imw2ldqppkrb84vo"></icon> </button> <button class="show-more-less__button show-more-less__less-button show-more-less-button show-more-less__button--hide" aria-expanded="false" data-tracking-control-name="learning-course_toc-section_show_more"> Introduction <icon class="show-more-less__button--chevron show-more-less-button-icon" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/4chtt12k98xwnba1nimld2oyg"></icon> </button> <ul data-max-num-to-show="0" class="show-more-less__list show-more-less__list--hide-after-0" data-impression-id="learning-course_toc-section_show-more-less"> <li class="toc-item"> <a data-tracking-control-name="learning-course_tocItem" data-tracking-will-navigate href="https://fr.linkedin.com/learning/decouvrir-le-material-design/bienvenue-dans-decouvrir-le-material-design?autoplay=true&trk=learning-course_tocItem" class="toc-item__link" aria-current="false"> <icon class="table-of-contents__item-status table-of-contents__item-status--unlocked" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/5jwhkytplzxiejvhzfu0t7m8l" data-svg-class-name="table-of-contents__item-status-svg--unlocked"></icon> <div class="table-of-contents__item-details"> <div class="table-of-contents__item-title"> Bienvenue dans « Découvrir le Material Design » </div> <div class="table-of-contents__item-duration"> 1 m 18 s </div> </div> </a> </li> </ul>  </div> </li> <li class="toc-section"> <div class="show-more-less"> <button class="show-more-less__button show-more-less__more-button show-more-less-button " aria-expanded="false" data-tracking-control-name="learning-course_toc-section_show_more"> 1. Faire ses premiers pas dans le Material Design <icon class="show-more-less__button--chevron show-more-less-button-icon" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cyolgscd0imw2ldqppkrb84vo"></icon> </button> <button class="show-more-less__button show-more-less__less-button show-more-less-button show-more-less__button--hide" aria-expanded="false" data-tracking-control-name="learning-course_toc-section_show_more"> 1. Faire ses premiers pas dans le Material Design <icon class="show-more-less__button--chevron show-more-less-button-icon" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/4chtt12k98xwnba1nimld2oyg"></icon> </button> <ul data-max-num-to-show="0" class="show-more-less__list show-more-less__list--hide-after-0" data-impression-id="learning-course_toc-section_show-more-less"> <li class="toc-item"> <a data-tracking-control-name="learning-course_tocItem" data-tracking-will-navigate href="https://fr.linkedin.com/learning/decouvrir-le-material-design/decouvrir-le-material-design?autoplay=true&trk=learning-course_tocItem" class="toc-item__link" aria-current="false"> <icon class="table-of-contents__item-status table-of-contents__item-status--unlocked" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/5jwhkytplzxiejvhzfu0t7m8l" data-svg-class-name="table-of-contents__item-status-svg--unlocked"></icon> <div class="table-of-contents__item-details"> <div class="table-of-contents__item-title"> Découvrir le Material Design </div> <div class="table-of-contents__item-duration"> 4 m 52 s </div> </div> </a> </li> <li class="toc-item"> <a data-tracking-control-name="learning-course_tocItem" data-tracking-will-navigate href="https://fr.linkedin.com/learning/decouvrir-le-material-design/acceder-aux-ressources-google-pour-le-material-design?autoplay=true&trk=learning-course_tocItem" class="toc-item__link" aria-current="false"> <span class="a11y-text">(Verrouillé)</span> <icon class="table-of-contents__item-status table-of-contents__item-status--locked" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cfu0devb5o77ym5x8vv0oilfz" data-svg-class-name="table-of-contents__item-status-svg--locked"></icon> <div class="table-of-contents__item-details"> <div class="table-of-contents__item-title"> Accéder aux ressources Google pour le Material Design </div> <div class="table-of-contents__item-duration"> 5 m 34 s </div> </div> </a> </li> </ul>  </div> </li> <li class="toc-section"> <div class="show-more-less"> <button class="show-more-less__button show-more-less__more-button show-more-less-button show-more-less__button--hide" aria-expanded="true" data-tracking-control-name="learning-course_toc-section_show_more"> 2. Connaître les principes de base <icon class="show-more-less__button--chevron show-more-less-button-icon" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cyolgscd0imw2ldqppkrb84vo"></icon> </button> <button class="show-more-less__button show-more-less__less-button show-more-less-button " aria-expanded="true" data-tracking-control-name="learning-course_toc-section_show_more"> 2. Connaître les principes de base <icon class="show-more-less__button--chevron show-more-less-button-icon" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/4chtt12k98xwnba1nimld2oyg"></icon> </button> <ul data-max-num-to-show="0" class="show-more-less__list " data-impression-id="learning-course_toc-section_show-more-less"> <li class="toc-item"> <a data-tracking-control-name="learning-course_tocItem" data-tracking-will-navigate href="https://fr.linkedin.com/learning/decouvrir-le-material-design/maitriser-l-environnement?autoplay=true&trk=learning-course_tocItem" class="toc-item__link" aria-current="false"> <span class="a11y-text">(Verrouillé)</span> <icon class="table-of-contents__item-status table-of-contents__item-status--locked" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cfu0devb5o77ym5x8vv0oilfz" data-svg-class-name="table-of-contents__item-status-svg--locked"></icon> <div class="table-of-contents__item-details"> <div class="table-of-contents__item-title"> Maîtriser l'environnement </div> <div class="table-of-contents__item-duration"> 1 m 40 s </div> </div> </a> </li> <li class="toc-item"> <a data-tracking-control-name="learning-course_tocItem" data-tracking-will-navigate href="https://fr.linkedin.com/learning/decouvrir-le-material-design/gerer-les-proprietes?autoplay=true&trk=learning-course_tocItem" class="toc-item__link" aria-current="false"> <span class="a11y-text">(Verrouillé)</span> <icon class="table-of-contents__item-status table-of-contents__item-status--locked" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cfu0devb5o77ym5x8vv0oilfz" data-svg-class-name="table-of-contents__item-status-svg--locked"></icon> <div class="table-of-contents__item-details"> <div class="table-of-contents__item-title"> Gérer les propriétés </div> <div class="table-of-contents__item-duration"> 5 m 36 s </div> </div> </a> </li> <li class="toc-item toc-item--active"> <a data-tracking-control-name="learning-course_tocItem" data-tracking-will-navigate href="https://fr.linkedin.com/learning/decouvrir-le-material-design/utiliser-l-espace-3d?autoplay=true&trk=learning-course_tocItem" class="toc-item__link" aria-current="true"> <icon class="table-of-contents__item-status table-of-contents__item-status--unlocked" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/5jwhkytplzxiejvhzfu0t7m8l" data-svg-class-name="table-of-contents__item-status-svg--unlocked"></icon> <div class="table-of-contents__item-details"> <div class="table-of-contents__item-title"> Utiliser l'espace 3D </div> <div class="table-of-contents__item-duration"> 5 m 54 s </div> </div> </a> </li> </ul>  </div> </li> <li class="toc-section"> <div class="show-more-less"> <button class="show-more-less__button show-more-less__more-button show-more-less-button " aria-expanded="false" data-tracking-control-name="learning-course_toc-section_show_more"> 3. Réaliser des animations <icon class="show-more-less__button--chevron show-more-less-button-icon" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cyolgscd0imw2ldqppkrb84vo"></icon> </button> <button class="show-more-less__button show-more-less__less-button show-more-less-button show-more-less__button--hide" aria-expanded="false" data-tracking-control-name="learning-course_toc-section_show_more"> 3. Réaliser des animations <icon class="show-more-less__button--chevron show-more-less-button-icon" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/4chtt12k98xwnba1nimld2oyg"></icon> </button> <ul data-max-num-to-show="0" class="show-more-less__list show-more-less__list--hide-after-0" data-impression-id="learning-course_toc-section_show-more-less"> <li class="toc-item"> <a data-tracking-control-name="learning-course_tocItem" data-tracking-will-navigate href="https://fr.linkedin.com/learning/decouvrir-le-material-design/faire-une-animation-realiste?autoplay=true&trk=learning-course_tocItem" class="toc-item__link" aria-current="false"> <span class="a11y-text">(Verrouillé)</span> <icon class="table-of-contents__item-status table-of-contents__item-status--locked" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cfu0devb5o77ym5x8vv0oilfz" data-svg-class-name="table-of-contents__item-status-svg--locked"></icon> <div class="table-of-contents__item-details"> <div class="table-of-contents__item-title"> Faire une animation réaliste </div> <div class="table-of-contents__item-duration"> 2 m 43 s </div> </div> </a> </li> <li class="toc-item"> <a data-tracking-control-name="learning-course_tocItem" data-tracking-will-navigate href="https://fr.linkedin.com/learning/decouvrir-le-material-design/jouer-avec-les-interactions?autoplay=true&trk=learning-course_tocItem" class="toc-item__link" aria-current="false"> <span class="a11y-text">(Verrouillé)</span> <icon class="table-of-contents__item-status table-of-contents__item-status--locked" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cfu0devb5o77ym5x8vv0oilfz" data-svg-class-name="table-of-contents__item-status-svg--locked"></icon> <div class="table-of-contents__item-details"> <div class="table-of-contents__item-title"> Jouer avec les interactions </div> <div class="table-of-contents__item-duration"> 3 m 11 s </div> </div> </a> </li> <li class="toc-item"> <a data-tracking-control-name="learning-course_tocItem" data-tracking-will-navigate href="https://fr.linkedin.com/learning/decouvrir-le-material-design/se-servir-des-transitions?autoplay=true&trk=learning-course_tocItem" class="toc-item__link" aria-current="false"> <span class="a11y-text">(Verrouillé)</span> <icon class="table-of-contents__item-status table-of-contents__item-status--locked" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cfu0devb5o77ym5x8vv0oilfz" data-svg-class-name="table-of-contents__item-status-svg--locked"></icon> <div class="table-of-contents__item-details"> <div class="table-of-contents__item-title"> Se servir des transitions </div> <div class="table-of-contents__item-duration"> 3 m 46 s </div> </div> </a> </li> <li class="toc-item"> <a data-tracking-control-name="learning-course_tocItem" data-tracking-will-navigate href="https://fr.linkedin.com/learning/decouvrir-le-material-design/avoir-le-souci-du-detail?autoplay=true&trk=learning-course_tocItem" class="toc-item__link" aria-current="false"> <icon class="table-of-contents__item-status table-of-contents__item-status--unlocked" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/5jwhkytplzxiejvhzfu0t7m8l" data-svg-class-name="table-of-contents__item-status-svg--unlocked"></icon> <div class="table-of-contents__item-details"> <div class="table-of-contents__item-title"> Avoir le souci du détail </div> <div class="table-of-contents__item-duration"> 4 m 58 s </div> </div> </a> </li> </ul>  </div> </li> <li class="toc-section"> <div class="show-more-less"> <button class="show-more-less__button show-more-less__more-button show-more-less-button " aria-expanded="false" data-tracking-control-name="learning-course_toc-section_show_more"> 4. Découvrir le style <icon class="show-more-less__button--chevron show-more-less-button-icon" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cyolgscd0imw2ldqppkrb84vo"></icon> </button> <button class="show-more-less__button show-more-less__less-button show-more-less-button show-more-less__button--hide" aria-expanded="false" data-tracking-control-name="learning-course_toc-section_show_more"> 4. Découvrir le style <icon class="show-more-less__button--chevron show-more-less-button-icon" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/4chtt12k98xwnba1nimld2oyg"></icon> </button> <ul data-max-num-to-show="0" class="show-more-less__list show-more-less__list--hide-after-0" data-impression-id="learning-course_toc-section_show-more-less"> <li class="toc-item"> <a data-tracking-control-name="learning-course_tocItem" data-tracking-will-navigate href="https://fr.linkedin.com/learning/decouvrir-le-material-design/maitriser-les-elements-de-style?autoplay=true&trk=learning-course_tocItem" class="toc-item__link" aria-current="false"> <span class="a11y-text">(Verrouillé)</span> <icon class="table-of-contents__item-status table-of-contents__item-status--locked" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cfu0devb5o77ym5x8vv0oilfz" data-svg-class-name="table-of-contents__item-status-svg--locked"></icon> <div class="table-of-contents__item-details"> <div class="table-of-contents__item-title"> Maîtriser les éléments de style </div> <div class="table-of-contents__item-duration"> 52 s </div> </div> </a> </li> <li class="toc-item"> <a data-tracking-control-name="learning-course_tocItem" data-tracking-will-navigate href="https://fr.linkedin.com/learning/decouvrir-le-material-design/gerer-la-couleur?autoplay=true&trk=learning-course_tocItem" class="toc-item__link" aria-current="false"> <span class="a11y-text">(Verrouillé)</span> <icon class="table-of-contents__item-status table-of-contents__item-status--locked" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cfu0devb5o77ym5x8vv0oilfz" data-svg-class-name="table-of-contents__item-status-svg--locked"></icon> <div class="table-of-contents__item-details"> <div class="table-of-contents__item-title"> Gérer la couleur </div> <div class="table-of-contents__item-duration"> 5 m 58 s </div> </div> </a> </li> <li class="toc-item"> <a data-tracking-control-name="learning-course_tocItem" data-tracking-will-navigate href="https://fr.linkedin.com/learning/decouvrir-le-material-design/utiliser-les-icones?autoplay=true&trk=learning-course_tocItem" class="toc-item__link" aria-current="false"> <span class="a11y-text">(Verrouillé)</span> <icon class="table-of-contents__item-status table-of-contents__item-status--locked" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cfu0devb5o77ym5x8vv0oilfz" data-svg-class-name="table-of-contents__item-status-svg--locked"></icon> <div class="table-of-contents__item-details"> <div class="table-of-contents__item-title"> Utiliser les icônes </div> <div class="table-of-contents__item-duration"> 7 m 35 s </div> </div> </a> </li> <li class="toc-item"> <a data-tracking-control-name="learning-course_tocItem" data-tracking-will-navigate href="https://fr.linkedin.com/learning/decouvrir-le-material-design/exploiter-les-illustrations?autoplay=true&trk=learning-course_tocItem" class="toc-item__link" aria-current="false"> <span class="a11y-text">(Verrouillé)</span> <icon class="table-of-contents__item-status table-of-contents__item-status--locked" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cfu0devb5o77ym5x8vv0oilfz" data-svg-class-name="table-of-contents__item-status-svg--locked"></icon> <div class="table-of-contents__item-details"> <div class="table-of-contents__item-title"> Exploiter les illustrations </div> <div class="table-of-contents__item-duration"> 4 m 37 s </div> </div> </a> </li> <li class="toc-item"> <a data-tracking-control-name="learning-course_tocItem" data-tracking-will-navigate href="https://fr.linkedin.com/learning/decouvrir-le-material-design/utiliser-la-typographie?autoplay=true&trk=learning-course_tocItem" class="toc-item__link" aria-current="false"> <span class="a11y-text">(Verrouillé)</span> <icon class="table-of-contents__item-status table-of-contents__item-status--locked" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cfu0devb5o77ym5x8vv0oilfz" data-svg-class-name="table-of-contents__item-status-svg--locked"></icon> <div class="table-of-contents__item-details"> <div class="table-of-contents__item-title"> Utiliser la typographie </div> <div class="table-of-contents__item-duration"> 8 m 12 s </div> </div> </a> </li> </ul>  </div> </li> <li class="toc-section"> <div class="show-more-less"> <button class="show-more-less__button show-more-less__more-button show-more-less-button " aria-expanded="false" data-tracking-control-name="learning-course_toc-section_show_more"> 5. Faire la mise en page <icon class="show-more-less__button--chevron show-more-less-button-icon" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cyolgscd0imw2ldqppkrb84vo"></icon> </button> <button class="show-more-less__button show-more-less__less-button show-more-less-button show-more-less__button--hide" aria-expanded="false" data-tracking-control-name="learning-course_toc-section_show_more"> 5. Faire la mise en page <icon class="show-more-less__button--chevron show-more-less-button-icon" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/4chtt12k98xwnba1nimld2oyg"></icon> </button> <ul data-max-num-to-show="0" class="show-more-less__list show-more-less__list--hide-after-0" data-impression-id="learning-course_toc-section_show-more-less"> <li class="toc-item"> <a data-tracking-control-name="learning-course_tocItem" data-tracking-will-navigate href="https://fr.linkedin.com/learning/decouvrir-le-material-design/connaitre-les-principes-de-base?autoplay=true&trk=learning-course_tocItem" class="toc-item__link" aria-current="false"> <span class="a11y-text">(Verrouillé)</span> <icon class="table-of-contents__item-status table-of-contents__item-status--locked" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cfu0devb5o77ym5x8vv0oilfz" data-svg-class-name="table-of-contents__item-status-svg--locked"></icon> <div class="table-of-contents__item-details"> <div class="table-of-contents__item-title"> Connaître les principes de base </div> <div class="table-of-contents__item-duration"> 2 m 15 s </div> </div> </a> </li> <li class="toc-item"> <a data-tracking-control-name="learning-course_tocItem" data-tracking-will-navigate href="https://fr.linkedin.com/learning/decouvrir-le-material-design/se-servir-des-grilles?autoplay=true&trk=learning-course_tocItem" class="toc-item__link" aria-current="false"> <span class="a11y-text">(Verrouillé)</span> <icon class="table-of-contents__item-status table-of-contents__item-status--locked" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cfu0devb5o77ym5x8vv0oilfz" data-svg-class-name="table-of-contents__item-status-svg--locked"></icon> <div class="table-of-contents__item-details"> <div class="table-of-contents__item-title"> Se servir des grilles </div> <div class="table-of-contents__item-duration"> 1 m 52 s </div> </div> </a> </li> <li class="toc-item"> <a data-tracking-control-name="learning-course_tocItem" data-tracking-will-navigate href="https://fr.linkedin.com/learning/decouvrir-le-material-design/maitriser-les-alignements-et-les-marges?autoplay=true&trk=learning-course_tocItem" class="toc-item__link" aria-current="false"> <span class="a11y-text">(Verrouillé)</span> <icon class="table-of-contents__item-status table-of-contents__item-status--locked" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cfu0devb5o77ym5x8vv0oilfz" data-svg-class-name="table-of-contents__item-status-svg--locked"></icon> <div class="table-of-contents__item-details"> <div class="table-of-contents__item-title"> Maîtriser les alignements et les marges </div> <div class="table-of-contents__item-duration"> 2 m 31 s </div> </div> </a> </li> <li class="toc-item"> <a data-tracking-control-name="learning-course_tocItem" data-tracking-will-navigate href="https://fr.linkedin.com/learning/decouvrir-le-material-design/decouvrir-les-themes-responsifs?autoplay=true&trk=learning-course_tocItem" class="toc-item__link" aria-current="false"> <span class="a11y-text">(Verrouillé)</span> <icon class="table-of-contents__item-status table-of-contents__item-status--locked" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cfu0devb5o77ym5x8vv0oilfz" data-svg-class-name="table-of-contents__item-status-svg--locked"></icon> <div class="table-of-contents__item-details"> <div class="table-of-contents__item-title"> Découvrir les thèmes responsifs </div> <div class="table-of-contents__item-duration"> 1 m 59 s </div> </div> </a> </li> <li class="toc-item"> <a data-tracking-control-name="learning-course_tocItem" data-tracking-will-navigate href="https://fr.linkedin.com/learning/decouvrir-le-material-design/examiner-les-proportions-les-incrementations-et-le-touche?autoplay=true&trk=learning-course_tocItem" class="toc-item__link" aria-current="false"> <span class="a11y-text">(Verrouillé)</span> <icon class="table-of-contents__item-status table-of-contents__item-status--locked" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cfu0devb5o77ym5x8vv0oilfz" data-svg-class-name="table-of-contents__item-status-svg--locked"></icon> <div class="table-of-contents__item-details"> <div class="table-of-contents__item-title"> Examiner les proportions, les incrémentations et le touché </div> <div class="table-of-contents__item-duration"> 3 m 33 s </div> </div> </a> </li> <li class="toc-item"> <a data-tracking-control-name="learning-course_tocItem" data-tracking-will-navigate href="https://fr.linkedin.com/learning/decouvrir-le-material-design/comprendre-la-structure?autoplay=true&trk=learning-course_tocItem" class="toc-item__link" aria-current="false"> <span class="a11y-text">(Verrouillé)</span> <icon class="table-of-contents__item-status table-of-contents__item-status--locked" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cfu0devb5o77ym5x8vv0oilfz" data-svg-class-name="table-of-contents__item-status-svg--locked"></icon> <div class="table-of-contents__item-details"> <div class="table-of-contents__item-title"> Comprendre la structure </div> <div class="table-of-contents__item-duration"> 3 m 1 s </div> </div> </a> </li> <li class="toc-item"> <a data-tracking-control-name="learning-course_tocItem" data-tracking-will-navigate href="https://fr.linkedin.com/learning/decouvrir-le-material-design/utiliser-les-barres-de-navigation-et-d-outils?autoplay=true&trk=learning-course_tocItem" class="toc-item__link" aria-current="false"> <span class="a11y-text">(Verrouillé)</span> <icon class="table-of-contents__item-status table-of-contents__item-status--locked" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cfu0devb5o77ym5x8vv0oilfz" data-svg-class-name="table-of-contents__item-status-svg--locked"></icon> <div class="table-of-contents__item-details"> <div class="table-of-contents__item-title"> Utiliser les barres de navigation et d'outils </div> <div class="table-of-contents__item-duration"> 4 m 16 s </div> </div> </a> </li> </ul>  </div> </li> <li class="toc-section"> <div class="show-more-less"> <button class="show-more-less__button show-more-less__more-button show-more-less-button " aria-expanded="false" data-tracking-control-name="learning-course_toc-section_show_more"> 6. Connaître les composants <icon class="show-more-less__button--chevron show-more-less-button-icon" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cyolgscd0imw2ldqppkrb84vo"></icon> </button> <button class="show-more-less__button show-more-less__less-button show-more-less-button show-more-less__button--hide" aria-expanded="false" data-tracking-control-name="learning-course_toc-section_show_more"> 6. Connaître les composants <icon class="show-more-less__button--chevron show-more-less-button-icon" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/4chtt12k98xwnba1nimld2oyg"></icon> </button> <ul data-max-num-to-show="0" class="show-more-less__list show-more-less__list--hide-after-0" data-impression-id="learning-course_toc-section_show-more-less"> <li class="toc-item"> <a data-tracking-control-name="learning-course_tocItem" data-tracking-will-navigate href="https://fr.linkedin.com/learning/decouvrir-le-material-design/exploiter-les-panneaux-deroulants?autoplay=true&trk=learning-course_tocItem" class="toc-item__link" aria-current="false"> <span class="a11y-text">(Verrouillé)</span> <icon class="table-of-contents__item-status table-of-contents__item-status--locked" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cfu0devb5o77ym5x8vv0oilfz" data-svg-class-name="table-of-contents__item-status-svg--locked"></icon> <div class="table-of-contents__item-details"> <div class="table-of-contents__item-title"> Exploiter les panneaux déroulants </div> <div class="table-of-contents__item-duration"> 1 m 55 s </div> </div> </a> </li> <li class="toc-item"> <a data-tracking-control-name="learning-course_tocItem" data-tracking-will-navigate href="https://fr.linkedin.com/learning/decouvrir-le-material-design/utiliser-les-boutons?autoplay=true&trk=learning-course_tocItem" class="toc-item__link" aria-current="false"> <span class="a11y-text">(Verrouillé)</span> <icon class="table-of-contents__item-status table-of-contents__item-status--locked" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cfu0devb5o77ym5x8vv0oilfz" data-svg-class-name="table-of-contents__item-status-svg--locked"></icon> <div class="table-of-contents__item-details"> <div class="table-of-contents__item-title"> Utiliser les boutons </div> <div class="table-of-contents__item-duration"> 5 m 21 s </div> </div> </a> </li> <li class="toc-item"> <a data-tracking-control-name="learning-course_tocItem" data-tracking-will-navigate href="https://fr.linkedin.com/learning/decouvrir-le-material-design/se-servir-des-cartes?autoplay=true&trk=learning-course_tocItem" class="toc-item__link" aria-current="false"> <span class="a11y-text">(Verrouillé)</span> <icon class="table-of-contents__item-status table-of-contents__item-status--locked" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cfu0devb5o77ym5x8vv0oilfz" data-svg-class-name="table-of-contents__item-status-svg--locked"></icon> <div class="table-of-contents__item-details"> <div class="table-of-contents__item-title"> Se servir des cartes </div> <div class="table-of-contents__item-duration"> 3 m 35 s </div> </div> </a> </li> <li class="toc-item"> <a data-tracking-control-name="learning-course_tocItem" data-tracking-will-navigate href="https://fr.linkedin.com/learning/decouvrir-le-material-design/maitriser-les-chips-et-les-pastilles?autoplay=true&trk=learning-course_tocItem" class="toc-item__link" aria-current="false"> <span class="a11y-text">(Verrouillé)</span> <icon class="table-of-contents__item-status table-of-contents__item-status--locked" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cfu0devb5o77ym5x8vv0oilfz" data-svg-class-name="table-of-contents__item-status-svg--locked"></icon> <div class="table-of-contents__item-details"> <div class="table-of-contents__item-title"> Maîtriser les chips et les pastilles </div> <div class="table-of-contents__item-duration"> 1 m 42 s </div> </div> </a> </li> <li class="toc-item"> <a data-tracking-control-name="learning-course_tocItem" data-tracking-will-navigate href="https://fr.linkedin.com/learning/decouvrir-le-material-design/decouvrir-les-boites-de-dialogue?autoplay=true&trk=learning-course_tocItem" class="toc-item__link" aria-current="false"> <span class="a11y-text">(Verrouillé)</span> <icon class="table-of-contents__item-status table-of-contents__item-status--locked" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cfu0devb5o77ym5x8vv0oilfz" data-svg-class-name="table-of-contents__item-status-svg--locked"></icon> <div class="table-of-contents__item-details"> <div class="table-of-contents__item-title"> Découvrir les boîtes de dialogue </div> <div class="table-of-contents__item-duration"> 3 m 27 s </div> </div> </a> </li> <li class="toc-item"> <a data-tracking-control-name="learning-course_tocItem" data-tracking-will-navigate href="https://fr.linkedin.com/learning/decouvrir-le-material-design/examiner-les-separateurs?autoplay=true&trk=learning-course_tocItem" class="toc-item__link" aria-current="false"> <span class="a11y-text">(Verrouillé)</span> <icon class="table-of-contents__item-status table-of-contents__item-status--locked" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cfu0devb5o77ym5x8vv0oilfz" data-svg-class-name="table-of-contents__item-status-svg--locked"></icon> <div class="table-of-contents__item-details"> <div class="table-of-contents__item-title"> Examiner les séparateurs </div> <div class="table-of-contents__item-duration"> 2 m 58 s </div> </div> </a> </li> <li class="toc-item"> <a data-tracking-control-name="learning-course_tocItem" data-tracking-will-navigate href="https://fr.linkedin.com/learning/decouvrir-le-material-design/comprendre-les-grilles?autoplay=true&trk=learning-course_tocItem" class="toc-item__link" aria-current="false"> <span class="a11y-text">(Verrouillé)</span> <icon class="table-of-contents__item-status table-of-contents__item-status--locked" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cfu0devb5o77ym5x8vv0oilfz" data-svg-class-name="table-of-contents__item-status-svg--locked"></icon> <div class="table-of-contents__item-details"> <div class="table-of-contents__item-title"> Comprendre les grilles </div> <div class="table-of-contents__item-duration"> 2 m 8 s </div> </div> </a> </li> <li class="toc-item"> <a data-tracking-control-name="learning-course_tocItem" data-tracking-will-navigate href="https://fr.linkedin.com/learning/decouvrir-le-material-design/en-savoir-plus-sur-les-listes?autoplay=true&trk=learning-course_tocItem" class="toc-item__link" aria-current="false"> <span class="a11y-text">(Verrouillé)</span> <icon class="table-of-contents__item-status table-of-contents__item-status--locked" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cfu0devb5o77ym5x8vv0oilfz" data-svg-class-name="table-of-contents__item-status-svg--locked"></icon> <div class="table-of-contents__item-details"> <div class="table-of-contents__item-title"> En savoir plus sur les listes </div> <div class="table-of-contents__item-duration"> 3 m 54 s </div> </div> </a> </li> <li class="toc-item"> <a data-tracking-control-name="learning-course_tocItem" data-tracking-will-navigate href="https://fr.linkedin.com/learning/decouvrir-le-material-design/maitriser-les-menus?autoplay=true&trk=learning-course_tocItem" class="toc-item__link" aria-current="false"> <span class="a11y-text">(Verrouillé)</span> <icon class="table-of-contents__item-status table-of-contents__item-status--locked" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cfu0devb5o77ym5x8vv0oilfz" data-svg-class-name="table-of-contents__item-status-svg--locked"></icon> <div class="table-of-contents__item-details"> <div class="table-of-contents__item-title"> Maîtriser les menus </div> <div class="table-of-contents__item-duration"> 3 m 49 s </div> </div> </a> </li> <li class="toc-item"> <a data-tracking-control-name="learning-course_tocItem" data-tracking-will-navigate href="https://fr.linkedin.com/learning/decouvrir-le-material-design/gerer-les-selecteurs-de-calendrier?autoplay=true&trk=learning-course_tocItem" class="toc-item__link" aria-current="false"> <span class="a11y-text">(Verrouillé)</span> <icon class="table-of-contents__item-status table-of-contents__item-status--locked" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cfu0devb5o77ym5x8vv0oilfz" data-svg-class-name="table-of-contents__item-status-svg--locked"></icon> <div class="table-of-contents__item-details"> <div class="table-of-contents__item-title"> Gérer les sélecteurs de calendrier </div> <div class="table-of-contents__item-duration"> 1 m 22 s </div> </div> </a> </li> <li class="toc-item"> <a data-tracking-control-name="learning-course_tocItem" data-tracking-will-navigate href="https://fr.linkedin.com/learning/decouvrir-le-material-design/connaitre-les-indicateurs-de-progression?autoplay=true&trk=learning-course_tocItem" class="toc-item__link" aria-current="false"> <span class="a11y-text">(Verrouillé)</span> <icon class="table-of-contents__item-status table-of-contents__item-status--locked" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cfu0devb5o77ym5x8vv0oilfz" data-svg-class-name="table-of-contents__item-status-svg--locked"></icon> <div class="table-of-contents__item-details"> <div class="table-of-contents__item-title"> Connaître les indicateurs de progression </div> <div class="table-of-contents__item-duration"> 1 m 48 s </div> </div> </a> </li> <li class="toc-item"> <a data-tracking-control-name="learning-course_tocItem" data-tracking-will-navigate href="https://fr.linkedin.com/learning/decouvrir-le-material-design/exploiter-les-curseurs?autoplay=true&trk=learning-course_tocItem" class="toc-item__link" aria-current="false"> <span class="a11y-text">(Verrouillé)</span> <icon class="table-of-contents__item-status table-of-contents__item-status--locked" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cfu0devb5o77ym5x8vv0oilfz" data-svg-class-name="table-of-contents__item-status-svg--locked"></icon> <div class="table-of-contents__item-details"> <div class="table-of-contents__item-title"> Exploiter les curseurs </div> <div class="table-of-contents__item-duration"> 2 m 38 s </div> </div> </a> </li> <li class="toc-item"> <a data-tracking-control-name="learning-course_tocItem" data-tracking-will-navigate href="https://fr.linkedin.com/learning/decouvrir-le-material-design/utiliser-les-interrupteurs?autoplay=true&trk=learning-course_tocItem" class="toc-item__link" aria-current="false"> <span class="a11y-text">(Verrouillé)</span> <icon class="table-of-contents__item-status table-of-contents__item-status--locked" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cfu0devb5o77ym5x8vv0oilfz" data-svg-class-name="table-of-contents__item-status-svg--locked"></icon> <div class="table-of-contents__item-details"> <div class="table-of-contents__item-title"> Utiliser les interrupteurs </div> <div class="table-of-contents__item-duration"> 1 m 40 s </div> </div> </a> </li> <li class="toc-item"> <a data-tracking-control-name="learning-course_tocItem" data-tracking-will-navigate href="https://fr.linkedin.com/learning/decouvrir-le-material-design/se-servir-des-onglets?autoplay=true&trk=learning-course_tocItem" class="toc-item__link" aria-current="false"> <span class="a11y-text">(Verrouillé)</span> <icon class="table-of-contents__item-status table-of-contents__item-status--locked" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cfu0devb5o77ym5x8vv0oilfz" data-svg-class-name="table-of-contents__item-status-svg--locked"></icon> <div class="table-of-contents__item-details"> <div class="table-of-contents__item-title"> Se servir des onglets </div> <div class="table-of-contents__item-duration"> 2 m 44 s </div> </div> </a> </li> <li class="toc-item"> <a data-tracking-control-name="learning-course_tocItem" data-tracking-will-navigate href="https://fr.linkedin.com/learning/decouvrir-le-material-design/maitriser-les-champs-texte?autoplay=true&trk=learning-course_tocItem" class="toc-item__link" aria-current="false"> <span class="a11y-text">(Verrouillé)</span> <icon class="table-of-contents__item-status table-of-contents__item-status--locked" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cfu0devb5o77ym5x8vv0oilfz" data-svg-class-name="table-of-contents__item-status-svg--locked"></icon> <div class="table-of-contents__item-details"> <div class="table-of-contents__item-title"> Maîtriser les champs texte </div> <div class="table-of-contents__item-duration"> 2 m 55 s </div> </div> </a> </li> <li class="toc-item"> <a data-tracking-control-name="learning-course_tocItem" data-tracking-will-navigate href="https://fr.linkedin.com/learning/decouvrir-le-material-design/decouvrir-les-infobulles?autoplay=true&trk=learning-course_tocItem" class="toc-item__link" aria-current="false"> <span class="a11y-text">(Verrouillé)</span> <icon class="table-of-contents__item-status table-of-contents__item-status--locked" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cfu0devb5o77ym5x8vv0oilfz" data-svg-class-name="table-of-contents__item-status-svg--locked"></icon> <div class="table-of-contents__item-details"> <div class="table-of-contents__item-title"> Découvrir les infobulles </div> <div class="table-of-contents__item-duration"> 2 m 46 s </div> </div> </a> </li> </ul>  </div> </li> <li class="toc-section"> <div class="show-more-less"> <button class="show-more-less__button show-more-less__more-button show-more-less-button " aria-expanded="false" data-tracking-control-name="learning-course_toc-section_show_more"> 7. Comprendre les modèles d'interaction <icon class="show-more-less__button--chevron show-more-less-button-icon" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cyolgscd0imw2ldqppkrb84vo"></icon> </button> <button class="show-more-less__button show-more-less__less-button show-more-less-button show-more-less__button--hide" aria-expanded="false" data-tracking-control-name="learning-course_toc-section_show_more"> 7. Comprendre les modèles d'interaction <icon class="show-more-less__button--chevron show-more-less-button-icon" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/4chtt12k98xwnba1nimld2oyg"></icon> </button> <ul data-max-num-to-show="0" class="show-more-less__list show-more-less__list--hide-after-0" data-impression-id="learning-course_toc-section_show-more-less"> <li class="toc-item"> <a data-tracking-control-name="learning-course_tocItem" data-tracking-will-navigate href="https://fr.linkedin.com/learning/decouvrir-le-material-design/connaitre-les-formats-et-les-erreurs?autoplay=true&trk=learning-course_tocItem" class="toc-item__link" aria-current="false"> <span class="a11y-text">(Verrouillé)</span> <icon class="table-of-contents__item-status table-of-contents__item-status--locked" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cfu0devb5o77ym5x8vv0oilfz" data-svg-class-name="table-of-contents__item-status-svg--locked"></icon> <div class="table-of-contents__item-details"> <div class="table-of-contents__item-title"> Connaître les formats et les erreurs </div> <div class="table-of-contents__item-duration"> 2 m 29 s </div> </div> </a> </li> <li class="toc-item"> <a data-tracking-control-name="learning-course_tocItem" data-tracking-will-navigate href="https://fr.linkedin.com/learning/decouvrir-le-material-design/en-savoir-plus-sur-la-gestuelle?autoplay=true&trk=learning-course_tocItem" class="toc-item__link" aria-current="false"> <span class="a11y-text">(Verrouillé)</span> <icon class="table-of-contents__item-status table-of-contents__item-status--locked" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cfu0devb5o77ym5x8vv0oilfz" data-svg-class-name="table-of-contents__item-status-svg--locked"></icon> <div class="table-of-contents__item-details"> <div class="table-of-contents__item-title"> En savoir plus sur la gestuelle </div> <div class="table-of-contents__item-duration"> 1 m 15 s </div> </div> </a> </li> <li class="toc-item"> <a data-tracking-control-name="learning-course_tocItem" data-tracking-will-navigate href="https://fr.linkedin.com/learning/decouvrir-le-material-design/parametrer-le-chargement-des-images?autoplay=true&trk=learning-course_tocItem" class="toc-item__link" aria-current="false"> <span class="a11y-text">(Verrouillé)</span> <icon class="table-of-contents__item-status table-of-contents__item-status--locked" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cfu0devb5o77ym5x8vv0oilfz" data-svg-class-name="table-of-contents__item-status-svg--locked"></icon> <div class="table-of-contents__item-details"> <div class="table-of-contents__item-title"> Paramétrer le chargement des images </div> <div class="table-of-contents__item-duration"> 1 m 39 s </div> </div> </a> </li> <li class="toc-item"> <a data-tracking-control-name="learning-course_tocItem" data-tracking-will-navigate href="https://fr.linkedin.com/learning/decouvrir-le-material-design/positionner-le-panneau-de-navigation?autoplay=true&trk=learning-course_tocItem" class="toc-item__link" aria-current="false"> <span class="a11y-text">(Verrouillé)</span> <icon class="table-of-contents__item-status table-of-contents__item-status--locked" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cfu0devb5o77ym5x8vv0oilfz" data-svg-class-name="table-of-contents__item-status-svg--locked"></icon> <div class="table-of-contents__item-details"> <div class="table-of-contents__item-title"> Positionner le panneau de navigation </div> <div class="table-of-contents__item-duration"> 1 m 31 s </div> </div> </a> </li> <li class="toc-item"> <a data-tracking-control-name="learning-course_tocItem" data-tracking-will-navigate href="https://fr.linkedin.com/learning/decouvrir-le-material-design/proposer-des-transitions?autoplay=true&trk=learning-course_tocItem" class="toc-item__link" aria-current="false"> <span class="a11y-text">(Verrouillé)</span> <icon class="table-of-contents__item-status table-of-contents__item-status--locked" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cfu0devb5o77ym5x8vv0oilfz" data-svg-class-name="table-of-contents__item-status-svg--locked"></icon> <div class="table-of-contents__item-details"> <div class="table-of-contents__item-title"> Proposer des transitions </div> <div class="table-of-contents__item-duration"> 1 m 21 s </div> </div> </a> </li> <li class="toc-item"> <a data-tracking-control-name="learning-course_tocItem" data-tracking-will-navigate href="https://fr.linkedin.com/learning/decouvrir-le-material-design/accompagner-le-defilement?autoplay=true&trk=learning-course_tocItem" class="toc-item__link" aria-current="false"> <span class="a11y-text">(Verrouillé)</span> <icon class="table-of-contents__item-status table-of-contents__item-status--locked" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cfu0devb5o77ym5x8vv0oilfz" data-svg-class-name="table-of-contents__item-status-svg--locked"></icon> <div class="table-of-contents__item-details"> <div class="table-of-contents__item-title"> Accompagner le défilement </div> <div class="table-of-contents__item-duration"> 2 m 39 s </div> </div> </a> </li> <li class="toc-item"> <a data-tracking-control-name="learning-course_tocItem" data-tracking-will-navigate href="https://fr.linkedin.com/learning/decouvrir-le-material-design/mettre-en-place-la-recherche?autoplay=true&trk=learning-course_tocItem" class="toc-item__link" aria-current="false"> <span class="a11y-text">(Verrouillé)</span> <icon class="table-of-contents__item-status table-of-contents__item-status--locked" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cfu0devb5o77ym5x8vv0oilfz" data-svg-class-name="table-of-contents__item-status-svg--locked"></icon> <div class="table-of-contents__item-details"> <div class="table-of-contents__item-title"> Mettre en place la recherche </div> <div class="table-of-contents__item-duration"> 1 m 39 s </div> </div> </a> </li> <li class="toc-item"> <a data-tracking-control-name="learning-course_tocItem" data-tracking-will-navigate href="https://fr.linkedin.com/learning/decouvrir-le-material-design/gerer-la-selection?autoplay=true&trk=learning-course_tocItem" class="toc-item__link" aria-current="false"> <span class="a11y-text">(Verrouillé)</span> <icon class="table-of-contents__item-status table-of-contents__item-status--locked" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cfu0devb5o77ym5x8vv0oilfz" data-svg-class-name="table-of-contents__item-status-svg--locked"></icon> <div class="table-of-contents__item-details"> <div class="table-of-contents__item-title"> Gérer la sélection </div> <div class="table-of-contents__item-duration"> 1 m 48 s </div> </div> </a> </li> </ul>  </div> </li> <li class="toc-section"> <div class="show-more-less"> <button class="show-more-less__button show-more-less__more-button show-more-less-button " aria-expanded="false" data-tracking-control-name="learning-course_toc-section_show_more"> 8. Ne pas oublier l'accessibilité <icon class="show-more-less__button--chevron show-more-less-button-icon" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cyolgscd0imw2ldqppkrb84vo"></icon> </button> <button class="show-more-less__button show-more-less__less-button show-more-less-button show-more-less__button--hide" aria-expanded="false" data-tracking-control-name="learning-course_toc-section_show_more"> 8. Ne pas oublier l'accessibilité <icon class="show-more-less__button--chevron show-more-less-button-icon" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/4chtt12k98xwnba1nimld2oyg"></icon> </button> <ul data-max-num-to-show="0" class="show-more-less__list show-more-less__list--hide-after-0" data-impression-id="learning-course_toc-section_show-more-less"> <li class="toc-item"> <a data-tracking-control-name="learning-course_tocItem" data-tracking-will-navigate href="https://fr.linkedin.com/learning/decouvrir-le-material-design/gerer-le-handicap?autoplay=true&trk=learning-course_tocItem" class="toc-item__link" aria-current="false"> <span class="a11y-text">(Verrouillé)</span> <icon class="table-of-contents__item-status table-of-contents__item-status--locked" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cfu0devb5o77ym5x8vv0oilfz" data-svg-class-name="table-of-contents__item-status-svg--locked"></icon> <div class="table-of-contents__item-details"> <div class="table-of-contents__item-title"> Gérer le handicap </div> <div class="table-of-contents__item-duration"> 2 m 3 s </div> </div> </a> </li> <li class="toc-item"> <a data-tracking-control-name="learning-course_tocItem" data-tracking-will-navigate href="https://fr.linkedin.com/learning/decouvrir-le-material-design/utiliser-la-localisation?autoplay=true&trk=learning-course_tocItem" class="toc-item__link" aria-current="false"> <span class="a11y-text">(Verrouillé)</span> <icon class="table-of-contents__item-status table-of-contents__item-status--locked" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cfu0devb5o77ym5x8vv0oilfz" data-svg-class-name="table-of-contents__item-status-svg--locked"></icon> <div class="table-of-contents__item-details"> <div class="table-of-contents__item-title"> Utiliser la localisation </div> <div class="table-of-contents__item-duration"> 2 m 19 s </div> </div> </a> </li> <li class="toc-item"> <a data-tracking-control-name="learning-course_tocItem" data-tracking-will-navigate href="https://fr.linkedin.com/learning/decouvrir-le-material-design/acceder-aux-outils-et-a-la-documentation?autoplay=true&trk=learning-course_tocItem" class="toc-item__link" aria-current="false"> <span class="a11y-text">(Verrouillé)</span> <icon class="table-of-contents__item-status table-of-contents__item-status--locked" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cfu0devb5o77ym5x8vv0oilfz" data-svg-class-name="table-of-contents__item-status-svg--locked"></icon> <div class="table-of-contents__item-details"> <div class="table-of-contents__item-title"> Accéder aux outils et à la documentation </div> <div class="table-of-contents__item-duration"> 3 m 9 s </div> </div> </a> </li> <li class="toc-item"> <a data-tracking-control-name="learning-course_tocItem" data-tracking-will-navigate href="https://fr.linkedin.com/learning/decouvrir-le-material-design/connaitre-l-avenir-du-material-design-et-du-design-fonctionnel?autoplay=true&trk=learning-course_tocItem" class="toc-item__link" aria-current="false"> <span class="a11y-text">(Verrouillé)</span> <icon class="table-of-contents__item-status table-of-contents__item-status--locked" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cfu0devb5o77ym5x8vv0oilfz" data-svg-class-name="table-of-contents__item-status-svg--locked"></icon> <div class="table-of-contents__item-details"> <div class="table-of-contents__item-title"> Connaître l'avenir du Material Design et du design fonctionnel </div> <div class="table-of-contents__item-duration"> 1 m 57 s </div> </div> </a> </li> </ul>  </div> </li> </ul> </section> </section> </main> <div class="pre-footer "> <section class="core-section-container my-3 price-disclaimer">    <div class="core-section-container__content break-words"> <p class="price-disclaimer__copy"> <sup class="price-disclaimer__copy--sup">*</sup>Le prix peut varier en fonction des informations relatives au profil et au pays de facturation saisies lors de l’identification ou de l’inscription </p> </div> </section> <section class="tw-linkster bg-cool-gray-20 browse-map" data-impression-id="learning-course_linkster" data-js-module-id="linkster"> <div class="max-w-screen-content-max-w w-full flex justify-between my-0 mx-auto mamabear:px-3 babybear:px-2 babybear:flex-col"> <div class="flex-1 w-1/2 pt-2 pr-4 pb-4 pl-0 babybear:pb-2 babybear:w-full babybear:border-b-1 babybear:border-solid babybear:border-color-border-low-emphasis babybear:last:border-b-0"> <h3 class="text-md font-bold text-color-text leading-open"> Parcourez la catégorie business </h3> <ul class="my-1"> <li class="tw-link-column-item"> <a class="link tw-linkster-link" href="https://fr.linkedin.com/learning/topics/strategie-et-analyse-metier?trk=learning-course_browsemap_link" data-js-module-id="link-column-link" data-tracking-control-name="learning-course_browsemap_link" data-tracking-will-navigate> Analyse et stratégie d'affaires </a> </li> <li class="tw-link-column-item"> <a class="link tw-linkster-link" href="https://fr.linkedin.com/learning/topics/leadership-et-developpement-professionnel?trk=learning-course_browsemap_link" data-js-module-id="link-column-link" data-tracking-control-name="learning-course_browsemap_link" data-tracking-will-navigate> Compétences professionnelles </a> </li> <li class="tw-link-column-item"> <a class="link tw-linkster-link" href="https://fr.linkedin.com/learning/topics/diversite-equite-et-inclusion-dei?trk=learning-course_browsemap_link" data-js-module-id="link-column-link" data-tracking-control-name="learning-course_browsemap_link" data-tracking-will-navigate> Diversité, équité, et inclusion (DEI&B) </a> </li> <li class="tw-link-column-item"> <a class="link tw-linkster-link" href="https://fr.linkedin.com/learning/topics/developpement-de-carriere-16111848?trk=learning-course_browsemap_link" data-js-module-id="link-column-link" data-tracking-control-name="learning-course_browsemap_link" data-tracking-will-navigate> Développement de carrière </a> </li> <li class="tw-link-column-item"> <a class="link tw-linkster-link" href="https://fr.linkedin.com/learning/topics/enseignement-et-pedagogie-16116198?trk=learning-course_browsemap_link" data-js-module-id="link-column-link" data-tracking-control-name="learning-course_browsemap_link" data-tracking-will-navigate> Enseignement et pédagogie </a> </li> <li class="tw-link-column-item"> <a class="link tw-linkster-link" href="https://fr.linkedin.com/learning/topics/finance-et-comptabilite?trk=learning-course_browsemap_link" data-js-module-id="link-column-link" data-tracking-control-name="learning-course_browsemap_link" data-tracking-will-navigate> Finance et comptabilité </a> </li> <li class="tw-link-column-item"> <a class="link tw-linkster-link" href="https://fr.linkedin.com/learning/topics/gestion-de-projet-16112729?trk=learning-course_browsemap_link" data-js-module-id="link-column-link" data-tracking-control-name="learning-course_browsemap_link" data-tracking-will-navigate> Gestion de projet </a> </li> <li class="tw-link-column-item"> <a class="link tw-linkster-link" href="https://fr.linkedin.com/learning/topics/leadership-et-management-16112728?trk=learning-course_browsemap_link" data-js-module-id="link-column-link" data-tracking-control-name="learning-course_browsemap_link" data-tracking-will-navigate> Leadership et management </a> </li> <li class="tw-link-column-item"> <a class="link tw-linkster-link" href="https://fr.linkedin.com/learning/topics/marketing-3?trk=learning-course_browsemap_link" data-js-module-id="link-column-link" data-tracking-control-name="learning-course_browsemap_link" data-tracking-will-navigate> Marketing </a> </li> <li class="tw-link-column-item"> <a class="link tw-linkster-link" href="https://fr.linkedin.com/learning/topics/outils-et-logiciels-bureautiques?trk=learning-course_browsemap_link" data-js-module-id="link-column-link" data-tracking-control-name="learning-course_browsemap_link" data-tracking-will-navigate> Outils et logiciels bureautiques </a> </li> <li class="tw-link-column-item"> <a class="link tw-linkster-link" href="https://fr.linkedin.com/learning/topics/petites-entreprises-et-entrepreneuriat?trk=learning-course_browsemap_link" data-js-module-id="link-column-link" data-tracking-control-name="learning-course_browsemap_link" data-tracking-will-navigate> Petites entreprises et entrepreneuriat </a> </li> <li class="tw-link-column-item"> <a class="link tw-linkster-link" href="https://fr.linkedin.com/learning/topics/ressources-humaines-16117026?trk=learning-course_browsemap_link" data-js-module-id="link-column-link" data-tracking-control-name="learning-course_browsemap_link" data-tracking-will-navigate> Ressources humaines </a> </li> <li class="tw-link-column-item"> <a class="link tw-linkster-link" href="https://fr.linkedin.com/learning/topics/service-clients-16113696?trk=learning-course_browsemap_link" data-js-module-id="link-column-link" data-tracking-control-name="learning-course_browsemap_link" data-tracking-will-navigate> Service client </a> </li> <li class="tw-link-column-item"> <a class="link tw-linkster-link" href="https://fr.linkedin.com/learning/topics/ventes-16114566?trk=learning-course_browsemap_link" data-js-module-id="link-column-link" data-tracking-control-name="learning-course_browsemap_link" data-tracking-will-navigate> Ventes </a> </li> </ul> <a class="link tw-linkster-general-link" aria-label="Voir tous les cours en business" href="https://fr.linkedin.com/learning/topics/business-2?trk=learning-course_browsemap_general-link" data-tracking-control-name="learning-course_browsemap_general-link" data-tracking-will-navigate> Tout voir </a> </div> <div class="flex-1 w-1/2 pt-2 pr-4 pb-4 pl-0 babybear:pb-2 babybear:w-full babybear:border-b-1 babybear:border-solid babybear:border-color-border-low-emphasis babybear:last:border-b-0"> <h3 class="text-md font-bold text-color-text leading-open"> Parcourez la catégorie créativité </h3> <ul class="my-1"> <li class="tw-link-column-item"> <a class="link tw-linkster-link" href="https://fr.linkedin.com/learning/topics/aic-architecture-ingenierie-et-construction?trk=learning-course_browsemap_link" data-js-module-id="link-column-link" data-tracking-control-name="learning-course_browsemap_link" data-tracking-will-navigate> AIC (Architecture, ingénierie et construction) </a> </li> <li class="tw-link-column-item"> <a class="link tw-linkster-link" href="https://fr.linkedin.com/learning/topics/animation-et-illustration?trk=learning-course_browsemap_link" data-js-module-id="link-column-link" data-tracking-control-name="learning-course_browsemap_link" data-tracking-will-navigate> Animation et illustration </a> </li> <li class="tw-link-column-item"> <a class="link tw-linkster-link" href="https://fr.linkedin.com/learning/topics/audio-et-musique?trk=learning-course_browsemap_link" data-js-module-id="link-column-link" data-tracking-control-name="learning-course_browsemap_link" data-tracking-will-navigate> Audio et musique </a> </li> <li class="tw-link-column-item"> <a class="link tw-linkster-link" href="https://fr.linkedin.com/learning/topics/design-web-et-ux?trk=learning-course_browsemap_link" data-js-module-id="link-column-link" data-tracking-control-name="learning-course_browsemap_link" data-tracking-will-navigate> Design web </a> </li> <li class="tw-link-column-item"> <a class="link tw-linkster-link" href="https://fr.linkedin.com/learning/topics/experience-utilisateur-16115211?trk=learning-course_browsemap_link" data-js-module-id="link-column-link" data-tracking-control-name="learning-course_browsemap_link" data-tracking-will-navigate> Expérience utilisateur </a> </li> <li class="tw-link-column-item"> <a class="link tw-linkster-link" href="https://fr.linkedin.com/learning/topics/fabrication-de-produit?trk=learning-course_browsemap_link" data-js-module-id="link-column-link" data-tracking-control-name="learning-course_browsemap_link" data-tracking-will-navigate> Fabrication de produit </a> </li> <li class="tw-link-column-item"> <a class="link tw-linkster-link" href="https://fr.linkedin.com/learning/topics/graphisme?trk=learning-course_browsemap_link" data-js-module-id="link-column-link" data-tracking-control-name="learning-course_browsemap_link" data-tracking-will-navigate> Graphisme </a> </li> <li class="tw-link-column-item"> <a class="link tw-linkster-link" href="https://fr.linkedin.com/learning/topics/motion-graphics-et-effet-speciaux-vfx?trk=learning-course_browsemap_link" data-js-module-id="link-column-link" data-tracking-control-name="learning-course_browsemap_link" data-tracking-will-navigate> Motion graphics et effet spéciaux (VFX) </a> </li> <li class="tw-link-column-item"> <a class="link tw-linkster-link" href="https://fr.linkedin.com/learning/topics/retouche-d-images-photographie-2?trk=learning-course_browsemap_link" data-js-module-id="link-column-link" data-tracking-control-name="learning-course_browsemap_link" data-tracking-will-navigate> Retouche d'images & Photographie </a> </li> <li class="tw-link-column-item"> <a class="link tw-linkster-link" href="https://fr.linkedin.com/learning/topics/video-audio-2?trk=learning-course_browsemap_link" data-js-module-id="link-column-link" data-tracking-control-name="learning-course_browsemap_link" data-tracking-will-navigate> Vidéo </a> </li> <li class="tw-link-column-item"> <a class="link tw-linkster-link" href="https://fr.linkedin.com/learning/topics/visualisation-et-temps-reel?trk=learning-course_browsemap_link" data-js-module-id="link-column-link" data-tracking-control-name="learning-course_browsemap_link" data-tracking-will-navigate> Visualisation et temps réel </a> </li> </ul> <a class="link tw-linkster-general-link" aria-label="Voir tous les cours en créativité" href="https://fr.linkedin.com/learning/topics/creativite?trk=learning-course_browsemap_general-link" data-tracking-control-name="learning-course_browsemap_general-link" data-tracking-will-navigate> Tout voir </a> </div> <div class="flex-1 w-1/2 pt-2 pr-4 pb-4 pl-0 babybear:pb-2 babybear:w-full babybear:border-b-1 babybear:border-solid babybear:border-color-border-low-emphasis babybear:last:border-b-0"> <h3 class="text-md font-bold text-color-text leading-open"> Parcourez la catégorie technologie </h3> <ul class="my-1"> <li class="tw-link-column-item"> <a class="link tw-linkster-link" href="https://fr.linkedin.com/learning/topics/cloud-computing?trk=learning-course_browsemap_link" data-js-module-id="link-column-link" data-tracking-control-name="learning-course_browsemap_link" data-tracking-will-navigate> Administration système et réseaux </a> </li> <li class="tw-link-column-item"> <a class="link tw-linkster-link" href="https://fr.linkedin.com/learning/topics/cloud-computing-16114570?trk=learning-course_browsemap_link" data-js-module-id="link-column-link" data-tracking-control-name="learning-course_browsemap_link" data-tracking-will-navigate> Cloud Computing </a> </li> <li class="tw-link-column-item"> <a class="link tw-linkster-link" href="https://fr.linkedin.com/learning/topics/securite?trk=learning-course_browsemap_link" data-js-module-id="link-column-link" data-tracking-control-name="learning-course_browsemap_link" data-tracking-will-navigate> Cybersécurité </a> </li> <li class="tw-link-column-item"> <a class="link tw-linkster-link" href="https://fr.linkedin.com/learning/topics/data-science-16113699?trk=learning-course_browsemap_link" data-js-module-id="link-column-link" data-tracking-control-name="learning-course_browsemap_link" data-tracking-will-navigate> Data science </a> </li> <li class="tw-link-column-item"> <a class="link tw-linkster-link" href="https://fr.linkedin.com/learning/topics/devops-16110802?trk=learning-course_browsemap_link" data-js-module-id="link-column-link" data-tracking-control-name="learning-course_browsemap_link" data-tracking-will-navigate> DevOps </a> </li> <li class="tw-link-column-item"> <a class="link tw-linkster-link" href="https://fr.linkedin.com/learning/topics/developpement-logiciel?trk=learning-course_browsemap_link" data-js-module-id="link-column-link" data-tracking-control-name="learning-course_browsemap_link" data-tracking-will-navigate> Développement logiciel </a> </li> <li class="tw-link-column-item"> <a class="link tw-linkster-link" href="https://fr.linkedin.com/learning/topics/developpement-mobile?trk=learning-course_browsemap_link" data-js-module-id="link-column-link" data-tracking-control-name="learning-course_browsemap_link" data-tracking-will-navigate> Développement mobile </a> </li> <li class="tw-link-column-item"> <a class="link tw-linkster-link" href="https://fr.linkedin.com/learning/topics/developpement-web?trk=learning-course_browsemap_link" data-js-module-id="link-column-link" data-tracking-control-name="learning-course_browsemap_link" data-tracking-will-navigate> Développement web </a> </li> <li class="tw-link-column-item"> <a class="link tw-linkster-link" href="https://fr.linkedin.com/learning/topics/gestion-des-bases-de-donnees?trk=learning-course_browsemap_link" data-js-module-id="link-column-link" data-tracking-control-name="learning-course_browsemap_link" data-tracking-will-navigate> Gestion des bases de données </a> </li> <li class="tw-link-column-item"> <a class="link tw-linkster-link" href="https://fr.linkedin.com/learning/topics/help-desk-it-16114571?trk=learning-course_browsemap_link" data-js-module-id="link-column-link" data-tracking-control-name="learning-course_browsemap_link" data-tracking-will-navigate> Help desk IT </a> </li> <li class="tw-link-column-item"> <a class="link tw-linkster-link" href="https://fr.linkedin.com/learning/topics/intelligence-artificielle-ia?trk=learning-course_browsemap_link" data-js-module-id="link-column-link" data-tracking-control-name="learning-course_browsemap_link" data-tracking-will-navigate> Intelligence artificielle (IA) </a> </li> <li class="tw-link-column-item"> <a class="link tw-linkster-link" href="https://fr.linkedin.com/learning/topics/materiel?trk=learning-course_browsemap_link" data-js-module-id="link-column-link" data-tracking-control-name="learning-course_browsemap_link" data-tracking-will-navigate> Matériel </a> </li> </ul> <a class="link tw-linkster-general-link" aria-label="Voir tous les cours en technologie" href="https://fr.linkedin.com/learning/topics/technologie?trk=learning-course_browsemap_general-link" data-tracking-control-name="learning-course_browsemap_general-link" data-tracking-will-navigate> Tout voir </a> </div> </div> </section> </div> <footer class="li-footer bg-transparent w-full "> <ul class="li-footer__list flex flex-wrap flex-row items-start justify-start w-full h-auto min-h-[50px] my-[0px] mx-auto py-3 px-2 papabear:w-[1128px] papabear:p-0"> <li class="li-footer__item font-sans text-xs text-color-text-low-emphasis flex flex-shrink-0 justify-start p-1 relative w-50% papabear:justify-center papabear:w-auto"> <span class="sr-only">LinkedIn</span> <icon class="li-footer__copy-logo text-color-logo-brand-alt inline-block self-center h-[14px] w-[56px] mr-1" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/e12h2cd8ac580qen9qdd0qks8"></icon> <span class="li-footer__copy-text flex items-center">© 2024</span> </li> <li class="li-footer__item font-sans text-xs text-color-text-low-emphasis flex flex-shrink-0 justify-start p-1 relative w-50% papabear:justify-center papabear:w-auto"> <a class="li-footer__item-link flex items-center font-sans text-xs font-bold text-color-text-low-emphasis hover:text-color-link-hover focus:text-color-link-focus" href="https://about.linkedin.com?trk=d_learning_course_video_guest_footer-about" data-tracking-control-name="d_learning_course_video_guest_footer-about" data-tracking-will-navigate> À propos </a> </li> <li class="li-footer__item font-sans text-xs text-color-text-low-emphasis flex flex-shrink-0 justify-start p-1 relative w-50% papabear:justify-center papabear:w-auto"> <a class="li-footer__item-link flex items-center font-sans text-xs font-bold text-color-text-low-emphasis hover:text-color-link-hover focus:text-color-link-focus" href="https://www.linkedin.com/accessibility?trk=d_learning_course_video_guest_footer-accessibility" data-tracking-control-name="d_learning_course_video_guest_footer-accessibility" data-tracking-will-navigate> Accessibilité </a> </li> <li class="li-footer__item font-sans text-xs text-color-text-low-emphasis flex flex-shrink-0 justify-start p-1 relative w-50% papabear:justify-center papabear:w-auto"> <a class="li-footer__item-link flex items-center font-sans text-xs font-bold text-color-text-low-emphasis hover:text-color-link-hover focus:text-color-link-focus" href="https://www.linkedin.com/legal/user-agreement?trk=d_learning_course_video_guest_footer-user-agreement" data-tracking-control-name="d_learning_course_video_guest_footer-user-agreement" data-tracking-will-navigate> Conditions générales d’utilisation de LinkedIn </a> </li> <li class="li-footer__item font-sans text-xs text-color-text-low-emphasis flex flex-shrink-0 justify-start p-1 relative w-50% papabear:justify-center papabear:w-auto"> <a class="li-footer__item-link flex items-center font-sans text-xs font-bold text-color-text-low-emphasis hover:text-color-link-hover focus:text-color-link-focus" href="https://www.linkedin.com/legal/privacy-policy?trk=d_learning_course_video_guest_footer-privacy-policy" data-tracking-control-name="d_learning_course_video_guest_footer-privacy-policy" data-tracking-will-navigate> Politique de confidentialité </a> </li>  <li class="li-footer__item font-sans text-xs text-color-text-low-emphasis flex flex-shrink-0 justify-start p-1 relative w-50% papabear:justify-center papabear:w-auto"> <a class="li-footer__item-link flex items-center font-sans text-xs font-bold text-color-text-low-emphasis hover:text-color-link-hover focus:text-color-link-focus" href="https://www.linkedin.com/legal/cookie-policy?trk=d_learning_course_video_guest_footer-cookie-policy" data-tracking-control-name="d_learning_course_video_guest_footer-cookie-policy" data-tracking-will-navigate> Politique relative aux cookies </a> </li> <li class="li-footer__item font-sans text-xs text-color-text-low-emphasis flex flex-shrink-0 justify-start p-1 relative w-50% papabear:justify-center papabear:w-auto"> <a class="li-footer__item-link flex items-center font-sans text-xs font-bold text-color-text-low-emphasis hover:text-color-link-hover focus:text-color-link-focus" href="https://www.linkedin.com/legal/copyright-policy?trk=d_learning_course_video_guest_footer-copyright-policy" data-tracking-control-name="d_learning_course_video_guest_footer-copyright-policy" data-tracking-will-navigate> Politique de copyright </a> </li> <li class="li-footer__item font-sans text-xs text-color-text-low-emphasis flex flex-shrink-0 justify-start p-1 relative w-50% papabear:justify-center papabear:w-auto"> <a class="li-footer__item-link flex items-center font-sans text-xs font-bold text-color-text-low-emphasis hover:text-color-link-hover focus:text-color-link-focus" href="https://brand.linkedin.com/policies?trk=d_learning_course_video_guest_footer-brand-policy" data-tracking-control-name="d_learning_course_video_guest_footer-brand-policy" data-tracking-will-navigate> Politique de la marque </a> </li> <li class="li-footer__item font-sans text-xs text-color-text-low-emphasis flex flex-shrink-0 justify-start p-1 relative w-50% papabear:justify-center papabear:w-auto"> <a class="li-footer__item-link flex items-center font-sans text-xs font-bold text-color-text-low-emphasis hover:text-color-link-hover focus:text-color-link-focus" href="https://www.linkedin.com/psettings/guest-controls?trk=d_learning_course_video_guest_footer-guest-controls" data-tracking-control-name="d_learning_course_video_guest_footer-guest-controls" data-tracking-will-navigate> Réglages invités </a> </li> <li class="li-footer__item font-sans text-xs text-color-text-low-emphasis flex flex-shrink-0 justify-start p-1 relative w-50% papabear:justify-center papabear:w-auto"> <a class="li-footer__item-link flex items-center font-sans text-xs font-bold text-color-text-low-emphasis hover:text-color-link-hover focus:text-color-link-focus" href="https://www.linkedin.com/legal/professional-community-policies?trk=d_learning_course_video_guest_footer-community-guide" data-tracking-control-name="d_learning_course_video_guest_footer-community-guide" data-tracking-will-navigate> Directives de la communauté </a> </li>  <li class="li-footer__item font-sans text-xs text-color-text-low-emphasis flex flex-shrink-0 justify-start p-1 relative w-50% papabear:justify-center papabear:w-auto"> <div class="collapsible-dropdown collapsible-dropdown--footer collapsible-dropdown--up flex items-center relative hyphens-auto language-selector z-2">  <ul class="collapsible-dropdown__list hidden container-raised absolute w-auto overflow-y-auto flex-col items-stretch z-1 bottom-[100%] top-auto" role="menu" tabindex="-1"> <li class="language-selector__item" role="presentation">  <button aria-label="العربية (Arabe)" class="font-sans text-xs link block py-[5px] px-2 w-full hover:cursor-pointer hover:bg-color-action hover:text-color-text-on-dark focus:bg-color-action focus:text-color-text-on-dark language-selector__link !font-regular" data-tracking-control-name="language-selector-ar_AE" data-locale="ar_AE" role="menuitem" lang="ar_AE"> العربية (Arabe) </button> </li> <li class="language-selector__item" role="presentation">  <button aria-label="বাংলা (Bengali)" class="font-sans text-xs link block py-[5px] px-2 w-full hover:cursor-pointer hover:bg-color-action hover:text-color-text-on-dark focus:bg-color-action focus:text-color-text-on-dark language-selector__link !font-regular" data-tracking-control-name="language-selector-bn_IN" data-locale="bn_IN" role="menuitem" lang="bn_IN"> বাংলা (Bengali) </button> </li> <li class="language-selector__item" role="presentation">  <button aria-label="Čeština (Tchèque)" class="font-sans text-xs link block py-[5px] px-2 w-full hover:cursor-pointer hover:bg-color-action hover:text-color-text-on-dark focus:bg-color-action focus:text-color-text-on-dark language-selector__link !font-regular" data-tracking-control-name="language-selector-cs_CZ" data-locale="cs_CZ" role="menuitem" lang="cs_CZ"> Čeština (Tchèque) </button> </li> <li class="language-selector__item" role="presentation">  <button aria-label="Dansk (Danois)" class="font-sans text-xs link block py-[5px] px-2 w-full hover:cursor-pointer hover:bg-color-action hover:text-color-text-on-dark focus:bg-color-action focus:text-color-text-on-dark language-selector__link !font-regular" data-tracking-control-name="language-selector-da_DK" data-locale="da_DK" role="menuitem" lang="da_DK"> Dansk (Danois) </button> </li> <li class="language-selector__item" role="presentation">  <button aria-label="Deutsch (Allemand)" class="font-sans text-xs link block py-[5px] px-2 w-full hover:cursor-pointer hover:bg-color-action hover:text-color-text-on-dark focus:bg-color-action focus:text-color-text-on-dark language-selector__link !font-regular" data-tracking-control-name="language-selector-de_DE" data-locale="de_DE" role="menuitem" lang="de_DE"> Deutsch (Allemand) </button> </li> <li class="language-selector__item" role="presentation">  <button aria-label="Ελληνικά (Grec)" class="font-sans text-xs link block py-[5px] px-2 w-full hover:cursor-pointer hover:bg-color-action hover:text-color-text-on-dark focus:bg-color-action focus:text-color-text-on-dark language-selector__link !font-regular" data-tracking-control-name="language-selector-el_GR" data-locale="el_GR" role="menuitem" lang="el_GR"> Ελληνικά (Grec) </button> </li> <li class="language-selector__item" role="presentation">  <button aria-label="English (Anglais)" class="font-sans text-xs link block py-[5px] px-2 w-full hover:cursor-pointer hover:bg-color-action hover:text-color-text-on-dark focus:bg-color-action focus:text-color-text-on-dark language-selector__link !font-regular" data-tracking-control-name="language-selector-en_US" data-locale="en_US" role="menuitem" lang="en_US"> English (Anglais) </button> </li> <li class="language-selector__item" role="presentation">  <button aria-label="Español (Espagnol)" class="font-sans text-xs link block py-[5px] px-2 w-full hover:cursor-pointer hover:bg-color-action hover:text-color-text-on-dark focus:bg-color-action focus:text-color-text-on-dark language-selector__link !font-regular" data-tracking-control-name="language-selector-es_ES" data-locale="es_ES" role="menuitem" lang="es_ES"> Español (Espagnol) </button> </li> <li class="language-selector__item" role="presentation">  <button aria-label="فارسی (Perse)" class="font-sans text-xs link block py-[5px] px-2 w-full hover:cursor-pointer hover:bg-color-action hover:text-color-text-on-dark focus:bg-color-action focus:text-color-text-on-dark language-selector__link !font-regular" data-tracking-control-name="language-selector-fa_IR" data-locale="fa_IR" role="menuitem" lang="fa_IR"> فارسی (Perse) </button> </li> <li class="language-selector__item" role="presentation">  <button aria-label="Suomi (Finnois)" class="font-sans text-xs link block py-[5px] px-2 w-full hover:cursor-pointer hover:bg-color-action hover:text-color-text-on-dark focus:bg-color-action focus:text-color-text-on-dark language-selector__link !font-regular" data-tracking-control-name="language-selector-fi_FI" data-locale="fi_FI" role="menuitem" lang="fi_FI"> Suomi (Finnois) </button> </li> <li class="language-selector__item" role="presentation">  <button aria-label="Français (Français) sélectionné" class="font-sans text-xs link block py-[5px] px-2 w-full hover:cursor-pointer hover:bg-color-action hover:text-color-text-on-dark focus:bg-color-action focus:text-color-text-on-dark language-selector__link--selected" data-tracking-control-name="language-selector-fr_FR" data-locale="fr_FR" role="menuitem" lang="fr_FR"> <strong>Français (Français)</strong> </button> </li> <li class="language-selector__item" role="presentation">  <button aria-label="हिंदी (Hindi)" class="font-sans text-xs link block py-[5px] px-2 w-full hover:cursor-pointer hover:bg-color-action hover:text-color-text-on-dark focus:bg-color-action focus:text-color-text-on-dark language-selector__link !font-regular" data-tracking-control-name="language-selector-hi_IN" data-locale="hi_IN" role="menuitem" lang="hi_IN"> हिंदी (Hindi) </button> </li> <li class="language-selector__item" role="presentation">  <button aria-label="Magyar (Hongrois)" class="font-sans text-xs link block py-[5px] px-2 w-full hover:cursor-pointer hover:bg-color-action hover:text-color-text-on-dark focus:bg-color-action focus:text-color-text-on-dark language-selector__link !font-regular" data-tracking-control-name="language-selector-hu_HU" data-locale="hu_HU" role="menuitem" lang="hu_HU"> Magyar (Hongrois) </button> </li> <li class="language-selector__item" role="presentation">  <button aria-label="Bahasa Indonesia (Indonésien)" class="font-sans text-xs link block py-[5px] px-2 w-full hover:cursor-pointer hover:bg-color-action hover:text-color-text-on-dark focus:bg-color-action focus:text-color-text-on-dark language-selector__link !font-regular" data-tracking-control-name="language-selector-in_ID" data-locale="in_ID" role="menuitem" lang="in_ID"> Bahasa Indonesia (Indonésien) </button> </li> <li class="language-selector__item" role="presentation">  <button aria-label="Italiano (Italien)" class="font-sans text-xs link block py-[5px] px-2 w-full hover:cursor-pointer hover:bg-color-action hover:text-color-text-on-dark focus:bg-color-action focus:text-color-text-on-dark language-selector__link !font-regular" data-tracking-control-name="language-selector-it_IT" data-locale="it_IT" role="menuitem" lang="it_IT"> Italiano (Italien) </button> </li> <li class="language-selector__item" role="presentation">  <button aria-label="עברית (Hébreu)" class="font-sans text-xs link block py-[5px] px-2 w-full hover:cursor-pointer hover:bg-color-action hover:text-color-text-on-dark focus:bg-color-action focus:text-color-text-on-dark language-selector__link !font-regular" data-tracking-control-name="language-selector-iw_IL" data-locale="iw_IL" role="menuitem" lang="iw_IL"> עברית (Hébreu) </button> </li> <li class="language-selector__item" role="presentation">  <button aria-label="日本語 (Japonais)" class="font-sans text-xs link block py-[5px] px-2 w-full hover:cursor-pointer hover:bg-color-action hover:text-color-text-on-dark focus:bg-color-action focus:text-color-text-on-dark language-selector__link !font-regular" data-tracking-control-name="language-selector-ja_JP" data-locale="ja_JP" role="menuitem" lang="ja_JP"> 日本語 (Japonais) </button> </li> <li class="language-selector__item" role="presentation">  <button aria-label="한국어 (Coréen)" class="font-sans text-xs link block py-[5px] px-2 w-full hover:cursor-pointer hover:bg-color-action hover:text-color-text-on-dark focus:bg-color-action focus:text-color-text-on-dark language-selector__link !font-regular" data-tracking-control-name="language-selector-ko_KR" data-locale="ko_KR" role="menuitem" lang="ko_KR"> 한국어 (Coréen) </button> </li> <li class="language-selector__item" role="presentation">  <button aria-label="मराठी (Marathi)" class="font-sans text-xs link block py-[5px] px-2 w-full hover:cursor-pointer hover:bg-color-action hover:text-color-text-on-dark focus:bg-color-action focus:text-color-text-on-dark language-selector__link !font-regular" data-tracking-control-name="language-selector-mr_IN" data-locale="mr_IN" role="menuitem" lang="mr_IN"> मराठी (Marathi) </button> </li> <li class="language-selector__item" role="presentation">  <button aria-label="Bahasa Malaysia (Malaisien)" class="font-sans text-xs link block py-[5px] px-2 w-full hover:cursor-pointer hover:bg-color-action hover:text-color-text-on-dark focus:bg-color-action focus:text-color-text-on-dark language-selector__link !font-regular" data-tracking-control-name="language-selector-ms_MY" data-locale="ms_MY" role="menuitem" lang="ms_MY"> Bahasa Malaysia (Malaisien) </button> </li> <li class="language-selector__item" role="presentation">  <button aria-label="Nederlands (Néerlandais)" class="font-sans text-xs link block py-[5px] px-2 w-full hover:cursor-pointer hover:bg-color-action hover:text-color-text-on-dark focus:bg-color-action focus:text-color-text-on-dark language-selector__link !font-regular" data-tracking-control-name="language-selector-nl_NL" data-locale="nl_NL" role="menuitem" lang="nl_NL"> Nederlands (Néerlandais) </button> </li> <li class="language-selector__item" role="presentation">  <button aria-label="Norsk (Norvégien)" class="font-sans text-xs link block py-[5px] px-2 w-full hover:cursor-pointer hover:bg-color-action hover:text-color-text-on-dark focus:bg-color-action focus:text-color-text-on-dark language-selector__link !font-regular" data-tracking-control-name="language-selector-no_NO" data-locale="no_NO" role="menuitem" lang="no_NO"> Norsk (Norvégien) </button> </li> <li class="language-selector__item" role="presentation">  <button aria-label="ਪੰਜਾਬੀ (Penjabi)" class="font-sans text-xs link block py-[5px] px-2 w-full hover:cursor-pointer hover:bg-color-action hover:text-color-text-on-dark focus:bg-color-action focus:text-color-text-on-dark language-selector__link !font-regular" data-tracking-control-name="language-selector-pa_IN" data-locale="pa_IN" role="menuitem" lang="pa_IN"> ਪੰਜਾਬੀ (Penjabi) </button> </li> <li class="language-selector__item" role="presentation">  <button aria-label="Polski (Polonais)" class="font-sans text-xs link block py-[5px] px-2 w-full hover:cursor-pointer hover:bg-color-action hover:text-color-text-on-dark focus:bg-color-action focus:text-color-text-on-dark language-selector__link !font-regular" data-tracking-control-name="language-selector-pl_PL" data-locale="pl_PL" role="menuitem" lang="pl_PL"> Polski (Polonais) </button> </li> <li class="language-selector__item" role="presentation">  <button aria-label="Português (Portugais)" class="font-sans text-xs link block py-[5px] px-2 w-full hover:cursor-pointer hover:bg-color-action hover:text-color-text-on-dark focus:bg-color-action focus:text-color-text-on-dark language-selector__link !font-regular" data-tracking-control-name="language-selector-pt_BR" data-locale="pt_BR" role="menuitem" lang="pt_BR"> Português (Portugais) </button> </li> <li class="language-selector__item" role="presentation">  <button aria-label="Română (Roumain)" class="font-sans text-xs link block py-[5px] px-2 w-full hover:cursor-pointer hover:bg-color-action hover:text-color-text-on-dark focus:bg-color-action focus:text-color-text-on-dark language-selector__link !font-regular" data-tracking-control-name="language-selector-ro_RO" data-locale="ro_RO" role="menuitem" lang="ro_RO"> Română (Roumain) </button> </li> <li class="language-selector__item" role="presentation">  <button aria-label="Русский (Russe)" class="font-sans text-xs link block py-[5px] px-2 w-full hover:cursor-pointer hover:bg-color-action hover:text-color-text-on-dark focus:bg-color-action focus:text-color-text-on-dark language-selector__link !font-regular" data-tracking-control-name="language-selector-ru_RU" data-locale="ru_RU" role="menuitem" lang="ru_RU"> Русский (Russe) </button> </li> <li class="language-selector__item" role="presentation">  <button aria-label="Svenska (Suédois)" class="font-sans text-xs link block py-[5px] px-2 w-full hover:cursor-pointer hover:bg-color-action hover:text-color-text-on-dark focus:bg-color-action focus:text-color-text-on-dark language-selector__link !font-regular" data-tracking-control-name="language-selector-sv_SE" data-locale="sv_SE" role="menuitem" lang="sv_SE"> Svenska (Suédois) </button> </li> <li class="language-selector__item" role="presentation">  <button aria-label="తెలుగు (Télougou)" class="font-sans text-xs link block py-[5px] px-2 w-full hover:cursor-pointer hover:bg-color-action hover:text-color-text-on-dark focus:bg-color-action focus:text-color-text-on-dark language-selector__link !font-regular" data-tracking-control-name="language-selector-te_IN" data-locale="te_IN" role="menuitem" lang="te_IN"> తెలుగు (Télougou) </button> </li> <li class="language-selector__item" role="presentation">  <button aria-label="ภาษาไทย (Thaï)" class="font-sans text-xs link block py-[5px] px-2 w-full hover:cursor-pointer hover:bg-color-action hover:text-color-text-on-dark focus:bg-color-action focus:text-color-text-on-dark language-selector__link !font-regular" data-tracking-control-name="language-selector-th_TH" data-locale="th_TH" role="menuitem" lang="th_TH"> ภาษาไทย (Thaï) </button> </li> <li class="language-selector__item" role="presentation">  <button aria-label="Tagalog (Tagalog)" class="font-sans text-xs link block py-[5px] px-2 w-full hover:cursor-pointer hover:bg-color-action hover:text-color-text-on-dark focus:bg-color-action focus:text-color-text-on-dark language-selector__link !font-regular" data-tracking-control-name="language-selector-tl_PH" data-locale="tl_PH" role="menuitem" lang="tl_PH"> Tagalog (Tagalog) </button> </li> <li class="language-selector__item" role="presentation">  <button aria-label="Türkçe (Turc)" class="font-sans text-xs link block py-[5px] px-2 w-full hover:cursor-pointer hover:bg-color-action hover:text-color-text-on-dark focus:bg-color-action focus:text-color-text-on-dark language-selector__link !font-regular" data-tracking-control-name="language-selector-tr_TR" data-locale="tr_TR" role="menuitem" lang="tr_TR"> Türkçe (Turc) </button> </li> <li class="language-selector__item" role="presentation">  <button aria-label="Українська (Ukrainien)" class="font-sans text-xs link block py-[5px] px-2 w-full hover:cursor-pointer hover:bg-color-action hover:text-color-text-on-dark focus:bg-color-action focus:text-color-text-on-dark language-selector__link !font-regular" data-tracking-control-name="language-selector-uk_UA" data-locale="uk_UA" role="menuitem" lang="uk_UA"> Українська (Ukrainien) </button> </li> <li class="language-selector__item" role="presentation">  <button aria-label="Tiạng Viạt (Vietnamien)" class="font-sans text-xs link block py-[5px] px-2 w-full hover:cursor-pointer hover:bg-color-action hover:text-color-text-on-dark focus:bg-color-action focus:text-color-text-on-dark language-selector__link !font-regular" data-tracking-control-name="language-selector-vi_VN" data-locale="vi_VN" role="menuitem" lang="vi_VN"> Tiạng Viạt (Vietnamien) </button> </li> <li class="language-selector__item" role="presentation">  <button aria-label="简体中文 (Chinois simplifié)" class="font-sans text-xs link block py-[5px] px-2 w-full hover:cursor-pointer hover:bg-color-action hover:text-color-text-on-dark focus:bg-color-action focus:text-color-text-on-dark language-selector__link !font-regular" data-tracking-control-name="language-selector-zh_CN" data-locale="zh_CN" role="menuitem" lang="zh_CN"> 简体中文 (Chinois simplifié) </button> </li> <li class="language-selector__item" role="presentation">  <button aria-label="正體中文 (Chinois traditionnel)" class="font-sans text-xs link block py-[5px] px-2 w-full hover:cursor-pointer hover:bg-color-action hover:text-color-text-on-dark focus:bg-color-action focus:text-color-text-on-dark language-selector__link !font-regular" data-tracking-control-name="language-selector-zh_TW" data-locale="zh_TW" role="menuitem" lang="zh_TW"> 正體中文 (Chinois traditionnel) </button> </li>  </ul> <button class="language-selector__button select-none relative pr-2 font-sans text-xs font-bold text-color-text-low-emphasis hover:text-color-link-hover hover:cursor-pointer focus:text-color-link-focus focus:outline-dotted focus:outline-1" aria-expanded="false" data-tracking-control-name="footer-lang-dropdown_trigger"> <span class="language-selector__label-text mr-0.5 break-words"> Langue </span> <icon class="language-selector__label-chevron w-2 h-2 absolute top-0 right-0" data-delayed-url="https://static.licdn.com/aero-v1/sc/h/cyolgscd0imw2ldqppkrb84vo"></icon> </button> </div> </li> </ul>  </footer> <script src="https://static.licdn.com/aero-v1/sc/h/eh08muqvrde4h3hc6koyij5ti" async></script>  <script src="https://static.licdn.com/aero-v1/sc/h/ek2tdg64hm7rdsrulg3lyo2vc" async defer></script> <script data-delayed-url="https://static.licdn.com/aero-v1/sc/h/81wy0f4hfrhoilx9eqdwg202z" data-module-id="media-player"></script> <code id="trackingData" style="display: none"></code> <code id="alcOnlyData" style="display: none"></code> </body> </html>

CINXE.COM

Utiliser l'espace 3D - Tutoriel vidéo Découvrir le Material Design | LinkedIn Learning, anciennement Lynda.com