web-dev-qa-db-fra.com

Migrer une petite application Web pour smartphones en créant des pages HTML étroites?

J'ai un petit site Web offrant quelques fonctionnalités, mais il n'était pas conçu pour fonctionner avec les smartphones à l'époque. Je n'ai pas d'expérience dans le développement d'applications pour smartphones (et c'est peut-être trop d'ingénierie), mais je me demandais si je pourrais utiliser une autre méthode.

À partir de ici , je remarque que tout l’écran du smartphone prend en charge une largeur de 320px lorsqu’il est tenu verticalement. Puis-je développer des pages HTML dont le contenu est compressé correctement dans une résolution de 320 pixels et étendu à une résolution de 480 pixels (et plus)? Serait-ce affiché correctement sur les téléphones intelligents? Dois-je économiser de l'espace pour les barres de défilement?

Ou devrais-je investir du temps à apprendre à utiliser un cadre CSS approprié pour les smartphones? Si oui, est-ce que quelqu'un a une recommandation à faire? Idéalement, j'aimerais simplement prendre une copie de mes pages et les réorganiser pour les smartphones afin de garder les choses simples. Merci.

4
Jérôme Verstrynge

La technique que vous recherchez s'appelle responsive design et utilise CSS3. Cette approche permet de modifier la disposition du contenu et la taille du texte en fonction de la taille de la fenêtre du navigateur de l'utilisateur ou de la résolution de l'écran de l'appareil de son choix.

Voici quelques ressources/liens/idées: -

  • astuces CSS est un excellent exemple de design réactif en action
  • magazine SpeckyBoy a un grand tour d'horizon des frameworks CSS à parcourir, MOINS est particulièrement bon à mon humble avis.
  • SmashingMagazine a une excellente introduction à la conception réactive.
4
toomanyairmiles