Différences entre versions de « Responsive - Site »
De Didaquest
Aller à la navigationAller à la recherche| (12 versions intermédiaires par le même utilisateur non affichées) | |||
| Ligne 4 : | Ligne 4 : | ||
= {{Widget:Traduction-Fiche}} = | = {{Widget:Traduction-Fiche}} = | ||
| − | [[ | + | [[Site web adaptatif]] (Français) / [[Responsive web design]] ou '''RWD''' (Anglais) |
| + | = {{Widget:Questions-possibles-Fiche}} = | ||
| + | |||
| + | * Le Responsive Web Design : qu'est-ce que c'est ? | ||
| + | * Comment savoir si mon site web s’affiche correctement sur un smartphone ou une tablette ? | ||
| + | * Comment savoir si mon site est responsive ? | ||
| − | = {{Widget: | + | = {{Widget:Reponses}} = |
* '''Domaine, Discipline, Thématique''' : | * '''Domaine, Discipline, Thématique''' : | ||
| − | [[:Catégorie: | + | [[:Catégorie:Informatique]] / [[:Catégorie:Internet]] |
| − | |||
| − | |||
| − | |||
{{Widget:Debut-cadre-Bleu}} | {{Widget:Debut-cadre-Bleu}} | ||
<!-- Remplacer et adapter le contenu --> | <!-- Remplacer et adapter le contenu --> | ||
| − | * | + | * Un site web adaptatif (responsive) possède la capacité à adapter son affichage à la dimension de l’écran de l’internaute. |
| − | + | * Le site est dit responsive si il s'adapte à la largeur réduite de l'écran avec lequel il est visualisé (PC, Smartphone, Tablette, Androïde, Iphone,..) pour que sa consultation reste agréable : son menu peut se replier sous une icône facile d'accès (par exemple en haut à gauche ou à droite), la taille des textes reste importante pour les lire sans effort, et le contenu du site s'est réorganisé dans la hauteur sans déborder en largeur. Il est inutile de zoomer ou de faire défiler le site horizontalement par des manipulations tactiles complexes. Il suffit de faire défiler le site verticalement avec un seul doigt pour le parcourir, comme sur le PC. Les boutons et liens sont faciles à pointer avec le doigt sans risque d'erreur. | |
| − | ...... | ||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
{{Widget:Fin-cadre-Bleu}} | {{Widget:Fin-cadre-Bleu}} | ||
| − | + | * '''Éléments-graphique''' | |
| − | |||
{{Widget:Debut-cadre-Bleu}} | {{Widget:Debut-cadre-Bleu}} | ||
| Ligne 60 : | Ligne 53 : | ||
* Consultez votre site sur smartphone et tablettes : si le site s'affiche en entier comme sur votre PC mais plus petit parce que le navigateur a fait un zoom arrière pour qu'il tienne en largeur c'est que le site n'est pas responsive. | * Consultez votre site sur smartphone et tablettes : si le site s'affiche en entier comme sur votre PC mais plus petit parce que le navigateur a fait un zoom arrière pour qu'il tienne en largeur c'est que le site n'est pas responsive. | ||
* Consultez votre site dans votre navigateur habituel mais réduisez la largeur de la fenêtre : si une barre de défilement horizontale apparaît c'est que le site n'est pas responsive. Faites le même test sur notre site dans votre navigateur et observez comme le site se réorganise au fur et à mesure que la largeur diminue. | * Consultez votre site dans votre navigateur habituel mais réduisez la largeur de la fenêtre : si une barre de défilement horizontale apparaît c'est que le site n'est pas responsive. Faites le même test sur notre site dans votre navigateur et observez comme le site se réorganise au fur et à mesure que la largeur diminue. | ||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
= {{Widget:Aides-astuces-Fiche}} = | = {{Widget:Aides-astuces-Fiche}} = | ||
| + | '''Utilisez une des pages suivantes'''(saisissez l'adresse de votre site et voyez comment il se comporte dans différentes largeurs). | ||
| − | + | * [[Youresponsive]] | |
| − | + | * [[Google resizer]] | |
| + | |||
= {{Widget:Liens-internet-Fiche}} = | = {{Widget:Liens-internet-Fiche}} = | ||
| − | + | {{widget:LienSiteEducatifs}} | |
| − | |||
| − | |||
= {{Widget:Bibliographie-Fiche}} = | = {{Widget:Bibliographie-Fiche}} = | ||
Version actuelle datée du 26 décembre 2016 à 01:23
 Votre Publicité sur le Réseau
|
Traduction
Site web adaptatif (Français) / Responsive web design ou RWD (Anglais)
Questions possibles
- Le Responsive Web Design : qu'est-ce que c'est ?
- Comment savoir si mon site web s’affiche correctement sur un smartphone ou une tablette ?
- Comment savoir si mon site est responsive ?
Réponse possible
- Domaine, Discipline, Thématique :
Catégorie:Informatique / Catégorie:Internet
|
- Éléments-graphique
|
|
Concepts ou notions associés
Exemples, applications, utilisations
Il y a plusieurs moyens très simples pour savoir comment se comportera un site existant sur un mobile ou une tablette :
- Consultez votre site sur smartphone et tablettes : si le site s'affiche en entier comme sur votre PC mais plus petit parce que le navigateur a fait un zoom arrière pour qu'il tienne en largeur c'est que le site n'est pas responsive.
- Consultez votre site dans votre navigateur habituel mais réduisez la largeur de la fenêtre : si une barre de défilement horizontale apparaît c'est que le site n'est pas responsive. Faites le même test sur notre site dans votre navigateur et observez comme le site se réorganise au fur et à mesure que la largeur diminue.
Aides, Astuces,...
Utilisez une des pages suivantes(saisissez l'adresse de votre site et voyez comment il se comporte dans différentes largeurs).
Liens Internet
- Portail Formation Gratuite
- Multisites Educatifs
- Sur DidaQuest
- Sur le Portail Didactique.info
- Sur le Portail Questions / Réponses
- Concept Sur Wikipedia
- Concept Sur Wikiwand
- Concept Sur Wikiversity
