Dzisiaj przedstawię wam oraz wyjaśnię jak powinien wyglądać szablon HTML/XHTML tak, aby spełniał dzisiejsze wymagania oraz jakich programów używać. Powiemy sobie również trochę o HTML5.
Od czego zacząć?
No właśnie od czego? Wielu ludzi chce się zabrać za kodowanie, ale nie wie od czego zacząć.
Musimy mieć program do kodowania stron internetowych ( może być systemowy notatnik, ale nie polecam... - dlaczego? no choćby dlatego, że nie ma tam kodowania utf-8, które obejmuje polskie znaki, a tak po za tym to w programach stworzonych do tego mamy wiele ułatwień ).
Więc jaki program wybrać?
Polecam Notepad++, który możesz ściągnąć z tej strony.
Oprócz notepad++ podobno dobrym programem jest eclipse, aczkolwiek nie korzystałem ( jestem przywiązany do notepad'a++, który posiada wszystko co jest potrzebne )
Ok, mam już program. Otwieramy go i co dalej?
U góry mamy menu plik, edycja, szukaj, etc.
Wybieramy Format > UTF-8 (bez BOM). Dlaczego? Ponieważ dzięki takiemu kodowaniu możemy używać takich liter jak ą, ę, ś itp..
A co jeśli zostawię kodowanie w ANSI?
Wtedy zamiast polskich liter pojawią się "�".
HTML5?
HTML5 jest językiem cały czas rozwijanym, posiada wiele nowych ciekawych funkcji jednak cały czas jest rozwijany ( skończony ma zostać w 2014 roku ). Dlatego na dzień dzisiejszy nie będziemy z niego korzystać, gdyż wejdzie sporo zmian zanim wyjdzie oficjalnie.
Ok! Co dalej?
Następnie przechodzimy do Składnia > H > HTML. Informuje to program, że plik który kodujemy jest w języku HTML. Pozwoli to nam na "pokolorowanie" komend tzn.:
Mamy już przygotowany plik na nasz kod co teraz?
Teraz musimy napisać nasz kod. W czym? HTML czy XHTML? Jaka jest różnica? Różnica jest taka, że w XHTML musi być wszystko dokładnie napisane, a html dopuszcza małe błędy. Dlatego jeśli zaczynasz proponuję Ci HTML.
Początek kodu:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
Ta linijka informuje naszą przeglądarkę, że plik jest kodowany w HTML ( wersja 4.01 ).
Dalej musimy zamieścić tag <html> oraz <head> (jeden pod drugim), w którym będą znajdować się wszystkie tagi strony, jej tytuł, autor, link do skryptu css, itp.
Mój tag <head> wygląda tak:
<head> - 1
<title>Tytuł strony</title> - 2
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> - 3
<meta name="Author" content="Mój nick" /> - 4
<link rel="Copyright" href="Prawa autorskie" /> - 5
<link href="styles.css" rel="stylesheet" type="text/css" /> - 6
</head> - 7
1 - otwarcie tagu head
2 - pomiędzy tagami <title> oraz </title> wpisujemy nazwę naszej strony
3 - informacja o kodowaniu w utf-8
4 - w miejsce mój nick wpisujemy autora
5 - w miejsce "Prawa autorskie" wpisujemy prawa np. "Copyright 2013 by NazwaFirmy"
6 - link do pliku css ( opis w następnym arytkule )
7 - zamknięcie tagu head
Ok, mam napisane html, head co dalej?
Teraz pod tagiem </head> wpisujemy <body>, który jest bardzo ważną częścią!
Po tym tagu wpisujemy kod, który ma nam się wyświetlić tzn. kod naszej strony.
Zamykamy tagiem </body>, a następnie pod tagiem </body>, zamykamy html'a tagiem </html>.
KOD NASZEJ STRONY POWINIEN WYGLĄDAĆ TAK :
Dziękuję oraz do zobaczenia w następnym poradniku, w którym omówimy CSS oraz napiszemy pierwszy kod !
Brak komentarzy:
Prześlij komentarz