Hosting HTML: publikacja strony i 4 częste błędy

Hosting HTML ma udostępnić gotowe pliki HTML, CSS i JavaScript; taka strona nie potrzebuje WordPressa ani bazy danych. Potrzebujesz usługi, która udostępni pliki pod publicznym adresem przez HTTPS. Wybierz platformę statyczną, jeśli masz same pliki i potrafisz je aktualizować, albo zwykły hosting WWW, gdy chcesz w jednym pakiecie także skrzynki pocztowe, obsługę PHP lub pomoc przy konfiguracji.

Najważniejsze pytanie brzmi: czy witryna tylko wyświetla informacje, czy również wykonuje zadania po stronie serwera? Formularz, który rzeczywiście doręcza wiadomość, logowanie użytkowników i przechowywanie zamówień wymagają dodatkowego zaplecza. Sam wygląd formularza w HTML takiego zaplecza nie tworzy.

W tym poradniku

1. Co oznacza hosting HTML i czego nie zawiera automatycznie?
2. Hosting HTML: platforma statyczna czy zwykłe WWW?
3. Przykład: wgranie gotowych plików do Cloudflare Pages
4. Hosting HTML: 4 częste błędy po wgraniu strony
5. Przykład naprawy ścieżek obrazów
6. Jak odebrać działający formularz?
7. Formularz i poczta: dwie osobne decyzje
8. Dlaczego nie polecam każdemu firmowemu projektowi GitHub Pages?
9. Krótka lista odbioru strony HTML

Co oznacza hosting HTML i czego nie zawiera automatycznie?

Przeglądarka pobiera pliki HTML, arkusze stylów, skrypty i obrazy. Przy stronie statycznej serwer nie musi generować każdej podstrony z bazy. Nadal odpowiadasz za treść, aktualizację używanych bibliotek, dostępność linków i kopię źródeł. Brak WordPressa zmniejsza liczbę elementów do utrzymania, lecz nie oznacza braku jakichkolwiek obowiązków.

Jeśli nie masz jeszcze gotowych plików, zacznij od wyboru sposobu wykonania strony. Tutaj zakładamy, że witryna już istnieje i chcesz ją poprawnie umieścić w internecie.

Hosting HTML: platforma statyczna czy zwykłe WWW?

Platforma statyczna pasuje do osoby, która dostaje od wykonawcy gotowy katalog strony albo samodzielnie korzysta z generatora plików. Aktualizacja polega wtedy na ponownym wdrożeniu wersji. Hosting HTML w klasycznym pakiecie WWW może być wygodniejszy dla małej firmy potrzebującej równocześnie kilku skrzynek, panelu i obsługi technicznej. Sam fakt, że oferta reklamuje WordPressa, nie wyklucza strony HTML; potwierdź jednak własną domenę, katalog publikacji i sposób przesyłania plików.

Nie porównuj wyłącznie ceny serwera. Zapisz osobno koszt domeny, poczty, formularza i pracy przy aktualizacjach. Darmowe miejsce na pliki nie oznacza bezpłatnej domeny, skrzynek ani dowolnych zastosowań. Przy zwykłym hostingu WWW ranking WebBay pomoże porównać operatorów i warunki pakietów; nie jest zestawieniem wszystkich platform statycznych.

Przykład: fotograf ma 12 podstron i 80 zdjęć. Nie potrzebuje kont użytkowników, przyjmuje zapytania telefonicznie i aktualizuje portfolio raz w miesiącu. To dobry kandydat do statycznego wdrożenia. Jeżeli dodaje formularz rezerwacji ze stanem dostępności, problemem przestaje być liczba plików — pojawia się obsługa danych i logika rezerwacji.

Przykład: wgranie gotowych plików do Cloudflare Pages

Poniższa ścieżka dotyczy ręcznego Direct Upload. Wymaga własnego konta Cloudflare i uprawnień do projektu. Nie wymaga przenoszenia działającej domeny na etapie próby. Według dokumentacji sprawdzonej 30.10.2026 projekt utworzony w ten sposób nie może zostać później przełączony na integrację Git; dla niej powstaje nowy projekt.

1. Przygotuj katalog zawierający index.html, pliki CSS, JavaScript i obrazy. Usuń kopie robocze, hasła, pliki konfiguracyjne zaplecza oraz dane klientów. Nie wgrywaj całego dysku ani katalogu projektu z niepotrzebnymi materiałami.
2. W panelu wybierz Workers & Pages → Create application → Get started → Drag and drop your files.
3. Nazwij projekt i przeciągnij katalog strony albo przygotowane archiwum. Plik index.html ma być na najwyższym poziomie publikowanych plików, a nie w dodatkowym katalogu nadrzędnym.
4. Wybierz Deploy site, a następnie odpowiedni krok zapisu i wdrożenia pokazany przez panel. Otwórz otrzymany adres nazwa-projektu.pages.dev.
5. Sprawdź stronę główną i każdą podstronę, zdjęcia, menu, polskie znaki i wersję telefonu. Zapisz lokalną kopię dokładnie tej wersji.

Ręczne przeciąganie ma limit 1000 plików i 25 MiB na pojedynczy plik. Duży film nie powinien trafić tu jako przypadkowy plik obok HTML. Przy większej witrynie wybierz właściwy sposób wdrażania lub osobne przechowywanie multimediów. Ręczny upload z panelu nie kompiluje katalogu Pages Functions, więc nie traktuj go jako gotowej drogi do własnego backendu.

Jak wprowadzić zmianę bez zgubienia poprzedniej wersji?

Edytuj źródła lokalnie, sprawdź całą stronę i utwórz nową wersję przez Create a new deployment. Wybierz podgląd, jeśli chcesz najpierw obejrzeć poprawkę. Nie zaczynaj od zmiany DNS działającej witryny. Własną domenę podłącz dopiero po sprawdzeniu wdrożenia, zgodnie z dokumentacją usługi i obecną konfiguracją domeny; nie usuwaj przy tym rekordów poczty. Sam adres domeny i skrzynki są osobnymi usługami.

Hosting HTML: 4 częste błędy po wgraniu strony

• 404 na stronie głównej: sprawdź położenie i nazwę index.html. Wgrywanie nadrzędnego katalogu zamiast jego zawartości może zmienić ścieżkę.
• Brak zdjęć lub stylów: usuń odwołania do lokalnego dysku, np. C:\projekt\zdjecie.jpg. Używaj ścieżek odpowiadających strukturze opublikowanych katalogów i zgodnej wielkości liter.
• Działa menu, ale nie formularz: sprawdź jego action albo rzeczywiste wywołanie API. HTML nie jest usługą wysyłania wiadomości. Jeśli formularz korzysta z własnego skryptu PHP, sprawdź także wymagania hostingu PHP i zaplecza aplikacji.
• Podstrona działa po kliknięciu, ale nie po odświeżeniu: ustal, czy masz osobne pliki, czy aplikację JavaScript z routingiem. Dla aplikacji potrzebne mogą być właściwe reguły obsługi ścieżek, nie kolejne kopie index.html tworzone na ślepo.

Przykład: jedna strona działa, a podstrona traci zdjęcia

Wyobraź sobie niewielkie portfolio z plikami index.html, oferta/index.html, assets/site.css i assets/portret.webp. Nazwy oraz katalogi są przykładowe. Fotograf otrzymuje całą paczkę od wykonawcy i chce ją opublikować bez zmiany wyglądu. Zaczyna od kopii tej paczki, a nie od przenoszenia pojedynczych plików w przypadkowe miejsca.

W głównym index.html zapis assets/portret.webp prowadzi do katalogu obok tego dokumentu. W zagnieżdżonym oferta/index.html ten sam zapis wskazuje już katalog oferta/assets. Jeżeli go nie ma, obraz się nie wczyta. Dla tego przykładu poprawne odwołanie z podstrony to ../assets/portret.webp. Początkowe .. oznacza wyjście o jeden poziom wyżej. To naprawa konkretnej struktury, a nie uniwersalny fragment do wklejenia do każdej witryny.

Alternatywa /assets/portret.webp zaczyna ścieżkę w korzeniu domeny. Jest wygodna, jeśli projekt zawsze zajmuje całą domenę. Może jednak przestać pasować, gdy później umieścisz go pod example.org/portfolio/. Ustal jeden model z wykonawcą. Nie mieszaj bez potrzeby pełnych adresów, ścieżek względem domeny i ścieżek względem dokumentu. Nie zmieniaj hurtowo ukośników, dopóki nie wiesz, z którego dokumentu powstaje błędne żądanie.

Rozstrzygnij problem w przeglądarce: otwórz brakujący obraz w nowej karcie albo sprawdź jego adres w narzędziach deweloperskich, w karcie sieci. Porównaj żądany adres z rzeczywistym położeniem pliku. Jeżeli nazwa jest poprawna, sprawdź jeszcze wielkość liter i rozszerzenie: Portret.webp oraz portret.webp nie powinny być używane zamiennie. Następnie popraw źródło odwołania, wdróż wersję podglądową i otwórz bezpośrednio również podstronę oferty. Nie wystarczy, że obraz wygląda dobrze na stronie głównej.

W Cloudflare Pages oferta/index.html jest udostępniany pod ścieżką /oferta/. Pojedynczy plik oferta.html może prowadzić do wariantu bez rozszerzenia. Dlatego kopiuj końcowy adres z rzeczywiście otwartej strony. Zapisz obok niego adres przykładowego obrazu i CSS; te trzy odnośniki tworzą prostą kontrolę po następnej aktualizacji. Szczególne zasady routingu aplikacji JavaScript trzeba ocenić oddzielnie od tej prostej witryny z osobnymi plikami.

Odbiór formularza: wyświetlony przycisk to dopiero początek

Przed testem wybierz skrzynkę, którą kontrolujesz, i jedną rozpoznawalną treść, na przykład „Próba formularza — portfolio”. Nie wysyłaj wielu zgłoszeń i nie używaj cudzych danych. Najpierw sprawdź, czy pusty wymagany e-mail wywołuje zrozumiały komunikat. Potem wykonaj jedną prawidłową próbę. Zapisz, czy pojawiła się informacja o wysłaniu, czy wiadomość rzeczywiście dotarła oraz gdzie trafiła odpowiedź po kliknięciu „Odpowiedz” w poczcie.

Jeżeli formularz pokazuje sukces bez odebranej wiadomości, sprawdź wynik usługi przyjmującej zgłoszenia, ustawienia odbiorcy i folder spamu. Sam status pomyślnego żądania HTTP nie jest dowodem dostarczenia do skrzynki. Jeżeli zgłoszenie odrzucono, nie usuwaj zabezpieczeń przeciw spamowi tylko po to, by komunikat zniknął. Przekaż wykonawcy czas próby i widoczny błąd, bez hasła do poczty. Do czasu naprawy podaj sprawny telefon lub inny rzeczywisty kontakt; nie zostawiaj czytelnika z przyciskiem, który jedynie udaje wysyłanie.

Formularz i poczta: dwie osobne decyzje

Nie umieszczaj hasła SMTP ani prywatnego klucza API w JavaScript — pliki otrzymuje przeglądarka użytkownika. Formularz powinien korzystać z serwera lub usługi przygotowanej do publicznego przyjmowania zgłoszeń. Sprawdź walidację, zabezpieczenie przed spamem, potwierdzenie błędu i dostarczenie wiadomości. Link mailto: może otworzyć program pocztowy odwiedzającego, ale nie gwarantuje wysyłki i nie zastępuje formularza.

Dobierz informację o przetwarzaniu danych i zakres formularza do jego rzeczywistego działania. Nie zbieraj niepotrzebnych danych. Skrzynkę we własnej domenie kup lub zachowaj niezależnie od miejsca publikacji HTML; praktyczną stronę opisuje poradnik o firmowej poczcie.

Dlaczego nie polecam każdemu firmowemu projektowi GitHub Pages?

GitHub Pages dobrze kojarzy się z dokumentacją i portfolio programistycznym, ale trzeba przeczytać zasady użycia. Oficjalna dokumentacja wyklucza wykorzystywanie usługi jako darmowego hostingu do prowadzenia biznesu online, e-commerce oraz witryn nastawionych głównie na transakcje komercyjne lub komercyjny SaaS. Nie wybieraj jej automatycznie dla sklepu, bo obsługuje HTML. Techniczna możliwość opublikowania plików nie jest zgodą na każdy rodzaj działalności.

Krótka lista odbioru strony HTML

1. Wszystkie podstrony otwierają się bezpośrednio, również po odświeżeniu.
2. Telefon nie ma poziomego przewijania, zdjęcia nie zasłaniają treści, linki są czytelne.
3. HTTPS działa pod docelowym adresem, a stara witryna nie została przypadkiem nadpisana.
4. Formularz faktycznie dostarcza zgłoszenie albo na stronie jest uczciwie podany inny kontakt.
5. Poczta działa po podłączeniu domeny.
6. Masz lokalną kopię źródeł, dostęp do konta usługi i instrukcję ponownego wdrożenia.

Kopię plików trzymaj również poza kontem publikacji. Zasady przechowywania i przywracania kopii są potrzebne także wtedy, gdy witryna nie korzysta z bazy danych.

Źródła i data weryfikacji

Dokumentacja pierwotna odczytana 30.10.2026. Scenariusz fotografa i lista odbioru są opracowaniem WebBay; instrukcja opisuje dokumentację, a nie wdrożenie wykonane na koncie czytelnika.

• Cloudflare — Direct Upload, ręczne wdrożenie i jego ograniczenia.
• Cloudflare — statyczny HTML i plik index.html.
• Cloudflare Pages — limity platformy.
• MDN — rozdzielenie przeglądarki i zaplecza serwera.
• GitHub Pages — ograniczenia i dopuszczalne użycie.
• MDN — adresy względne i bezwzględne.
• Cloudflare Pages — obsługa ścieżek dokumentów HTML.