8 pași pentru reproiectarea site-ului dvs. Lista dvs. de verificare pentru o renovare fluidă a site-ului web în 2023

Publicat: 2022-11-15

Tooltester este susținut de cititori ca dvs. Este posibil să câștigăm un comision de afiliat atunci când cumpărați prin link-urile noastre, ceea ce ne permite să oferim cercetarea noastră gratuit.

Site-ul dvs. arată vechi, urât și neplăcut? Nu funcționează așa cum trebuie? Atunci o reproiectare a site-ului web ar putea fi în regulă.

Desigur, acest lucru este mult mai ușor de spus decât de făcut.

Cazul perfect este site-ul nostru Tooltester, pe care l-am renovat recent. Lucrarea de reproiectare ne-a luat 1,5 ani. Fără exagerare.

Înainte de a alerga spre dealuri, ar trebui să menționăm că ne-am reproiectat site-ul web ca parte a unui exercițiu major de rebranding. Acest lucru a făcut, probabil, procesul de reproiectare mai complex decât efortul mediu de relansare a site-ului web.

Pe parcurs, însă, am obținut informații valoroase despre realizarea unei reproiectări a site-ului web cât mai ușor posibil . Am compilat ceea ce am învățat într-o foaie de parcurs solidă de reproiectare a site-ului web în 8 pași, pe care o veți găsi utilă dacă intenționați să vă reproiectați propriul site:

Analiză

  1. Analizați site-ul dvs. actual
  2. Analizează-ți concurența

Planificare

  1. Stabiliți obiective pentru reproiectare
  2. Examinați configurația tehnologică a site-ului dvs
  3. Delegați responsabilități pentru reproiectarea site-ului web

Realizare

  1. Pregătiți-vă pentru reproiectare
  2. Ziua lansării!
  3. Îmbunătățiți în mod constant site-ul dvs

De asemenea, vom împărtăși cum am aplicat acești pași în proiectul nostru de reproiectare a site-ului web. Dar, mai întâi, să scoatem din cale câteva întrebări fundamentale.

Și anume: de ce ați putea avea nevoie să faceți o reproiectare a site-ului web și cât ar putea costa?

De ce reproiectează un site web?

Motivele pentru reproiectarea unui site web includ:

  • Designul site-ului dvs. este depășit: este posibil să fi iubit inițial aspectul site-ului dvs. Dar acum, găsești elementele sale vizuale inestetice sau deplasate cu cele mai recente tendințe de web design. Sau poate site-ul dvs. nu are un design responsive, ceea ce face ca utilizatorii de pe dispozitive mobile să aibă dificultăți în navigarea pe site.
  • Site-ul dvs. este construit pe tehnologie învechită: dacă sistemul de gestionare a conținutului (CMS) al site-ului dvs. este vechi și rar actualizat, este posibil să sufere de defecte serioase de securitate. În acest caz, practic invitați hackerii să vă fure datele sau să vă distrugă întregul site.
  • Aveți nevoie de noi caracteristici și funcționalități ale site-ului web: de-a lungul timpului, este posibil să aveți nevoie ca site-ul dvs. să facă mai mult decât ați creat inițial. De exemplu, dacă adăugați un magazin online pe blogul dvs., atunci va trebui să vă reproiectați site-ul web pentru a include o astfel de funcționalitate a magazinului.
  • Designul dvs. slab al site-ului dvs. are impact asupra clasamentului dvs. de căutare: de exemplu, Google a adoptat o abordare în primul rând pentru mobil pentru indexarea și clasarea paginilor site-ului din iulie 2019. Un site web care nu este optimizat pentru dispozitive mobile poate duce la clasamente scăzute în căutare și, prin urmare, are nevoie de o reproiectare. . Asigurați-vă că utilizați un generator de site-uri web sau un CMS care este excelent pentru SEO.
  • Rebranding: compania dvs. trece printr-un rebranding major și își revizuiește valorile mărcii, sigla, culorile și multe altele. Ca parte a procesului, va trebui să vă reproiectați garanția de marketing - care include o reproiectare a site-ului dvs.

Acest ultim motiv rezonează în special la noi.

Am decis să ne reproiectăm site-ul pentru că am simțit că designul nostru nu mai reprezintă cine suntem noi ca companie. Pentru context, iată cum arăta vechea noastră pagină de pornire:

websitetooltester pagina de pornire veche

Designul site-ului nostru anterior

Vechiul nostru site web arăta ca și cum ar fi fost o operațiune de 3 persoane, care a fost precisă la un moment dat din istoria noastră. Dar acum, Tooltester este condus de o echipă minunată de peste 10 persoane!

Așa că ne-am dorit ca site-ul nostru web să aibă mai multă lustruire și să comunicăm cum este condus de o echipă experimentată dedicată să ajute întreprinderile mici să găsească instrumentele perfecte pentru nevoile lor.

Cât ar putea costa o reproiectare a unui site web?

Dacă angajați profesioniști care să se ocupe de întreaga slujbă pentru dvs. , vă puteți aștepta să cheltuiți aproximativ următoarele pentru a reproiecta un site web:

  • Proiectarea șabloanelor de pagină (inclusiv cele pentru un site web mobil): 100 USD – 300 USD per pagină
  • Codarea unei teme de site WordPress de 8 pagini: 1.500 USD–3.000 USD
  • Obținerea de găzduire web , un nume de domeniu și adrese de e-mail: 10 USD – 30 USD pe lună, în funcție de volumul lunar de trafic pe site-ul dvs.

Alternativ, ați putea să favorizați o abordare de creare de site-uri DIY și să utilizați un generator de site-uri web pentru a crea un nou site de la zero . În acest caz, costul de reproiectare ar putea fi de doar 10 USD – 25 USD pe lună, în funcție de constructorul site-ului web ales.

De exemplu, constructorul de site-uri web Wix taxează 16 USD/lună pentru planul său Combo, care include 2 GB de spațiu de stocare și un certificat SSL gratuit. Pe de altă parte, costă 16 USD/lună să construiești noul tău site web pe planul personal Squarespace, care vine cu lățime de bandă nelimitată, funcții de comerț electronic, analiză avansată a site-ului și multe altele.

(Avem, de asemenea, un ghid complet al costurilor site-ului pe care îl puteți consulta!)

În situația noastră, am decis să angajăm o agenție de branding care să supravegheze procesul de reproiectare a site-ului web pentru noi. Agenția ne-a ajutat să creăm un nou logo și șabloane personalizate de design web pentru aproape 20 de tipuri de pagini.

Serviciile lor nu erau ieftine: am pus deoparte un buget de 5 cifre pentru a lucra cu ei. Dar au făcut o treabă excelentă și suntem foarte mulțumiți de rezultate!

Și chiar dacă nu aveți acest tip de buget, veți descoperi că procesul de reproiectare pentru site-ul dvs. web va include pași foarte similari cu ai noștri.

Analiză

Lucrările de reproiectare a site-ului web pot fi împărțite în trei etape principale:

  1. Analiză
  2. Planificare
  3. Realizare

În primul rând, să ne aprofundăm în procesul de analiză...

1. Analizați site-ul dvs. actual

Cât de mult din site-ul dvs. existent trebuie schimbat - trebuie să reproiectați întregul site web sau doar părți din acesta?

Luați în considerare lucruri precum:

  • Configurare tehnică: poate că trebuie să vă schimbați generatorul de site-uri web sau CMS-ul dacă site-ul dvs. web existent este extrem de învechit sau dificil de utilizat. Alternativ, poate că trebuie doar să vă recodați tema pentru o performanță mai rapidă a site-ului.
  • Optimizare pentru motoarele de căutare (SEO): Efectuați un audit SEO al site-ului dvs. pentru a verifica problemele care ar putea afecta clasamentul său de căutare. Instrumentele SEO cu funcții de audit SEO încorporate, cum ar fi Screaming Frog și Ahrefs (Site Audit, care poate fi folosit gratuit), vă pot ajuta să identificați astfel de probleme înainte de a vă decide asupra următorilor pași. De exemplu, dacă auditul raportează că aveți pagini de eroare 404 pe site-ul dvs. web, este posibil să doriți să redirecționați linkurile care indică aceste pagini în altă parte.
  • Design: elementele de design ale site-ului dvs. sunt (încă) moderne și au un aspect profesional? Reflectează ele cu acuratețe marca dvs.? Dacă adăugați noi funcții pentru site-ul web, poate fi necesar să vă reproiectați site-ul web pentru a le adapta (așa cum am menționat mai devreme). Iată câteva sfaturi pentru a găsi ceva inspirație.
  • Navigarea și experiența utilizatorului (UX): De-a lungul timpului, este posibil să fi primit plângeri ale utilizatorilor cu privire la modul în care unele părți ale site-ului dvs. sunt dificil de navigat sau la modul în care anumite funcții pot fi greu de găsit. Prioritizează reproiectarea acestor interfețe problematice pentru a îmbunătăți experiența utilizatorului.
Sfat: Instrumente precum Screaming Frog sau Ahrefs Site Audit sunt, de asemenea, foarte utile pentru a crea o listă cu toate adresele URL ale site-ului dvs. web. Având o astfel de listă, vă va asigura că nu veți uita nicio pagină din verificările dvs. și va facilita, de asemenea, configurarea redirecționărilor (dacă este necesar).

Există diverse instrumente pentru a efectua astfel de „consultări de sănătate” pe site-ul dvs. web. Iată câteva pentru a începe:

  • Google Analytics : pentru monitorizarea traficului site-ului dvs. și a valorilor paginii de destinație
  • Hotjar : un instrument de cartografiere termică pentru urmărirea comportamentului utilizatorilor și pentru a afla cum interacționează vizitatorii site-ului web cu paginile dvs. web
  • Feedback Sabre : încorporați un buton de feedback pe site-ul dvs. web pentru ca utilizatorii să trimită feedback cu privire la orice probleme de site pe care le găsesc

2. Analizează-ți concurența

După ce vă revizuiți site-ul, îndreptați-vă atenția către site-urile create de concurenții dvs.

Faceți cercetări de piață despre liderii din industria dvs. și despre caracteristicile site-urilor lor web. Ce fac ei bine? Site-urile web ale concurenților dvs. pot avea caracteristici care merită furate - ahem, vrem să spunem, adaptarea pentru propriile dvs. Puteți, de asemenea, să vă gândiți să vă faceți site-ul chiar mai bun decât al lor.

Acestea fiind spuse, nu te limita la site-urile web din spațiul tău . Alte industrii pot avea site-uri web care funcționează similar cu ale dvs., cu abordări unice pentru a-și servi publicul țintă. „Transplantarea” unor astfel de abordări din alte industrii pe site-ul dvs. ar putea fi cheia pentru a-l ajuta să iasă în evidență în spațiul dvs.!

Când am analizat concurența site-ului nostru, agenția noastră de branding a solicitat o listă a concurenților noștri pentru examinare. De asemenea, au obținut exemple bune de reproiectare de pe site-uri web din alte industrii. De exemplu, deoarece ajutăm utilizatorii să compare instrumentele site-ului web, agenția a analizat și modul în care platformele de rezervare la hoteluri îi ajută pe utilizatori să compare hoteluri.

După ce a efectuat toate aceste cercetări, agenția de branding a stabilit poziționarea noastră față de celelalte mărci din spațiul nostru.

Deoarece mulți dintre concurenții noștri adoptă o abordare impersonală a recenziilor instrumentelor și nu interacționează prea mult cu cititorii lor, am decis că Tooltester va fi „prietenul expert digital” al cititorilor noștri, fiind o sursă de recenzii autoritară, dar prietenoasă.

Această poziționare a influențat apoi puternic reproiectarea site-ului nostru. De exemplu, am decis să prezentăm în mod vizibil membrii echipei Tooltester pe paginile noastre web, pentru a evoca o abordare personală și care să poată identifica recenziile instrumentelor.

Doar consultați pagina noastră Despre și veți vedea la ce ne referim!

Noua pagină Despre Tooltester

Planificare

Ați identificat părțile site-ului dvs. care necesită îmbunătățiri? În continuare, veți planifica modul în care le veți reproiecta. Aceasta implică:

3. Stabilirea obiectivelor pentru reproiectare

Faceți o listă cu obiectivele generale de afaceri pe care doriți să le atingeți din reproiectarea site-ului dvs. Aceste obiective vă vor ghida strategia de reproiectare a site-ului dvs.

Exemple de obiective generale includ:

  • Dublarea traficului organic în anul următor
  • Actualizează tot conținutul de pe blogul tău
  • Reducerea frecării cu care se confruntă utilizatorii atunci când plasează comenzi în magazinul online

Apoi, împărțiți-vă obiectivele generale în obiective mai mici, aplicabile . Aceștia sunt pașii efectivi pe care îi veți face pentru a vă atinge obiectivele generale.

Pentru a îndeplini obiectivul general de dublare a traficului organic în următorul an, de exemplu, ar putea fi necesar să setați obiective secundare, cum ar fi:

  • Configurarea urmăririi cuvintelor cheie pentru site-ul dvs. web
  • Actualizarea unei anumite postări de blog pentru a viza mai bine un anumit cuvânt cheie
  • Conectarea Google Analytics la site-ul dvs. web pentru a vă urmări traficul organic lunar

Pe de altă parte, pentru a îndeplini obiectivul general de reducere a frecvenței comerțului electronic, obiectivele secundare ar putea include:

  • Reproiectarea formularului de plată cu mai multe pagini într-un formular de o singură pagină
  • Crearea unui buton care le permite utilizatorilor să meargă direct la finalizarea comenzii după ce adaugă un articol în coșul lor
  • Adăugarea unei funcții care stochează în siguranță informațiile despre cardul de credit ale clienților dvs. pentru utilizare ulterioară

În cele din urmă, planificați când veți îndeplini fiecare sub-obiectiv.

Sfat important SEO: ca regulă generală, nu schimba prea multe lucruri deodată .

De exemplu, nu încercați să vă schimbați domeniul site-ului, structura URL, CMS și designul, toate în aceeași actualizare. Fiecare modificare pe care o faceți site-ului dvs. web are potențialul de a afecta clasamentul dvs. de căutare și veți dori să puteți identifica dacă o anumită modificare a fost cauza pentru care clasamentul dvs. a luat o scufundare.

Încercați să vă împărțiți obiectivele generale în cât mai multe sub-obiective separate posibil, apoi distanțați-le. În acest fel, veți avea un control mai bun asupra impactului modificărilor dvs. (dacă există) în clasamentul motorului de căutare.

4. Examinarea configurației tehnice a site-ului dvs. web

Site-ul dvs. web trebuie să fie construit pe o bază tehnică solidă pentru o performanță eficientă. Profitați de ocazie pentru a verifica dacă specificațiile tehnice ale site-ului dvs. vă sunt încă de folos sau dacă au nevoie de un upgrade.

De exemplu, este posibil să doriți să schimbați CMS-ul site-ului dvs. web sau generatorul de site-uri web cu unul care oferă viteze mai rapide de încărcare a paginii. Sau, dacă doriți să extindeți funcționalitatea site-ului dvs. web , verificați dacă instalarea unui plugin terță parte va funcționa sau dacă va trebui să angajați o echipă de dezvoltare web pentru a codifica caracteristica pentru dvs.

Toate modificările aduse configurației tehnice a site-ului dvs. vor implica costuri (consultați discuția despre costurile de reproiectare a site-ului web de mai sus), așa că bugetați-le în mod corespunzător.

În cazul nostru, folosim CMS-ul WordPress pentru site-ul nostru web și intenționam să-l folosim în continuare. Deci, în loc să migrăm CMS-urile, trebuie „pur și simplu” să creăm o nouă temă WordPress și să o activăm, pentru a schimba aspectul site-ului nostru.

(Aici spunem „pur și simplu” între ghilimele, deoarece crearea acestui nou șablon WordPress a fost mult mai dificilă decât pare!)

De asemenea, am încercat să nu facem prea multe modificări în funcționalitatea site-ului nostru. Acest lucru a fost pentru a evita ca proiectul nostru de reproiectare a site-ului nostru web să fie mai complicat decât trebuia (și era deja foarte complex).

5. Delegarea responsabilităților pentru reproiectarea site-ului

Ați stabilit obiectivele care trebuie îndeplinite pentru a finaliza reproiectarea site-ului. Acum, veți găsi oamenii care să le ducă la îndeplinire .

Împărțiți obiectivele în două categorii:

  1. Obiectivele care trebuie gestionate intern de echipa ta
  2. Obiectivele care urmează să fie gestionate extern de agențiile de angajare sau freelanceri

Dacă echipa dvs. are cunoștințele și experiența necesare pentru a gestiona anumite obiective , atribuirea acestor obiective nu este o idee. În special, este posibil să doriți să delegați anumite obiective echipei dvs. în locul unei terțe părți, dacă aceste obiective implică lucrul cu informații comerciale confidențiale.

Dar dacă doriți să aveți o ochi proaspăt și o opinie expertă a unui străin cu privire la proiectul dvs. de reproiectare a site-ului dvs., atragerea de profesioniști terți poate fi calea de urmat. Aceasta este ceea ce am făcut pentru reproiectarea site-ului nostru: am angajat o agenție de branding pentru a veni cu noi șabloane de design pentru site-ul nostru. Separat, am angajat un programator pentru a implementa aceste modele în noua noastră temă de site.

Dacă intenționați să angajați designeri web și programatori independenți pentru proiectul dvs. de reproiectare a site-ului, vă puteți publica cererea pe platforme precum Upwork, Fiverr sau LinkedIn. Alternativ, găsiți servicii suplimentare de web design aici. De asemenea, puteți cere recomandări persoanelor din rețeaua dvs.

Pe măsură ce căutați ajutor extern, sfatul nostru este să găsiți oameni care se specializează în serviciile specifice de care aveți nevoie . Un programator nu este de obicei un mare designer web și invers .

Realizare

Acum, vă veți murdari mâinile cu munca reală de reproiectare a site-ului web!

6. Pregătirea pentru reproiectare

Echipa dvs. și profesioniștii externi pe care i-ați angajat vor începe să execute sub-obiectivele pe care le-ați identificat mai devreme. Sarcinile lor pot implica:

  • Crearea noului design de site web: Figma este platforma standard de design de interfață preferată în prezent
  • Construirea noului site pe un server provizoriu: acest server oferă un mediu de testare pentru a vă previzualiza modul în care va arăta noul dvs. site și pentru a elimina eventualele erori, înainte de a vă activa noul site.
  • Testați totul pentru a vă asigura că funcționează: faceți clic pe fiecare link și pe fiecare buton. Verificați cum apare site-ul dvs. atât pe desktop, cât și pe mobil. Efectuați comenzi de testare online. Testează TOTUL!
  • Faceți backup pentru site-ul dvs. vechi: nu săriți peste acest pas. Dacă ceva nu merge bine în timp ce lansați site-ul web nou proiectat, veți dori să aveți o copie de rezervă a site-ului dvs. anterior la care să apelați. De asemenea, ar trebui să descărcați o copie offline a vechiului site.
  • Configurarea redirecționărilor de link 301 dacă vă schimbați adresele URL: acest lucru îi ajută pe utilizatori să continue să acceseze paginile dvs. fără a întâmpina erori 404 urâte. Din punct de vedere SEO, configurarea redirecționărilor de linkuri ajută, de asemenea, motoarele de căutare să clasifice noile adrese URL și să atribuie „sucul de linkuri” acumulat de pagină de la vechea adresă URL paginii de la noua adresă URL.

Pe măsură ce finalizați fiecare sub-obiectiv, bifați-le din lista dvs.! Acest lucru vă va menține motivat pe măsură ce numărați invers pentru:

7. Ziua lansării!

După ce ați verificat de două ori și trei ori că totul este în ordine, lansați site-ul dvs. reproiectat. Acest lucru poate implica migrarea noului dvs. site de la serverul dvs. de staging la serverul dvs. de producție (adică serverul care găzduiește site-ul dvs. live).

Și chiar dacă sărbătorești lansarea, urmărește cu atenție performanța noului tău site web . Cum interacționează vizitatorii cu site-ul dvs.? Au o experiență de utilizator la fel de bună pe cât ați plănuit-o?

De asemenea, s-ar putea să întâmpinați o pierdere temporară de trafic dacă primiți mulți dintre vizitatorii dvs. din paginile cu rezultate ale motorului de căutare. Asta pentru că este normal ca clasamentele tale de căutare să scadă atunci când faci modificări majore site-ului tău. Dar, cu puțin noroc, clasamentele tale - și, prin urmare, numerele de trafic - ar trebui să se recupereze rapid și să devină și mai bune.

8. Îmbunătățirea constantă a site-ului web

Cu site-ul dvs. nou proiectat, proiectul dvs. de reproiectare a site-ului dvs. este finalizat. Dar munca nu se termina niciodată!

Tendințele de design web se schimbă în timp , așa că poate fi necesar să vă reproiectați site-ul web peste câțiva ani pentru a-l menține să arate proaspăt și modern.

În afară de asta, monitorizează-ți site-ul web pentru a identifica mai multe zone potențiale de îmbunătățire . Instrumentele de analiză, cum ar fi cele pe care le-am menționat mai sus, pot ajuta în acest sens.

Dacă întâmpinați probleme cu remedieri rapide și ușoare, cum ar fi o legătură întreruptă care a fost trecută cu vederea, rezolvați-le imediat. În schimb, alte probleme pot necesita mai mult timp și efort pentru rezolvare. Chiar dacă alegi să nu le abordezi în acest moment, notează-le.

Acestea vor fi utile pe măsură ce decideți la ce să lucrați data viitoare când vă reproiectați site-ul!

Reproiectarea unui site web: recapitulare finală

Iată o recapitulare la îndemână pentru a ține evidența activităților dvs. de făcut în timp ce vă reproiectați site-ul web:

Analiză

  1. Analizați site-ul dvs. actual pentru a vedea ce trebuie schimbat
  2. Analizați-vă concurența pentru a vă inspira pentru îmbunătățirea site-ului

Planificare

  1. Stabiliți obiective pentru reproiectare - atât obiective generale, cât și sub-obiective acționabile pentru implementarea reproiectării
  2. Examinați configurația tehnologică a site-ului dvs. pentru a decide dacă are nevoie de o revizuire
  3. Delegați responsabilități pentru reproiectarea site-ului web, astfel încât echipa dvs. să știe cine va face ce. Angajați și profesioniști externi, dacă este necesar

Realizare

  1. Pregătiți-vă pentru reproiectare creând toate elementele de design necesare, construind noul dvs. site web și așa mai departe
  2. Lansați site-ul dvs. reproiectat și monitorizați-i performanța
  3. Îmbunătățiți-vă în mod constant site-ul web pe măsură ce identificați noi domenii de îmbunătățire

Dacă încă vă simțiți intimidat de munca care vă așteaptă, sfatul nostru final este să vă împărțiți proiectul de reproiectare în cât mai multe sub-obiective mai mici. Toate aceste mici progrese se vor acumula pe măsură ce lucrați la transformarea site-ului dvs. web!

Nici nu strică să angajezi profesioniști care se ocupă zilnic de proiecte de reproiectare a site-ului web, dacă bugetul o permite și dacă vrei ca un expert să supravegheze întregul proces pentru tine.

În cele din urmă, suntem bucuroși să contribuim cu cei doi cenți ai noștri dacă doriți feedback cu privire la proiectul dvs. de reproiectare a site-ului. Doar lăsați comentariile și întrebările dvs. mai jos!