Historia powstania i rozwoju HTML. Podstawy języka HTML Co to jest język HTML?

W tym artykule przyjrzymy się pytaniu, czym jest HTML i przyjrzymy się historii jego rozwoju. Porozmawiajmy o tym jak stworzyć stronę internetową i czy jest to w ogóle trudne. Zacznijmy więc

HTML (hyper tekstowy język znaczników) to specjalny język znaczników używany do tworzenia stron internetowych w Internecie.

Przeglądarki doskonale rozumieją HTML i potrafią go interpretować w zrozumiały sposób. Ogólnie rzecz biorąc, każda strona witryny jest kodem HTML, który przeglądarka tłumaczy na przyjazną dla użytkownika formę. Nawiasem mówiąc, kod dowolnej strony jest dostępny dla każdego. Aby go wyświetlić, kliknij prawym przyciskiem myszy i wybierz wyświetl kod źródłowy lub naciśnij CTRL+U na klawiaturze:

Język znaczników HTML zyskał dużą popularność. W tej chwili jest to jedyny język, w którym tworzone są znaczniki witryny. Chcę podkreślić fakt, że jest to znacznik. W innym języku programowania (najczęściej php) tworzony jest tzw. „silnik”, który umożliwia tworzenie interaktywnych stron (html na to nie pozwala).

Uważny czytelnik zauważy, że nie wszystkie strony w Internecie mają na końcu rozszerzenie .html. Istnieją na przykład strony /katalog/lista (w ogóle bez rozszerzenia). Jest to nieprawidłowe, ale przeglądarka będzie w stanie zrozumieć, że jest to dokument internetowy i wyświetlić go poprawnie.

Poniżej znajduje się przykład ze strukturą typowej strony HTML. Należy pamiętać, że kod HTML jest podzielony na dwa obszary: nagłówek i treść strony.

Kod ten można edytować w dowolnym edytorze tekstu. Najczęściej do tworzenia strony internetowej html wykorzystywany jest notatnik++ (zaawansowany edytor podświetlający tagi i pokazujący błędy). Ale do pracy ze znacznikami HTML lepiej jest używać bardziej zaawansowanych edytorów.

Znacznik składa się ze znaczników HTML (czasami zapisywanych jako „tag”).

Znacznik HTML jest jednym z elementów układu HTML potrzebnym do utworzenia struktury. Tagi mają znak otwierający< и закрывающий > .

Na przykład, . Prawie każdy tag jest sparowany i wymaga tagu zamykającego. Jeśli webmaster zapomni umieścić tag zamykający lub zrobi to niepoprawnie, układ nie będzie prawidłowy (patrz sprawdzanie poprawności witryny). Jeśli ten tag utrzymuje „ramkę” witryny, wówczas witryna może „unosić się” (boczna kolumna przesunie się w dół itp.).

Zabrania się zamykania tagów w innej kolejności, w jakiej zostały otwarte. Na przykład

Przeczytaj artykuł, aby uzyskać więcej informacji na temat tworzenia strony HTML.

Chyba zacznę od początku...

Język HTML nie jest z natury językiem programowania. Jest to język znaczników dla dokumentów hipertekstowych. Inaczej mówiąc, odpowiada za uporządkowanie w dokumencie Twoich tekstów, rysunków, tabel... przeznaczonych do życia w Internecie. Nie da się go zmusić do obliczenia, ile dwa razy dwa równa się dwa, nie ma w tym żadnych funkcji logicznych, ale pięknie i co najważniejsze łatwo jest zamieścić informację, że dwa razy dwa równa się cztery - to proste. Język ten odczytuje się za pomocą znanych Ci programów, zwanych przeglądarkami (przeglądarkami), które „znają” standardowe polecenia języka HTML i „przeżuwając” je, wyświetlają dokumenty na monitorze komputera w takiej formie, w jakiej webmaster – czyli kompilator dokumentów - chce je zaprezentować.

Teraz o poleceniach - nazywane są deskryptorami, ale częściej - tagami.

Wróćmy do naszej pierwszej strony... więc napisaliśmy:

Moja pierwsza strona


Witaj świecie!!!

A więc tak jest napisane pomiędzy - nazywają się one tagami; nie są one widoczne dla czytelnika przeglądającego Twoją stronę, ale są wyraźnie widoczne dla przeglądarki, która natknąwszy się na tag, rozumie to jako sygnał, że tam będzie. być dokumentem, który należy przeczytać i wyświetlić na monitorze w wymaganej formie.. ale tag mówi, że dokument się skończył i nic więcej od niego nie jest wymagane, czyli przeglądarka, i może spać z czystym sumieniem .

Co więc napisaliśmy? i jak przeglądarka to odczytuje?

Przeglądarka:

Tak mniej więcej wygląda czytanie naszej strony.. Jak widać przeglądarka jest typem dość kapryśnym, więc musi wydawać jasne i precyzyjne polecenia, inaczej będzie przeklinać.. i to na głos.. dlatego pamiętajmy o następujących kwestiach rzeczy:

1) Trzeba raz na zawsze pamiętać, że jeśli jest tag otwierający, musi być też tag zamykający

Chociaż są wyjątki, takie jak nasz tag
- nie wymaga domknięcia, gdyż mówi jedynie, że należy go zapisać w nowej linii. Nawiasem mówiąc, spróbuj dodać jeszcze kilka takich samych przed wierszem „Nazywam się…”, a zobaczysz, że w rezultacie zauważalnie się obniżył.. (No cóż, oczywiście zapisz zmiany w notatniku i kliknij przycisk „odśwież” w przeglądarce)

2) Wszystkie dokumenty muszą mieć następujący szablon kodu:

Te tagi są wymagane! Należy je zawsze zapisywać dla każdej nowej strony i tylko w tej kolejności! Nie próbuj wywracać wszystkiego do góry nogami...

3) O zamówieniu:

Tag otwierający i zamykający to swego rodzaju pojemnik, pudełko, w którym można przechowywać inne tagi - mniejsze pudełka... zatem zgodnie z logiką dokument powinien wyglądać tak:

Jeśli napiszesz na przykład tak:

treść

Okaże się, że to śmieci, które nie mieszczą się w głowie, „duży” jest już zamknięty, a „mały” z niego „wystaje”, który jest zamknięty w „środku”, a „ content” rozprzestrzenił się wszędzie.. Nawet osobie trudno jest sobie wyobrazić, co tam jest mówiącego o przeglądarce.. Jasno ustrukturyzuj kod swojej strony, w przeciwnym razie nic nie będzie działać..

Cóż, nauczyliśmy się pisać prosty tekst, udało się! w następnym rozdziale opowiem co można z tym zrobić..

Pisząc stronę internetową utwórz folder w dowolnym dogodnym miejscu na dysku twardym, nazwij go jak chcesz, pod warunkiem, że jest to jasne... zapisuj swoje strony w tym folderze, nadając im znaczące nazwy... opcje typu aaa. html, 123.html doprowadzi do zamieszania i zamętu... Na tym etapie ta rada nie będzie wydawać się praktyczna, ale w przyszłości znacznie ułatwi Ci pracę. Wyobraź sobie na przykład co najmniej 20-30 takich plików, których nazwy musisz zapamiętać, aby móc je powiązać. Zamów najpierw!

Pisząc kod radzę trzymać się „dobrego stylu pisania”, czyli pisać tagi w sposób „drabinkowy”, gdyż jeden tag jest zagnieżdżony w drugim. Z biegiem czasu zrozumiesz, że czytanie kodu napisanego w ten sposób:



Moja pierwsza strona


Witaj świecie!!!

Nazywam się Carlson, to jest moja pierwsza strona!



O wiele łatwiej niż to:



Moja pierwsza strona


Witaj świecie!!!

Nazywam się Carlson, to jest moja pierwsza strona!



A nawet więcej niż to:

Moja pierwsza stronaWitaj, świecie!!!
Nazywam się Carlson, to jest moja pierwsza strona!

Choć jest to kwestia przyzwyczajenia... to i tak lepiej przyzwyczaić się do pisania „czytelnie”.

Wraz z pojawieniem się sieci komputerowych, a zwłaszcza sieci WWW, pojawiła się potrzeba przesyłania informacji na różne platformy. W końcu konieczne jest, aby wszystkie elementy dokumentu wyświetlały się identycznie na wszystkich komputerach, niezależnie od używanego systemu. Służy do tego specjalny język – HTML. Pierwsze użycie tego języka opisu strony było używane do wyświetlania informacji naukowych w Europejskim Centrum Badań Jądrowych (Genewa) i umożliwiało wyświetlanie informacji dla wszystkich komputerów w sieci lokalnej. Obecnie HTML stanowi integralną część większości programów, a przede wszystkim służy do wyświetlania stron internetowych. W rzeczywistości każdy użytkownik sieci globalnej korzysta z HTML podczas odwiedzania dowolnej witryny internetowej. Wszystkie informacje, które użytkownik może zobaczyć w oknie przeglądarki, opisane są poprzez HTML, a same przeglądarki są wyspecjalizowanymi programami do pracy z językiem HTML.

HTML nie można w pełni nazwać językiem programowania, chociaż wiele funkcji pozwala na tworzenie prostych aplikacji bezpośrednio w kodzie. Do opisu właściwości elementów stosuje się deskryptory (znaczniki), za pomocą których określa się wielkość, położenie i specjalne właściwości elementów, a także łącza do innych elementów samego tekstu lub innych dokumentów. Cały kompleks kodu nazywa się hipertekstem, a skrót oznacza HTML Hipertekstowy język znaczników, co w tłumaczeniu „wielki i potężny” oznacza „hipertekstowy język znaczników”.

Rozwój specjalny HTML otrzymał wraz z rozwojem WWW (World Wide Web), gdyż powstał on jako język uniwersalny dla wszystkich urządzeń, niezależnie od posiadanego przez nie sprzętu. Użycie języka umożliwia strukturalne przedstawienie informacji i upraszcza jej odbiór. W porównaniu z drukami odpowiadałoby to kolumnom i stronom gazety. Nagłówki, położenie obrazów, tabel - wszystko to jest niezbędne do prezentacji strukturalnej, ponieważ ciągły ciąg tekstu jest bardzo trudny do odczytania.

Pierwsze wersje HTML były fragmentaryczne i nie miały pewnej jedności. W rezultacie konieczne było opracowanie pewnego jednolitego standardu. Dokonano tego w 1995 roku, a standard został sformalizowany jako oficjalna wersja HTML 2.0. Po 2 latach (w 1997 r.) dodano do niego pewne funkcje. Nowy format nazwano HTML 3.0 i został zaproponowany przez W3C ( Konsorcjum w sieci WWW). Teoretycznie zawierał wszystkie funkcje wersji 2.0, ale w tamtych czasach możliwości przeglądarki były bardzo ograniczone, więc nie udało się osiągnąć pełnej kompatybilności. Pod koniec 1997 roku, po przetestowaniu wersji 3.2 języka, przyjęto nowy standard 4.0. Wyeliminowano stare deskryptory i wprowadzono nowe, w szczególności zastosowanie kaskadowych arkuszy stylów (CSS).

Większość nowoczesnych programów do układania stron, takich jak Dreamweaver i Microsoft SharePoint Designer, automatycznie tworzy podstawową strukturę dokumentów, jednak aby samodzielnie ją poprawnie odczytać i utworzyć, należy zapoznać się z prostymi regułami.

Oznaczanie dokumentów odbywa się za pomocą znaczników, zwykle parami (otwieranie i zamykanie). Tagi ujęte są w nawiasy ostre i nie są pokazywane użytkownikowi, jednak ściśle przylegają do układu strony.

Dokument HTML zaczyna się i kończy znacznikami formatu dokumentu.

Oto kod strony

Znacznik dokumentu może być poprzedzony standardem, według którego będzie wyświetlana treść (znacznik DOCTYPE).

W dokumencie znajduje się tytuł, który jest czytany przez przeglądarkę, ale nie wyświetlany w oknie, oraz treść strony, którą faktycznie widzi użytkownik.

Nagłówek jest definiowany przez znaczniki i i zawiera dane przeznaczone do formatowania dokumentu. Nagłówek zawiera także załadowane skrypty wymagane do wyświetlenia danych. W tagach< title>i zapisywany jest tytuł strony, który jest wyświetlany w tytule okna lub zakładki.

Główny kod strony jest reprezentowany za pomocą tagów i. Wszystko, co jest między nimi napisane, zostanie wyświetlone na ekranie, z wyjątkiem elementów, dla których określono specjalne wartości, oraz samych znaczników do formatowania dokumentu.

Strukturę dokumentu HTML można przedstawić w następujący sposób.

< title>Tytuł strony (odzwierciedlony w oknie!)

Tytuł dokumentu. Nie pojawia się na ekranie

Treść dokumentu. Wyświetlane na ekranie

Podstawy HTML dla początkujących, co powinien teraz wiedzieć każdy początkujący webmaster lub bloger. Jeśli chcesz nauczyć się tworzyć podstawowe strony internetowe, rozumieć sam kod, wiedzieć, co się za czym kryje i co powinno się znaleźć, to po prostu nie da się tego zrobić bez znajomości podstaw języka HTML. Na swoim blogu będę miał cały łańcuch artykułów, które poświęcę temu tematowi od A do Z, opiszę każdy tag występujący w dokumencie, co on oznacza i jak go poprawnie używać.

Jeśli nie znasz najbardziej podstawowych rzeczy, twoja droga jest zamknięta. Wierzę, że każda osoba decydująca się na rozwój i tworzenie stron internetowych powinna znać i rozumieć podstawy, z czego składa się sama witryna, jak działa i co dzieje się w samym kodzie.

Oczywiście istnieje wiele języków programowania, wszystkie są na swój sposób skomplikowane, ale są takie, które koniecznie musisz znać. Jeśli chcesz pięknie zaprojektować list do wysłania pocztą, masz własną grupę VKontakte, grupę w innych sieciach społecznościowych, ten sam kanał YouTube, musisz majstrować przy kodzie w dowolnym silniku witryny, po prostu potrzebujesz poznać podstawowe pojęcia.

Podałem tylko kilka przykładów, tak naprawdę obecnie wiedza ta jest coraz częściej wykorzystywana w Internecie. Jestem bardziej praktykiem niż teoretykiem, dlatego w moich artykułach w tym dziale pokażę Wam krok po kroku moje przykłady tego, jak i co zrobiłem. Będę publikować zarówno przykładowe strony, jak i całe witryny.

Dokument HTML to najprostszy dokument tekstowy, język tagowania, z którym spotykasz się codziennie w Internecie. Tagi opisują strukturę dokumentu. Tagi są sformatowane jako kątowe< >nawiasach, wewnątrz których zapisana jest nazwa tagu. Przeglądarka sprawdza strukturę dokumentu, buduje go i wyświetla zgodnie z instrukcjami na Twoim monitorze, jeśli oczywiście wszystko zrobiłeś poprawnie.

Cały proces rozpoczyna się, zanim jeszcze zobaczysz gotowy obraz. Przeglądarki przetwarzają dokument sekwencyjnie, od początku do końca. Zawiera wszystko co powinno znaleźć się na stronie. Tabele, obrazy, skrypty i tak dalej, z wyjątkiem stylów CSS.

Czym jest HTML - jeśli spojrzysz na to, co pisze Wikipedia - (HyperText Markup Language) hipertekstowy język znaczników dokumentów. Większość stron w Internecie zawiera znaczniki stron w tym języku. Język ten jest interpretowany przez przeglądarki, a powstały w ten sposób sformatowany tekst jest wyświetlany na monitorze komputera lub urządzeniu mobilnym.

Język ten jest z natury bardzo łatwy i przystępny do nauki. Każdy może poznać i zrozumieć jego podstawy. Aby posługiwać się takim językiem, trzeba znać i używać deskryptorów, zwanych także tagami. To za pomocą tagów tworzony jest dokument.

Z czego powinna składać się struktura dokumentu, jakie znaczniki powinny się w nim znajdować. Spójrzmy na wszystko na jednym małym przykładzie. Napisałem tekst w MS Office i pokazałem go na tym zrzucie ekranu.

Aby wyświetlić ten tekst w przeglądarce w taki sam sposób, w jaki został zapisany w dokumencie, należy dodać do niego znacznik strony, który zawiera pewne znaczniki. Najpierw przyjrzyj się im, potem opiszę każdego, kto za co odpowiada.

Witaj na moim blogu. Bierzesz teraz lekcję z podstaw HTML. Jeśli spodobał Ci się ten artykuł, możesz zasubskrybować tego bloga, aby otrzymywać nowe artykuły na swoją skrzynkę e-mail.

Z jakich znaczników składa się każdy dokument HTML, co zawiera i gdzie należy to wszystko zapisać?

Każdy kod składa się ze znaków umieszczonych w nawiasach kątowych. Wszystko to nazywane jest elementami. Wszystkie elementy składają się zwykle z dwóch znaczników, otwierającego i zamykającego. Radzę najpierw uważnie przyjrzeć się tagom; jeśli pominiesz któryś z nich i go nie zamkniesz, będziesz musiał przejrzeć duże części kodu, aby znaleźć błąd.

Zdarzały się przypadki, gdy trwało to dłużej niż jeden dzień, osoba kontaktowała się i prosiła o pomoc, nie mógł znaleźć błędu na swojej stronie, więc zawsze uważnie patrz, co i gdzie piszesz. Skorzystajmy teraz z tego przykładu, aby przyjrzeć się każdemu elementowi kodu, co jest w nim zapisane, co to oznacza i co się ostatecznie dzieje.

Większość tagów jest sparowanych, co obejmuje tag otwierający i tag zamykający. Oprócz takich tagów istnieją również pojedyncze tagi. Tagi mogą łączyć się z innymi, zagnieżdżając się w sobie. Na przykład wyświetl tekst jednocześnie pogrubionym i kursywą.

Tekst

Jeszcze raz przypominam, że należy przestrzegać zasad, które są zawarte w dokumencie. W ten sposób przeglądarka rozumie, co znajduje się na stronie, jej kolejność, treść itd.

Tag to komponent, który informuje przeglądarkę internetową o wykonaniu określonego zadania. Na przykład obecność akapitu, tabeli, formularza lub obrazu.

Atrybut - modyfikuje znacznik. Można na przykład wyrównać akapit do środka lub do prawej strony, ustawić położenie obrazu na stronie i tak dalej.

ZAWSZE zamykaj tagi, jeśli je otworzysz, zdecydowanie powinieneś je zamknąć. W przeciwnym razie wystąpi błąd i dokument nie będzie poprawnie wyświetlany na stronie. Są też wyjątki, o których nie należy zapominać.

Bez wątpienia konieczne jest zrozumienie, że istnieje tytuł dokumentu i jego treść. Tytuł to wszystko, co jest zawarte w tagu. Treść dokumentu (), treść dokumentu zawiera całą zawartość strony. Jeżeli zaistnieje potrzeba pozostawienia fragmentu kodu dla siebie, załączając w ten sposób te tagi w komentarzach, służy do tego tag. Wszystko, co znajduje się w takim tagu, służy jako komentarz i nie jest postrzegane przez przeglądarki.

Zacznijmy od pierwszego. Na początku dokumentu otworzyłem tag, a na końcu go zamknąłem. Kod ten jest obecny w absolutnie każdym dokumencie; informuje przeglądarkę, że wszystko umieszczone pomiędzy tymi znacznikami jest kodem HTML. Jest to korzeń samego dokumentu; wszystko, co później znajduje się za tym znacznikiem, nie jest już zawarte w dokumencie i nie jest postrzegane przez przeglądarki. Na samym początku dokumentu tag jest otwarty, a na samym końcu należy go zamknąć.

Cała sekcja tego znacznika zawiera wszystkie informacje techniczne dokumentu. Podobnie jak w przypadku poprzedniej zawieszki, główkę również należy na końcu otworzyć i zamknąć. Informacje te obejmują tytuł strony, opis, słowa kluczowe w wyszukiwarce i kodowanie. O kodowaniu trochę poniżej.

Treść

Znacznik ten jest zawarty w nagłówku i musi być zapisany wewnątrz znacznika nagłówka. Ten tag tytułowy jest obowiązkowy i musi być obecny w każdym dokumencie HTML. Oprócz tego pojawia się jako tytuł okna przeglądarki. Długość takiego nagłówka nie powinna przekraczać 60 znaków. Tekst takiego nagłówka powinien zawierać jak najpełniejszą informację charakteryzującą zawartość strony.

Jeśli w nagłówku napisałeś „Hello World”, to właśnie ta informacja powinna wyświetlić się na stronie, a nie inna. Nie powinieneś oszukiwać ludzi i wyszukiwarek, im się to nie podoba, a tym samym pogarszasz swoją sytuację. Informacje zawarte w tym tagu powinny odpowiadać treści Twojej strony.

Po obowiązkowym tagu tytułowym znajduje się opcjonalny, ale równie ważny metatag. Ten tag jest pojedynczy. Za pomocą tego tagu ustawiasz opis strony (description) i jej słowa kluczowe (keywords).

Dodatkowo metatag może zawierać dane o autorze strony i inne właściwości metadanych. Możesz uniemożliwić indeksowanie całej strony przez wyszukiwarki. Ustaw automatyczne odświeżanie strony po 20 sekundach lub po 5 sekundach, po czym następuje przejście na inną stronę.

Takich metaelementów może być kilka, ponieważ mogą one przenosić zupełnie inne informacje. Inni użytkownicy, otwierając stronę w przeglądarce, nie widzą wszystkich Twoich opisów; wszystko to pozostaje niewidoczne.

Znacznik stylu może być również używany do ustawiania stylów na stronie. Jeśli używasz wielu różnych stylów CSS, zaleca się ustawienie ich w osobnym pliku. Jeśli chcesz określić kilka z nich, wszystko to można określić bezpośrednio w dokumencie HTML.

.base ( szerokość: 100px; kolor tła: #000; wysokość: 150px; kolor: #fff; )

Możesz też dodać style specjalnie do jednego tagu; w tym celu musisz dodać element stylu wewnątrz samego tagu. Tego tagu należy użyć wewnątrz kontenera, który ustawia style strony. Możesz użyć kilku takich tagów, nie będzie to błąd.

Nieco podobny do poprzedniego tagu, tag link pozwala ustawić style dla dokumentu, który znajduje się w innym pliku. Innymi słowy, możesz dołączyć do istniejącego dokumentu kompletny arkusz stylów CSS, który składa się z wielu właściwości. W ten sposób zmniejszasz rozmiar dokumentu, który ostatecznie będzie ładował się i otwierał szybciej na komputerze lub urządzeniu mobilnym z niską szybkością Internetu.

Można podłączyć więcej niż jeden plik, nie ma żadnych ograniczeń. Nie ma potrzeby zamykania takiego tagu. Jeżeli wszystko zostało wykonane poprawnie, do dokumentu zostaną załadowane określone style z osobnego pliku. Znacznik ten można dodać do podstawowego HTML i nie zapomnieć o jego istnieniu. Rezultatem jest taki obraz:

Za pomocą znacznika skryptu możesz połączyć różne scenariusze (skrypty) z dokumentem. Wymagana jest obecność znacznika zamykającego. Sam skrypt może znajdować się na początku dokumentu, wewnątrz lub na końcu.

Informuje przeglądarkę, że wszystko umieszczone pomiędzy tymi znacznikami powinno pojawić się w oknie przeglądarki. Oto główne tagi, które mogą znajdować się w absolutnie każdym dokumencie. Znacznik body pełni rolę głównej części strony, która zawiera całą jej zawartość. Warto otworzyć ten tag i pamiętać o zamknięciu go na końcu dokumentu.

Pójdźmy dalej, widzimy tag, który otwiera się i zamyka w ten sam sposób. Znacznik ten oznacza główny tytuł tekstu; w większości przypadków pod nagłówkiem H1 znajduje się tytuł strony. W rzeczywistości istnieje tylko sześć nagłówków danych. . Wykorzystuje się je także w SEO, ale to już nieco inny temat. Na pewno wyróżnię w tym celu jeden artykuł i podam jego szczegółowy opis, subskrybuj aktualizacje bloga, aby niczego nie przegapić.

Obecność takich nagłówków w artykule będzie odgrywać ważną rolę w promowaniu strony. Ponadto ich użycie zapewnia przejrzystą strukturę strony, jej tytuł, podtytuły, wyróżnienia, akapity i tak dalej. Zawsze z nich korzystaj i wdrażaj je w życie. W wielu systemach CMS, takich jak WordPress, podczas pisania tekstu można zobaczyć „nagłówek 1”, „nagłówek 2”, „nagłówek 3” i tak dalej. To one odpowiadają za h1, h2 i h3.

Jeśli napiszesz tekst główny z nowego akapitu, napiszesz znacznik

Na początku i zamknij na końcu

Dokument HTML

Ten tekst będzie pogrubiony, i ten również jest napisany kursywą

Każdy dokument zawiera element nagłówkowy i tytułowy. Pierwszy, który następuje bezpośrednio po pierwszym tagu. Tag ten zawiera wszystkie informacje o stronie, zawiera także element. Tytuł – informacja o tytule strony, czyli inaczej tytule strony, jej nazwie. To w tytule podajesz poprawną nazwę strony, po której użytkownik będzie Cię szukał w wyszukiwarce, co jest bardzo ważnym punktem. Oba elementy muszą być otwarte i jednocześnie zamknięte. Każdy element jest zamknięty znakiem „/”. Rezultatem jest taki obraz.

Nagłówek i zawartość strony

Jak widać, nie ma nic skomplikowanego. Oto najbardziej podstawowe znaczniki, które powinny znajdować się w każdym dokumencie HTML. Nie zapomnij zamknąć każdego z nich, w przeciwnym razie przeglądarka nie będzie w stanie dostrzec pełnego obrazu kodu. Trzeba o tym wiedzieć i zawsze pamiętać. Następnie zacznij wstawiać tekst, obrazy, filmy i tak dalej. Ale to będzie już w innych artykułach.

Do pracy z kodem użyj programu Notepad++. Jest darmowy i nietrudno go znaleźć w Internecie. Bardzo wygodny do zrozumienia dowolnego kodu; wygodnie wyświetla również znaczniki otwierające i zamykające. Obsługujemy składnię ponad 40 języków programowania. Tylko to, czego potrzebujesz, aby nauczyć się podstaw HTML.

Notatnik pod każdym względem przewyższa zwykły notatnik. Dla maksymalnej wygody, prostoty i nauki, ten edytor musi być początkowo zainstalowany na Twoim komputerze. Najważniejszą zaletą i wygodą jest to, że edytor Notepad++ pokazuje podpowiedzi podczas pisania kodu, co sprawia, że ​​Twoja praca jest znacznie szybsza i lepszej jakości.

Każdy dokument musi także zawierać następujący element doctype. Dlaczego jest potrzebny i co powinno się w nim znaleźć. Zwykle ludziom nie podobają się te linie, kopiują je do swoich dokumentów i pracują spokojnie. Elementy te informują przeglądarkę, jaka wersja HTML jest używana w dokumencie, jaki jest opis strony, jakie jest użyte kodowanie, jakie słowa kluczowe zostały użyte, kim jest autor i jak nazywa się strona.

Zazwyczaj umieszczane są na samym początku. Opcji jest kilka i wszystkie różnią się od siebie, napiszę jeden przykład, który jest najczęściej używany. Ten blankiet może służyć jako gotowy szablon. Dalej będzie czytelny opis każdej linii, nie powinno być z tym żadnych problemów.

Krótko i zrozumiałym językiem o podstawach HTML: Ta linijka informuje przeglądarkę, że ten dokument jest w wersji XHTML 1.0, używany jest angielski i cały ten bałagan znajduje się pod tym adresem. Następnie w metatagu wskazujemy zastosowane kodowanie. Najczęściej używany jest Windows 1251.

Opis – poruszany jest temat SEO, jeden z trzech głównych tagów, które muszą znaleźć się w absolutnie każdym dokumencie. Ten tag wskazuje opis strony; Co jest napisane na tej stronie, krótki opis, nie więcej niż dwa zdania. Tag słów kluczowych obejmuje również temat SEO, ten tag jest wymagany. Zawiera słowa kluczowe, za pomocą których internauci będą Cię odnajdywać w wyszukiwarkach.

Znacznik tytułu zawiera nazwę samego dokumentu, jego tytuł, który widzimy w przeglądarce. Prawdopodobnie najważniejszy tag w całym dokumencie, który ma największy wpływ na promocję strony. Artykuł o dodawaniu i projektowaniu opisuje ten tag bardziej szczegółowo.

O czym musisz pamiętać z tej lekcji o podstawach HTML:

Wszystkie strony główne powinny zawsze nosić nazwę indeks. Tak to jest przyjęte i wszyscy są do tego przyzwyczajeni, niezależnie od rozszerzenia pliku, może to być html lub php. Zawsze się to tak nazywa.

Obejrzyj film o podstawach HTML od Webformyself.

Hipertekstowy język znaczników, podstawowe elementy i struktura. To wszystko i wiele więcej postaram się opisać na moim blogu. Przede wszystkim zostaną napisane przydatne informacje dla początkujących, zostanie podany przykładowy kod oraz zapewniona zostanie możliwość pobrania samego przykładu wraz z gotową stroną.

HTML (Hyper Text Markup Language) to specjalny język znaczników dokumentów. Należy zauważyć, że mówimy o dokumentach elektronicznych, a nie drukowanych.

Drukowany dokument ma ściśle określone rozmiary stron i marginesy. Precyzyjnie określa parametry czcionki. Dokumenty elektroniczne i strony internetowe nie są przeznaczone do drukowania na drukarce, ale do przeglądania na ekranie. Nie wiadomo z góry, na jakim komputerze dokument będzie przeglądany. Rozmiar okna przeglądarki jest nieznany i nie wiadomo, jakie czcionki są dostępne.

Język HTML został stworzony specjalnie do projektowania dokumentów ekranowych, które będą odtwarzane w nieznany sposób. Pierwotnie HTML nie był przeznaczony do formatowania dokumentu, ale do jego funkcjonalnych znaczników. Na przykład „nagłówek” jest cechą treści, a nie projektu. Program do przeglądania dokumentu na ekranie (przeglądarka, przeglądarka, eksplorator) wybiera sposób wyświetlania części dokumentu opisanej jako nagłówek.

Tworzenie dokumentu w HTML jest podobne do programowania. Autor dokumentu bierze zwykły tekst i wstawia do niego specjalne kody (nazywa się je tagami). Podczas przeglądania dokumentu znaczniki działają jak polecenia. Przykładowo, jeśli na początku akapitu znajduje się znacznik, to cały akapit zostanie wyrównany do środka okna, niezależnie od tego, w którym oknie będzie przeglądany dokument i w jakiej czcionce będzie wyświetlany tekst.

Tagi HTML umożliwiają wyrównywanie linii dokumentu, kontrolowanie tła i koloru czcionki, wstawianie ilustracji i oblewanie ich tekstem, umieszczanie obiektów multimedialnych w dokumencie i wiele więcej. Rezultatem są znaczące i imponująco zaprojektowane dokumenty internetowe.

Wśród wielu znaczników HTML istnieje specjalna grupa znaczników przeznaczona do tworzenia łączy hipertekstowych. Link hipertekstowy to wybrany fragment tekstu lub ilustracji powiązany z adresem innego dokumentu. Linki hipertekstowe są zwykle wyróżniane podkreśleniem lub innym kolorem. Jeśli najedziesz myszką na łącze hipertekstowe, zmieni ono kształt. Jeśli klikniesz lewym przyciskiem myszy łącze hipertekstowe, zostaniesz przeniesiony na inną stronę internetową, być może zlokalizowaną na innym serwerze, a może nawet na innym kontynencie.

Dokumenty utworzone w formacie HTML zapisywane są w plikach z rozszerzeniem html lub htm.

Konstrukcje sterujące w HTML nazywane są tagami. Tagi to zestawy znaków używane do oznaczania tekstu. Wszystkie znaczniki są zapisywane w nawiasach ostrych, które tworzą symbole mniejszości (). Po nawiasie otwierającym następuje słowo kluczowe definiujące znacznik.

Wielkość liter w nazwach tagów nie ma znaczenia. Jednak powszechną praktyką jest pisanie tagów wielkimi literami, aby odróżnić je od tekstu głównego.

Tagi mogą być sparowane lub niesparowane. Aby wpłynąć na część dokumentu (na przykład akapit), stosuje się sparowane znaczniki: otwieranie i zamykanie. Znacznik otwierający tworzy efekt, a znacznik zamykający go zatrzymuje. Tagi zamykające zaczynają się od ukośnika (/).

Niesparowane znaczniki wpływają na cały dokument lub mają jednorazowy efekt w miejscu ich pojawienia się. W tym przypadku znacznik zamykający nie jest używany.

Jeśli przez pomyłkę tag zawiera słowo kluczowe, które nie występuje w danym języku, tag jest całkowicie ignorowany.

Podczas przeglądania dokumentu w przeglądarce same znaczniki nie są wyświetlane, ale wpływają na sposób wyświetlania dokumentu.

Na efekt wywołany tagiem mogą mieć wpływ atrybuty. Atrybuty to słowa funkcyjne oddzielone od słowa kluczowego tag i od siebie nawzajem spacjami. Jeśli konieczne jest określenie wartości atrybutu, jest ona zapisywana po znaku równości i ujęta w cudzysłów. W przypadku tagów sparowanych atrybuty są dodawane tylko do tagu otwierającego. Tagi zamykające nigdy nie zawierają .

Język HTML umożliwia wejście do dokumentu