Jak zrobić stronę internetową? Kompletny poradnik Krok po Kroku

Zanim przejdziemy do konkretów, muszę zaznaczyć, że tak naprawdę możliwości zrobienia swojej własnej strony internetowej jest co najmniej kilka. Prawdę mówiąc, cenię ludzi, którzy potrafią szybko przechodzić do działania, ale w tym przypadku proponuję Wam się na chwilę zatrzymać i na spokojnie zdecydować, która ścieżka będzie dla Was najlepsza.

Jak można założyć własną stronę internetową:

• Skorzystać z jednego z prostych kreatorów stron internetowych, jak chociażby Wix.com.
• Utworzyć stronę na jednym z darmowych i popularnych CMSów jak np. WordPress, czy Joomla.
• Stworzyć stronę od podstaw przy użyciu HTML, CSS, oraz opcjonalnie wybranych języków programowania (np. PHP).

Każde z wymienionych rozwiązań ma swoje wady i zalety i tak naprawdę ciężko wybrać jakieś najlepsze. Wszystko zależy tak naprawdę od ilości Waszego czasu, oraz Waszych umiejętności (lub budżetu).

W przypadku dużych i bardziej ambitnych projektów mimo wszystko odradzałbym wybór kreatorów stron. W większości są one bardzo wygodne i pozwalają cieszyć się własną stroną internetową już w ~kilkanaście minut, ale same możliwości na dłuższą metę mogą pozostawiać wiele do życzenia. Nie wspominając już o kosztach, czy konieczności dzierżenia na swojej stronie dodatkowych reklam. To dobre rozwiązanie, ale głównie dla niewielkich, hobbystycznych projektów.

W mojej opinii oparcie się o popularny system CMS to zdecydowanie najlepsza opcja na wejście do internetu dla niewielkich firm, które nie mają ogromnych potrzeb i po prostu chcą zacząć od czegoś sensownego i czegoś, co w przyszłości będzie można łatwo skalować. Utworzenie prostej strony na WordPress lub innym CMS (systemie zarządzania treścią) nie powinno stanowić większego problemu dla kogoś, kto jest w miarę obeznany z nowymi technologiami, nawet w przypadku, gdy nie potrafi kodować. Wiele popularnych hostingów pozwala nawet na automatyczną instalację takiego skryptu z poziomu ich panelu (można to bez problemu wyklikać). Co więcej, WordPress, na którym stoi ok. 30% wszystkich stron internetowych, dzięki swojej ogromnej popularności cieszy się także ogromną ilością różnego rodzaju poradników i videotutoriali. To naprawdę świetny wybór na start, jeżeli takie rzeczy sprawiają Wam jakąkolwiek przyjemność. W innym wypadku można zlecić stworzenie takiej strony komuś innemu. Profesjonalnie wykonana, niewielka strona firmowa na WordPressie z dobrze wyglądającym, choć niekoniecznie unikalnym szablonem z np. themeforest, z domeną i niedrogim hostingiem najprawdopodobniej spokojnie mogłaby się zamknąć w kilku stówkach.

Panel Administratora w WordPress

Jeżeli mamy większe wymagania, lub po prostu chcemy stworzyć coś od podstaw, najlepszym wyborem będzie zakodowanie całej strony samemu.

Do utworzenia swojej pierwszej strony internetowej wystarczy tak naprawdę podstawowa znajomość HTML, a żeby to jeszcze jakoś wyglądało, przydałoby się poznać choćby podstawy CSS. Myślę, że już po kilku dniach nauki i drobnej męczarni z podłączeniem się np. do serwera FTP (pamiętam, że kilkanaście lat temu miałem z tym ogromny problem) można bez większego problemu opublikować w sieci taką stronę, np. korzystając z jednego z darmowych hostingów. Oczywiście, apetyt rośnie zwykle w miarę jedzenia. Docelowo dobrze byłoby użyć także jakiegoś języka programowania jak np. PHP, który mógłby nam pozwolić na tworzenie wielu ciekawych skryptów, oraz na pogrupowanie całej strony tak, żeby jej edycja była wygodniejsza. Przykładowo, jeśli mielibyśmy 30 podstron HTML i chcielibyśmy dodać coś do menu, dzięki PHP moglibyśmy po prostu mieć jeden zewnętrzny plik z całym menu i nie musieć za każdym razem ręcznie dodawać nowej zakładki w każdym z 30 miejsc. Oczywiście PHP to nie jedyny język programowania przydatny przy tworzeniu stron, jest ich całe mnóstwo. Na samym początku uważam, że dobrze się zainteresować na przykład JavaScript, który pomimo swojej prostoty daje dziś naprawdę ogromne możliwości i pozwala na tworzenie bardziej interaktywnych stron.

Przykład jednej ze stworzonych przeze mnie stron. Przy jej tworzeniu użyłem między innymi HTML, CSS (bootstrap), PHP, JavaScript, jQuery. Jak widać, jest dość specyficzna, ma pełnić konkretne zadanie i umożliwiać pewną interaktywność. Samej treści nie ma na niej zbyt wiele i jest rzadko kiedy aktualizowana, dlatego też nie było sensu używać żadnego CMSa, znacznie szybciej i wydajniej było napisać to od podstaw.

• Zobacz: Prosta strona internetowa w HTML krok po kroku

Strona internetowa Krok po Kroku

Tworzymy prostą stronę w oparciu o WordPress

Postanowiłem, że w tym poradniku pokażę, w jaki sposób można założyć swoją pierwszą stronę internetową na WordPress, ponieważ dla większości zastosowań powinien być on dość sensowną i nieskomplikowaną opcją. Sama strona nie będzie zbyt wybajerowana, nie będzie miała też unikalnego designu, ale będzie działać i w przyszłości będzie mogła być nadal rozwijana bez większych przeszkód. Generalnie rzecz biorąc, zwykle odradzam tworzenie stron bezpośrednio na hostingu. Zdecydowanie wygodniejsze może okazać się spokojne tworzenie strony w lokalnym środowisku za pomocą np. XAMPP i późniejsze opublikowanie, gdy wszystko już będzie wygodne. Niemniej, byłaby to dodatkowa i dość zbędna komplikacja, dla kogoś, kto ma dopiero zamiar utworzyć pierwszą lub jedną z pierwszych własnych stron internetowych.

Opcjonalnie jeśli macie, na tym etapie można też podpiąć domenę.
Po prostu klikamy na niebieski przycisk i ściągamy pliki CMSa.

Opcjonalnie jeśli macie, na tym etapie można też podpiąć domenę.

Dla celów tego poradnika skorzystam z darmowego hostingu ct8.pl, jeżeli Wasza strona nie jest wyłącznie hobbystycznym projektem, polecałbym zastanowić się jednak nad płatnym rozwiązaniem.

Po założeniu konta, w zależności od panelu, jakim będziecie dysponować (ct8 i MyDevil mają dość zbliżony) możecie utworzyć stronę.

To dzięki niemu wgramy pliki WordPressa. Można by było pominąć ten krok jeżeli mielibyśmy do dyspozycji instalator skryptów, ale osobiście polecam zawsze zrobić to manualnie z najnowszą wersją CMSa.

Aby połączyć się z FTP, najwygodniej będzie skorzystać z programu jak np. FileZilla. Wiele hostingów oferuje wbudowany, przeglądarkowy panel, ale z doświadczenia wiem, że nie zawsze działają one sprawnie i na dłuższą metę przyjemniej korzysta się z dedykowanego programu.

Po pobraniu programu uzupełniamy w nim dane niezbędne do połączenia, zgodne z tym co jest ustawione na hostingu. Zazwyczaj takie dane można znaleźć w jego panelu lub w sekcji FAQ.

Po połączeniu się z FTP w prawym dolnym rogu znajdziemy pliki dostępne na naszym serwerze. Ważne jest, żeby przed wgraniem plików WordPress (lub jakichkolwiek innych) dostać się do folderu głównego, w którym powinniśmy umieścić nasze pliki. W moim przypadku będzie to domains/webporadydev.ct8.pl/public_html/.

Po rozpakowaniu pobranego WordPressa przechodzimy do katalogu wordpress, w którym powinny znajdować się rozmaite foldery i plik index.php. Czas wgrać je na serwer. Żeby to zrobić, zaznaczamy wszystkie pliki z tego folderu (np. skrótem CTRL + A) i przeciągamy je do głównego folderu naszej strony (wcześniej możemy usunąć stamtąd zbędne pliki jak np. index.html).

Po wgraniu wszystkich plików (co może potrwać nawet około kilku minut) przechodzimy na naszą stronę. Jeśli wszystko przebiegło poprawnie, na stronie głównej powinien wyświetlić się instalator umożliwiający wybór języka. Teraz przechodzimy przez kolejne kroki.

Po wyborze języka powinniśmy nacisnąć przycisk “zaczynajmy” i uzupełnić pola, które zaraz ukażą się naszym oczom. Aby jednak cały system działał poprawnie, samo wgranie plików nie wystarczy, bowiem trzeba to jeszcze połączyć z bazą danych. Wróćmy więc na chwilę do panelu w naszym hostingu i spróbujmy ją utworzyć. Najprawdopodobniej znajdziesz w nim zakładkę “Bazy Danych” lub “MySQL”.

Nazwę bazy i login możecie ustawić samodzielnie, w moim przypadku był to prefiks narzucony przez panel hostingu i odpowiednio “webporady” i “user”. Warto zadbać o to, żeby hasło było dość silne i nie było takie samo jak to do panelu, czy do konta FTP.

Teraz musimy wprowadzić te dane w instalatorze:

Co istotne, adres serwera bazy danych powinniście znaleźć gdzieś w Waszym panelu hostingu lub w FAQ. Często będzie on domyślny, czyli po prostu ustawiony na localhost.

Prefiks tabel możecie zmienić na jakiś inny, aczkolwiek ja nie widziałem takiej potrzeby, więc zostawiłem domyślny.

Później czekają na nas jeszcze ogólne informacje dotyczące naszej strony i konta:

Teraz będziemy mogli uruchomić naszą instalację i przejść do panelu (domyślnie będzie on dostępny pod adresem www.adreswaszejstrony/wp-admin).

Uwaga! Jeśli chcecie, żeby stronę mogli w przyszłości znajdować inni w wyszukiwarkach, nie zaznaczajcie “Proś wyszukiwarki o nieindeksowanie tej witryny”. Ja zaznaczyłem to tylko na czas prac, a tak naprawdę przede wszystkim ze względu na to, że to po prostu testowa strona.

Po całym procesie instalacji powinniśmy w końcu ujrzeć nasz kokpit, czyli panel administratora. Jeśli skasujemy z adresu /wp-admin i całą resztę pozostawiając po prostu adres strony głównej — będziemy mogli na nią wejść. Będzie ona wprawdzie dość pusta i wybrakowana, ale.. Będzie!

Teraz możemy wrócić do panelu (www.adreswaszejstrony/wp-admin). Pokażę kilka prostych możliwości, które odrobinę ubarwią naszą stronę.

Przejdźmy do zakładki “Wygląd”.

Wybór szablonów w WordPress jest naprawdę całkiem spory. Można użyć jednego z zainstalowanych, dodać jakiś kupiony lub znaleziony w internecie (jest dużo także tych darmowych), albo nawet utworzyć swój własny. Na potrzeby tego poradnika skorzystam z pierwszej opcji, włączając zainstalowany już motyw “Twenty Twenty”. Warto zwrócić uwagę na przycisk “Dodaj” w lewym górnym rogu. W tamtej zakładce będziemy mogli dodawać własne szablony lub instalować różne inne proponowane przez WordPress.

Po włączeniu szablonu możemy go jeszcze dostosować w zakładce Wygląd/Dostosuj. Niektóre szablony mają całkiem sporo możliwości, więc zachęcam, żeby spróbować się tym pobawić i dokonać ew. zmian według własnych upodobań.

Chcąc dodać podstronę musimy wejść w zakładkę “Strony” i nacisnąć na przycisk “Dodaj nową”.

Dla celów tego poradnika utworzę stronę “Pytania i Odpowiedzi”.

Po stworzeniu treści możemy ustawić rozmaite parametry, dodać obrazek wyróżniający i wreszcie opublikować ją na naszej nowej stronie.

Podsumowanie

Jeśli chcesz zacząć tworzyć strony internetowe, WordPress może być naprawdę niezłym wyborem na start. Sam CMS jest dość przyjazny, a w internecie można znelźć mnóstwo poradników i zasobów, pozwalających na jeszcze łatwiejsze rozwijanie swoich umiejętności i swojej strony. W tym wpisie pokazałem w jaki sposób utworzyć stronę na WordPress i opublikować ją w internecie. Wydaje mi się, że to najżmudniejszy i najbardziej problematyczny (na samym początku) proces tworzenia stron. Sama nauka powinna być już przyjemnością i zachęcam do tego, żebyście próbowali rozwijać swoje serwisy. Jeśli miałbym zakończyć to podsumowanie jedną ważną radą na przyszłość to z pewnością brzmiałaby ona tak:

Co dalej? Najważniejsze funkcje w WordPress.

To co zrobicie później jest już Waszą decyzją i zależy między innymi od Waszych potrzeb. Jeśli chcecie nauczyć się najważniejszych funkcji WordPressa, poza motywami proponowałbym zgłębić przede wszystkim następujące rzeczy:

• Zakładka Wygląd -> Menu. Menu jest bardzo ważnym elementem nawigacji na niemal każdej stronie internetowej. Warto potrafić je tworzyć i dodawać poszczególne elementy. Może wydawać się to z początku trochę nieintuicyjne, jednak w rzeczywistości tworzenie menu w WordPress jest naprawdę proste. Po prostu trzeba mu nadać nazwę, dodać interesujące nas elementy i później zapisać i dodać je np. w zakładce Wygląd -> Dostosuj.
• Zakładka Wtyczki. Chyba najpotężniejsza i dostarczająca najwięcej frajdy (a czasami i nerwów) zakładka. Znajdziecie w niej mnóstwo przydatnych wtyczek do Waszej strony, które mogą na rozmaite sposoby rozszerzyć jej funkcjonalność. Między innymi znajdują się tam wtyczki jak WooCommerce pozwalające na utworzenie w pełni fukncjonalnego sklepu internetowego, czy Yoast SEO umożliwiające lepsze optymalizowanie naszych treści pod kątem pozycjonowania.
• Zakładka Wpisy. Jeśli chcecie prowadzić na stronie swojego Bloga, warto się z nią zapoznać. Działa na podobnej zasadzie jak “Strony”.
• Zakładka Ustawienia. Proponuję odwiedzić ją jak najszybciej. Możecie tu dostosować wiele parametrów, zrezygnować z wyświetlania na stronie głównej wpisów (jeśli nie chcecie prowadzić bloga), czy zmienić format adresów URL (Ustawienia -> Bezpośrednie odnośniki). Jeśli chcecie go zmienić, a moim zdaniem warto (polecam “nazwa wpisu”) to lepiej to zrobić jeszcze przed publikacją pierwszych wpisów, żeby potem nie robić przekierowań ze względu na SEO.