Jak zrobić stronę internetową od podstaw w 2023 r. (szczegółowy samouczek)

Obecność w Internecie ma wiele form. Jednym z nich jest posiadanie własnej strony internetowej. Niezależnie od tego, czy chodzi o Twoją firmę, czy o markę osobistą, posiadanie strony internetowej może pomóc Ci zwiększyć swoją obecność w Internecie. Pokażemy Ci, jak stworzyć stronę internetową od podstaw, aby pomóc Ci jak najszybciej uruchomić witrynę. Zapewnimy Ci wszystkie niezbędne kroki, których potrzebujesz! W sumie przejdziemy ponad 13 kroków. Ten post powinien pomóc Ci zbudować jasny plan działania przy planowaniu budowy własnej strony internetowej.

Weźmy się za to.

Czy muszę wiedzieć, jak kodować?

Znajomość kodowania była kiedyś niezbędna, jeśli chodzi o strony internetowe. Chociaż wysoce zalecane jest posiadanie doświadczenia w zakresie tworzenia podstawowych stron internetowych, nie jest to konieczne. Wiele dostępnych narzędzi koncentruje się na tworzeniu wizualnych wrażeń podczas tworzenia witryny. Takie podejście przyjmiemy w tym poście. Nie będziesz potrzebować wiedzy technicznej, aby postępować zgodnie z tym samouczkiem i stworzyć stronę internetową od podstaw.

Krok 1: CMS czy Kreator Stron?

Dwie główne opcje, które masz przy podejmowaniu decyzji o zbudowaniu własnej strony internetowej, to:

1. system zarządzania treścią
2. kreator stron internetowych

System zarządzania treścią, taki jak WordPress, pozwala kontrolować każdy aspekt witryny, w tym hosting. Często też są bezpłatne. Połączenie tych dwóch opcji sprawia, że ​​systemy zarządzania treścią są najpopularniejszą opcją.

Z drugiej strony twórca stron internetowych blokuje Cię na swojej platformie hostingowej. Masz znacznie mniejszą kontrolę i często utkniesz z narzędziem do tworzenia witryn, co może spowodować „utknięcie”, jeśli oprogramowanie Cię rozczaruje.

Nasz wybór: W tym praktycznym samouczku wybierzemy WordPress.org. Jest bezpłatny, ma rozsądną krzywą uczenia się i oferuje wiele opcji ożywienia witryny.

Krok 2: Wybierz dostawcę usług hostingowych

Wybór dostawcy hostingu to kolejna ważna decyzja, którą musisz podjąć przy tworzeniu strony internetowej. Istnieje wiele planów hostingowych, więc może być trudno zobaczyć las dla drzew. Postaramy się ułożyć to dla Ciebie tak łatwo, jak to możliwe.

Rodzaje hostingu

Opcje hostingu różnią się w zależności od ruchu w witrynie. W przypadku małego ruchu działa hosting współdzielony, ale będziesz udostępniać miejsce i zasoby. Zarządzany hosting WordPress jest lepszy dla większości, ponieważ obsługuje kwestie bezpieczeństwa i techniczne. Ci, którzy potrzebują solidnego rozwiązania, mogą rozważyć hosting VPS — tańszą alternatywę dla hostingu dedykowanego o podobnych funkcjach. Aby uzyskać więcej wskazówek dotyczących wyboru odpowiedniego hostingu WordPress, zapoznaj się z naszym obszernym artykułem na temat rodzajów i wyboru.

Nasza rekomendacja: SiteGround

Zakładamy, że chcesz zbudować prostą witrynę internetową, w której nie spodziewasz się zbyt dużego ruchu. W takim przypadku wspólny plan hostingowy spełni swoje zadanie (na razie). Zawsze możesz zwiększyć skalę opcji hostingu. Nasza rekomendacja dotycząca hostingu to SiteGround. Ma ocenę 4,4 na 5 w serwisie Trustpilot i jest w pełni zasłużona. Ich platforma i rozwiązania hostingowe traktują priorytetowo klienta i jego potrzeby.

cennik

SiteGround oferuje trzy plany: StartUp za 14,99 USD miesięcznie, GrowBig za 24,99 USD i GoGeek za 39,99 USD. W tym samouczku wybierzemy plan GoGeek, który da nam 40 GB miejsca w sieci, 400 000 wizyt miesięcznie i sporo doskonałych funkcji na początek.

Utwórz konto SiteGround

Kolejnym krokiem jest utworzenie konta. Zacznij od wybrania planu (dla nas jest to plan GoGeek), a następnie postępuj zgodnie z instrukcjami, aby zarejestrować nową domenę lub dodać obecną.

Na koniec dodaj informacje o koncie, takie jak adres e-mail i hasło, informacje o kliencie, informacje o płatności i czas trwania hostingu: miesięczny lub roczny.

Krok 3: Wybierz swoją domenę

Po wybraniu dostawcy usług hostingowych możesz kontynuować, wybierając swoją domenę (jeśli jeszcze jej nie masz).

.COM

Najpopularniejsze adresy URL kończą się na dot com. To jest zakorzenione w naszym mózgu. Domyślnie ufamy domenom internetowym bardziej niż innym, co pozytywnie wpływa na markę.

Spraw, aby było to niezapomniane

Niezależnie od tego, czy wybierzesz domenę dot com, czy nie, ważne jest, aby Twoja domena była łatwa do zapamiętania. Szczególnie długoterminowo nie chcesz utrudniać odwiedzającym i klientom znalezienia Cię online.

Zarejestruj swoją domenę

Dostępnych jest wielu rejestratorów domen, ale wybór dobrego jest ważny. Jednymi z najlepszych rejestratorów domen są Namecheap lub SiteGround, ale pamiętaj, aby przeprowadzić badania, aby określić, który jest odpowiedni dla Ciebie.

Krok 4: Zainstaluj WordPress.org

Po skonfigurowaniu hostingu i domeny nadszedł czas, aby zainstalować WordPress na swojej stronie internetowej. Istnieje wiele powodów, aby wybrać WordPress ponad jakąkolwiek inną opcję. Po pierwsze, nie bez powodu jest to najpopularniejszy CMS. Jest intuicyjny, open source i umożliwia pełną personalizację. Masz także nieograniczone opcje motywów i wtyczek. Nie szkodzi również, że nie musisz płacić ani grosza, aby korzystać z WordPress.org na swojej stronie internetowej!

Automatyczna instalacja

Aby skonfigurować WordPress w swojej domenie SiteGround, możesz przejść do strony głównej swojego konta SiteGround i kliknąć Skonfiguruj witrynę .

Wybierz nową, istniejącą lub tymczasową domenę witryny, a następnie kliknij przycisk Kontynuuj .

Następnie wybierz Rozpocznij nową witrynę internetową .

Następnie wybierz WordPress , wprowadź swój adres e-mail i utwórz hasło. Następnie kliknij kontynuuj .

Krok 5: Zaplanuj strukturę swojej strony internetowej

W tym momencie środowisko Twojej witryny jest gotowe, aby zacząć myśleć o kształcie, jaki będzie miała Twoja witryna. Ważne jest, aby zastanowić się, jak ma wyglądać Twoja witryna i jakich funkcji będziesz potrzebować. Czy wystarczy jednostronicowy? Czy potrzebujesz kilku podstawowych stron dla witryny typu broszura? Potrzebujesz funkcjonalności e-commerce? Na potrzeby tego samouczka odejdziemy od celu, jakim jest zbudowanie witryny z broszurami.

Strony do rozważenia

Jeśli budujesz witrynę z broszurami, będzie kilka niezbędnych stron:

• Dom
• O
• Kontakt

Ponadto, w zależności od tego, do czego służy witryna, może się okazać, że dodasz więcej stron poświęconych:

• Usługi
• Teczka
• Blog

Nie ma dobrej ani złej struktury strony internetowej; musisz znaleźć opcję, która działa dla Ciebie, Twojej witryny i jej celów.

Krok 6: Wybierz swój motyw

Gdy Twoje środowisko WordPress jest gotowe, czas zabrać się do pracy! Korzystając z WordPressa, masz możliwość ustawienia motywu. Ten motyw stanowi podstawę Twojej witryny. W oparciu o funkcjonalność, którą chcesz dodać do swojej witryny, wybór odpowiedniego motywu będzie ważnym krokiem.

Rodzaje motywów

Istnieje wiele różnych motywów, które możesz wybrać w WordPress. Najpopularniejsze motywy są uniwersalne i zazwyczaj zawierają kreator wizualny. Powodem tego jest elastyczność, jaką oferuje. Istnieją również motywy, które są specjalnie dostosowane do witryn e-commerce lub witryn z portfolio. W zależności od rodzaju motywu, którego szukasz, możesz sprawdzić różne listy z naszymi najlepszymi rekomendacjami.

Nasza główna rekomendacja: Divi

Wybierzemy motyw do pracy w nadchodzących (praktycznych) krokach w tym samouczku. Zalecamy korzystanie z naszego własnego Divi dla każdej tworzonej witryny. Divi jest uniwersalnym motywem i zawiera Visual Builder bez kodu, który sprawia, że ​​tworzenie stron internetowych jest bardzo intuicyjne. Divi oferuje szeroką gamę funkcji, ponad 200 dostosowywalnych elementów i ponad 2200 profesjonalnie zaprojektowanych układów, z których możesz wybierać! Niezależnie od rodzaju strony internetowej, którą chcesz utworzyć, istnieje duże prawdopodobieństwo, że istnieje pakiet układu przeznaczony dokładnie dla tej konkretnej firmy.

cennik

Divi oferuje dwie opcje członkostwa: roczną i dożywotnią. Możesz uzyskać roczne członkostwo za 89 USD rocznie lub dożywotnie członkostwo za jednorazową opłatą 249 USD.

Zostań członkiem Divi

Aby zostać członkiem Divi, przejdź do naszej strony dołączania. Lub skorzystaj z dzisiejszej zniżki 10% taniej!

Po zarejestrowaniu się w celu uzyskania członkostwa możesz przejść do obszaru członkowskiego.

Pobierz Divi

Tutaj znajdziesz możliwość pobrania pliku motywu Divi.

Zainstaluj Divi na swojej stronie WordPress

Po pobraniu Divi przejdź do pulpitu nawigacyjnego WordPress, najedź kursorem na element menu Wygląd na lewym pasku bocznym i kliknij Motywy .

U góry strony zobaczysz przycisk Dodaj nowy . Kliknij ten przycisk.

Następnie kliknij Prześlij motyw .

Wyszukaj spakowany folder Divi pobrany w poprzedniej części tego samouczka i kliknij Zainstaluj teraz .

Gdy ci się to uda, będziesz mógł również aktywować motyw!

Divi jest teraz gotowy do użycia.

Dodaj klucz API do opcji motywu Divi

Aby uzyskać dostęp do wszystkich bezpłatnych układów, które zapewnia Divi, musisz dodać swój klucz API do opcji motywu Divi. Możesz znaleźć (i utworzyć) klucze API, przechodząc do obszaru członkowskiego. Tam najedź kursorem na Konto .

Następnie kliknij Nazwa użytkownika i klucz API .

Możesz tworzyć i kopiować nowe klucze API w obszarze Klucze API.

Aby dodać klucz API do opcji motywu Divi, potrzebujesz zarówno swojej nazwy użytkownika, jak i klucza API.

Następnie przejdź do pulpitu nawigacyjnego WordPress. Najedź kursorem na pozycję menu „Divi” na lewym pasku bocznym (1) i kliknij „Opcje motywu” (2). Przejdź do zakładki „Aktualizacje” (3). Możesz tam dodać swoją nazwę użytkownika (4) oraz klucz API (5). Pamiętaj o zapisaniu zmian (6).

Krok 7: Zainstaluj wtyczki

Kolejną wielką częścią WordPressa jest możliwość instalowania wtyczek. Istnieją dosłownie tysiące wtyczek, które pomagają zaspokoić różne potrzeby. Przyjrzyjmy się, które wtyczki warto rozważyć dla swojej witryny.

Niezbędne wtyczki

W przypadku każdej witryny WordPress istnieje kilka niezbędnych wtyczek, których potrzebujesz, aby odnieść sukces. Będziesz chciał zainstalować wtyczki do SEO, bezpieczeństwa i inne doskonałe wtyczki WordPress, które pomogą Ci utrzymać witrynę w doskonałym stanie.

SEO

WordPress jest przyjazny dla SEO od razu po wyjęciu z pudełka, ale potrzebuje niewielkiej pomocy, jeśli chcesz uzyskać wyższą pozycję na stronach rankingu wyszukiwarek (SERP). Na szczęście istnieje kilka doskonałych wtyczek SEO, takich jak Rank Math, dzięki którym potencjalni klienci mogą łatwo znaleźć Twoją witrynę.

Bezpieczeństwo

Kolejnym istotnym aspektem, który należy wziąć pod uwagę, jest niezawodna wtyczka bezpieczeństwa, taka jak iThemes Security. Zapewnienie ochrony przed złośliwym oprogramowaniem, botami i atakami DDoS ma kluczowe znaczenie. Z ponad 44% Internetu zbudowanego na WordPressie, staje się on głównym celem złośliwych aktorów.

Opcjonalne wtyczki

Oprócz wtyczek SEO i bezpieczeństwa, niektóre opcjonalne wtyczki mogą ulepszyć Twoją witrynę. Rozważ czat, biuletyn, media społecznościowe lub inne opcjonalne wtyczki, aby Twoja witryna stała się potęgą generującą leady.

Czat

Zaangażowanie klientów ma kluczowe znaczenie dla sukcesu Twojej witryny. Powinieneś rozważyć zainstalowanie dobrej wtyczki do czatu, takiej jak Tidio, aby być bardziej dostępnym dla klientów. Niezależnie od tego, czy chcesz zautomatyzować obsługę klienta, czy zapewnić agenta na żywo dla swojej witryny, wtyczka czatu to doskonały sposób na udzielenie odwiedzającym odpowiedzi, których pragną.

Biuletyn

Jeśli chcesz zwiększyć liczbę potencjalnych klientów i poszerzyć bazę klientów, wtyczka do biuletynu, taka jak Bloom, jest odpowiednia. To doskonały sposób na powiększenie bazy klientów, dostarczanie im przydatnych informacji i śledzenie zaangażowania Twojej witryny.

Media społecznościowe

Połączenie kanałów mediów społecznościowych z witryną WordPress to doskonały sposób na zwiększenie widoczności witryny i kont w mediach społecznościowych. Korzystając z dobrej wtyczki mediów społecznościowych, takiej jak Monarch, możesz osadzać swoje kanały mediów społecznościowych z Facebooka, YouTube i innych.

I więcej

Niezależnie od tego, czy potrzebujesz rozwiązania do tworzenia kopii zapasowych, przyspieszenia lub ulepszenia funkcjonalności witryny, dobra wtyczka WordPress może pomóc Ci osiągnąć swoje cele. Zapoznaj się z naszym postem z 31 najlepszymi wtyczkami WordPress, aby uzyskać więcej informacji na temat wtyczek, których możesz użyć, aby Twoja witryna WordPress była jak najlepsza.

Krok 8: Utwórz swoją pierwszą stronę

W tym momencie możemy śmiało przystąpić do tworzenia stron, które chcemy zaprezentować na naszej stronie! Ta część może być przytłaczająca, jeśli dopiero zaczynasz tworzyć strony internetowe. Chociaż tworzenie strony internetowej jest łatwe, czasami może prowadzić do przeciążenia informacjami. Pozwól sobie na przetwarzanie i powrót do informacji ze świeżym umysłem, gdy zajdzie taka potrzeba.

Dodaj nową stronę

Przejdź do pulpitu nawigacyjnego WordPress. Tam najedź kursorem na Strony i kliknij Dodaj nowy .

Nadaj swojej stronie tytuł. W tym przypadku nazwiemy go Home .

Możesz zapisać stronę jako wersję roboczą lub opublikować ją, aby rozpocząć nad nią pracę.

Gdy będziesz gotowy, przełącz się na Divi, klikając Użyj Divi Builder .

Wybierz gotowy układ

Divi to intuicyjne narzędzie i możesz stworzyć dowolną stronę od podstaw, jeśli nauczysz się podstaw. Ale aby przyspieszyć ten proces, Divi udostępnia ponad sto pakietów stron internetowych z ponad 2200 układami! Przy tak wielu dostępnych opcjach znajdziesz pakiet stron internetowych, który odpowiada potrzebom Twojej witryny. Co tydzień wydajemy nowy pakiet układów!

Aby przesłać układ na swoją stronę, wybierz środkową opcję z napisem Przeglądaj układy .

Zobacz, jak rozwija się nasza biblioteka pakietów układów i układów!

Możesz użyć paska wyszukiwania na lewym pasku bocznym, jeśli szukasz określonego pakietu układów.

Na potrzeby tego samouczka użyjemy układu strony głównej pakietu Marketing Layout Pack. Po prostu wpiszemy Marketing w pasku wyszukiwania.

Następnie wybierzemy stronę główną Marketing.

Spowoduje to wyświetlenie całego podglądu pakietu układu.

Aby przesłać stronę główną, kliknij niebieski przycisk z napisem Użyj tego układu .

W mgnieniu oka Twoja strona zostanie zastąpiona układem!

Zmień zawartość i obrazy

Układy są świetnymi punktami wyjścia, ale trzeba je jeszcze dostosować do potrzeb witryny. Możesz zajść z tym tak daleko, jak chcesz. Divi to wizualny kreator, który umożliwia dodawanie nowych sekcji, wierszy, kolumn, modułów i nie tylko. Posiada również wiele funkcji zwiększających wydajność, które przyspieszają proces projektowania.

W tym samouczku uprościmy to, zmieniając tylko zawartość.

Zmień kopię

Możesz otworzyć każdy pojedynczy moduł zawierający kopię i użyć pola zawartości, aby zmienić kopię. Łatwy!

Zmień obrazy

Podobnie możesz zmienić wszystkie używane obrazy, jeśli są potrzebne/chciane. Upewnij się, że zoptymalizujesz swoje zdjęcia przed przesłaniem, aby uniknąć powolnego ładowania.

Zapisz i opublikuj

Możesz zapisać i opublikować po zastosowaniu zmian, które chciałeś na swojej stronie!

Krok 10: Utwórz dodatkowe strony

W zależności od struktury witryny możesz powtórzyć powyższe kroki dla każdej potrzebnej strony. Jeśli chcesz jak najszybciej uruchomić swoją witrynę, możesz najpierw rozważyć skorzystanie z jednej strony, a następnie powoli budować pozostałe strony.

Krok 11: Utwórz nawigację swojej witryny

Wspaniale jest mieć strony w swojej witrynie, ale jeśli ludzie nie mogą dostać się na żądaną stronę, mamy problem. Dlatego należy zwrócić szczególną uwagę na nawigację w witrynie. Nawigacja zwykle znajduje się w obszarach nagłówka i stopki witryny. WordPress ma dedykowane miejsce do dynamicznego tworzenia menu z istniejących stron.

Wybierz stronę główną

Zanim stworzymy menu, skonfigurujmy najpierw stronę główną. Jeśli ludzie wpiszą Twój główny adres URL, trafią na tę stronę. Domyślnie strona główna witryny WordPress jest ustawiona na Twoje najnowsze posty . Aby to zmienić, możesz przejść do pulpitu nawigacyjnego WordPress, a następnie najechać na Ustawienia w menu po lewej stronie i kontynuować, klikając Czytanie .

Tam wybierz stronę statyczną pod pierwszą opcją i przejrzyj swoje strony, aby znaleźć swoją stronę główną. Pamiętaj, aby zapisać zmiany.

Utwórz menu główne

Następnie utworzymy menu główne. Przejdź do pulpitu nawigacyjnego WordPress, najedź kursorem na pozycję menu Wygląd na lewym pasku bocznym i wybierz Menu .

Kliknij Dodaj nowe menu i nadaj swojemu menu nazwę.

Kontynuuj, dodając strony, które chcesz umieścić w nawigacji.

Gdy to zrobisz, ustaw swoje menu jako Menu główne .

I zapisz swoje menu. To menu główne będzie teraz automatycznie odzwierciedlane w nagłówku Twojej witryny.

Krok 12: Dodatkowe kwestie do rozważenia

Strona internetowa nigdy nie jest naprawdę skończona. Zawsze będziesz mieć coś do ulepszenia lub aktualizacji. Jeśli chcesz jeszcze bardziej udoskonalić swoją witrynę, możesz rozważyć niektóre z poniższych elementów.

Tworzenie nagłówka i stopki

Istnieje kilka sposobów tworzenia nagłówków i stopek w witrynie Divi. Możesz użyć dostosowywania motywu WordPress w obszarze Wygląd > Dostosuj , aby stylizować domyślny nagłówek i stopkę Divi lub użyć Konstruktora motywów, aby je utworzyć. Zdecydowanie zalecamy korzystanie z narzędzia Divi's Theme Builder, ponieważ umożliwia ono tworzenie niestandardowych nagłówków i stopek za pomocą narzędzia Visual Builder typu „przeciągnij i upuść”. Aby uzyskać dostęp do Konstruktora motywów, przejdź do Divi > Konstruktor motywów .

Kliknij Dodaj globalny nagłówek , aby dodać nagłówek.

Możesz stworzyć dowolny układ nagłówka za pomocą narzędzia Visual Builder Div.

Tworzenie szablonów

Divi to najlepszy motyw do edycji w całej witrynie. Oprócz tworzenia nagłówków i stopek możesz tworzyć układy postów, produktów, kategorii i nie tylko. Divi's Theme Builder daje Ci pełną swobodę tworzenia strony internetowej, którą chcesz, wykorzystując swoją kreatywność lub stosując jeden z naszych wstępnie zaprojektowanych układów postów na naszym blogu.

Optymalizacja SEO

WordPress jest już przyjazny dla SEO, ale użycie wtyczki SEO i dobrego narzędzia SEO zwiększy Twoją widoczność. Dowiedz się o wyszukiwaniu słów kluczowych, pisaniu dobrych tekstów SEO i korzystaniu z linków wewnętrznych. Podejmując te kroki, w mgnieniu oka staniesz się ekspertem SEO.

Optymalizacja pod kątem urządzeń mobilnych

Stworzenie atrakcyjnej wizualnie strony internetowej na wszystkich urządzeniach ma kluczowe znaczenie. Algorytm Google zorientowany na urządzenia mobilne nadaje priorytet witrynom przyjaznym małym ekranom. Na szczęście Divi specjalizuje się w projektach mobilnych, co daje sporą przewagę.

Krok 13: Utrzymanie Twojej witryny

Aby mieć odnoszącą sukcesy witrynę internetową, musisz ją stale utrzymywać.

Aktualizuj regularnie

Nawet jeśli to tylko ze względów bezpieczeństwa, regularne aktualizowanie witryny ma zalety. Upewnij się, że jeśli przeprowadzasz aktualizację, korzystasz z witryny przejściowej. Pomoże to uniknąć konfliktów podczas aktualizacji WordPressa, motywu lub wtyczki.

Zmierz dane

Rozważ również mierzenie danych dostarczanych przez Twoją witrynę za pomocą narzędzi takich jak Google Analytics. Pomoże Ci to śledzić skuteczność Twojej witryny, w zależności od celu, jaki sobie wyznaczyłeś.

Końcowe przemyślenia

To by było na tyle w tym poście o tym, jak zrobić stronę internetową! Jak ze wszystkimi rzeczami w życiu, im więcej ćwiczysz, tym staje się to łatwiejsze. Pozwól sobie poeksperymentować z różnymi etapami procesu tworzenia strony internetowej, ponieważ zazwyczaj w ten sposób nauczysz się najwięcej. Jeśli masz jakieś pytania lub sugestie, możesz skomentować w sekcji komentarzy poniżej!

Polecane zdjęcie za pośrednictwem Darko 1981 / Shutterstock.com