Referencement naturel/Responsive Web Design
Fermé
alexlb06
Messages postés
4
Date d'inscription
mercredi 1 août 2012
Statut
Membre
Dernière intervention
1 août 2012
-
1 août 2012 à 14:25
Nxl Messages postés 1038 Date d'inscription mardi 2 février 2010 Statut Membre Dernière intervention 5 janvier 2017 - 1 août 2012 à 15:03
Nxl Messages postés 1038 Date d'inscription mardi 2 février 2010 Statut Membre Dernière intervention 5 janvier 2017 - 1 août 2012 à 15:03
A voir également:
- Referencement naturel/Responsive Web Design
- Web office - Guide
- Traduire une page web - Guide
- Adresse web - Guide
- Création site web - Guide
- Capture web - Guide
4 réponses
mimigenie
Messages postés
1180
Date d'inscription
dimanche 3 janvier 2010
Statut
Membre
Dernière intervention
4 août 2018
313
1 août 2012 à 14:30
1 août 2012 à 14:30
Pour le référencement, tape "référencement" dans le champ de recherche de ccm et tu trouveras plein de fiche pratique donnant de bon conseil.
Une feuille pour chaque type de terminal est une bonne idée mais pour les mobiles il est parfois utile de faire une version entière du site uniquement pour les mobiles.
Pour une adaptation simple et rapide, l'utilisation de valeur relative ( en % ou en em ) est une très bonne chose.
Une feuille pour chaque type de terminal est une bonne idée mais pour les mobiles il est parfois utile de faire une version entière du site uniquement pour les mobiles.
Pour une adaptation simple et rapide, l'utilisation de valeur relative ( en % ou en em ) est une très bonne chose.
Nxl
Messages postés
1038
Date d'inscription
mardi 2 février 2010
Statut
Membre
Dernière intervention
5 janvier 2017
133
Modifié par antoine7104 le 1/08/2012 à 14:53
Modifié par antoine7104 le 1/08/2012 à 14:53
Moi ce que je te recommanderai c'est de faire faire une feuille de style avec dedans toute les propriétés global (quelque soit les résolutions) et toujours dans cette feuille de style ajouter ceci par exemple :
évidement les valeurs sont des exemples (sauf pour mobile) et étant donner que les iPad on des résolutions aussi grande que les ordinateurs il sont fait pour aller sur les même versions des sites que les PC.
Sinon évidement je te recommande d'éviter les valeurs donner en px. ;)
/****************************************************/ /* 1200px (>= 481px) */ /****************************************************/ @media only screen and (min-width: 481px) { /* ... */ } /****************************************************/ /* 1000px (>= 481px && <= 1199px) */ /****************************************************/ @media only screen and (max-width: 1199px) and (min-width: 481px) { /* ... */ /****************************************************/ /* Mobile (<= 480px) */ /****************************************************/ @media only screen and (max-width: 480px) { /* ... */ }
évidement les valeurs sont des exemples (sauf pour mobile) et étant donner que les iPad on des résolutions aussi grande que les ordinateurs il sont fait pour aller sur les même versions des sites que les PC.
Sinon évidement je te recommande d'éviter les valeurs donner en px. ;)
alexlb06
Messages postés
4
Date d'inscription
mercredi 1 août 2012
Statut
Membre
Dernière intervention
1 août 2012
1 août 2012 à 14:55
1 août 2012 à 14:55
Si je comprends bien antoine, je rajoute ces éléments là à la fin de la feuille de CSS comme ça si je veux changer la taille d'un texte mais garder sa couleur je n'aurais juste qu'à spécifier sa taille pour la résolution en question
alexlb06
Messages postés
4
Date d'inscription
mercredi 1 août 2012
Statut
Membre
Dernière intervention
1 août 2012
1 août 2012 à 14:40
1 août 2012 à 14:40
Pour l'instant j'ai adapté la majorité de mes valeurs en % sauf pour certains div car ça ne veux pas s'adapter comme avec les valeurs en pixels et je ne comprends pas pourquoi.
J'ai également ajouté la balise meta viewport
Merci du conseil à bientôt
J'ai également ajouté la balise meta viewport
Merci du conseil à bientôt
Nxl
Messages postés
1038
Date d'inscription
mardi 2 février 2010
Statut
Membre
Dernière intervention
5 janvier 2017
133
1 août 2012 à 15:00
1 août 2012 à 15:00
Voila par exemple dans le global tu mets ça :
ainsi pour les écrans d'une résolution inférieur à 1199 px mais supérieure à 481 (donc pas mobile) ton texte sera plus petit.
p { color: #006699; font-size: 13.5pt; font-family: 'Yanone Kaffeesatz'; } /* et pour les plus petit écrans */ @media only screen and (max-width: 1199px) and (min-width: 481px) { p { font-size: 10pt; }
ainsi pour les écrans d'une résolution inférieur à 1199 px mais supérieure à 481 (donc pas mobile) ton texte sera plus petit.
alexlb06
Messages postés
4
Date d'inscription
mercredi 1 août 2012
Statut
Membre
Dernière intervention
1 août 2012
1 août 2012 à 15:02
1 août 2012 à 15:02
ça marche merci beaucoup passes une bonne journée
Nxl
Messages postés
1038
Date d'inscription
mardi 2 février 2010
Statut
Membre
Dernière intervention
5 janvier 2017
133
Modifié par antoine7104 le 1/08/2012 à 15:04
Modifié par antoine7104 le 1/08/2012 à 15:04
De rien. ;) Merci toi aussi. :)