Referencement naturel/Responsive Web Design Fermé

Question

Bonjour, 

Je suis actuellement un stagiaire en cours de réalisation d'un site informatique à propos d'une agence immobilière.
J'aurais voulu avoir des informations concernant le référencement naturel, les liens, le poid des images, le renouvellement des pages. Toutes les infos ou les liens que vous avez concernant ce sujet là car je dois avancer sur le reste du site et notamment ce qui m'amène à ma deuxième question:

Le responsive web design qu'en pensez vous et comment l'avez vous mit en place sur votre site pour qu'il s'adapte aux différents terminaux.

 Globalement doit on faire une feuille pour les ordis une pour les format ipad et une pour le format iphone? 

Merci d'avance et passez une bonne journée.

De plus vous pouvez me joindre par message privé..

mimigenie · Answer

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.

alexlb06 · Answer

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

Nxl · Answer

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 : /****************************************************/ /* 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. ;)

Nxl · Answer

Voila par exemple dans le global tu mets ça :

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.

Referencement naturel/Responsive Web Design

4 réponses

Discussions similaires