Back to top

Autore Topic: Ottimizzazione Joomla senza utilizzo di estensioni. La mia esperienza  (Letto 16273 volte)

Offline otto9due

  • Appassionato
  • ***
  • Post: 689
  • Sesso: Maschio
  • Quello che semini raccogli!!
    • Mostra profilo
Personalmente mi sono chiesto quali e quanti possano essere i metodi per cercare di ottimizzare un sito fatto con joomla 1.5,  senza aggiungere estensioni o altro codice al nostro sito internet, ho provato a scrivere un articolo per cercare di rendere note quelle che in prima persona ho sperimentato e testato su alcuni siti joomla 1.5!
Sperando in numerosi commenti e sopratutto critiche ed implementazioni costruttive da parte vostra!

Link all'articolo: http://www.joomla.it/articoli-della-community/4679-ottimizzazione-joomla-senza-utilizzo-di-estensioni-la-mia-esperienza.html
« Ultima modifica: 06 Gen 2011, 10:15:21 da alexred »
Fai agli Altri quello che desidereresti fosse fatto a TE!!

Offline alexred

  • Fuori controllo
  • *
  • Post: 25672
  • Sesso: Maschio
  • Esperto in ozio relaxed
    • Mostra profilo
ciao otto9due,
grazie per l'ottimo articolo, sicuramente molto utile.

Consiglio di utilizzare questo strumento:  http://tools.pingdom.com
per verificare il tempo di caricamento della pagina ed avere un minimo di storico ed i dati globali del peso delle immagini o dei css ecc...  ricordando inoltre che spesso poi l'effettiva velocità di caricamento dipende molto anche dalle prestazioni del server che ospita il sito e dall'orario in cui si effettuano i test, in orari notturni forse si otterranno valori migliori rispetto ad orari come le 17:00 dove c'è maggior carico.

Già che l'articolo esamina vari aspetti del template consiglio anche di verificare sempre la validazione W3C http://validator.w3.org/ dell'html e dei CSS http://jigsaw.w3.org/css-validator/

Offline GabIvan

  • Appassionato
  • ***
  • Post: 212
  • Sesso: Maschio
    • Mostra profilo
Mi sa di aver trovato un errore:

Citazione
6) ATTIVAZIONE DEL Gzip
Anche se questa attivazione non ha nulla a che vedere con page speed, migliorerà l'esperienza degli utenti nella navigazione all'interno del vostro sito internet,  poichè essendo comprimendo le pagine sarà velocizzerà il loro caricamento di circa il 70%.

 ;D

Secondo la mia esperienza, si possono ottenere buoni risultati con i css sprites.

Offline alexred

  • Fuori controllo
  • *
  • Post: 25672
  • Sesso: Maschio
  • Esperto in ozio relaxed
    • Mostra profilo
ciao GabIvan,
grazie per la segnalazione, errore corretto.

Offline otto9due

  • Appassionato
  • ***
  • Post: 689
  • Sesso: Maschio
  • Quello che semini raccogli!!
    • Mostra profilo

Secondo la mia esperienza, si possono ottenere buoni risultati con i css sprites.

Benissimo, nell'ultima parte avevo inserito questa voce " css sprites " ho letto qualche guida ma non sono riuscito a metterla in pratica, se riuscissi a spiegare come sviluppare un css sprites con le immagini sarebbe un grande aiuto. Mi farebbe molto piacere se lo spiegassi, anche perchè è un errore che solitamente viene segnalato in rosso. Grazie!

Per quanto riguarda le prestazioni del server che ospita il sito ho letto di questo fattore, anche qui sul forum, poichè c'era un utente che lamentava la lentezza cercando un professionista joomla che risolvesse questo problema della velocità. Ha messo poi risolto al post dando come spiegazione: ho cambiato server che ospita il sito!
 Ma non avendolo sperimentato personalmente non l'ho messo  :P nell'articolo.
Cmq grazie mille alexred (specialmente per la pazienza e la costanza con la quale ti dedichi a questo forum) ;D

Inoltre vi segnalo anche un altro metodo di analisi per la velocità di un sito, che inserisce anche alcuni suggerimenti nelle statistiche che genera. Unico difetto un pò lentuccio nell'analisi, ma efficace:
http://www.joomlaperformance.com/component/option,com_performance/Itemid,52/   Poichè considera anche il Gzip e la compressione.
« Ultima modifica: 06 Gen 2011, 13:10:04 da otto9due »
Fai agli Altri quello che desidereresti fosse fatto a TE!!

Offline ilvanni

  • Global Moderator
  • Instancabile
  • ********
  • Post: 7038
  • Sesso: Maschio
  • Giovanni Vacca
    • Mostra profilo
Ciao otto9due, innanzitutto ti ringrazio pubblicamente per la citazione.

A parte tutto quello che ci siamo detti nei dibattiti e scambi di punti di vista ed esperienze/consigli, mi è piaciuto il fatto che è stato sottolineato il discorso sul @import dei css e sul discorso del num. posizioni moduli, bene, bene.

A proposito, l'ultima volta me lo sono dimenticato di dirtelo, aggiungi anche il fatto che (ove e quando possibile chiaramente) è meglio non usare il richiamo tramite api ai fonts di google (google font directory) al posto di quelli del css, in quanto chiaramente sono sempre altre chiamate esterne che devono andare a richiamare oggetti presenti altrove, processarli e renderli disponibili per la pagina per la quale vengono richiamati in quel momento. E' logico che questo discorso vale nel caso in cui la scelta di un carattere opzionale è diciamo così, superflua, che se ne potrebbe anche fare a meno, poi de gustibus e comunque se proprio serve... Sì lo so, è un discorso di 1 secondo o 2, ma dato che stiamo parlando dell'argomento, 1 secondo lì, 2 secondi là, 1/2 secondo là ancora... alla fine...

Poi bisogna stare attenti ai volumi di dati, es. più roba c'è in una pagina, meno miracoli ci si deve aspettare di ricevere, anche a fronte di un lavoro certosino di ottimizzazione (ricordiamoci che stiamo parlando di un cms che si interfaccia direttamente con un database nel quale alla fine ci va a confluire quasi tutto).

In ultimo, te l'avevo detto già in un vecchio post, mi raccomando, a seconda del sito che si tira su, è chiaro che ci si deve affidare ad un buon servizio di hosting, un buon piano, con buoni requisiti e potenza, altrimenti come ti ho già detto precedentemente, è come "...se mi costruisco da solo una ferrari e poi gli metto le gomme della 500 e giro nel cortile di casa mia, che cacchio di gara di velocità potrei mai andare a fare?"

Quindi, ricordiamoci anche sempre la mia frase "evitiamo di installare orpelli inutili" (ripetitiva ma efficace)...

Ciao Giacomo, un abbraccio e sempre in gamba, mi raccomando!

Offline andresb

  • Esploratore
  • **
  • Post: 185
    • Mostra profilo
articolo interessante, grazie per i suggerimenti!

una cosa che mi sembra subito strana.
In questo sito ( http://www.charcot.it ) ho attivato la compressione Gzip, ma Page Speed mi segnala (in rosso) la voce "Enable compression", consigliandomi di applicare la compressione a js e css.
La stessa cosa accade in altri miei siti...
Come mai?
« Ultima modifica: 07 Gen 2011, 10:51:45 da andresb »
Suage
Charcot - Apéritif Pop

Offline otto9due

  • Appassionato
  • ***
  • Post: 689
  • Sesso: Maschio
  • Quello che semini raccogli!!
    • Mostra profilo
Perchè da quanto ho capito la compressione Gzip, viene attivata sulla pagina e credo sull'html, non sui js ne sui css, ne sulle immagini di qualsivoglia estensione, per quello ci sarebbe un codice da inserire nel .htaccess ma solamente se hai a disposizione un server intero e non condiviso.( in più ci vogliono due requisiti che devono essere attivi sul server )
Almeno nelle mie prove non mi è riuscito. Per questo non ho inserito le stringhe qui sull'articolo. Ho provato a testare anche questo,ma se facendo prove anche tu, riesci ad estrapolare qualcosa nello specifico, questo sarebbe un enorme vantaggio. :D
« Ultima modifica: 07 Gen 2011, 11:30:52 da otto9due »
Fai agli Altri quello che desidereresti fosse fatto a TE!!

Offline solaria62

  • Esploratore
  • **
  • Post: 189
  • Sesso: Maschio
  • L'arte di vivere
    • Mostra profilo
grazie per l'ottimo argomento, che , credo, interssi tutti.
page speed spesso  raccomanda di spostare i javascript in basso... non capisco come fare, c'è una guida?'
risolvere questo problema aumenterebbe la velocità di visualizzaizone della pagina.... 
<a href="http://www.marasweb.it alt="promoziona il tuo sito"/">promozione su motori di ricerca[/url] ti
aiuta!

Offline andresb

  • Esploratore
  • **
  • Post: 185
    • Mostra profilo
@otto9due
ok, grazie!

certo che se la compressione gzip non funziona su js e css si perdono un bel po' di vantaggi...
Suage
Charcot - Apéritif Pop

Offline GabIvan

  • Appassionato
  • ***
  • Post: 212
  • Sesso: Maschio
    • Mostra profilo
Benissimo, nell'ultima parte avevo inserito questa voce " css sprites " ho letto qualche guida ma non sono riuscito a metterla in pratica, se riuscissi a spiegare come sviluppare un css sprites con le immagini sarebbe un grande aiuto. Mi farebbe molto piacere se lo spiegassi, anche perchè è un errore che solitamente viene segnalato in rosso. Grazie!

Per capire l'argomento mi son letto questa guida mentre per creare le immagini ho trovato questo sito e ne esistono altri infatti ho semplicemente cercato su Google.

Per fare un esempio, io ho usato questa tecnica per i social buttons.
1 Ho creato l'immagine grazie al sito di prima che genera anche il codice css che naturalmente poi modificare per renderlo più comprensibile e per poter seguire la guida (in poche parole trasformi tutti gli id in classi);

2 Ti crei un immagine png trasparente 1px x 1px;

3 richiami l'immagine; es:

Codice: [Seleziona]
<img src="/templates/xyz/images/trasparente.png" class="condividi facebook_png" alt="Share to Facebook" />

Offline ilvanni

  • Global Moderator
  • Instancabile
  • ********
  • Post: 7038
  • Sesso: Maschio
  • Giovanni Vacca
    • Mostra profilo
@solaria62:

...page speed spesso  raccomanda di spostare i javascript in basso... non capisco come fare, c'è una guida?'
risolvere questo problema aumenterebbe la velocità di visualizzaizone della pagina.... 

Il fatto di spostare in basso i js? Imho dico sì e no a questa cosa, tanto poi alla fine sempre li carica, a mio avviso questa è una cosa a cui non ho mai dato personalmente peso, poi è a discrezione del webmaster.

Offline otto9due

  • Appassionato
  • ***
  • Post: 689
  • Sesso: Maschio
  • Quello che semini raccogli!!
    • Mostra profilo
Purtroppo come dice la stessa guida per i css sprites hanno dei limiti, 1 è il tempo che ci vorrebbe per impostarli su tutte le pagine, 2 non sono molto pratici in quanto a modifiche (essendo le immagini un qualcosa che spesso si modifica e/o si cambia di posizione). Difatti come la stessa guida dice:
" Perché un'immagine sprite con i CSS funzioni deve sempre avere una larghezza, un'altezza e una background-position definite. Se non lo fate vedrete l'intero sprite in quell'immagine." quindi bisnogna di volta in volta impostare le dimensioni dell'immegine ad una ad una se non sono tutte uguali nonchè impostare anche la posizione esatta.. un pò noiosa come cosa, salvo che non sia una cosa che rimane sempre fissa li..
Fai agli Altri quello che desidereresti fosse fatto a TE!!

Offline ventus85

  • Instancabile
  • ******
  • Post: 6538
  • Sesso: Femmina
  • Affetta da Joomlaite
    • Mostra profilo
Ottimo articolo!  ;)
Se volete aiuto non mandate messaggi privati, ma usate la funzione Cerca e postate sul forum, grazie!

Born in the wind, born to be wild!

Offline otto9due

  • Appassionato
  • ***
  • Post: 689
  • Sesso: Maschio
  • Quello che semini raccogli!!
    • Mostra profilo
Ottimo articolo!  ;)

Grazie mille   :P
Fai agli Altri quello che desidereresti fosse fatto a TE!!

Offline seflex

  • Esploratore
  • **
  • Post: 60
    • Mostra profilo
Ciao. Ottimo articolo, aggiungo la mia. la procedura di creazione di css sprite e molto facile.
1. Ricavate le immagini del vostro sito.
2. Raggruppateli: orizzontali e verticali e comprimete in due cartelle zip
3. Andate su questo sito http://spritegen.website-performance.org/ e caricate le cartelle zip, dopo riceverete i codici di posizione di ogni immagine 
4. Caricate l'immagine sprite sul vostro server
5. Aprite il file css del vostro template e aggiungete i codici con il nuovo percorso del immagine.
Esempio:
Prima
background: url(../images/main_top.png) no-repeat center top;}
Dopo
background:url(../images/sprites.png) no-repeat center top; background-position: 0 -217px;}
Praticamente va aggiunto la posizione del immagine e il nuovo file
----------------
« Ultima modifica: 07 Gen 2011, 15:25:53 da seflex »

Offline otto9due

  • Appassionato
  • ***
  • Post: 689
  • Sesso: Maschio
  • Quello che semini raccogli!!
    • Mostra profilo
Ma la posizione dell'imm te la da questo sito in automatico?
Fai agli Altri quello che desidereresti fosse fatto a TE!!

Offline tonicopi

  • Global Moderator
  • Instancabile
  • ********
  • Post: 12790
  • Sesso: Maschio
    • Mostra profilo
Ottimo articolo, grazie! ottimi spunti di discussione!

Confermo che però l'ottimizzazione di un server per joomla ha la maggior importanza nella velocità di caricamento di un sito joomla!
Vi porto una mia personale esperienza. Avevamo provato ogni accorgimento utile per velocizzare il sito, chiedendo anche la collaborazione del gestore dell'hosting. Niente da fare! Ci volevano trentacinque lunghissimi secondi per il caricamento della home page!  :(
Cambiato gestore host: 5 secondi netti!  :D
joomlacsszengarden.com = il giardino dei css di Joomla!
L'attesa del piacere è essa stessa... piacere!

Offline otto9due

  • Appassionato
  • ***
  • Post: 689
  • Sesso: Maschio
  • Quello che semini raccogli!!
    • Mostra profilo
So che vado un pò contro le regole del forum ma qui la domanda sorge spontanea... Ma in definitiva quale host consigliate per un sito veloce.. Rispondetemi anche in privato se qui sul forum nn è possibile ma svelatemi sto segretooooo!!! ;D
Fai agli Altri quello che desidereresti fosse fatto a TE!!

Offline GabIvan

  • Appassionato
  • ***
  • Post: 212
  • Sesso: Maschio
    • Mostra profilo
Purtroppo come dice la stessa guida per i css sprites hanno dei limiti, 1 è il tempo che ci vorrebbe per impostarli su tutte le pagine, 2 non sono molto pratici in quanto a modifiche (essendo le immagini un qualcosa che spesso si modifica e/o si cambia di posizione). Difatti come la stessa guida dice:
" Perché un'immagine sprite con i CSS funzioni deve sempre avere una larghezza, un'altezza e una background-position definite. Se non lo fate vedrete l'intero sprite in quell'immagine." quindi bisnogna di volta in volta impostare le dimensioni dell'immegine ad una ad una se non sono tutte uguali nonchè impostare anche la posizione esatta.. un pò noiosa come cosa, salvo che non sia una cosa che rimane sempre fissa li..

Ma aspetta; gli sprites vengono creati per immagini usate in molte pagine. Se prendi come esempio il mio sito, i social buttons sono fatti con questa tecnica. Altre immagini che potrei mettere assieme sarebbero quelle del template.

Assolutamente non bisogna usare la tecnica con immagini usate in poche pagine come ad esempio in un articolo.

Per cui la perdita di tempo è inesistente anche perché gli strumenti online fanno tutto loro; ti creano anche il codice css relativo.

Offline otto9due

  • Appassionato
  • ***
  • Post: 689
  • Sesso: Maschio
  • Quello che semini raccogli!!
    • Mostra profilo
OK allora in questi casi sono d'accordo.. Buona idea la devo testare ;-)
Fai agli Altri quello che desidereresti fosse fatto a TE!!

Offline caps

  • Abituale
  • ****
  • Post: 848
  • Sesso: Maschio
  • smanetòn (geek)
    • Mostra profilo
comfermo anche io che usando gli sprite per le immagini dei social network page speed non le segnala più come immagini da ottimizzare, chiaramente il lavoro iniziale è un filino più impegnativo ma credo ne valga la pena

io uso gimp per la modifica delle immagini
dopo un paio di prove per prendere pratica con le classi css le modifiche si applicano in pochissimo tempo

un esempio interessante si può vedere nel sito www.connecting-managers.com in basso a destra dove hanno usato gli sprite addirittura per un menù ...
Caps
dentri Furlan (Furlan inside)-un istant par imparà il furlan

Offline otto9due

  • Appassionato
  • ***
  • Post: 689
  • Sesso: Maschio
  • Quello che semini raccogli!!
    • Mostra profilo
Ma hai utilizzato la tecnica descritta nel post precedente? O un'altra su qualche altro sito?
Anche se nel sito da te citato, www.connecting-managers... la spunta di page speed me lo da in rosso  ::), ma si vede che su molte cose utilizza il css sprite Grazie a presto  :D
« Ultima modifica: 10 Gen 2011, 01:30:50 da otto9due »
Fai agli Altri quello che desidereresti fosse fatto a TE!!

Offline caps

  • Abituale
  • ****
  • Post: 848
  • Sesso: Maschio
  • smanetòn (geek)
    • Mostra profilo
la tecnica degli sprite css non è altro che ridurre il numero delle immagini e quindi chiamate al server ...

il sito citato era solo per esempio per un menù con sprite css ...
Caps
dentri Furlan (Furlan inside)-un istant par imparà il furlan

Offline GabIvan

  • Appassionato
  • ***
  • Post: 212
  • Sesso: Maschio
    • Mostra profilo
Bisogna anche ricordarsi che non tutte le immagini possono essere usate in questa tecnica.
Non potrò mai unire l'immagine di sfondo di 1px x 940px con quella orizzontale di 1000px x 1px.

Offline otto9due

  • Appassionato
  • ***
  • Post: 689
  • Sesso: Maschio
  • Quello che semini raccogli!!
    • Mostra profilo
Queste modifiche ( ad esempio per le imm del template ) vanno apportate nel template.css? O comunque nei css che richiamano le immagini? ???
Fai agli Altri quello che desidereresti fosse fatto a TE!!

Offline GabIvan

  • Appassionato
  • ***
  • Post: 212
  • Sesso: Maschio
    • Mostra profilo
Queste modifiche ( ad esempio per le imm del template ) vanno apportate nel template.css? O comunque nei css che richiamano le immagini? ???

Le modifiche devi farle dove vengono richiamate le immagini. Naturalmente è sempre valido il concetto di unificazione degli stili in un solo file.

Offline Beppegoal

  • Esploratore
  • **
  • Post: 76
  • Sesso: Maschio
  • popstar
    • Mostra profilo
Vorrei ringraziare l'autore di questo articolo perché oltre ad essere ben scritto offre numerosi spunti di riflessione.

Offline otto9due

  • Appassionato
  • ***
  • Post: 689
  • Sesso: Maschio
  • Quello che semini raccogli!!
    • Mostra profilo
Vorrei ringraziare l'autore di questo articolo perché oltre ad essere ben scritto offre numerosi spunti di riflessione.

Anzitutto grazie per gli apprezzamenti. Sinceramente non mi aspettavo così tante letture, ma i primi risultati lasciano presagire quanto questo argomento sia apprezzato e ricercato, e quanto interesse ci sia nell'approfondirlo.
Sono felice di aver contribuito, seppure in minima parte, allo stesso approfondimento e che i miei sacrifici e le mie ricerche siano state apprezzate.  ;)
Fai agli Altri quello che desidereresti fosse fatto a TE!!

Offline GabIvan

  • Appassionato
  • ***
  • Post: 212
  • Sesso: Maschio
    • Mostra profilo
Proprio ieri su www.downloadblog.it hanno pubblicato un articolo su una estensione per firefox: SEO doctor.
Rispetto a firebug con pagespeed, questa estensione è prettamente mirata all'ottimizzazione e risulta più adatta a persone con minore esperienza.
Ecco il link all'articolo:

http://www.downloadblog.it/post/13628/seo-doctor-unestensione-firefox-per-valutare-lottimizzazione-delle-vostre-pagine

Offline otto9due

  • Appassionato
  • ***
  • Post: 689
  • Sesso: Maschio
  • Quello che semini raccogli!!
    • Mostra profilo
L'ho testato ma... A parte che questo mi sembra più un estensione per la SEO non per la velocità, mi sembra anche un pò riduttiva per quanto riguarda i suggerimenti, ti evidenzia che so, i titoli in H1, ma non ti dice però in quali pagine ne il numero di errori, (che invece dice solo per alcuni errori particolari).
In più se non frequenti di continuo un sito molti dati non te li da mettendo sempre es : None Visits: n/a ecc...

In più, per quanto riguarda i css sprites, nel caso in cui un immagine è in ripetizione come nella maggiorparte dei template bisognerà lasciare anche il repeat-x
« Ultima modifica: 12 Gen 2011, 19:06:01 da otto9due »
Fai agli Altri quello che desidereresti fosse fatto a TE!!

Offline GabIvan

  • Appassionato
  • ***
  • Post: 212
  • Sesso: Maschio
    • Mostra profilo
L'ho testato ma... A parte che questo mi sembra più un estensione per la SEO non per la velocità, mi sembra anche un pò riduttiva per quanto riguarda i suggerimenti, ti evidenzia che so, i titoli in H1, ma non ti dice però in quali pagine ne il numero di errori, (che invece dice solo per alcuni errori particolari).
In più se non frequenti di continuo un sito molti dati non te li da mettendo sempre es : None Visits: n/a ecc...

In più, per quanto riguarda i css sprites, nel caso in cui un immagine è in ripetizione come nella maggiorparte dei template bisognerà lasciare anche il repeat-x

Bisogna ricordarsi che nell'ottimizzare un sito bisogna considerare anche la SEO d'altronde un sito deve essere raggiungibile a meno che non sia usato da soli eletti   ;D (esempio applicazione Intranet)

 



Web Design Bolzano Kreatif