HTML to skrót od Hyper Text Markup Language. Jest to standardowy język, którego twórcy stron internetowych używają do ich tworzenia. Jeśli chcesz stworzyć własną stronę internetową lub bloga, a może nawet chcesz tylko edytować kod HTML istniejącej strony, warto znać podstawy języka HTML. W tym wpisie dowiesz się wszystkiego, co powinieneś wiedzieć o HTML-u. END^^> Dla początkujących temat języka HTML może być przytłaczający. Istnieje tak wiele różnych znaczników i atrybutów, że można się poczuć jak w zupełnie innym języku. Jednak gdy już pozbędziesz się tej dziwnej terminologii i zaczniesz dostrzegać, jak te wszystkie elementy ze sobą współpracują, zrozumienie tego języka stanie się dużo łatwiejsze. W rzeczywistości, gdy już opanuje się ten początkowy proces nauki, z czasem i praktyką poznawanie nowych znaczników i atrybutów staje się o wiele łatwiejsze. Zaczynajmy!
Co to jest HTML?
HTML to skrót od angielskiej nazwy Hyper Text Markup Language. Jest to standardowy język, którego twórcy stron internetowych używają do ich tworzenia. Jeśli chcesz stworzyć własną stronę internetową lub blog, a może nawet po prostu edytować kod HTML istniejącej strony, warto znać podstawy języka HTML. Podsumowując, HTML to kod, który tworzy wszystkie strony internetowe. Zawartość witryny jest zapisywana w języku HTML, a następnie publikowana lub hostowana w sieci. Język HTML jest używany do tworzenia wyglądu i struktury witryny. Nie służy on do dodawania treści, takich jak tekst (do tego służy CSS). Nie służy on jednak tylko do tworzenia stron internetowych. Można go również używać do tworzenia wiadomości e-mail, dokumentów, a nawet prezentacji. Możliwości są nieograniczone. Jedyną rzeczą, o której należy pamiętać, jest to, że wszystkie strony internetowe i dokumenty będą tworzone w jakiejś formie kodu HTML.
Struktura HTML
Podstawowa struktura dokumentu HTML jest następująca: – html> – head> – title> – body> – /body> – /html>. Przeanalizujmy każdy z tych elementów i sposób ich działania: – html> – Element html> jest najbardziej zewnętrznym elementem dokumentu HTML. Wszystkie inne elementy są zagnieżdżone w tym elemencie. – head> – element head> zawiera metadane i właściwości dokumentu, takie jak tytuł dokumentu, autor i data publikacji. – title> – element title> zawiera tytuł dokumentu, który będzie wyświetlany na karcie przeglądarki i w menu zakładek. – body> – element body> zawiera zawartość dokumentu, taką jak akapity tekstu, obrazy, łącza i wideo. – /body> – Element ten oznacza koniec treści dokumentu i początek stopki dokumentu. – /html> – oznacza koniec dokumentu HTML.
Znaczniki HTML
Każda część dokumentu (np. head, body, title) jest oddzielona znacznikami. Znacznik jest jak wskazówka dla przeglądarki, jaki rodzaj zawartości jest w nim zawarty. To właśnie te znaczniki informują przeglądarkę, co powinna zrobić z określonym fragmentem kodu. Jeśli na przykład chcesz dodać zdjęcie do swojej witryny, musisz umieścić znacznik img> w sekcji body> dokumentu. Oto przykład: Jak widać, znacznik img> jest ujęty w nawiasy otwierające i zamykające. Pomiędzy znacznikami body> można dodać dowolną liczbę elementów.
Tekst HTML
Znacznik p> służy do dodawania nowego akapitu tekstu do strony internetowej. Przyjrzyjmy się kodowi i przeanalizujmy go po kolei: Jak widać, znacznik p> jest używany do oznaczenia nowego akapitu. Zawartość akapitu to tekst znajdujący się między znacznikami p> /p>. Istnieje wiele innych znaczników HTML, których można używać do formatowania treści. Niektóre z tych znaczników to: – h1> – służy do dodawania Nagłówka 1 do witryny. – h2> – służy do dodawania nagłówka 2 do witryny. – h3> – ten element służy do dodawania nagłówka 3 do witryny internetowej. – h4> – ten element służy do dodawania Nagłówka 4 do witryny internetowej. – h5> – ten element służy do dodawania nagłówka 5 do witryny internetowej. – h6> – ten element służy do dodawania nagłówka 6 do witryny internetowej. – ul> – służy do tworzenia listy wypunktowanej na stronie internetowej. – ol> – służy do tworzenia listy numerowanej w witrynie internetowej.
Łącza HTML
Znacznik a> służy do dodawania odnośnika do witryny. Możesz użyć tego znacznika, aby połączyć się z inną witryną lub inną stroną w tej samej witrynie. Przyjrzyjmy się kodowi i przeanalizujmy go po kolei: Jak widać, znacznik a> jest używany do oznaczania sekcji zawierającej łącze. Tekst wewnątrz znacznika a> będzie klikalnym łączem, natomiast tekst poza znacznikiem a> będzie wyświetlany jako tekst klikalnego łącza.
Znaczniki wyświetlania HTML
Znacznik br> służy do dodawania do strony przerw w linii. Przyjrzyjmy się kodowi i rozbijmy go po kolei na poszczególne elementy: Jak widać, znacznik br> jest używany do oznaczenia sekcji zawierającej przerwę. Podział zostanie wyświetlony dopiero po ostatnim elemencie sekcji body>, dlatego warto pamiętać, że znacznik podziału powinien znajdować się na końcu strony. Znacznik hr> jest używany do tworzenia poziomej reguły między sekcjami witryny. Przyjrzyjmy się kodowi i przeanalizujmy go po kolei: Jak widać, znacznik hr> jest używany do zaznaczenia miejsca, w którym reguła powinna zostać wstawiona w sekcji body>. Można również użyć znacznika hr> do utworzenia reguły o określonej szerokości poprzez dodanie atrybutu width. Atrybut width przyjmuje wartość w pikselach, na przykład hr width=50>.
Słowa podsumowujące
HTML jest łatwym do nauczenia się językiem znaczników używanym do tworzenia stron internetowych i innych treści w sieci. Jest to język programowania, który umożliwia tworzenie stron internetowych od podstaw, z podstawową konstrukcją. Istnieją jednak gotowe szablony, które można łatwo dostosować do własnych potrzeb i tworzyć profesjonalne witryny przy minimalnym wysiłku. Istnieje wiele różnych elementów, które współpracują ze sobą w celu utworzenia witryny. Aby zacząć, wystarczy wiedzieć tylko kilka rzeczy: Istnieje wiele samouczków i lekcji online, które mogą pomóc w nauce kodowania HTML. Kiedy już opanujesz podstawy, przekonasz się, że jest to język bardzo łatwy do opanowania. Może to być świetna umiejętność, zwłaszcza jeśli chcesz założyć własny blog lub stronę internetową.