Jak przeprojektować witrynę WordPress: najlepsza lista kontrolna

Aaah, przeprojektowanie witryny WordPress…

Kiedy myślisz o różnych kwestiach związanych z tą misją, zwykle trochę się stresujesz.

Kto w tym kluczowym momencie nie marzy o wykonaniu prostego Command + Option + Escape lub Ctlr + Alt + Del na swoim serwerze i łatwym rozpoczęciu od nowa?

Niestety przeprojektowanie witryny jest zawsze nieco bardziej skomplikowane . A przeoczenie, pomyłka, pomyłka zdarzają się tak szybko…

Firma WPMarmite chciała podzielić się z wami swoimi najlepszymi praktykami, aby spokojnie podejść do tego dużego projektu.

Jesteś gotowy? W tym poście szczegółowo opisuję wszystkie elementy, o których musisz pomyśleć, aby przeprojektować swoją witrynę WordPress , od strategii upstream po uruchomienie online.

Twoje najlepsze projekty WordPress potrzebują najlepszego hosta!

WPMarmite poleca Bluehost: świetna wydajność, świetne wsparcie. Wszystko, czego potrzebujesz na dobry początek.

Wypróbuj Bluehost

Aby dowiedzieć się, jak stworzyć witrynę WordPress od podstaw, zapoznaj się z naszym kompletnym przewodnikiem .

4 kroki przed przeprojektowaniem witryny WordPress

Zanim zdobędziesz WordPress, aby przeprojektować swoją witrynę, musisz popracować nad różnymi elementami strukturalnymi.

Zgadza się: nie myślałeś, że zaczniesz, nie wiedząc, w co się pakujesz?

1. Wyznacz cele swojego przeprojektowania

Jak każdy projekt, aby przeprojektować stronę aWordPress, trzeba mieć cele, które trzeba precyzyjnie zdefiniować (czy jesteś freelancerem, agencją internetową czy nieprofesjonalnym webmasterem).
To właśnie te jasne i zwięzłe cele będą kierować Twoimi kolejnymi krokami .

Sprowadza się do zadania sobie następującego pytania: dlaczego chcesz przeprojektować swoją stronę internetową? Powodów może być wiele:

• Zmień projekt swojej witryny , wybierając nowy motyw lub wybierając narzędzie do tworzenia stron.
• Zaktualizuj administrację swojej witryny . Może się tak zdarzyć, jeśli Twoje wtyczki lub Twoja wersja WordPressa CMS nigdy nie zostały zaktualizowane, jeśli występują konflikty między różnymi wtyczkami lub jeśli Twój motyw został nieprawidłowo zmodyfikowany. To wszystko są obawy, które mogą wpłynąć na wydajność Twojej witryny i jej codzienne zarządzanie.
• Zoptymalizuj swoje SEO . Cel, aby zadać sobie pytanie, zwłaszcza jeśli ruch spadł lub nie rośnie, jeśli wrażenia użytkownika są obecnie niepewne lub jeśli Twój kod HTML nie jest zoptymalizowany pod kątem robotów Google.
• Dodaj do swojej witryny nowe funkcje , których Twój obecny projekt nie jest w stanie obsłużyć. Możesz także uczynić go bardziej intuicyjnym i łatwiejszym w użyciu dla odwiedzających.
• Popraw strukturę techniczną swojej strony internetowej (lub e-commerce) , aby wzmocnić jej bezpieczeństwo, poprawić szybkość ładowania i zmodyfikować strukturę drzewa.
• Przenieś swoją witrynę na inny serwer hostingowy .
• Zwiększaj sprzedaż , zwłaszcza jeśli masz sklep WooCommerce.
• Dostosuj swoją witrynę do konkurencji , która oferuje bardziej aktualne witryny. Skorzystasz z tego, aby poprawić wizerunek swojej marki i reputację.

Zapisz w dobrze ustrukturyzowanym dokumencie te różne cele. Przekonasz się, że będą one stanowić elementy strukturyzujące, organizujące redesign Twojej strony internetowej.

2. Zorganizuj swój projekt przeprojektowania

Teraz, gdy masz już jasne pojęcie o celu przeprojektowania, porozmawiajmy o różnych krokach, które określają główne linie projektu.

Stwórz swoje makiety

Czy termin makiety dzwoni dzwonkiem?

Konieczny jest szybki przegląd tematu, ponieważ ten krok jest kluczowy.

Modele szkieletowe to strukturalne makiety, które pomagają rozmieścić różne elementy stron internetowych w jednym dokumencie.

Chodzi o to, aby stworzyć ramy dla różnych stron witryny, aby mieć jasny obraz doświadczeń użytkownika, które zamierzasz stworzyć.

Podałem ci przykład w tym artykule, a tutaj ponownie zilustruję mój punkt widzenia:

Jeśli metoda millenium papier + ołówek może wystarczyć do lekkiego przeprojektowania, nadal polecam korzystanie z cyfrowego narzędzia do projektowania makiety .

Pozwoli to nie tylko łatwo je modyfikować w razie potrzeby, ale także udostępnić te makiety swojemu zespołowi (lub kuzynowi, który pracuje w marketingu internetowym).

Mogę polecić tylko kilka narzędzi, aby to zrobić :

• Balsamiq Wireframes : Jest to płatne oprogramowanie, ale bezpłatna 30-dniowa wersja próbna daje mnóstwo czasu na zaprojektowanie dobrze przygotowanych modeli szkieletowych.
• MockFlow : Jest to przydatne narzędzie online freemium. Jego darmowa wersja pozwala na utworzenie do 3 stron, na początek.
• Szkic : bardzo potężna platforma do wspólnego projektowania stron internetowych, pod warunkiem, że wiesz, jak z niej prawidłowo korzystać. Oferuje bezpłatną 30-dniową wersję próbną, a następnie płatną ofertę od 9 USD miesięcznie.
• Canva : nie jest to narzędzie przeznaczone do tworzenia szkieletów, ale dzięki licznym funkcjom pozwala się do niego zbliżyć. A przede wszystkim ma darmową wersję z wieloma funkcjami.

W tym momencie masz jaśniejsze pojęcie o tym, czego możesz się spodziewać po przeprojektowaniu swojej witryny WordPress.

Projektowanie makiet

Tam, gdzie makiety dadzą Ci wizję struktury przeprojektowanych stron, makiety będą integrować sam projekt .

Utworzony za pomocą oprogramowania do tworzenia układu strony (takiego jak InDesign), układ stron internetowych może wymagać pewnych technicznych aspektów i jest to dość czasochłonny krok.

Więc pytanie brzmi: czy naprawdę musisz stworzyć graficzne makiety do swojego redesignu? Odpowiedź jest prosta:

• Tak, jeśli chcesz stworzyć własny motyw . W takim przypadku będziesz musiał zaprojektować przeprojektowaną stronę internetową od podstaw, aby móc łatwo zwizualizować wszystkie elementy graficzne.
• Nie, jeśli chcesz po prostu użyć istniejącego motywu i przeprojektować go. Prostsze rozwiązanie. Ale w tym przypadku pamiętaj, aby wybrać nowy motyw zgodnie ze swoimi celami.
  Aby Ci pomóc, WPMarmite ma potrzebne zasoby: listę najlepszych darmowych motywów. Cieszyć się!
  

Dołącz do subskrybentów WPMarmite

Pobierz ostatnie posty WPMarmite (a także ekskluzywne zasoby).

ZAPISZ SIĘ TERAZ

Pomyśl o swojej nowej strukturze drzewa

Tak, zapewniam Cię, wciąż mówimy o redesignie strony internetowej, a nie o ogrodnictwie!

Projektowanie struktury drzewa oznacza wyobrażanie sobie powiązań, które będą istniały między różnymi stronami, i zastanowienie się nad wszystkimi sposobami, w jakie odwiedzający może się poruszać po witrynie.

Krótko mówiąc, tworząc strukturę drzewa, myślisz o różnych ścieżkach nawigacji swoich użytkowników.

Więc jak to zrobić?

Zaprojektuj strukturę drzewa i pamiętaj, aby uwzględnić:

• Twoje główne menu nawigacyjne, a także potencjalne menu dodatkowe.
• Twoja stopka i linki, które może zawierać.
• Twoje możliwe paski boczne, zwłaszcza na Twoim blogu.
• Różne kategorie Twojego bloga itp.

Przy takim diagramie nie sposób zapomnieć o stworzeniu dobrze wykonanej siatki między różnymi stronami , co zapewni płynną obsługę.

Podobnie jak makiety, możesz utworzyć ten diagram na kartce papieru lub użyć narzędzia online, takiego jak GlooMaps lub Octopus.

Projektowanie specyfikacji

Cóż, na tym etapie jesteś dobrze zaopatrzony w elementy strukturyzujące. Teraz nadszedł czas, aby zebrać to wszystko w kluczowym dokumencie: specyfikacji.

Specyfikacja przeprojektowania Twojej witryny internetowej jest bardzo obszernym dokumentem, który pozwala na ukierunkowanie się na różne oczekiwania związane z przeprojektowaniem witryny.

W sieci znajdziesz wiele szablonów specyfikacji. Jednak twój musi koniecznie zawierać:

• Opis Twojego projektu internetowego i Twojej firmy , a także rolę, jaką Twoja strona internetowa odgrywa w tym projekcie.
• Grupa docelowa Twojej nowej witryny , opisana precyzyjnie, jeśli to możliwe.
• Cele Twojego przeprojektowania , zilustrowane w jak największym stopniu liczbami. Jeśli jednym z Twoich celów jest np. zwiększenie ruchu, pamiętaj o określeniu ruchu na Twojej obecnej witrynie.
• Elementy do odzyskania z Twojej obecnej witryny : zawartość Twoich stron, możliwe obrazy itp.
• Ścieżki graficzne, którymi chcesz podążać . Aby to zrobić, zintegruj swoje makiety i makiety ze specyfikacjami, a także z przewodnikiem stylu (który definiuje Twoją tożsamość wizualną).
• Nowe elementy funkcjonalne Twojej przeprojektowanej strony internetowej, takie jak dodanie sklepu e-commerce, bloga, modułu opt-in, nowa administracja (back-office) itp.
• Główne kamienie milowe Twojego projektu przeprojektowania : kiedy chcesz mieć podgląd swojej witryny? Kiedy chcesz, żeby był dostępny na żywo?

Teraz jest to o wiele jaśniejsze, prawda?

3. Pomyśl o zasobach, którymi dysponujesz

Teraz czas zabrać się do pracy.

Twoim wyzwaniem, jeśli je zaakceptujesz, jest teraz wymienienie zasobów, którymi dysponujesz w zakresie :

• Budżet : ile chcesz zainwestować w przeprojektowanie?
• Czas : ile masz czasu na przeprojektowanie witryny WordPress?
• Umiejętności : czy potrafisz samodzielnie osiągnąć wszystkie swoje cele?
• Narzędzia : wtyczki, motywy, narzędzia do tworzenia stron… Czy tego typu narzędzia mogą pomóc Ci osiągnąć Twoje cele, nawet jeśli masz ograniczone umiejętności techniczne w zakresie sieci?

Ta lista pozwoli Ci dowiedzieć się, czy będziesz musiał skontaktować się z zewnętrznym dostawcą , czy też czujesz, że możesz pracować samodzielnie, z członkami zespołu lub własnymi środkami.

Znajdź najlepszych ekspertów WordPress

Codeable ma na celu łączenie Cię z ekspertami, którzy mogą Ci pomóc we wszystkim, od projektowania motywów WordPress lub instalacji po tworzenie niestandardowych wtyczek.

Wypróbuj kodowalne

4. Utwórz plan przekierowań

„Dobra, zaczynamy, to jest to!”

Łatwo! Ostatni krok, który zbyt często jest zaniedbywany podczas przeprojektowywania witryny: stworzenie planu przekierowań .

Pozwól mi wyjaśnić.

Często podczas przebudowy strony internetowej nastąpią zmiany adresu URL. Będzie tak szczególnie w przypadku tworzenia nowych stron.

Ale co się stanie, jeśli umieścisz swoją nową witrynę w Internecie, nie myśląc o wykonywaniu przekierowań? Mnóstwo błędów 404, które wpłyną na SEO i nawigację odwiedzających.

Aby zaprojektować swój plan przekierowań, nic nie może być prostsze. Otwórz Excel lub Arkusze Google i utwórz tabelę w następujący sposób:

Gdy Twoja witryna będzie już online, możesz skonfigurować wtyczkę Przekierowanie i bezpośrednio zaimportować tę tabelę.

Sprytne, prawda?

W porządku: weź głęboki oddech i porozmawiajmy o samym przeprojektowaniu.

Przyspiesz swoją witrynę dzięki WP Rocket

Zmień swoją witrynę w rakietę dzięki najpotężniejszej wtyczce do buforowania, uznanej przez ekspertów WordPressa.

Wypróbuj rakietę WP

3 kroki do rozpoczęcia przeprojektowania

Jak więc się do tego zabrać, skoro Twój projekt jest dobrze zorganizowany i dobrze zorganizowany? Te 3 podstawowe kroki poprowadzą Cię.

1. Wybierz pracę lokalnie lub bezpośrednio w swojej obecnej witrynie

Zanim przejdziesz do aspektu technicznego, zacznij od wyboru pracy:

• Albo bezpośrednio w swojej obecnej witrynie i integruj zmiany „na żywo”.
• Lub na serwerach programistycznych i przedprodukcyjnych , aby przetestować nową witrynę przed udostępnieniem jej odbiorcom.

Co oznaczają te dwie opcje?

Praca online bezpośrednio na twojej stronie jest barbarzyńska.

W takim przypadku wszyscy odwiedzający widzą zmiany na żywo i działają jak „świnki doświadczalne” nowych funkcji… ze wszystkimi błędami, które może to wywołać.

Pamiętaj również, że jeśli podczas modyfikacji wystąpi błąd, będzie on miał wpływ na witrynę, dopóki nie wykryjesz i nie rozwiążesz problemu. Witryna niedostępna, funkcja nie działa…

Aby uniknąć wszystkich tych problemów, możesz przeprojektować swoją witrynę lokalnie.

Zalety pracy na miejscu są liczne:

• Dokonuj swoich modyfikacji bezpiecznie.
• Przetestuj swoje wtyczki bez ryzyka.
• Wyświetl podgląd ostatecznego renderowania przed przejściem do trybu online.

Jest to również idealne rozwiązanie, jeśli chcesz zachować administrację WP tak, jak ją aktualnie skonfigurowałeś. Innymi słowy, będziesz mógł modyfikować witrynę WordPress bez usuwania istniejącej.

Jeśli jednak chcesz zacząć od zera, w zupełnie nowej administracji, zobacz, jak powinieneś zainstalować WordPressa lokalnie.

Wskazówka WPMarmite : „Oczywiście możesz pobierać elementy ze swojej starej witryny dzięki wtyczce takiej jak UpdraftPlus lub Duplicator. Te wtyczki umożliwiają zaimportowanie z powrotem do administratora tego, co chcesz: treści, motywów, wtyczek, multimediów itp. ”

2. Zdobądź narzędzia potrzebne do przeprojektowania

Teraz nadszedł czas, abyś wymienił i zdobył wszystko, czego potrzebujesz, aby przejąć przeprojektowanie swojej witryny WordPress.

Pamiętaj: wymieniłeś je w swoich specyfikacjach.

Może to obejmować :

• Nowy motyw , jeśli jeden z wielu dostępnych w oficjalnym katalogu przykuł twoją uwagę (jak bardzo popularna Astra).
• Kreator stron , taki jak Elementor lub Beaver Builder, jeśli chcesz uniknąć wkładania kodu.
• Nowe wtyczki , integrujące niesamowite funkcje.

Nie wiesz, jakich wtyczek użyć? Może znajdziesz to, czego szukasz na naszej liście must-have.

Czy Twój zestaw narzędzi jest gotowy? Przygotujmy to wszystko i przejdźmy do ostatniego kluczowego kroku przeprojektowania: zawartości.

3. Przygotuj treść swojej nowej strony internetowej

Przede wszystkim kluczowy punkt, o którym nie wolno zapomnieć.

Podczas przeprojektowania strony internetowej nieuchronnie istnieje zawartość poprzedniej strony internetowej, którą można odzyskać.

Konfiguracja obrazów, tekstów, wtyczek: pomyśl o tym!

Zrób więc kopię zapasową swojej obecnej witryny WordPress i zachowaj w tajemnicy to, co chcesz umieścić w swoim przeprojektowaniu.

Wyobrażam sobie jednak, że jeśli dokonujesz redesignu, to jest to również modyfikacja treści Twojej witryny, aby była bardziej trafna, bardziej atrakcyjna dla Twoich odbiorców… i oczywiście dla wyszukiwarek!

Pomyśl więc o swojej strategii SEO , tak ważnej, aby dobrze ocenić swoją nową (niesamowitą) witrynę.

Jeśli podsumowanie kolejnych kroków jest skomplikowane, mogę jednak podać tutaj główne kwestie:

• Z jednej strony zdefiniuj słowa kluczowe, według których chcesz pozycjonować . Są to wyrażenia, które Twoje cele wpisują spontanicznie w Google, aby znaleźć informacje, których szukają.
• Z drugiej strony określ, gdzie chcesz je zintegrować, na każdej stronie . Twoje tagi tytułu (hn) , lub alternatywny tekst obrazów, musi być na przykład zoptymalizowany pod kątem SEO: Google je lubi, dlatego najpierw spróbuje zrozumieć Twoją witrynę!
• Po zintegrowaniu tych nowych treści z przeprojektowaną witryną internetową możesz sprawdzić, czy wszystko jest na swoim miejscu . Pomyśl w szczególności o nazwach obrazów, tytułach i meta opisach stron, które są zbyt często lekceważone.

Aby pomóc Ci w pozycjonowaniu witryny na stronie (optymalizacja treści), polegaj na dedykowanej wtyczce SEO.

WPMarmite korzysta z najsłynniejszego z nich, Yoast SEO, ale nie tylko on jest skuteczny na rynku. Zapoznaj się z naszym szczegółowym porównaniem jego konkurentów w tym artykule.

Jedna rzecz prowadzi do drugiej, lokalnie na serwerze programistycznym i dzięki wszystkim niezbędnym narzędziom WordPress możesz obserwować postęp swojego projektu… i zbliża się premiera online.

3 kroki do udanego uruchomienia Twojej strony internetowej

Czuję, że ekscytujesz się prezentacją swojej nowej witryny WordPress na świecie.

Poświęć trochę czasu na przyjrzenie się tym 3 krokom i postępuj zgodnie z nimi uważnie: będziesz zadowolony, że to zrobiłeś, obiecuję.

1. Wybierz bezpośredni serwer produkcyjny lub przedprodukcyjny

Czy termin „serwer przedprodukcyjny” nic dla ciebie nie znaczy? Nie martw się, zróbmy krótką przerwę na definicję.

Serwer przedprodukcyjny korzysta z tego samego serwera, na którym będzie znajdować się Twoja witryna po uruchomieniu . Jeśli WPMarmite miałby go przeprojektować, Alex mógłby na przykład umieścić swoją wersję przedprodukcyjną na preprod.wpmarmite.com : byłoby to to samo środowisko, co wpmarmite.com .

Dlaczego miałbyś używać tego serwera preprod?

• Aby zweryfikować przeprojektowanie z klientem, jeśli jesteś programistą WordPress.
• Aby przetestować pod kątem błędów przed uruchomieniem witryny.
• Aby dostosować strategię SEO, upewnij się, że wszystkie słowa kluczowe znajdują się na każdej stronie.

Dopiero po potwierdzeniu tego wszystkiego możesz zacząć działać i wdrożyć nową witrynę internetową. Jeśli masz pewność, możesz oczywiście przejść bezpośrednio do produkcji.

2. Przetestuj swoją nową stronę internetową pod kątem potencjalnych problemów

Na serwerze przedprodukcyjnym (lub na żywo, jeśli jesteś poszukiwaczem przygód WordPress), musisz przetestować swoją nową witrynę.

Kluczem do pomyślnego testowania problemów jest postawienie się w sytuacji przeciętnego odwiedzającego , klikanie i notowanie wszelkich napotkanych problemów…

Prawdopodobnie zobaczysz problemy z projektem i strukturą. Ale nie zapomnij również sprawdzić:

• Przekierowania , które nie zostały wykonane i generują martwe linki lub białe strony.
• Wydajność strony internetowej , testując ją na GTMetrix, Pingdom lub teście PageSpeed ​​Insights Google.
• Punkty opt-in , sprawdzając, czy działają dobrze.
• Formularze kontaktowe, formularze wyceny…
• Płatność , jeśli masz witrynę e-commerce (w tym wiadomości e-mail z potwierdzeniem, dostęp do witryny członkowskiej…).

Wszystko jest piękne, funkcjonalne, dobrze połączone i dobrze poskładane? Gratulacje! Ostatni krok wzmocni wielki uśmiech, który widzę na twoich twarzach.

3. Aktywuj ponownie i ponownie połącz wszystkie usługi innych firm

Chodź, już prawie jesteś!

Możesz teraz ponownie aktywować wszystkie usługi i wtyczki powiązane z Twoją witryną WordPress . Pomyśl w szczególności o:

• Twoja wtyczka pamięci podręcznej.
• Wtyczki korzystające z Google Analytics, takie jak MonsterInsights.
• Wtyczki korzystające z sieci społecznościowych, takich jak Facebook czy Instagram.
• Różne klucze licencyjne dla wtyczek i motywu.

A ponieważ bezpieczeństwo to sprawa każdego (a zwłaszcza Twojej), pamiętaj o ponownym włączeniu wszystkich elementów zabezpieczających Twoją witrynę .

Gotowy do wyjścia? Następnie zacznij indeksować swoją nową witrynę w Google Search Console. Ta manipulacja zmusza roboty Google do odwiedzania Twojego nowego dziecka, a tym samym do szybszego indeksowania go w nowej wersji.

Tadam! Przeprojektowana, wydajniejsza, bardziej efektowna, lepiej ustrukturyzowana, Twoja nowa witryna jest gotowa na przyjęcie takiego ruchu, na jaki zasługuje. To była ciężka praca, ale była tego warta, prawda?

A co z tobą, czy ostatnio przeprowadziłeś przeprojektowanie witryny WordPress?

Jakie napotkałeś problemy lub dumę, którą z tego wziąłeś?

Opowiedz nam o tym w komentarzach: zespół WPMarmite dokładnie je czyta.