Optimiser le temps de chargement de mon siteRésolu/Fermé

Question

Bonjour,

je viens de finir le "construction" de mon site internet, en faisant le tous de mes proches internautes, il en revient que certaines parties du site sont très longues a chargé, je souhaiterais donc avoir votre avis, et savoir ce que vous me conseiller afin d'ameliorer la vitesse de chargement.

Le site: http://yoshiprod.free.fr

merci

PMax-57 · Accepted Answer

Salut !

petit post-opinion :

1) ton site est très bien fait (juste dommage qu'on retrouve du mootools et slimbox, ce qui rends la chose moins personnelle bien que le rendu de ce script soit excellent...)
2) free => terrible pour hébergement gratuit, mais quand il s'agit de télécharger des choses lourdes (notamment les photos), ça commence a peser... on peut pas tout avoir ^^
3) perso je suis chez OVH, très bon rapport qualité / prix.

Bonne continuation ;)

Zemimi · Answer

Change d'hébergeur...
malheureusement, ton site, qui est super bien fait, nessesite de la bande passante, et l'hebergement gratuit de free est juste

Yoshiprod · Answer

et quel hebergeur gratuit ou payant me conseillerais tu pour que je passe en vitesse lumière??

merci de ta reponse

Utilisateur anonyme · Answer

"Change d'hébergeur... "


Heu personnellement je trouve que Free n'est pas mauvais pour un site de ce genre...

Il faudrait juste voir à compresser les images car elles font un poids conséquent par rapport à leur taille...

Pareil pour le cv, pourquoi est-il sous forme d'image ?? du texte mis en forme avec css donne le même résultat...

Sinon, le lien mailto: c'est vraiment très très décevant pour quelqu'un qui a fait des études dans le web...

Si tu veux convaincre avec ce site, il va falloir donner le meilleur de toi même, et ne pas se contenter de choses simples...

Yoshiprod · Answer

merci de me répondre,

pour le mailto je comtais changer cela en creant une page contact avec formulaire....

pour le cv..... et bas oui je suis fautif! je vais m'atteler a changer ça.

pour ce qui est de diminuer la taille des images je suis en train de les modifier avec punypng sa me fait gagner de 10 a 20% sur la taille de mes images mais si vous connaissé d'autre moyen pour diminuer leur poid sans perdre la qualité je suis preneur. merci

Utilisateur anonyme · Answer

"pour le mailto je comtais changer cela en creant une page contact avec formulaire...."

En voilà une bonne idée !! :-)

"pour le cv..... et bas oui je suis fautif! je vais m'atteler a changer ça."

Et hop, encore une !! :-)

"pour ce qui est de diminuer la taille des images je suis en train de les modifier avec punypng sa me fait gagner de 10 a 20% sur la taille de mes images mais si vous connaissé d'autre moyen pour diminuer leur poid sans perdre la qualité je suis preneur."

Photoshop, enregistrer pour le web, JPEG, qualité 60%... je trouve pas ça moche et ca te fait passer de 107.82 Ko, à 28.67 Ko... Après à toi de régler, mais pourquoi choisir PNG alors que t'as rien de transparent ?? Surtout qu'avec IE... le png c'est vraiment moche...

D'ailleurs sur IE 6, ton menu avec le PNG est illisible...

Yoshiprod · Answer

nan mais l'outil punypng ( que je decouvre ) me permet de reduire la taille des png jpg et je perd pas de qualité donc je me dit que 20 % sa peut deja etre pas mal apres faut voir si au final je gagne beaucoup.

http://www.gracepointafterfive.com/punypng/

bg62 · Answer

première chose  : la page index !
un fichier flash ... avec 'enter' qui va poser gros problèmes pour le référencement !
(à refaire complètement ....)
la page accueil.html  : même chose ! que du flash (un tout petit texte), pas de balises, charset inadapté ... etc ...
un site doit donner qq chose à "manger" aux moteurs de recherche, c'est le but du jeu non ??? là tu n'as rien ; donc du boulot sur la planche !
mais c'est faisable :
optimiser et référencer site en flash
petit exemple de qq qui lui aussi a du talent mais ne connait pas les règles des moteurs de recherche ... Maintenant il y est, à lui de faire "tourner" ...
et plus que d'accord sur le problème des pages BEAUCOUP trop lourdes ... ailleurs ce sera la même chose !
Il n'y aurait à la limite que le blog, mais venant de 'over blog' ... pourquoi ne pas être 'indépendant' ???
bonne chance et bon courage 
:)

Utilisateur anonyme · Answer

Ok, chacun son point de vue, mais....

"pourquoi choisir PNG alors que t'as rien de transparent ?? Surtout qu'avec IE... le png c'est vraiment moche... D'ailleurs sur IE 6, ton menu avec le PNG est illisible... "

Yoshiprod · Answer

les png pour la section index_port.html c'est parce qu'il y a un leger ombrage autour des png après avec le survol que j'ai rajouté je me rend compte que sa fait quelque chose d'assez lourd ( ça ferait 6 png a charger donc oui faut que je revois ça ).

Sinon pour le référencement  ( c'est des choses que je découvre je ne connaissait rien au html il y a quelques mois :P ) si j'ai bien compris j'ai interet a ce que ma première page contienne du texte avec le maximum ( en condensé ) d'information sur moi et mon site, j'ai bien tout compris au il faut que je retourne tout de suite en cours et que je me mette au premier rang et pas au fond de l'amphi?

Zemimi · Answer

Et aussi, sur certaines pages, il y a sur la droite de l'écran une grosse marge blanche, (j'affiche en 1620*1050, voire 1920*1080 de temps a autres)
Sinon je le trouve plus rapide avec FF3.5.2 qu'avec IEtab

Utilisateur anonyme · Answer

"il y a un leger ombrage autour des png"

Un ombrage sur un fond noir.... c'est pas inutile ça ?

Yoshiprod · Answer

bon alors j'ai fait quelque modifs; j'ai reduit la taille de mes jpeg, remplacer certains png par des jpg, creer une page contact ( j'ai abandonner le formulaire, le PHP me fait trop peur ), essayer de regler le problème de marge blanche mais je peu pas verifier donc voila

Est ce que vous voyez une difference au chargement de la page?

est ce que mon survol sur la page portfolio.html ne rame-t-il pas horriblement?

et pour le reférencement j'ai pas tout compris si quelqu'un peut m'eclairer merki!

merci de vos ( futur/probable/inexistante/inneporable mr désolé il faut l'achever) reponses

Utilisateur anonyme · Answer

"j'ai abandonner le formulaire, le PHP me fait trop peur"

Portant sur ton CV tu le mentionnes noir sur blanc dans tes compétences...

Et puis aller, je me lâche...

Tu utilises un fond bg2.gif qui est un fond tout noir... tu sais réellement faire des sites internet ??? A ce niveau on se demande... encore 75Ko de données qui servent à rien... il suffit de déclarer la couleur de fond dans le CSS et ca prends quelques octets...

As tu porté attention à ce que je t'ai dis il y a quelques heures ?? sur IE ton site est illisible... La cause ?? PNG !!!

C'est dingue ça...

Zemimi · Answer

Déjè, le portfolio répond quasi instentanément, le cv est un peu long, mais va plus vite que la lecture donc sa va ^^le blog met moins de 2 secondes a se charger la première fois, et c'est instentané une fois en cache(comme le CV)
page contact instentané

Yoshiprod · Answer

merci pour vos reponses;

Anonym€ merci d'être franc ( c'est limite mechant mais bon ),

comme je l'ai dit je l'ai dit je suis etudiant je suis pas un pro, après d'accord je met PHP dans mon cv mais on nous a appris a faire comme cela en cours, je ne maitrise pas PHP, malgré tout j'y ai été formé et j'en connais les bases ( après il y a peut etre des details a modifier dans mon cv )

sinon:

"Tu utilises un fond bg2.gif qui est un fond tout noir"

J'utilise un fond bg2.fpg qui n'est pas un fond noir

"tu sais réellement faire des sites internet ??? A ce niveau on se demande... "

J'aprend c'est pour ça que je suis la.

"sur IE ton site est illisible..."

chez moi sa marche, au pire je mettrai une mention "optimisé pour firefox"

"C'est dingue ça.."

oui c'est fou!

voila merci tout de même et si quelqu'un peut m'aiguiller sur le référencement, en gros dois je impérativement faire en sorte que ma première page contienne le maximum d'information sur le site.

merci

Zemimi · Answer

Sa marche sous IE, c'est sous IE6 que sa doit pas marcher, sinon sa fonctionne bien, mais sous chrome, les bandes blanches sont plus présentes et le chargement est plus long, donc oui, optimisé firefox ^^

Utilisateur anonyme · Answer

"Anonym€ merci d'être franc ( c'est limite mechant mais bon )"

Mais au moins c'est franc...

"J'utilise un fond bg2.fpg qui n'est pas un fond noir"

C'est quelle couleur pour toi ça ??? http://yoshiprod.free.fr/design/bg2.jpg

"J'aprend c'est pour ça que je suis la."

Ton CV est donc entièrement à revoir... création de site internet tu effaces, ainsi que HTML PHP CSS et Javascript... Tant que tu ne maitrises pas, ca ne sert a rien de le mettre sur ton CV... c'est pas parce que tu fais la vidange de ta voiture tout seul qu'il faut péter "Mécanicien" sur ton CV non ?

"sur IE ton site est illisible..."

Et la je reprends ce que j'ai dis plus haut --> "D'ailleurs sur IE 6, ton menu avec le PNG est illisible... "
Il est vrai que j'ai fait erreur en ne précisant pas encore une fois la version qui foire...

"si quelqu'un peut m'aiguiller sur le référencement"

Oui pourquoi pas, mais avant de faire connaitre ton site à tout le monde (but du référencement), assures toi qu'il est irréprochable... Je ne veux pas être méchant avec toi, t'es jeune, t'as de l'ambition et tu as l'air sérieux !! Mais il y a tellement de sites (excusez moi l'expression) merdiques, qu'il ne faudrait pas qu'un mec comme toi, qui a du talent en graphisme, et qui a suivit une formation en créa web, fasse la même chose...

Des sites pourris c'est 80% de la toile (on imagine pas le nombre de pages perso...) alors fais un effort pour appartenir aux 20% qui restent !!

"au pire je mettrai une mention "optimisé pour firefox""

Non, non et non... quand on aime le travail bien fait (et c'est toujours bon de le faire voir sur un CV) on s'applique pour qu'il soit correct sur tous les supports...


Sur ce désolé d'être direct... c'est une qualité chez certains, et un défaut pour d'autres... j'estime que c'est la clé de la réussite.

Yoshiprod · Answer

"C'est quelle couleur pour toi ça ??"

ba c'est un fond d'écran que j'ai réalisé je sais pourquoi tu vois un fond noir j'espère qu'il y a que toi qui le voi comme ça

"Ton CV est donc entièrement à revoir... création de site internet tu effaces, ainsi que HTML PHP CSS et Javascript..."

Comme je l'ai dit on nous a appris a faire nos cv, ainsi ne je vais pas enlever création de site internet puisque c'est bien ce que l'on nous apprend en DUT SRC. Apres pour ce qui est des langage informatique je n'ai preciser maitrisé ou non mais ça s'est toujours pareil avec les CV, ils y a 30 façon différentes de les faire mais je n'exclue pas quelques modifs en rajoutant des niveaux ( notion, scolaire ) comme pour les langues.

"sur IE ton site est illisible..."

un petit optimiser pour firefox reglera le tout; apres je suis en train de virer mes boutons en png pour les remplacer par du texte la j'avoue j'ai merdé.

Zemimi · Answer

Sachant que la majorité des personnes utilisent IE6, (les plus noobs) je ne me passerais pas de cette clientèle, et j'optimiserais un peu pour les autres, faut mettre sa fainéantise de côté.

Yoshiprod · Answer

nan mais oui je n'exclue pas les utilisateurs d'IE6 ( même si je n'attend pas à ce qu'il vienne visiter mon site ) et je suis en train de faire le maximum de modif possible, apres compte tenu de mes capacités je sais qu'il ne sera jamais totalement adapté a tous les navigateurs.

Mais je fais le maximum, allez dire a ma petite amie qu'il faudrait que je passe plus de temps sur mon site et je ne donnerais pas chère de votre peau ^^

Utilisateur anonyme · Answer

"ba c'est un fond d'écran que j'ai réalisé je sais pourquoi tu vois un fond noir j'espère qu'il y a que toi qui le voi comme ça"

Ah, oui effectivement ce n'est pas totalement noir... c'est tellement foncé que l'inclinaison de l'écran fausse les données... ceci dit, ça peut être laaargement optimisé parceque un background de 1300px de large, c'est lourd lourd très lourd. mieux vaut déclarer une couleur de fond #000; avec un background url de ton image plus cadrée en no-repeat center center;

"Comme je l'ai dit on nous a appris a faire nos cv, ainsi ne je vais pas enlever création de site internet puisque c'est bien ce que l'on nous apprend en DUT SRC."

Hum... ouais... bon bah puisque j'ai fait de la philo, de l'histoire et des maths dans mon cursus scolaire, je peux mettre que je suis capable de faire les mêmes choses qu'un philosophe, un historien et un mathématicien... ok... ok... Y'a une différence entre apprendre et maîtriser... Si tu ne maîtrises pas, tu ne mentionne pas (surtout si c'est ce qui ressors le plus dans le CV). Comme je disais : "c'est pas parce que tu fais la vidange de ta voiture tout seul qu'il faut péter "Mécanicien" sur ton CV". Chacun son truc...

"un petit optimiser pour firefox reglera le tout"

Voià, c'est une bonne façon de dire "merde" à 67% des visiteurs de ton site !

Yoshiprod · Answer

Je vais mettre un petit notion de base en Javascritp PHP... et sa passera mieux ( je pense )

Pour le optimiser pour firefox je penserai ( je l'ai pas encore mis :p ) pas être le premier a le faire.

Merci par contre pour le font sa va regler mon problème de bande blanche!

bg62 · Answer

mets ton 'cv' en "texte" le fichier png est trop long a charger ...

Zemimi · Answer

Et si tu tient a ton Image, fais un Jpeg minimaliste, mais PAS de .png

et il y a bien des sites ou il est écrit dessus "Optimisé pour Internet explorer 6", quels vieux site de merde ...

bg62 · Answer

bon moi ... je laisse tomber !
:)

Yoshiprod · Answer

Chacun son point de vue! je vous remercie tout de même pour vos conseils et avis; je vous rapelle que je ne suis encore qu'étudiant. Je vais d'ailleurs retrouver dans deux semaines mes professeurs qui sont des professionnels reconnu à qui j'accorde plus de crédit qu'a des internautes anonyme ( même si j'ai pris vos conseil en compte ).

une dernière chose, j'aimerais savoir pourquoi préféré un jpg au png pour mon cv? ( IE6 n'affiche pas les .png?)

merci

bg62 · Answer

Je vais d'ailleurs retrouver dans deux semaines mes professeurs qui sont des professionnels reconnu à qui j'accorde plus de crédit qu'a des internautes anonyme
- mets un S à reconnuS sinon tes chers profs vont te saKer ! (et si possible à amonymeS)
- anonymes : tu parles de qui là ????   faudrait savoir ...

Yoshiprod · Answer

Désolé pour le faute mais on va dire que je viens de me lever donc j'ai un peu de mal :p,

Quand je dis anonyme, je veux dire par là que vous n'êtes pas en face de moi, que je ne vous connais pas, donc j'ai plus de mal a accorder ma confiance à un pseudo, confiance que j'accorde plus volontiers à mes professeurs mais je n'ai rien contre vous.

Si je suis venu là c'est pour prendre le maximum d'information/conseil après il est bien évident que c'est a moi de decider si oui ou non je dois les appliquer! mais je ne ferme pas, je souhaite juste que l'on m'explique les choses que j'ai du mal a comprendre de maniere calme et posé.

Quand je vois que j'en déçois certain, sa ne me fait pas très mal au c**, pardonner moi l'expression.

Voila tout maintenant bg62 peut tu ( si tu le souhaite ) m'expliquer l'interet que j'aurais a remplacé mon .png par un .jpg 

merci

Utilisateur anonyme · Answer

"Chacun son point de vue!"

Tout à fait :
1 - Le point de vue professionnel
2 - Le point de vue amateur

"Je vais d'ailleurs retrouver dans deux semaines mes professeurs qui sont des professionnels reconnu"

Sans déconner.... Quelqu'un voit des noms sur cette fiche ??
http://iutdijon.u-bourgogne.fr/internet/documents/fiches_filiere/DUT_SRC_09.pdf

Moi pas... Ils sont peut être reconnus, mais personne ne s'en vante à Dijon... D'ailleurs c'est pas parce qu'ils ont des années d'expérience derrière eux qu'ils sont au point... L'informatique ça évolue très vite, et on se retrouve largué rapidement... Après si ils sont si bons que ça, c'est que tu es un cancre à l'école...

"à qui j'accorde plus de crédit qu'a des internautes anonyme ( même si j'ai pris vos conseil en compte )."

Après tu fais ce que tu veux... tu pouvais aussi attendre deux semaines pour connaître les raisons de la lenteur de ton site !! Plutôt que de demander à des mecs qui en savent moins que tes profs sur le sujet !

"une dernière chose, j'aimerais savoir pourquoi préféré un jpg au png pour mon cv? ( IE6 n'affiche pas les .png?)"

Demande à tes profs !! Eux au moins quand ils parlent, tu les écoutes...

"Quand je vois que j'en déçois certain, sa ne me fait pas très mal au c**, pardonner moi l'expression."

Et bien tu décevras sûrement tes futurs boss alors... et il faudra que tu revois ta façon de bosser... tôt ou tard...

PMax-57 · Answer

Re !

Sans vouloir alimenter la polémique, juste pour répondre à la question : 

"pourquoi préférer les JPG au PNG sur IE 6" => Tu peux utiliser ces deux formes de fichiers sous IE6, ils servent à compresser les images et le font très bien (PNG est excellent pour la miniaturisation d'image, et offre un très bon rendu en toutes circonstances).


La différence, outre le rapport de compression (diminution du poids de l'image), est sur l'opacité. En effet, le PNG accèpte le différentes opacités, cette variable nommée la couche Alpha. C'est à peu près ce qui est utilisé sur les GIFS, en 1000 fois mieux. 

IE6 ne détecte pas la couche ALPHA, ce qui rends les opacités que t'auras pu faire inefficaces. A savoir que sur le .JPG tu ne peux rien faire de transparent, de moyennement opaque etc.

Autre chose : beaucoup de gens ne codent plus pour IE6 car trop de temps est perdu à rendre le site compatible, pour seulement 10% des internautes qui l'utilisent.

Perso, je continue à coder compatible IE6 car je ne crache pas sur les 10%, mais bon par exemple youtube ne le fait plus. C'est au choix du webmaster.



Tcho !

bg62 · Answer

met ton post en "résolu" ... là y-en-a-marre-maintenant ...
merci  :)

Yoshiprod · Answer

oui merci pmax-57 pour ces explications

merci a vous tous.

( au passage 2 exemples de mes professeurs a l'iut de dijon:

http://www.pascal-lardellier.com/biographie.htm

http://grosbook.chez-alice.fr/cv.html )

voila post "résolu"!

bg62 · Answer

voila post "résolu"!
où ??

Yoshiprod · Answer

arf! comment on clos un sujet? desolée c'est ma première visite ici :p

bg62 · Answer

tu pourrais demander à tes profs, mais , bah ... allez je suis bon : en haut de page (= en haut du post )
il y a une case "résolu" à cocher ... maintenant si tu ne me crois pas attends une quinzaine pour leur demander de t'aider ....
:)

PMax-57 · Answer

Pour bg62, j'adore ta façon de répondre ^^ Faut pas leur en vouloir, le premier c'est un template : */ ----------------------------------------------- Blogger Template Style Name: Minima Designer: Douglas Bowman URL: www.stopdesign.com Date: 26 Feb 2004 ----------------------------------------------- */ Le second, on voit qu'il est de la vielle école avec plein de , etc.. Par contre il se débrouille pas trop mal au niveau du flash : http://grosbook.chez-alice.fr/ (la page d'accueil n'est pas mal) Concernant les validations W3C, même moi qui essaye de créer des sites Internet valides je ne les respecte pas forcément... Au final, tant que c'est compatible FF, IE7 & sup, GG chrome, tout va bien... (Bien qu'avec un respect des normes W3C tout irait encore mieux !) Bonne journée :)

bg62 · Answer

tout à fait d'accord,pour le 'W3C' ...moi aussi ... mais là ça fait quand même un peu fort ....
et dire que l'on a essayé d'aider (un anonyme une fais de plus ....)  pour se faire envoyer sur les roses de cette manière ...
bon ça finira par me passer ...
:)

Yoshiprod · Answer

Ca sera mon dernier post:

A aucun moment je n'ai voulu vous manquer de respect ou vous envoyer paitre, si c'est ce que vous avez ressenti; je m'en excuse. 
Je souhaitait simplement expliquer comment je percevait le fait d'accorder plus de credit aux paroles de mes professeurs que je connais ( je sais qui ils sont j'ai leur cv devant moi ce qui leur permet de gagner en crédibilité a mes yeux ).

Je concede cependant que sans vous mon ne ressemblerais a rien; trop lent a charger, plein d'erreurs;
J'ai fait un paquet de modifications, mon site n'est toujours pas parfait mais vous m'avez permit de l'ameliorer considerablement et pour ça je vous en remercie.

Sur ce bonne journée et au prochain sujet.....

(^_^)

bg62 · Answer

je percevait
= je percevais
(ceci pour tes profs qui viendront ici .... ça va faire mal !)
by définitif !

PMax-57 · Answer

Bah inscrit toi sur le forum comme ça on pourra suivre tes différents sujets.

Pour ma part ce sera avec plaisir que je le ferais, comme pour tous les inscrits d'ailleurs


Bonne journée :)

:hap: · Answer

:hap:

Anonymous · Answer

/*
Tout à fait d'accord,pour le 'W3C' ...moi aussi ... mais là ça fait quand même un peu fort ....
et dire que l'on a essayé d'aider (un anonyme une fais de plus ....) pour se faire envoyer sur les roses de cette manière ...
bon ça finira par me passer ...
:)  */

Un anonyme une fois de plus.

De rien.

Fy- · Answer

Sinon, en plus on trouve un tutoriel complet et simple ici: http://www.lezard-spock.com/optimiser-le-temps-de-chargement-de-votre-site.html

Optimiser le temps de chargement de mon site

44 réponses

Discussions similaires

Newsletters