Reverse Engineering di WordPress: come replicare un sito WordPress

Questo sito web sembra così bello. Vorrei avere un sito web del genere.

Ti suona familiare?

Questo è il pensiero di quasi tutti i blogger quando vedono un sito Web, ostentando un'interfaccia utente interessante, colori, caratteri, ecc.

Mi sono ritrovato più volte nella stessa situazione e sapevo che era necessario fare qualcosa. Quindi, sono andato avanti e ho fatto la mia ricerca.

Più in particolare, ho trovato strumenti in grado di decodificare un sito Web, rivelando tutti i segreti sottostanti che lo alimentano.

In questo post, condivido la mia strategia di Reverse Engineering di WordPress e l'elenco di strumenti che puoi utilizzare per replicare qualsiasi sito WordPress.

Ma Shafi, perché WordPress? Potresti chiedere.

Il motivo è piuttosto semplice. WordPress è uno dei sistemi di gestione dei contenuti più popolari e alimenta il 28,6% di tutti i siti Web su Internet.

Sorprendentemente, ogni giorno vengono lanciati altri 50.000 siti WordPress ( fonte ) e siti popolari come TechCrunch, Disney, Sony, ecc. utilizzano WordPress per eseguire il loro sito ( fonte )

Spero che risponda alla tua domanda.

[click_to_tweet tweet=”Ogni giorno vengono lanciati 50.000 blog WordPress e diventa importante avere un ottimo design e funzionalità. Ecco 5 passaggi per copiare qualsiasi blog WordPress. #WordPress #OceanWP #WordPressFacts” quote="Lo sapevi che ogni giorno vengono lanciati 50.000 nuovi blog WordPress. #WordPressFacts”]

Pronto a rotolare? Iniziamo.

Passaggio 0: verifica se il sito utilizza WordPress

L'hai visto arrivare, vero?

Ovviamente, la prima cosa che dobbiamo fare è controllare se il nostro sito preferito utilizza WordPress. In caso contrario, non ha senso seguire questa strategia e continuerai a grattarti la testa nei passaggi successivi.

Per verificare quale sistema di gestione dei contenuti (CMS) alimenta un sito Web, utilizzeremo WhatCMS.org , uno strumento online gratuito.

L'utilizzo dello strumento è semplice, copia il sito Web da testare, inseriscilo nella casella del sito Web fornita e premi invio.

Lo strumento eseguirà set di algoritmi e fornirà un risultato che mostra quale CMS viene utilizzato dal sito web.

Passaggio 1: copia del design

Il prossimo passo ovvio è controllare quale tema WordPress viene utilizzato dal sito in questione. Solo perché tu sappia, ci sono almeno diecimila diversi temi WordPress gratuiti e premium disponibili da utilizzare, il che offre ai proprietari di siti Web una scelta sufficiente.

Inoltre, molti proprietari di siti Web utilizzano un tema sviluppato su misura che potrebbe essere una versione personalizzata di un framework o un tema codificato da zero.

Per verificare quale tema WordPress viene utilizzato, puoi utilizzare WPThemeDetector.com , un altro strumento gratuito.

Lo strumento è avanzato e rileva facilmente il tema o il framework sottostante (anche se è nascosto), cosa non possibile con altri strumenti simili come WhatWPThemeIsThat.com.

Oltre a rilevare il tema, lo strumento fornirà anche ulteriori informazioni sullo sviluppatore, su quanti altri siti lo utilizzano e collegamenti ufficiali.

Cosa fare se il sito utilizza un tema personalizzato?

Come discusso in precedenza, è molto probabile che alcuni siti utilizzino un tema personalizzato sviluppato da zero. In questi casi, lo strumento di cui sopra non sarà di grande aiuto.

Ma non deludere le tue speranze, puoi inchiodare lo stesso design del sito Web utilizzando una combinazione di tema OceanWP e page builder come Elementor.

OceanWP è facilmente il tema più personalizzabile che ti sei imbattuto e bastonato con un generatore di pagine, intuitivo e facile da usare come Elementor, ti dà tutta la potenza che hai in mano.

Puoi letteralmente trascinare e rilasciare i componenti predefiniti, regolare le dimensioni/il colore, aggiungere alcune modifiche CSS e ottenere un design quasi simile.

Passaggio 2: ottieni le funzionalità giuste!

Ok, quindi hai il design giusto e il tuo sito WordPress appena creato sembra simile. Ma non è niente senza funzionalità simili o dovrei dire plugin.

Un sito WordPress medio è alimentato da almeno 10 diversi plugin, ognuno dei quali fornisce una funzionalità unica.

Il tuo sito Web ideale utilizza anche più plug-in per avere quella funzionalità e un'esperienza utente eleganti. Inoltre, è una buona idea ottenere informazioni sui plug-in poiché avrebbero provato più plug-in prima di accontentarsi di quello specifico.

Sebbene sia difficile ottenere un elenco esatto dei plugin utilizzati (molti sviluppatori nascondono il nome e le informazioni), scanwp.net può recuperare le informazioni in modo efficiente.

Trova anche il link ufficiale per i plugin disponibili sul repository di WordPress e se è gratuito o meno.

Passaggio 3: non dimenticare l'esperienza di lettura

Come spiegato qui , il carattere utilizzato può effettivamente influenzare il modo in cui i singoli rispondono a un contenuto.

Nell'esperimento di cui sopra, il primo gruppo di persone (con caratteri di facile lettura) ha stimato che l'attività richiederebbe 8,2 minuti per essere completata. Considerando che, il secondo gruppo (con font difficile da leggere) ha stimato ben 15,1 minuti.

Questa è un'enorme differenza e ha senso. Se trovi difficile leggere le istruzioni, la tua mente le elaborerà più lentamente e quindi un tempo di stima elevato. Sicuramente, quello che vuoi per il tuo blog.

Se desideri un'esperienza di lettura simile, dovresti provare a utilizzare lo stesso carattere utilizzato da quel sito. Puoi facilmente rilevare quale font utilizza un sito utilizzando l'estensione WhatFont Chrome .

Installa l'estensione, visita il sito (preferibilmente una pagina di articolo), fai clic sul pulsante dell'estensione WhatFont (disponibile nell'angolo in alto a destra dello schermo) e passa il mouse sopra il testo.

Non solo ottieni il carattere esatto, ma anche la dimensione del carattere, lo stile, il peso e un collegamento al carattere Web di Google per scaricarlo.

Passaggio 4: qualcuno ha detto colore?

Ancora una volta, i colori sono qualcosa che si riferisce alla psicologia umana e gli esperti suggeriscono di utilizzare una tavolozza di colori ottimale basata sulla nicchia del sito web.

Secondo Kissmetrics , i colori influiscono sul comportamento di acquisto e in base al tipo di pubblico, dovresti scegliere una combinazione di colori adeguata.

Sebbene tu possa dare un'occhiata e ottenere la combinazione di colori utilizzata dal tuo sito Web preferito, ha più senso ottenere la tonalità di colore esatta e il codice esadecimale.

ColorCombos.com ha uno strumento online che può afferrare le palette di colori utilizzate da una pagina web. Devi solo inserire l'URL della pagina e premere invio.

In pochi secondi otterrai un elenco di tutte le palette di colori utilizzate di frequente sul sito Web con codice esadecimale e un'opzione per scaricare la combinazione di colori.

Passaggio 5: velocità del sito web

Sono abbastanza sicuro che la prima buona impressione che hai avuto sul sito sia stata la velocità di caricamento. Non importa quanto sia buono il design o l'interfaccia utente, se si carica in 3-4 secondi o più, avresti chiuso la scheda e non avresti mai restituito.

L'hosting Web è uno dei motivi principali alla base di un buon tempo di caricamento e probabilmente potresti chiederti quale hosting viene utilizzato per alimentare questo sito. Se non riesci a ottenere la risposta navigando nel sito (nella maggior parte dei casi, sarà scritto nel footer), puoi utilizzare lo strumento di HostAdvice.com per ottenere il provider di hosting.

A differenza di altri strumenti che utilizzano solo Nameserver per rilevare l'host web, questo strumento può effettivamente rivelare l'host nascosto in caso di utilizzo della CDN.

Senza questo strumento, non avrei mai saputo che OceanWP.org è ospitato su Google Cloud Platform abbinato a CloudFlare CDN (questo spiega il tempo di caricamento super veloce)

Inoltre, puoi vedere i piani di hosting e le recensioni degli utenti direttamente sulla stessa pagina.

Conclusione

Ecco qua!

Ora sei un assassino segreto che può rapidamente decodificare un sito Web WordPress e replicarlo direttamente dalla progettazione alle funzionalità del sito Web.

Se c'è qualcos'altro che desideri sul tuo sito ma non riesci a trovare come è fatto, considera di contattare direttamente il proprietario del sito. Nella maggior parte dei casi, ti guideranno verso la fonte della funzionalità o lo sviluppatore che l'ha scritta.

Hai qualche strumento segreto che usi per replicare un sito Web WordPress? Mi piacerebbe sentirlo. Lascia un commento e possiamo discuterne. Assicurati di condividere questo articolo con i tuoi amici amanti di WordPress che potrebbero trovarlo utile.