2017-03-28 Podstawy HTML-a Adam Rębisz
"Pajęczyna (Web) pozwala ludziom szukać i odkrywać, decydować samemu, jakie informacje będą im potrzebne w przeciwieństwie do zalewu informacji, które uderzają w nich, ale nad którymi nie mają kontroli. Będzie to naprawdę bogate źródło". Tim Berners-Lee
WWW i HTML – trochę historii. w roku 1980 Berners-Lee napisał dla własnych potrzeb program używający hipertekstu Od 1984 naukowcy CERN używają języka T.B w środowisku Unix 1989 uważany jest za rok powstania HTML 1990 powstaje system nazwany World Wide Web
Przeglądarki internetowe w roku 1991 powstała pierwsza przeglądarka World-Wide Web, pracująca na systemie Unix w 1993 roku Marc Andreessen stworzył program Mosaic – pierwszą przeglądarkę nie tylko dla Unix w 1994 powstaje firma Netscape i przeglądarka Netscape Nawigator W 1995 powstaje Internet Explorer, przeglądarka firmy Microsoft Kolejne lata - kolejne wersje - internetowe kombajny: Explorer, NeoPlanet, Netscape – pakiety wielozadaniowe
Cechy HTML-a Nie posiada struktur właściwych językom programowania Jest językiem opisu strony WWW Jego konstrukcja jest standaryzowana i opisana określoną specyfikacją Służy do projektowania prostych stron WWW Na jego standardzie opierają się narzędzia do tworzenia zaawansowanych stron WWW http://www.w3.org
Wprowadzenie Skrót HTML odnosi się do jednego z wielu języków znakowania, które pojawiły się w ostatnich latach. Mówiąc w skrócie, język znakowania to sposób kodowania dokumentów tekstowych przy pomocy specjalnych elementów – znaczników. Znaczniki te opisują poszczególne części dokumentu.
Wprowadzenie do języków znakowania Znaczniki są potrzebne, ponieważ komputery zupełnie się nie sprawdzają, gdy trzeba zrozumieć jakiś tekst. Komputer nie potrafi sam stwierdzić, czy określony fragment tekstu to cytat, tytuł, nagłówek czy akapit. Bez dodatkowych informacji komputer nie będzie wiedział, jak wyświetlać tekst, aby był on podobny do prawdziwego dokumentu.
znaczniki zwane inaczej elementami zapisywane są w nawiasach <> 2017-03-28 znaczniki zwane inaczej elementami zapisywane są w nawiasach <> <ZNACZNIK> - /początek działania znacznika/ </ZNACZNIK> - /koniec działania znacznika/ atrybuty – inaczej parametry, umieszczane są one po znaczniku otwierającym, wewnątrz nawiasu <> style opisywane są poprzez definicje
Wprowadzenie do podstawowych bloków HTML-a - elementów W HTML-u do definiowania struktury dokumentu, określa jego wyglądu, definiowania łącz do innych dokumentów i określania wymaganego zachowania używa się elementów. Przykładowe elementy to: HEAD, BODY, P, BLOCKQUOTE i UL. Gdy będziesz chciał umieścić te elementy w swoim tekście, musisz je ograniczyć symbolami: < (mniejszości) i > (większości). Gdy już to zrobisz, otrzymasz <HEAD>, <BODY>, <P>, <BLOCKQUOTE> i <UL>. Wtedy nie będą się one nazywały elementami tylko, znacznikami.
Kto tworzy reguły? Każda organizacja ma instytucję tworzącą reguły. W przypadku Internetu taką instytucją tworzącą reguły jest World Wide Web Consortium (W3C). W3C składa się z reprezentantów ponad 400 firm, które chcą mieć coś do powiedzenia w kwestii tworzenia standardów dla Internetu. W3C próbuje znaleźć kompromis między interesami uczelni, firm produkujących przeglądarki internetowe oraz twórcami nowych technologii. Gdyby nie W3C nie ustalała standardów, mogłoby się zdarzyć, że niektóre przeglądarki nie byłyby w stanie porozumieć się z niektórymi serwerami WWW.
Elementy występujące w HTML-u składają się z trzech części: znacznik otwierający zawartość znacznik zamykający Znacznik otwierający jest nazwą elementu ograniczoną znakami mniejszości i większości np. <HEAD>. Znacznik zamykający jest nazwą elementu, poprzedzoną znakiem / (zwanym ukośnikiem prawym) i ograniczoną znakami mniejszości i większości np. </HEAD>.
Aby wprowadzić dodatkowe zamieszanie, niektóre elementy będą prawidłowo wyświetlane bez znaczników zamykających, o ile koniec elementu może być jasno określony na podstawie elementów otaczających go. Na przykład znaczniki LI (element listy) i P (akapit) nie wymagają znaczników zamykających, ponieważ ich koniec może być jasno określony przez początek następnego elementu.
Podsumowując Każdy element posiada nazwę. Znacznik otwierający jest nazwą elementu ograniczoną znakami mniejszości i większości. Znacznik zamykający zaczyna się ukośnikiem prawym, zawiera nazwę elementu i jest ograniczony znakami mniejszości i większości. Niektóre elementy nie posiadają zawartości. Niektóre elementy nie wymagają znaczników zamykających.
Pomiędzy znacznikiem otwierającym i znacznikiem zamykającym znajduje się zawartość. W rzeczywistości zwykle najpierw piszesz zawartość, a później dodajesz znacznik otwierający przed zawartością, a następnie znacznik zamykający za zawartością. Upewnij się że prawidłowo wpisałeś nazwy znaczników, dodałeś oba znaki mniejszości i większości oraz umieściłeś tam gdzie trzeba, znaki ukośnika.
Przykłady HTML-a z prawidłową składnią: <H1> To jest <B> pogrubiony tytuł </B> strony </H1> To jest pogrubiony tytuł strony <B> To zdanie będzie pochylone </B> To zdanie będzie pochylone
width=”120” (szerokość-liczba pikseli) Atrybuty Elementy posiadają atrybuty, które dają elastyczność w tworzeniu dokumentu HTML. Atrybuty posiadają wartości atrybutu. Wartość atrybutu jest zawsze ograniczona znakami cudzysłowu np. width=”120” (szerokość-liczba pikseli)
Podstawowa struktura dokumentu HTML: HEAD i BODY Informacja o wersji. Istnieją trzy rodzaje dokumentów HTML-a; informacja o wersji powinna informować, którego rodzaju używasz. Czołówki (HEAD). HEAD poza tym, że jest częścią elementu HTML, jest również elementem samym w sobie. Element HEAD może zawierać tytuł. To tutaj będziesz umieszczał informacje o standardzie kodowania polskich znaków. Sekcji BODY. Wszystkie inne rzeczy, które chcesz umieszczać
Ważne elementy HEAD znacznik META przypomina zbiór „zaklęć”, może powtarzać się wielokrotnie: przykłady: <META NAME="Author" Content="A.Śmigielska"> <META http-equiv=”Content-Type” content=”text/html; charset=windows-1250”> <META http-equiv=”Content-Type” content=”text/html; charset=ISO-8859-2”> tytuł strony <TITLE> Privat </TITLE>
Atrybuty BODY: BGCOLOR="#E0E0E0" /atrybut koloru tła dokumentu/ TEXT="black" /atrybut koloru tekstu dokumentu/ LINK="blue" /atrybut odnośników/ VLINK="fuchsia" /atrybut odnośników wskazanych/ ALINK="red" > /atrybut odnośników użytych/ BACKGROUND="obrazek.jpg" /tłem może być również obrazek/
Strona w języku HTML Nagłówek Ciało strony Podstawowa struktura strony <head> <title> Tytuł tworzonej przez nas strony </title> </head> <body> Treść jaką chcemy zamieścić na naszej stronie np. Witaj na mojej stronie </body> </html> Nagłówek Ciało strony
Strona w języku HTML Wyjaśnienie struktury strony <html> - informuje przeglądarkę, iż od tego momentu oglądany dokument jest zapisany w języku HTML, otwarcie dokumentu HTML <head> - otwarcie części nagłówkowej strony <title> - umożliwia nadanie tytułu przeglądanej stronie; tytuł jest wyświetlany w górnej części okna, tj. w pasku tytułowym. </title> - informuje przeglądarkę o tym, iż skończyliśmy podawać tytuł. </head> - zamknięcie części nagłówkowej <body> - sekcja w której zawarta jest główna część dokumentu „ciało strony”. Witaj na mojej stronie - składa się na nią w tym przypadku tylko ta linijka tekstu. </body> - zamknięcie sekcji body. </html> - zamknięcie całego dokumentu HTML.
KONIEC