8 kroków do przeprojektowania witryny internetowej Twoja lista kontrolna dotycząca sprawnej modernizacji witryny w 2023 r

Tooltester jest obsługiwany przez czytelników takich jak Ty. Możemy otrzymać prowizję partnerską, jeśli dokonasz zakupu za pośrednictwem naszych linków, co umożliwi nam bezpłatne oferowanie naszych badań.

Czy Twoja witryna wygląda na starą, brzydką i nieporadną? Nie działa tak dobrze, jak powinien? W takim razie przeprojektowanie strony internetowej może być w porządku.

Oczywiście znacznie łatwiej to powiedzieć, niż zrobić.

Idealnym przykładem jest nasza witryna Tooltester, którą niedawno odnowiliśmy. Prace nad przeprojektowaniem zajęły nam 1,5 roku. Bez przesady.

Zanim wyruszysz w góry, powinniśmy wspomnieć, że w ramach dużego rebrandingu przeprojektowaliśmy naszą stronę internetową. To prawdopodobnie sprawiło, że proces przeprojektowania był bardziej złożony niż przeciętny wysiłek związany z ponownym uruchomieniem witryny.

Po drodze jednak zdobyliśmy cenne informacje na temat możliwie najsprawniejszego przeprowadzenia przeprojektowania witryny internetowej . Zebraliśmy to, czego się nauczyliśmy, w solidny, ośmioetapowy plan przeprojektowania witryny internetowej, który okaże się pomocny, jeśli planujesz przeprojektować własną witrynę:

Analiza

1. Przeanalizuj swoją obecną witrynę internetową
2. Przeanalizuj swoją konkurencję

Planowanie

1. Wyznacz cele przeprojektowania
2. Sprawdź konfigurację techniczną swojej witryny
3. Deleguj obowiązki związane z przeprojektowaniem strony internetowej

Realizacja

1. Przygotuj się na przeprojektowanie
2. Dzień premiery!
3. Stale ulepszaj swoją witrynę

Podzielimy się również sposobem, w jaki zastosowaliśmy te kroki w naszym własnym projekcie przeprojektowania witryny internetowej. Ale najpierw usuńmy kilka podstawowych pytań.

Mianowicie: dlaczego może być konieczne przeprojektowanie witryny internetowej i ile może to kosztować?

Dlaczego warto przeprojektować stronę internetową?

Powody przeprojektowania strony internetowej obejmują:

• Projekt Twojej witryny jest przestarzały: być może początkowo podobał Ci się jej wygląd. Ale teraz uważasz, że jego elementy wizualne są nieestetyczne lub niezgodne z najnowszymi trendami w projektowaniu stron internetowych. A może Twoja witryna nie jest responsywna, co powoduje, że użytkownicy urządzeń mobilnych mają trudności z poruszaniem się po witrynie.
• Twoja witryna internetowa jest zbudowana w oparciu o przestarzałą technologię: jeśli system zarządzania treścią (CMS) Twojej witryny jest stary i rzadko aktualizowany, może zawierać poważne luki w zabezpieczeniach. W tym przypadku praktycznie zapraszasz hakerów do kradzieży Twoich danych lub zamknięcia całej witryny.
• Potrzebujesz nowych funkcji i funkcjonalności witryny internetowej: z biegiem czasu witryna może wymagać więcej funkcji, niż pierwotnie zakładano. Na przykład, jeśli dodajesz sklep internetowy do swojego bloga, musisz przeprojektować swoją witrynę, aby uwzględnić taką funkcjonalność sklepu.
• Słaby projekt Twojej witryny internetowej wpływający na Twoje rankingi wyszukiwania: na przykład Google od lipca 2019 r. przyjął podejście mobilne do indeksowania i rankingu stron internetowych. Witryna, która nie jest zoptymalizowana pod kątem urządzeń mobilnych, może prowadzić do niskich rankingów wyszukiwania i dlatego wymaga przeprojektowania . Upewnij się, że używasz narzędzia do tworzenia witryn internetowych lub systemu CMS, który świetnie nadaje się do SEO.
• Dokonujesz rebrandingu: Twoja firma przechodzi gruntowny rebranding i zmienia wartości marki, logo, kolory i nie tylko. W ramach tego procesu będziesz musiał przerobić materiały marketingowe, co obejmuje przeprojektowanie witryny internetowej.

Ten ostatni powód szczególnie do nas przemawia.

Zdecydowaliśmy się przeprojektować naszą stronę internetową, ponieważ uznaliśmy, że nasz projekt nie odzwierciedla już tego, kim jesteśmy jako firma. Dla kontekstu oto jak wyglądała nasza stara strona główna:

Projekt naszej poprzedniej strony internetowej

Nasza stara strona internetowa wyglądała, jakby była dziełem trzech osób, co w pewnym momencie naszej historii było prawdą. Ale teraz Tooltester jest prowadzony przez niesamowity zespół składający się z ponad 10 osób!

Chcieliśmy więc, aby nasza witryna była bardziej dopracowana i informowała o tym, jak jest prowadzona przez doświadczony zespół, który pomaga małym firmom w znalezieniu narzędzi idealnych do ich potrzeb.

Ile może kosztować przeprojektowanie strony internetowej?

Jeśli zatrudniasz specjalistów, którzy zajmą się całą pracą za Ciebie , możesz spodziewać się wydatków na przeprojektowanie witryny internetowej w wysokości około:

• Projektowanie szablonów stron (w tym dla witryny mobilnej): 100–300 USD za stronę
• Kodowanie 8-stronicowego motywu witryny WordPress: 1500–3000 USD
• Uzyskanie hostingu , nazwy domeny i adresów e-mail: 10–30 USD miesięcznie w zależności od miesięcznego natężenia ruchu w witrynie

Alternatywnie możesz preferować podejście do samodzielnego tworzenia witryn internetowych i skorzystać z narzędzia do tworzenia witryn, aby zbudować nową witrynę od podstaw . W takim przypadku koszt przeprojektowania może wynosić zaledwie 10–25 USD miesięcznie, w zależności od wybranego narzędzia do tworzenia witryn.

Na przykład narzędzie do tworzenia witryn Wix pobiera opłatę w wysokości 16 USD miesięcznie za plan Combo, który obejmuje 2 GB przestrzeni dyskowej i bezpłatny certyfikat SSL. Z drugiej strony utworzenie nowej witryny internetowej w ramach planu Personal Squarespace kosztuje 16 USD miesięcznie, który zapewnia nieograniczoną przepustowość, funkcje e-commerce, zaawansowaną analitykę witryny i nie tylko.

(Mamy również kompletny przewodnik po kosztach tworzenia stron internetowych, który możesz sprawdzić!)

W naszej sytuacji zdecydowaliśmy się zatrudnić agencję brandingową, która będzie nadzorować za nas proces przeprojektowania strony internetowej. Agencja pomogła nam stworzyć nowe logo i niestandardowe szablony projektów stron internetowych dla prawie 20 typów stron.

Ich usługi nie były tanie: na współpracę z nimi przeznaczyliśmy pięciocyfrowy budżet. Ale wykonali świetną robotę i jesteśmy naprawdę zadowoleni z wyników!

Nawet jeśli nie masz takiego budżetu, przekonasz się, że proces przeprojektowania Twojej witryny będzie obejmował bardzo podobne kroki do naszego.

Analiza

Prace nad przeprojektowaniem strony internetowej można podzielić na trzy główne etapy:

1. Analiza
2. Planowanie
3. Realizacja

Na początek przyjrzyjmy się procesowi analizy…

1. Przeanalizuj swoją obecną witrynę

Ile elementów Twojej istniejącej witryny internetowej wymaga zmian — czy potrzebujesz przeprojektować całą witrynę, czy tylko jej części?

Rozważ takie rzeczy jak:

• Konfiguracja techniczna: Być może musisz zmienić narzędzie do tworzenia witryn lub system CMS, jeśli Twoja istniejąca witryna jest bardzo przestarzała lub trudna w użyciu. Alternatywnie, może wystarczy przekodować motyw, aby przyspieszyć działanie witryny.
• Optymalizacja wyszukiwarek (SEO): Przeprowadź audyt SEO swojej witryny, aby sprawdzić, czy nie występują problemy, które mogą negatywnie wpływać na jej rankingi wyszukiwania. Narzędzia SEO z wbudowanymi funkcjami audytu SEO, takie jak Screaming Frog i Ahrefs (Audyt witryny, z którego można korzystać bezpłatnie), mogą pomóc Ci zidentyfikować takie problemy, zanim podejmiesz decyzję o kolejnych krokach. Na przykład, jeśli audyt wykaże, że w Twojej witrynie znajdują się strony z błędami 404, możesz chcieć przekierować linki prowadzące do tych stron w inne miejsce.
• Projekt: Czy elementy projektu Twojej witryny są (nadal) nowoczesne i wyglądają profesjonalnie? Czy dokładnie odzwierciedlają Twoją markę? Jeśli dodajesz nowe funkcje witryny internetowej, może być konieczne przeprojektowanie witryny, aby je uwzględnić (jak wspomniano wcześniej). Oto kilka wskazówek, jak znaleźć inspirację.
• Nawigacja i doświadczenie użytkownika (UX): Z biegiem czasu mogłeś otrzymywać skargi użytkowników dotyczące trudności w nawigacji po niektórych częściach Twojej witryny lub znalezienia niektórych funkcji. Nadaj priorytet przeprojektowaniu tych problematycznych interfejsów, aby poprawić wygodę użytkownika.

Na Twojej stronie internetowej znajdują się różne narzędzia umożliwiające przeprowadzanie takich „kontroli stanu”. Oto kilka wskazówek na początek:

• Google Analytics : do monitorowania ruchu w witrynie i wskaźników strony docelowej
• Hotjar : narzędzie do tworzenia mapy cieplnej służące do śledzenia zachowań użytkowników i uczenia się, w jaki sposób odwiedzający wchodzą w interakcję z Twoimi stronami internetowymi
• Opinia Sabre : umieść przycisk opinii na swojej stronie internetowej, aby użytkownicy mogli przesyłać opinie na temat wszelkich znalezionych problemów z witryną

2. Przeanalizuj swoją konkurencję

Po przejrzeniu swojej witryny zwróć uwagę na witryny zbudowane przez konkurencję.

Przeprowadź badania rynku dotyczące liderów w Twojej branży i funkcji ich witryn internetowych. Co oni robią dobrze? Witryny Twojej konkurencji mogą zawierać funkcje, które warto ukraść — hm, mamy na myśli dostosowanie ich do własnych potrzeb. Możesz także zadbać o to, aby Twoja witryna była jeszcze lepsza od ich.

To powiedziawszy, nie ograniczaj się do witryn internetowych w swojej przestrzeni . Inne branże mogą mieć witryny internetowe działające podobnie do Twojej i charakteryzujące się unikalnym podejściem do obsługi docelowych odbiorców. „Przeszczepienie” takiego podejścia z innych branż na Twoją witrynę może być kluczem do wyróżnienia jej w Twojej przestrzeni!

Kiedy analizowaliśmy konkurencję na naszej stronie internetowej, nasza agencja brandingowa poprosiła o listę naszych konkurentów do sprawdzenia. Pozyskali także dobre przykłady przeprojektowania ze stron internetowych z innych branż. Na przykład, ponieważ pomagamy użytkownikom porównywać narzędzia internetowe, agencja przeanalizowała również, w jaki sposób platformy rezerwacji hoteli pomagają użytkownikom porównywać hotele.

Po przeprowadzeniu wszystkich tych badań agencja brandingowa ustaliła naszą pozycję na tle innych marek w naszej przestrzeni.

Ponieważ wielu naszych konkurentów podchodzi bezosobowo do recenzji narzędzi i nie kontaktuje się zbyt często ze swoimi czytelnikami, zdecydowaliśmy, że Tooltester będzie „cyfrowym kumplem-ekspertem” naszych czytelników, będącym autorytatywnym, ale przyjaznym źródłem recenzji.

To pozycjonowanie miało następnie duży wpływ na przeprojektowanie naszej witryny internetowej. Na przykład postanowiliśmy umieścić w widocznym miejscu członków zespołu Tooltester na naszych stronach internetowych, aby podkreślić osobiste i istotne podejście do recenzji narzędzi.

Po prostu sprawdź naszą stronę Informacje, a zobaczysz, co mamy na myśli!

Planowanie

Zidentyfikowałeś części swojej witryny, które wymagają ulepszenia? Następnie zaplanujesz sposób ich przeprojektowania. Wiąże:

3. Wyznaczanie celów przeprojektowania

Zrób listę ogólnych celów biznesowych, które chcesz osiągnąć dzięki przeprojektowaniu witryny. Cele te będą wyznaczać strategię przeprojektowania Twojej witryny internetowej.

Przykłady celów ogólnych obejmują:

• Podwojenie ruchu organicznego w ciągu najbliższego roku
• Odświeżam całą zawartość Twojego bloga
• Zmniejszenie trudności, z jakimi spotykają się użytkownicy podczas składania zamówień w sklepie internetowym

Następnie podziel swoje ogólne cele na mniejsze, wykonalne cele . Oto rzeczywiste kroki, które podejmiesz, aby osiągnąć swoje ogólne cele.

Aby na przykład osiągnąć ogólny cel, jakim jest podwojenie ruchu organicznego w ciągu następnego roku, konieczne może być wyznaczenie celów cząstkowych, takich jak:

• Konfigurowanie śledzenia słów kluczowych dla Twojej witryny
• Aktualizacja określonego wpisu na blogu w celu lepszego kierowania na określone słowo kluczowe
• Podłączenie Google Analytics do Twojej witryny w celu śledzenia miesięcznego ruchu organicznego

Z drugiej strony, aby osiągnąć ogólny cel, jakim jest zmniejszenie tarć w handlu elektronicznym, Twoje cele cząstkowe mogą obejmować:

• Przeprojektowanie wielostronicowego formularza transakcji na formularz jednostronicowy
• Zbudowanie przycisku umożliwiającego użytkownikom przejście bezpośrednio do kasy po dodaniu produktu do koszyka
• Dodanie funkcji, która bezpiecznie przechowuje informacje o karcie kredytowej Twoich klientów do wykorzystania w przyszłości

Na koniec zaplanuj, kiedy zrealizujesz każdy cel cząstkowy.

Spróbuj podzielić swoje cele ogólne na jak najwięcej oddzielnych celów cząstkowych, a następnie rozłóż je w odstępach. W ten sposób będziesz mieć lepszą kontrolę nad wpływem wprowadzonych zmian (jeśli w ogóle) na ranking wyszukiwarek.

4. Przegląd konfiguracji technicznej witryny

Aby zapewnić skuteczne działanie, Twoja witryna internetowa musi być zbudowana na solidnych podstawach technicznych. Skorzystaj z okazji i sprawdź, czy specyfikacje techniczne Twojej witryny nadal dobrze Ci służą, czy też wymagają aktualizacji.

Możesz na przykład zmienić system CMS lub narzędzie do tworzenia witryn internetowych na takie, które zapewniają większą prędkość ładowania strony. Lub jeśli chcesz rozszerzyć funkcjonalność swojej witryny internetowej , sprawdź, czy zainstalowanie wtyczki innej firmy rozwiąże problem lub czy będziesz musiał zatrudnić zespół programistów internetowych, aby zakodował tę funkcję za Ciebie.

Wszystkie zmiany w konfiguracji technicznej Twojej witryny będą wiązać się z kosztami (zobacz dyskusję na temat kosztów przeprojektowania witryny powyżej), dlatego należy odpowiednio zaplanować dla nich budżet.

W naszym przypadku korzystaliśmy z systemu CMS WordPress na naszej stronie internetowej i zamierzaliśmy go nadal używać. Zamiast więc przenosić systemy CMS, „po prostu” musieliśmy stworzyć nowy motyw WordPress i aktywować go, aby zmienić wygląd naszej witryny.

(Mówimy tutaj „po prostu” w cudzysłowie, ponieważ utworzenie nowego szablonu WordPress było o wiele trudniejsze, niż się wydaje!)

Staraliśmy się także nie wprowadzać zbyt wielu zmian w funkcjonalności naszej witryny. Miało to na celu uniknięcie komplikowania naszego projektu przeprojektowania strony internetowej, bardziej niż było to konieczne (a było to już bardzo złożone).

5. Delegowanie obowiązków związanych z redesignem serwisu

Wyznaczyłeś cele, które należy osiągnąć, aby ukończyć przeprojektowanie witryny internetowej. Teraz znajdziesz ludzi, którzy je przeprowadzą .

Podziel cele na dwie kategorie:

1. Cele, którymi powinien zająć się Twój zespół wewnętrznie
2. Cele do realizacji zewnętrznie przez agencje rekrutacyjne lub freelancerów

Jeśli Twój zespół ma wiedzę i doświadczenie potrzebne do realizacji określonych celów , przypisanie im tych celów jest oczywiste. W szczególności możesz chcieć delegować określone cele swojemu zespołowi zamiast osobie trzeciej, jeśli te cele wiążą się z pracą z poufnymi informacjami biznesowymi.

Jeśli jednak chcesz poznać świeże spojrzenie osoby z zewnątrz i uzyskać fachową opinię na temat projektu przeprojektowania swojej witryny internetowej, najlepszym rozwiązaniem może być zatrudnienie zewnętrznych specjalistów. Oto, co zrobiliśmy w przypadku przeprojektowania naszej witryny internetowej: zatrudniliśmy agencję brandingową, aby opracowała nowe szablony projektów dla naszej witryny. Osobno zatrudniliśmy programistę, aby zaimplementował te projekty w naszym nowym motywie witryny.

Jeśli zamierzasz zatrudnić niezależnych projektantów i programistów stron internetowych do projektu przeprojektowania swojej witryny, możesz opublikować swoją prośbę na platformach takich jak Upwork, Fiverr lub LinkedIn. Alternatywnie, tutaj znajdziesz dodatkowe usługi projektowania stron internetowych. Możesz także poprosić osoby w swojej sieci o rekomendacje.

Jeśli szukasz pomocy z zewnątrz, naszą wskazówką jest skorzystanie z pomocy osób, które specjalizują się w konkretnych usługach, których potrzebujesz . Programista zazwyczaj nie jest świetnym projektantem stron internetowych i odwrotnie .

Realizacja

Teraz będziesz mieć brudne ręce, pracując nad przeprojektowaniem strony internetowej!

6. Przygotowanie do przeprojektowania

Twój zespół i zatrudnieni przez Ciebie zewnętrzni specjaliści zaczną realizować cele cząstkowe, które określiłeś wcześniej. Do ich zadań może należeć:

• Tworzenie nowego projektu strony internetowej: Figma jest obecnie preferowaną standardową platformą do projektowania interfejsów
• Tworzenie nowej witryny na serwerze przejściowym: ten serwer zapewnia środowisko testowe, w którym możesz sprawdzić, jak będzie wyglądać Twoja nowa witryna i usunąć wszelkie błędy, zanim ją uruchomisz
• Testowanie wszystkiego, aby upewnić się, że działa: kliknij każdy link i każdy przycisk. Sprawdź, jak Twoja witryna wygląda zarówno na komputerze stacjonarnym, jak i mobilnym. Złóż testowe zamówienia online. Przetestuj WSZYSTKO!
• Tworzenie kopii zapasowej starej witryny: nie pomijaj tego kroku. Jeśli coś pójdzie nie tak po uruchomieniu nowo zaprojektowanej witryny internetowej, warto mieć kopię zapasową poprzedniej witryny, na której będziesz mógł polegać. Powinieneś także pobrać kopię offline swojej starej witryny.
• Konfigurowanie przekierowań linków 301 w przypadku zmiany adresów URL: pomaga to użytkownikom w dalszym uzyskiwaniu dostępu do Twoich stron bez napotykania nieprzyjemnych błędów 404. Z punktu widzenia SEO konfiguracja przekierowań linków pomaga również wyszukiwarkom w rankingu nowych adresów URL i przypisywaniu „sytu linków” zgromadzonego przez stronę pod starym adresem URL do strony pod nowym adresem URL.

Po zrealizowaniu każdego celu cząstkowego skreślaj je ze swojej listy! Dzięki temu będziesz mieć motywację podczas odliczania do:

7. Dzień premiery!

Po dwukrotnym i potrójnym sprawdzeniu, czy wszystko jest w porządku, uruchom przeprojektowaną witrynę. Może to obejmować migrację nowej witryny z serwera pomostowego na serwer produkcyjny (tj. serwer, na którym znajduje się działająca witryna internetowa).

Nawet świętując uruchomienie, uważnie obserwuj wydajność swojej nowej witryny internetowej . W jaki sposób odwiedzający wchodzą w interakcję z Twoją witryną? Czy korzystanie z niego jest tak dobre, jak planowałeś?

Możesz także doświadczyć tymczasowej utraty ruchu, jeśli wielu odwiedzających pozyskasz ze stron wyników wyszukiwania. Dzieje się tak dlatego, że po wprowadzeniu poważnych zmian w witrynie spadek pozycji w wynikach wyszukiwania jest zjawiskiem normalnym. Ale przy odrobinie szczęścia Twoje rankingi – a co za tym idzie również liczba odwiedzin – powinny szybko powrócić do normy i stać się jeszcze lepsze.

8. Ciągłe udoskonalanie serwisu

Po uruchomieniu nowo zaprojektowanej witryny projekt przeprojektowania witryny jest ukończony. Ale praca nigdy się nie kończy!

Trendy w projektowaniu stron internetowych zmieniają się z biegiem czasu , więc za kilka lat może być konieczne ponowne przeprojektowanie witryny, aby wyglądała świeżo i nowocześnie.

Poza tym monitoruj swoją witrynę, aby zidentyfikować więcej potencjalnych obszarów wymagających poprawy . Pomóc w tym mogą narzędzia analityczne, takie jak te, o których wspomnieliśmy powyżej.

Jeśli napotkasz problemy wymagające szybkich i łatwych rozwiązań, np. przeoczony uszkodzony link, rozwiąż je natychmiast. Natomiast rozwiązanie innych problemów może wymagać więcej czasu i wysiłku. Nawet jeśli zdecydujesz się nie zajmować nimi w tym momencie, zanotuj je.

Przydadzą się, gdy będziesz decydować, nad czym pracować przy następnym przeprojektowaniu swojej witryny!

Przeprojektowanie strony internetowej: podsumowanie końcowe

Oto przydatne podsumowanie zadań do wykonania podczas przeprojektowywania witryny internetowej:

Analiza

1. Przeanalizuj swoją obecną witrynę i zobacz, co należy zmienić
2. Przeanalizuj konkurencję , aby uzyskać inspirację do ulepszenia witryny

Planowanie

1. Wyznacz cele przeprojektowania — zarówno cele ogólne, jak i wykonalne cele cząstkowe dotyczące wdrożenia przeprojektowania
2. Przejrzyj konfigurację techniczną swojej witryny i zdecyduj, czy wymaga ona remontu
3. Deleguj obowiązki związane z przeprojektowaniem witryny internetowej, aby Twój zespół wiedział, kto będzie co robił. W razie potrzeby zaangażuj także specjalistów z zewnątrz

Realizacja

1. Przygotuj się do przeprojektowania , tworząc wszystkie niezbędne zasoby projektowe, budując nową witrynę internetową i tak dalej
2. Uruchom przeprojektowaną witrynę internetową i monitoruj jej działanie
3. Stale ulepszaj swoją witrynę internetową , identyfikując nowe obszary wymagające poprawy

Jeśli nadal czujesz się onieśmielony pracą, która Cię czeka, naszą ostatnią radą jest podzielenie projektu przeprojektowania na jak najwięcej mniejszych celów cząstkowych. Wszystkie te małe postępy będą sumować się podczas pracy nad transformacją Twojej witryny!

Nie zaszkodzi też zatrudnienie profesjonalistów, którzy na co dzień zajmują się projektami przebudowy stron internetowych, jeśli pozwala na to budżet i jeśli chcesz, aby cały proces nadzorował za Ciebie ekspert.

Na koniec chętnie dorzucimy nasze trzy grosze, jeśli chcesz uzyskać opinię na temat projektu przeprojektowania swojej witryny internetowej. Po prostu napisz poniżej swoje komentarze i pytania!