Certification de formation Ergonomie Web

Formation Ergonomie WEB éligible CPF faisant partie de la certification « Les fondamentaux du développement web »

0
Jours
0
Heures
0
CNCP
0
CPF
Formation certifiante disponible en :

Formation
intra-entreprise

Formation
inter-entreprises

Egalement disponible à distance en :
e-learning-tutore
Tous les détails et démonstrations en ligne du déroulement de la formation e-learning ou à distance tutoré : « Les fondamentaux en gestion de projet »
Prochaines dates
Planning et dates

« Les fondamentaux en gestion de projet »

Ville Session 1 Session 2
Paris 17-09-18 15-11-18
Lyon 17-09-18 15-11-18
Aix-en-Provence 17-09-18 15-11-18
Nous vous recommandons

Programme de formation:
Ergonomie Web.

L’ergonomie web est une étape incontournable.
Elle a pour objectif d’adapter la présentation à l’écran, de s’adapter aux standards de la navigation Web ou Mobile, afin de créer des sites Web agréables et efficaces à la navigation et donner l’envie aux internautes d’y rester et d’y revenir.

Objectifs

Quelles seront mes compétences à l’issu de la formation : Ergonomie Web ?

À l’issue de la formation Ergonomie Web, les apprenants auront les capacités de :

  1. Créer des designs Web ergonomiques
  2. Travailler en tenant compte du Responsive Web Design
  3. Améliorer l’expérience utilisateur
  4. Comprendre et justifier les décisions techniques

Publics

Quels sont les profils concernés par le module : Ergonomie Web ?

La formation Ergonomie Web, s’adresse à tout public salarié, demandeur d’emploi ou en reconversion professionnelle et souhaitant acquérir des compétences en développement Web :

  1. Toute personne ayant des connaissances basiques en WEB et souhaitant maîtriser le développement d’application WEB avec du PHP orienté Objet et Symfony
  2. Graphiste, intégrateur WEB, designer, Webmaster ou référenceur WEB souhaitant avoir une double compétence et souhaitant exploiter une base de données MySQL pour rendre une application WEB plus dynamique
  3. Journaliste, réalisateur, communicant, responsable de projet, toute personne souhaitant gérer un projet web éditorial
  4. Informaticiens et concepteurs souhaitant maîtriser les techniques pour développer des sites WEB riches et interactif
  5. Toute personne souhaitant élargir ses compétences sur les missions liées à la fonction de développement WEB

Prérequis

Quelles sont les qualifications requises pour suivre la formation : Ergonomie Web ?

Les prérequis nécessaire à la formation Ergonomie Web sont :

  1. Maîtriser Internet et posséder une bonne connaissance des outils informatiques
Programme détaillé

Comprendre les fondamentaux du Responsive Web design (RWD).

Introduction au Responsive Web Design

  1. Qu’est-ce que le Responsive Web Design ?
  2. Les navigateurs mobiles
  3. Autres considérations sur le web mobile
  4. Techniques de conception adaptée
  5. Éléments de Responsive Design
  6. Exemple de conception adaptée
  7. Alternatives à Responsive Design

CSS 3 et Responsive Web Design

  1. Amélioration progressive
  2. Mise en œuvre de l’amélioration progressive
  3. Types de support
  4. Style CSS « Reset »
  5. Styles conditionnels pour Internet Explorer
  6. Qu’est-ce que la fenêtre d’affichage ?
  7. Adaptation du Viewport
  8. Spécification du Viewport
  9. Les médias Queries
  10. Caractéristiques des médias utilisés dans les médias Queries
  11. La combinaison des techniques de conception adaptée
  12. Test Responsive Design

Atelier et cas pratique.

Mettre en place le Responsive Web Design (RWD).

Mise en page Responsive Web

  1. Les types de mise en page
  2. Les Layouts Responsive
  3. Les patterns les plus courant
  4. Le pattern de layout « Mostly Fluid »
  5. Le pattern de layout « Column Drop »
  6. Le pattern « Layout Sifhter »
  7. D’autres techniques de layout
  8. La propriété CSS Float
  9. La combinaison de styles CSS
  10. Exemple de la mise en page fluide
  11. La technique de mise en page fluide
  12. Unités Taille de la police
  13. Pixel-Sized vs Em-Sized
  14. Les relations de l’unité Taille de la police
  15. Pixels à Em Formule de Conversion
  16. Autres considérations
  17. Regard sur l’avenir

Images réactives

  1. Images réactives
  2. Considérations sur les performances
  3. Images Shrinking
  4. Techniques traditionnelles de traitement des images
  5. Médias Queries ne pas toujours aider à améliorer les performances
  6. Avoir un pixel « fluide »
  7. Les fenêtres de l’appareil
  8. Pixels CSS
  9. La puissance de la simplicité
  10. Sencha.io Src Images Service Cloud
  11. Sencha.io Src Schéma
  12. Comment ça marche
  13. API Sencha.io Src
  14. Sencha.io Src Détails API
  15. Sencha.io Src API Détails suite
  16. Des exemples de l’API Sencha.io Src
  17. Savoir utiliser un service de manipulation d’image en cloud
  18. L’élément d’image
  19. L’attribut srcset
  20. Plus d’informations sur l’attribut srcset
  21. Des exemples de l’attribut srcset
  22. Qu’est-ce que le Picturefill?
  23. L’utilisation du Picturefill

Atelier et cas pratique.

Utiliser Bootstrap pour le Responsive Web Design (RWD).

Boostrap, vue d’ensemble

  1. Qu’est-ce que Bootstrap
  2. Mots-clés de bower.js
  3. L’Histoire de Bootstrap
  4. Le Développement Web Responsive
  5. Mise en page d’une Grille Responsive
  6. Composants GUI réutilisables
  7. JavaScript
  8. La Philosophie Mobile
  9. Pourquoi le RWD
  10. Une vue Responsive
  11. Obtenir Bootstrap
  12. Bootstrap Content Delivery Network
  13. Autres options de configuration
  14. Bootstrap fichiers Core
  15. Minimifié ou pas ?

Utilisation de Bootstrap

  1. Les fichiers CSS Bootstrap
  2. Les fichiers JavaScript Bootstrap
  3. Viewport Meta Tags
  4. Exemples
  5. Layouts
  6. La grille Bootstrap
  7. Explicatop, de la grille
  8. La navigation
  9. Navigation (bureau)
  10. Navigation (Mobile)
  11. Source de navigation
  12. Éléments de navigation et Styles

Bootstrap, sujets divers

  1. Composants bootstrap
  2. Composants Bootstrap pour les Pages Web
  3. L’intégration de composants Bootstrap avec jQuery
  4. Identification de la version requise de jQuery
  5. Télécharger le Bootstrap Minimifié
  6. Utilisation de Customizer
  7. Le Customizer page Fragment
  8. Compilation et chargement personnalisé Bootstrap
  9. Personnalisation des composants Bootstrap

Utiliser Bootstrap pour le Responsive Web Design (RWD).

Techniques avancées pour le Responsive Web Design.

Autres techniques

  1. Sprites
  2. Police d’icônes
  3. Code Emoji
  4. Graphiques vectoriels évolutifs (SVG)
  5. CSS3

Solutions côté serveur

  1. Images adaptatives
  2. Images réactives
  3. Solutions serveur tiers

Besoin d'un devis / d'un renseignement :

Adresse :

28 rue Xavier Bichat

72000 Le Mans

 

Téléphone :

02.43.52.36.45

 

Email :

contact@cegefos.fr

 

Suivez-nous :

[Form id= »6″]