Wprowadzenie
Czym jest HTML
Witaj w kursie HTML.
HTML, czyliHyperText Markup Language, jest to hipertekstowy język znaczników, używany do tworzenia stron internetowych. Warto wiedzieć, że nie jest to język programowania lecz język prezentacji. HTML pozwala nam publikować w internecie dokumenty, czyli strony internetowe, zawierające elementy takie jak nagłówki, teksty, tabele, listy, obrazki itd. Jest on używany przede wszystkim do opisu struktury i zawartości strony internetowej, do określenia jej dokładnego wyglądu używamyCSS, a do oprogramowania dodatkowych interakcji z użytkownikiem, języku programowaniaJavaScript.
Prototyp standardu HTML został opracowany na początku lat 80 przez Tima Berners-Lee, pracującego dla ośrodka naukowo-badawczego CERN. Co ciekawe pierwsza strona internetowa jest ciągle dostępna, możesz ją zobaczyć pod adresemhttp://info.cern.ch/hypertext/WWW/TheProject.html. Możemy bez wątpienia powiedzieć, że od tego czasu HTML przeszedł wiele zmian i zrobił oszałamiającą karierę. Aktualnie na świecie jest ponad 1,1 miliarda stron internetowych, a każda z nich korzysta z HTML.
Czy warto uczyć się HTML?
Wiele osób widząc powyższe pytanie może stwierdzić, że jest to pytanie retoryczne. Według mnie jeśli chcesz stworzyć swoją własną stronę internetową, to po prostu powinieneś znać HTML.
Oczywiście możesz również stworzyć stronę korzystając z gotowych narzędzi, takich jak chociażby systemy CMS, czyli systemy zarządzania treścią. Najpopularnieszymi z nich są WordPress oraz Joomla. Korzystając z tego typu narzędzi możesz również stworzyć stronę internetową, jednak w takim przypadku musisz pamiętać, że osiągniesz tylko to, na co pozwala dany system. Nie jest to przeszkodą, gdy tworzysz tylko tak zwaną stronę wizytówkę wyświetlającą dane kontaktowe. Jednak gdy masz ambitniejszy plan, jak na przykład stworzenie drugiego facebooka, to znajomość HTML jest absolutnie niezbędna. Nawet jeśli będziesz chciał korzystać tylko z systemów CMS, to znajomość HTML i tak okaże się przydatna.
Co będzie potrzebne do pracy?
Podczas korzystania z tego kursu wystarczy po prostu przeglądarka internetowa. Przygotowaliśmy dla Ciebie przykłady kodu, które możesz uruchomić oraz interaktywne zadania.
Każdy z przykładów oraz zawartość każdego zadania możesz również uruchomić bezpośrednio na swoim komputerze. Aby to zrobić wystarczy przeglądarka internetowa oraz edytor tekstu, może być nawet Notatnik. Polecam jednak, zamiast notatnika, darmowy programSublimeText. Jest to rozbudowany edytor tekstu, bardzo ułatwiający pracę dzięki między innymi kolorowaniu składni, zamykaniu znaczników czy podpowiadaniu nazw tagów. Jest on dostępny na systemy Windows, Linux oraz macOS.
Strona Sublime Text 3:https://www.sublimetext.com/3.
Gdy już będziesz miał edytor, przekopiuj kod do nowego pliku, który możesz nazwać dowolnie pod warunkiem, że nadasz mu rozszerzenie.html. Taki plik możesz następnie otworzyć w dowolnej przeglądarce i natychmiast zobaczysz efekty pracy.
Pierwsze spotkanie z kodem HTML
Poniżej znajduje się jeden z najprostszych przykładów, jaki możemy napisać w HTML. Jest to strona wyświetlającą nagłówek “Mój pierwszy nagłówek” oraz paragraf, lub inaczej mówiąc akapit, “Mój pierwszy paragraf”.
Tym razem nie będziemy zajmować się analizą poniższego kodu. Przyjrzymy mu się już w kolejnej lekcji. Zachęcam Cię jednak do samodzielnej próby analizy kodu. Oczywiście korzystając z naszego edytora możesz również wprowadzić zmiany w przykładzie i od razu zobaczyć ich efekt.
| 1 2 3 4 5 6 7 8 91011 | <!DOCTYPE html><html><head><metacharset="UTF-8"><title>Tytuł strony</title></head><body><h1>Mój pierwszy nagłówek</h1><p>Mój pierwszy paragraf.</p></body></html> |
|---|---|
Zadanie 1
Otwórz zadanie i kliknij “Uruchom i sprawdź”. Tym razem nie musisz niczego sam pisać.
Podsumowanie
W tej lekcji zajęliśmy się ogólnym wprowadzeniem do kursu. Dowiedziałeś się czym jest HTML oraz poznałeś najważniejsze fakty z jego historii. Następnie omówiliśmy to, czy w ogóle warto uczyć się HTML. Miałeś również okazję dowiedzieć się jak uruchomić kod HTML na własnym komputerze. Na końcu tej lekcji mogłeś wyświetlić swój pierwszy kod HTML i zobaczyć pierwszą, bardzo prostą stronę stworzoną w tym kursie. Już niebawem dokładnie omówimy wszystkie elementy znajdujące się w tym przykładzie.