Mon premier site (responsive design) - avis

[BlackShark]

Bonjour,

Je viens récemment de finir mon premier site et mon raisonnement est le suivant, dans cet ordre:
1. C'est mal fait
2. mais je sais pas comment l'améliorer

Petit dilemne donc ^^

Les petites images png sont en base 64, les chargements java sont décalés, le css de base est compressé, les images optimisées,..
Or mon score inside speed est toujours bas (dans les 60 pour le mobile).

D'abord qu'en pensez vous et que conseillerez vous?

Voici l'adresse: La Bocca



ps: je ne suis pas arrivé à trouver de solution simple pour charger des images différentes suivants la résolution, si vous avez des pistes

 

[bewweb]

Bonjour,

En ce qui concerne le score page speed insights:
vos images son mal optimisé. Pour les optimiser vous pouvez utiliser Photoshop et enregistrer vos images pour le web (fichier->Enregistrer pour le web). Pour choisir le format, utilisez le jpg pour les paysage, le png pour les éléments graphique haute qualité mais utilisant de la transparence et du gif pour les images animé.

Aussi vous pouvez utiliser les méthodes de mise en cache et augmenter le temps de cache. Cela améliorera votre score/rapidité cependant si vous êtes en dev ne les mettez pas en place maintenant ça pourrait être gênant.

Pour le reste c'est minime. Cependant j'ai remarqué que sur mobile votre background était fixe ce qui peut parfois poser problème sur certains téléphone mais rien de grave.


Je n'avais pas vu votre ps. Pour vos images il y a plusieurs solution mais je n'en connais pas une vraiment bonne, créer un script php qui redimensionne en direct votre image à la taille demandé. Pas la meilleurs solution à mon gout. Ou alors dupliquer vos images et les redimensionner au préalable et appeler dans votre css les images qui conviennent a l’écran qui les affichent.

Bonne journée

 

[noren]

Bonjour

Il faut en effet revoir l'optimisation des images. Le responsive ici ne sert "presque" à rien si le site est bien trop lourd pour du mobile :wink:

 

[Blount]

Bonjour

Il faut en effet revoir l'optimisation des images. Le responsive ici ne sert "presque" à rien si le site est bien trop lourd pour du mobile :wink:

Perso, je suis toujours en Wifi avec mon mobile, donc ce que tu dis n'est pas toujours vrai.
C'est ce qui rend compliqué le développement multiplateforme.

 

[noren]

Oui je suis d'accord avec toi mais quitte à faire du responsive autant optimiser le chargement du site dans le cas d'utilisation de la 3G (ou 4G)
Le mobile ce n’est pas que le WIFI :wink:
D'autant plus que dans son cas il ne semble pas impossible de réduire fortement les tailles des images ou d'avoir des versions miniatures en tout cas sur la page "photos".
même chez moi en wifi et sur PC j'ai trouvé le site long à charger les images :/

 

[godscourge]

Optimiser les images, mettre un lightbox sur l'agrandissement.

 

[BlackShark]

Ok!

Je vais donc retravailler les images en php.
Pas de problèmes avec le redimensionnement. (J'utilise gimp, lightroom et tinypng pour les images, je fais aussi de la photo :? ) Je continuais de chercher une solution magique! :'(
Je vais faire ça avec des blocs divs et du css background ^^


Pour la mise en cache, je n'y comprends rien :'(
Mon site est hebergé sur planethoster et je ne comprends pas du tout comment créer le htaccess (enfin, où le mettre) et comment activer les modules apaches.


Le chargement des plices d'écritures semblenet ramer aussi. Il vaut mieux continuer à faire un link vers google ou les charger dans le css en local?


Aucuns autres problèmes?

 

[bewweb]

Pour ce qui est du cache et la compression serveur :
tu créer un fichier texte que tu édite et ou tu y écris

##Compression
SetOutputFilter DEFLATE
AddOutputFilterByType DEFLATE text/html text/css text/plain text/xml application/x-javascript image/jpg image/gif image/jpeg 

ExpiresActive On
## 7 jours
ExpiresDefault A604800

Ensuite tu enregistre ton fichier et tu le renomme en ".htaccess".
Tu le place dans le dossier de ton site en sachant que un htaccess porte sur les sous dossier donc si tu mets à la racine de ton site tout les sous dossier vont en hérité.

Je précise que je n'ai pas testé chez ton hébergeur et que je ne sais pas si tout y est activé et parfois avec les htaccess la syntaxe change légèrement suivant le paramétrage serveur. Tu peux essayer si tu a une erreur 500 c'est que le fichier pose problème dans ce cas tu le supprime sur ton hébergeur et tu reviens vers nous. Il se pourrait que juste la compression pose problème essaye en enlevant les ligne concernant la compression.

 

[BlackShark]

Ca ne semble pas marcher :'(
Mais pas d'erreur 500, c'est déjà ça

Ce que je désire mettre en cache sont les photos et les polices d'écritures.
Les sites de validations ralent pour google map et les polices d'écritures.

Chargeant les polices depuis google font, je vois 2 origines au problème :
- mauvaise configuration du serveur (j'appelerai l'hébergeur)
- les links ne sont pas mis en cache

 

[BlackShark]

voilà, le site est fini.

Le design a été quelque peu changé par mon ami.

responsive et assez optimisé (sauf la page photo, pas le temps d'adapter le code)

 

[adiway]

oui le chargement des images est visible (à l'œil nu)
200 ko , alors que ça pourrait etre 15 Ko pour images/salle/salle1.jpg
mais c'est bon ...

 

[adiway]

Ha oui et aussi la photo de la page d'accueil est trop grande à mon gout en taille
et bien sur en poids : 900 Ko

 

[spout]

Très épuré comme design: -http://www.ristorante-labocca.fr/index.php/ :mrgreen:

 

[forma.tis]

Spout enfin faut faire des pages "light" pour répondre à "PageSpeed Insights".... :wink: , si tu veux une bonne note... 8O ...

Il faudrait un peu plus développer. Présenter le restaurant et donner l'envie d'y venir. Le footer avec le google Map j'aime pas trop et le M en bas à gauche.
La grande photo au milieu de la page d’accueil plus petite avec une présentation de votre établissement.
Pour la rubrique "Le Restaurant et l'Equipe" je n'ai pas vu l'équipe... 8)
"desserts (faits maison)" oui c'est ce qui est attendu dans un restaurant...j’espère que les entrées et les plats sont aussi maison.
Expliquez peut-être si vous organisez des soirées...faite un "qrcode" à flasher pour retenir votre url et votre adresse...(même si c'est du "responsive design")
Salutations

 

[undeuxtoi]

nous avons un site undeuxtoi.com dont voici le lien http://www.undeuxtoi.com

il a été conçu en full reponsive design et nous constatons que nous sommes pas mal baladé par Google actuellement du fait de son nouveau système de référencement.

Savez-vous si au final, google va privilégier les sites conçus de cette manière par rapport aux autres ?

 

[Marie-Aude]

Merci d'ouvrir votre propre sujet.