Podgląd HTML online
Kod i podgląd strony na jednym ekranie
Publikacja bez zapisywania pliku
1. Kod do karty HTML
Skopiuj znaczniki z edytora kodu albo z czatu z AI do karty HTML, zastępując przykładową stronę. Gdy podgląd wygląda dobrze, Publish przenosi kod do nowej karty tiiny.host.
2. Wybierz adres
Kod dociera tam jako spakowany plik, więc zostaje tylko nazwa, np. spotkanie-zespolu dla adresu spotkanie-zespolu.tiiny.site.
3. Strona pod linkiem
Przy pierwszej publikacji tiiny.host prosi o potwierdzenie adresu e-mail. Gotowy link otworzy każdy, komu go wyślesz.
Zobacz, jak opublikować stronę z HTML i CSS
Narzędzia pod ręką
👁️ Podgląd na żywo
Każde naciśnięcie klawisza przerysowuje stronę, a nad nią widać tekst z twojego znacznika title.
📖 Eksport czytelny jak strona
Newsletter z narzędzia do mailingu albo fragment skopiowany z CMS-a trudno czytać jako znaczniki. W podglądzie widać gotowy układ.
⚙️ JavaScript i CSS działają
Skrypty uruchamiają się w podglądzie, więc menu rozwijane albo przycisk z obsługą kliknięcia zachowują się jak na opublikowanej stronie.
🛠️ Błędy na liście
Błąd w HTML-u zamienia podgląd w listę problemów z numerami linii. Po poprawkach strona wraca.
📱 Także na telefonie
Na wąskim ekranie karty z kodem zwijają się w listę rozwijaną, a wynik przesuwa się pod edytor.
📋 Kopiowanie jednym kliknięciem
Jeden przycisk zabiera kod z otwartej karty, gotowy do wklejenia z powrotem do projektu.
📂 Zapisany plik bez edytora
Gotowy plik .html nie musi przechodzić przez edytor. Pole przesyłania na tiiny.host opublikuje go od razu po wpisaniu nazwy.
🧩 Kod do osadzenia
Opcja Embed this link w menu projektu daje kod, którym wstawisz stronę do poradnika albo artykułu w bazie wiedzy, od planu Tiny.
🔒 Hasło do strony
W planie Solo strona może poprosić o hasło, zanim cokolwiek się wczyta.
Na tle CodePena i edytorów kodu
Górna część tabeli porównuje sam podgląd, dolna to, co dzieje się ze stroną po publikacji.
Gratis, razem z jedną publikacją
Z podglądu korzystasz bez ograniczeń, a darmowe konto opublikuje też jedną stronę albo witrynę.
- ✓ Podgląd bez limitu na tej stronie
- ✓ 1 opublikowana strona lub witryna
- ✓ Pliki do 3 MB
- ✓ 5000 odwiedzin i 5 GB transferu miesięcznie
- ✓ Darmowy adres twojanazwa.tiiny.site
- – Z małym banerem Tiiny Host
- Tiny 5 € · bez banera, pliki do 25 MB, kody QR, statystyki
- Solo 13 € · 5 stron, własna domena, hasło, edytor kodu i edytor wizualny, API
- Pro 31 € · 15 stron, zbieranie adresów e-mail, członkowie zespołu, wsparcie w pierwszej kolejności
- Pro Max 74 € · strony bez limitu, 2 TB na duże multimedia
Ile zmieści każdy plan
Na projekt albo na całe kontoFragmenty kodu i pojedyncze strony ważą niewiele w porównaniu ze zdjęciami i wideo, które niesie pełna witryna.
Link do strony z HTML-a wygenerowanego w kodzie
Czaty i agenci AI do programowania co chwila oddają HTML. Endpoint przesyłania zamienia taki plik w publiczny adres URL, a późniejsze wywołanie PUT na ten sam adres podmienia stronę.
curl -X POST https://ext.tiiny.host/v1/upload \
-H "x-api-key: $TIINY_API_KEY" \
-F "files=@podglad.html" \
-F "domain=podglad-strony.tiiny.site"
# → https://podglad-strony.tiiny.site
# PUT na ten sam adres podmienia plikCodzienne zastosowania
Układ od projektanta
Layout z kursu albo z przekazania od projektanta widać zaraz po wklejeniu kodu.
Prototypy do pokazania
Wstępny prototyp trafia do zespołu jako link na długo przed właściwą wersją.
Osadzone elementy
Odtwarzacz z YouTube albo widżet rezerwacji wklejony w stronę pokazuje, jak jego iframe mieści się w układzie.
Newslettery
Programy pocztowe wyświetlają HTML inaczej niż przeglądarki, dlatego kod newslettera dobrze jest obejrzeć przed wysyłką testową.
Szablony z archiwum ZIP
Szablony stron przychodzą zwykle spakowane. Szablon wgrany do Tiiny Host działa w sieci, więc przejrzysz każdą podstronę, zanim zaczniesz go zmieniać.
Lekcja informatyki
Nauczyciel pokazuje klasie działające przykłady, a uczniowie zmieniają kod i patrzą, co się psuje.
HTML Viewer: View, Fix, Host, and Share Your Web Pages
Do czego przydaje się podgląd HTML, dziesięć sytuacji, w których się sprawdza, i publikacja gotowej strony.
HTML Tester: Make Sure Your HTML Code Works Everywhere
Jak działa tester HTML i osiem wskazówek, dzięki którym kod przejdzie walidację W3C.
How to Upload HTML File to a Website
Publikacja pliku HTML bez edytora kodu i strona zamknięta hasłem.
