Twoje Centrum Szkoleniowe

Nauczmy się dziś czegoś nowego!

Kurs tworzenia stron - HTML + CSS

Czym jest strona internetowa i jak działa?

W dzisiejszym świecie trudno wyobrazić sobie życie bez internetu. Strony internetowe są nieodłączną częścią naszego codziennego funkcjonowania – korzystamy z nich w celach edukacyjnych, rozrywkowych, biznesowych i wielu innych. Ale czy kiedykolwiek zastanawiałeś się, czym dokładnie jest strona internetowa i jak to się dzieje, że możesz ją zobaczyć na ekranie swojego komputera czy smartfona? W tej lekcji zgłębimy tajemnice działania stron WWW, abyś mógł zrozumieć podstawy ich funkcjonowania i przygotować się do tworzenia własnych witryn.

 

Co to jest strona internetowa?

Strona internetowa to zbiór dokumentów i zasobów dostępnych w sieci internetowej, które są powiązane ze sobą za pomocą hiperłączy (linków) i identyfikowane przez unikatowy adres URL. Strony te są tworzone przy użyciu języków znaczników, takich jak HTML (HyperText Markup Language), oraz stylowane za pomocą CSS (Cascading Style Sheets).

Ciekawostka

Termin "strona internetowa" pochodzi od angielskiego "web page", gdzie "web" oznacza "sieć". To odniesienie do sieci pajęczej jest nieprzypadkowe – internet jest jak ogromna sieć połączonych ze sobą stron i zasobów.

 

Podstawowe pojęcia

1. Adres URL

Uniform Resource Locator (URL) to unikatowy adres, który pozwala zidentyfikować i odnaleźć konkretną stronę lub zasób w internecie. Przykładowy URL wygląda następująco:

https://egzaminator.pl/o-nas

2. Domena

Domena to przyjazna dla użytkownika nazwa, która zastępuje trudne do zapamiętania adresy IP serwerów. Dzięki domenom możemy łatwo zapamiętać adresy stron, np. www.wikipedia.org.

3. Serwer

Serwer to komputer lub system, który przechowuje strony internetowe i udostępnia je użytkownikom internetu. Kiedy wpisujesz adres strony w przeglądarce, wysyłasz zapytanie do serwera o przesłanie zawartości strony.

4. Przeglądarka internetowa

Przeglądarka to aplikacja, która interpretuje kod strony (HTML, CSS, JavaScript) i wyświetla go w formie zrozumiałej dla użytkownika. Popularne przeglądarki to Google Chrome, Mozilla Firefox, Safari czy Microsoft Edge.

 

Jak działa strona internetowa? Krok po kroku

    1. Wprowadzenie adresu URL

      Użytkownik wpisuje adres URL w pasku adresu przeglądarki lub klika na link prowadzący do strony.

    2. Zapytanie DNS

      Przeglądarka potrzebuje przetłumaczyć nazwę domeny na adres IP serwera. W tym celu wysyła zapytanie do serwera DNS (Domain Name System).

    3. Nawiązanie połączenia z serwerem

      Po uzyskaniu adresu IP, przeglądarka nawiązuje połączenie z serwerem za pomocą protokołu HTTP lub HTTPS.

    4. Wysłanie żądania HTTP

      Przeglądarka wysyła żądanie do serwera o przesłanie konkretnego zasobu (np. strony głównej index.html).

    5. Odpowiedź serwera

      Serwer przetwarza żądanie i przesyła odpowiedź, która zawiera kod HTML strony, a często także pliki CSS, JavaScript i inne zasoby (obrazy, czcionki).

    6. Renderowanie strony

      Przeglądarka otrzymuje odpowiedź i zaczyna interpretować kod HTML oraz dołączone pliki CSS i JavaScript. Na tej podstawie buduje strukturę strony i wyświetla ją użytkownikowi.

    7. Interakcja użytkownika

      Użytkownik może teraz przeglądać stronę, klikać na linki, wypełniać formularze itp. Każda interakcja może generować kolejne żądania do serwera lub być obsługiwana lokalnie przez przeglądarkę.

 

Protokół HTTP i HTTPS

HTTP (HyperText Transfer Protocol)

Jest to podstawowy protokół komunikacyjny używany do przesyłania dokumentów hipertekstowych w sieci WWW. Umożliwia wymianę informacji między klientem (przeglądarką) a serwerem.

HTTPS (HTTP Secure)

To rozszerzenie protokołu HTTP o warstwę bezpieczeństwa (SSL/TLS), która zapewnia szyfrowanie przesyłanych danych. Dzięki temu komunikacja między przeglądarką a serwerem jest zabezpieczona przed podsłuchiwaniem i modyfikacją.

Ciekawostka: Strony korzystające z HTTPS są oznaczane w przeglądarce jako "bezpieczne", często z ikoną kłódki obok adresu URL.

 

Budowa strony internetowej

HTML – struktura strony

HTML (HyperText Markup Language) to język znaczników, który definiuje strukturę i treść strony internetowej. Za jego pomocą określamy, jakie elementy pojawią się na stronie – nagłówki, akapity, obrazy, linki itd.

CSS – stylizacja strony

CSS (Cascading Style Sheets) to język arkuszy stylów, który pozwala na kontrolowanie wyglądu elementów HTML. Dzięki CSS możemy zmieniać kolory, czcionki, układ i wiele innych aspektów wizualnych strony.

JavaScript – interaktywność

Choć nasz kurs skupia się na HTML i CSS, warto wspomnieć o JavaScript – języku skryptowym, który dodaje stronie interaktywności. Dzięki niemu możemy reagować na działania użytkownika, manipulować elementami strony w czasie rzeczywistym i tworzyć dynamiczne efekty.

 

Serwer i hosting

Aby strona internetowa była dostępna dla użytkowników na całym świecie, musi być umieszczona na serwerze, który jest stale podłączony do internetu. Usługa udostępniania przestrzeni na serwerze nazywa się hostingiem.

Rodzaje hostingu

    • Hosting współdzielony: Wiele stron korzysta z zasobów jednego serwera. Jest to ekonomiczne rozwiązanie dla mniejszych witryn.
    • VPS (Virtual Private Server): Wirtualny serwer z dedykowanymi zasobami.
    • Serwer dedykowany: Cały serwer jest do dyspozycji jednego klienta.
    • Hosting w chmurze: Elastyczne zasoby serwerowe dostosowujące się do obciążenia strony.

 

Domeny i DNS

Rejestracja domeny

Aby strona była łatwo dostępna, potrzebuje nazwy domeny, np. www.mojastrona.pl. Domeny rejestruje się u akredytowanych registrarów, a ich nazwy są unikatowe.

System DNS

DNS (Domain Name System) to "książka telefoniczna" internetu. Przetwarza nazwy domen na adresy IP serwerów, umożliwiając przeglądarce odnalezienie właściwej strony.

 

Podsumowanie

Strona internetowa to połączenie różnych technologii i systemów, które współpracują, aby dostarczyć użytkownikowi treści w czytelnej i interaktywnej formie. Zrozumienie, jak działa ta komunikacja między przeglądarką a serwerem, jest kluczowe dla każdego, kto chce tworzyć własne strony WWW.

W kolejnych lekcjach zagłębimy się w szczegóły języków HTML i CSS, które pozwolą Ci samodzielnie tworzyć struktury i stylizować strony internetowe.

 

Zadanie do przemyślenia

Spróbuj wyobrazić sobie drogę, jaką przebywa żądanie o wyświetlenie strony od momentu wpisania adresu URL do wyświetlenia strony na ekranie. Jakie elementy infrastruktury są w to zaangażowane i jakie procesy zachodzą po drodze?

 

Ciekawostka na zakończenie

Pierwsza strona internetowa została opublikowana 6 sierpnia 1991 roku przez sir Tima Bernersa-Lee, twórcę World Wide Web. Strona ta była hostowana na komputerze NeXT i zawierała informacje o projekcie WWW. Co interesujące, kopia tej strony jest nadal dostępna online pod adresem:

http://info.cern.ch/hypertext/WWW/TheProject.html
 

Testy przypięte do lekcji
Aby uzyskać dostęp do testów i ćwiczeń interaktywnych - Zaloguj się
Aby widzieć ocenę lekcji - Zaloguj się