Sensible

1. Développez simplement une interface.
2. L'adaptation d'écran pour la page se situe dans une certaine plage : par exemple, un ensemble pour PC (>1024), un ensemble pour tablette (768-1024), un ensemble pour téléphone mobile (<768) ; un ensemble pour toutes les pages réactives ; sont adaptés. (Comme vous pouvez l'imaginer : le design réactif doit être considéré comme beaucoup plus complexe que le design adaptatif)
3. Créez une page Web et utilisez CSS Media Query, Content-Based Breakpoint et d'autres technologies pour modifier la taille de la page Web afin de l'adapter aux écrans avec différentes résolutions.

Adaptatif

1. Plusieurs interfaces doivent être développées
2. En détectant la résolution de la fenêtre d'affichage, il est déterminé si le périphérique actuellement accédé est : un PC, une tablette ou un téléphone mobile, demandant ainsi la couche de service et renvoyant différentes pages ; une conception réactive détecte la résolution de la fenêtre d'affichage et effectue des opérations sur le client pour différents clients ; Traitement du code pour afficher différentes mises en page et contenus.
3. Créez différentes pages Web pour différents types d'appareils et appelez les pages Web correspondantes après avoir détecté la résolution de l'appareil.

Faire la différence entre réactif et adaptatif

1. Utilisez le navigateur Chrome ou Edge pour ouvrir l'URL sur l'ordinateur.
2. selon F12 Ou faites un clic droit et sélectionnez Détection。
3. Cliquez dans le coin supérieur gauche du panneauIcône de changement d'appareil,Comme indiqué ci-dessous

4. Après le changement,
   La disposition affichée sur l'ordinateur et les terminaux mobiles change automatiquement, c'est-à-direSensible, comme ce site ;
   Si la mise en page ne s'adapte pas automatiquement, la mise en page passera en adaptation après rafraîchissement de la page (l'URL saute ou ne saute pas), c'est-à-direAdaptatif, comme Baidu ;
   S'il n'y a pas de commutation après l'actualisation, il n'est ni réactif ni adaptatif et ne s'adapte pas aux différents appareils.

suggestion

• Perspective de développement : page unique, fonctions complexes, fonctions simples adaptatives, responsive.
• Point de vue SEO : les moteurs de recherche préfèrent généralement la réactivité.

Résumer

• Sensible:un ensemble de modèles; Adapté par le front-end, les modèles avec différentes résolutions sont fusionnés en une seule page, et le téléchargement d'une page de modèles ne représente qu'une seule page.
• Adaptatif:Plusieurs ensembles de modèles; Adapté par le backend, chaque modèle de résolution comporte une page et différents modèles de résolution sont téléchargés séparément.