HTML dla zielonych.docx

Widzę, że jesteś "zielony/zielona"... ale nic się nie martw. Jeśli koniecznie chcesz "zmienić kolor", przeczytaj umieszczony poniżej tekst. Pozwoli Ci on, stworzyć Twoją pierwszą stronę internetową, nawet w ciągu jednego dnia. Jeśli uważasz, że pisanie stron w języku HTML jest dla Ciebie "czarną magią", a sama strona jest jakimś tajemniczym i bardzo skomplikowanym dokumentem, to się mylisz. Napisanie krótkiej strony internetowej jest prostsze niż Ci się wydaje. Zatem nie trać już czasu na wymówki typu: Ja się niczego nie nauczę! i tym podobne, bo to nieprawda. Zacznij już lepiej czytać.

Mam tylko jedną prośbę: postaraj się przeczytać w miarę uważnie i po kolei całą treść na tej stronie. Jeśli pominiesz jakiś punkt lub przeczytasz go zbyt pobieżnie, może to spowodować, że nie zrozumiesz następnych.

Wyjaśnienie

W większości miejsc tego kursu jest mowa o języku HTML, jednak tak naprawdę nauczysz się tutaj stosować język XHTML, który jest jego następcą i zarazem aktualnym standardem. Określenie "HTML" będzie dalej używane raczej w znaczeniu ogólnego języka opisującego strukturę dokumentów stron WWW. Nie musisz się jednak obawiać, że Twoja strona nie będzie działać prawidłowo, ponieważ przedstawiane tutaj polecenia są napisane w taki sposób, aby były poprawne również w języku HTML i prawidłowo prezentowane także w starszych przeglądarkach internetowych. Sam język XHTML 1 nie różni się diametralnie od swojego poprzednika - m.in. właśnie dlatego często stosuje się zapis "(X)HTML", co sugeruje, że strona jest poprawna pod względem obu tych języków - a więc za jednym zamachem nauczysz się zasad zarówno XHTML jak i HTML. Czytając ten kurs, poznasz zasady projektowania stron WWW zgodnie z najnowszymi technologiami, a jednocześnie działających także w starszych przeglądarkach.

Źródła

Opis tutaj zawarty, został opracowany na podstawie następujących specyfikacji:

· HTML 4.01 Specification

· XHTML 1.0 The Extensible HyperText Markup Language

· XHTML 1.1 - Module-based XHTML

Edytory

Co jest potrzebne, żeby napisać stronę internetową? Teoretycznie może to być dowolny edytor tekstu, no i oczywiście dobre chęci. Dokument (X)HTML, czyli (Extensible) Hypertext Markup Language - (Rozszerzalny) Hipertekstowy Język Oznaczania, jest po prostu plikiem tekstowym, gdzie wpisujemy wszystkie polecenia, dotyczące formatowania tekstu, wstawiania grafiki i inne. Lecz pisanie strony w zwykłym edytorze tekstu, byłoby bardzo uciążliwe. Dlatego powstało wiele wyspecjalizowanych edytorów, które ułatwią, przyspieszą i uprzyjemnią Twoją pracę. Poniżej znajdziesz listę popularnych edytorów HTML (kolejność wg licencji i alfabetycznie). Informacje częściowo zostały zaczerpnięte ze stron producentów.

Windows

Pajączek (shareware - płatny)

Najbardziej znany polski edytor HTML rozwijany od lat. Oferuje szerokie wsparcie dla najnowszych technologii internetowych, z których warto wymienić takie jak HTML, XHTML, XML, PHP, JavaScript, VBScript, Perl, MathML, SVG, SMIL, P3P, ASP i inne. Wsparcie to dotyczy nie tylko ułatwionej edycji plików źródłowych w tych językach - program oferuje bowiem kontekstową dokumentację dla wybranego polecenia języka, przeglądanie za pomocą serwera czy funkcję dynamicznego kodu, która uwalnia od konieczności pamiętania poleceń języka.

CoreEditor (płatny - dostępna wersja DEMO)

Tańszy konkurent Pajączka, następca darmowego EdHTML przepisany zupełnie od nowa. Bardzo dobrze spisuje się jako edytor dla osób programujących w Pascalu, Asemblerze, Delphi, C, Java itd. Niemniej największy nacisk położony został na wsparcie dla takich technologii jak xHTML, CSS, PHP, JavaScript i MySQL.

Ager Web Edytor (darmowy)

Oprócz HTML i CSS, wspiera również programowanie w językach JavaScript i PHP. Posiada generatory do automatycznego podłączenia pluginów takich jak: Media Pleyer, QuickTime, Flash, RealMedia, a także kreatory znaczników HTML, deklaracji CSS oraz skryptów JavaScript. Obsługuje makrokody i encje HTML.

EdHTML (darmowy)

Uniwersalny edytor do HTMLa. Wspiera również XHTML, CSS, JavaScript i PHP. Bardzo dobrze koloruje składnię, pozwala na proste testowanie stron we wbudowanych przeglądarkach, pozwala także na testowanie skryptów PHP nie wychodząc z programu. Program zawiera wiele wbudowanych narzędzi, np. kompresor HTML, konwerter polskich znaków itp. Dzięki szablonom i rozbudowanej pomocy pomaga początkującym webmasterom.

Edytor Znaczników HTML - ezHTML (darmowy)

Dostęp do wszystkich możliwości języka HTML dają zakładki - pomieszczone na nich zostały wszystkie istotne znaczniki. Można także skorzystać z listy znaczników zawierającej wszystkie tagi standardu HTML 4.0. Wiele czynności automatyzują "czarodzieje" i inne kreatory. Warto także zwrócić uwagę na konfigurowalny interfejs (pasek użytkownika, na który można przenieść najczęściej używane polecenia), edytor kolorujący znaczniki oraz inne drobne ułatwienia (np. powtórne wstawienie ostatnio użytego znacznika, podpowiedzi składniowe, automatyczne zamykanie znaczników).

HateML Pro (darmowy)

Edytor przeznaczony zarówno dla początkujących jak i zaawansowanych webmasterów.Wspomaga tworzenie stron z użyciem XHTML, PHP, CSS, SQL (m.in. MySQL, Oracle, MSSQL7, MSSQL2000, Interbase6), JavaScript i VBScript. Posiada wbudowany inspektor tagów, parser HTML i PHP oraz prosty edytor WYSIWYG. Program został również wyposażony w narzędzia mające na celu optymalizację kodu - m.in. narzędzie HTMLTidy służące do sprawdzania poprawności kodu, narzędzie kompresujące kod, oraz możliwość bezpośredniego wysłania kodu do narzędzia Validator W3C. Ułatwieniem dla programistów piszących w PHP jest możliwość bezpośredniego uruchamiania kodu PHP z poziomu programu (bez konieczności uruchamiania serwera).

kED (darmowy)

Edytor plików HTML, CSS, XML, PHP, JavaScript. Edycja wielu dokumentów jednocześnie, rozbudowana edycja tabel (w tym oczyszczanie tabel zapisanych przez MS-Word). Możliwość wyboru dodatkowych zewnętrznych przeglądarek. Wbudowany prosty mechanizm sprawdzania struktury dokumentu - "rysuje" on sprawdzany dokument w postaci drzewa, dzięki czemu łatwiej zobaczyć, czy wszystkie znaczniki są prawidłowo podomykane.

PSPad (darmowy)

Szybki i lekki edytor produkcji czeskiej, jednak radzący sobie z kodowaniem polskich znaków lepiej niż niejeden rodzimy program. Oczywiście posiada polską wersję językową. Uwaga: zaraz po instalacji należy w ustawieniach programu usunąć skróty klawiaturowe kolidujące z kombinacjami służącymi do uzyskania polskich znaków diakrytycznych (np. Alt+L)!
Wspiera m.in. następujące języki: (X)HTML, XML, CSS, JavaScript, PHP, C/C++, Java, Pascal, Perl, Python, RSS, SQL (MySQL, Interbase, MSSQL, Oracle, Sybase), Visual Basic, Assembler. Pozwala korzystać z szablonów dokumentów. Ma wbudowany podgląd dokumentów za pomocą Internet Explorera i Mozilli. Integruje się z zewnętrznymi programami, między innymi edytorem CSS. Obsługuje mechanizm wtyczek. Zawiera narzędzie do kompresji i dekompresji kodu HTML oraz rozbudowany eksplorator kodu z listą funkcji i elementów zawartych w edytowanym dokumencie. Posiada zaimplementowaną funkcję dopasowywania nawiasów, podpowiedzi oraz kreatory znaczników i funkcji, które można samodzielnie tworzyć i modyfikować. Obsługuje makrokody. Zawiera wbudowane narzędzie do porównywania plików oraz wyszukiwania i zamiany w wielu plikach jednocześnie. Przydatną funkcją jest także próbnik kolorów ekranu, tabela znaków ASCII oraz sprawdzanie pisowni.

Linux

Bluefish (darmowy)

Szybki i lekki edytor dla webmasterów-programistów. Posiada również wbudowany graficzny tryb edycji. Wspiera m.in.: HTML, PHP, C, Java, JavaScript, JSP, SQL, XML, Python, Perl, CSS, ColdFusion, Pascal. Zawiera kreatory znaczników HTML, a także specjalne dla szkieletu strony, tabel, ramek, albumów zdjęć itp. Automatyczne domyka znaczniki. Posiada wbudowane narzędzie wyszukiwania i zamiany w wielu plikach jednocześnie oraz przeglądarkę dokumentacji znaczników i funkcji. Integruje się z innymi aplikacjami. Istnieje polska wersja językowa.

gedit (darmowy)

Oficjalny edytor środowiska GNOME, cechujący się prostotą. Wspiera m.in.: C, C++, Java, HTML, XML, Python, Perl. Automatycznie dodaje wcięcia linii kodu oraz dopasowywuje nawiasy. Obsługuje wtyczki, np.: statystyki dokumentu, integracja z zewnętrznymi aplikacjami, makrokody, lista znaczników.

Kate (darmowy)

Wchodzi w skład środowiska KDE. Dostępna również uproszczona wersja pod nazwą KWrite. Podświetla składnię, dopasowuje nawiasy oraz automatyczne dodaje wcięcia linii kodu. Obsługuje autouzupełnianie, a także mechanizm wtyczek. Wbudowana jest funkcja sprawdzanie pisowni oraz konwersja kodowania znaków.

Quanta Plus (darmowy)

Wchodzi w skład środowiska KDE. Podświetla składnię m.in.: (X)HTML, XML, XSLT, CSS, JavaScript, Java, PHP, C/C++, C#, Python, Perl, SQL (MySQL, PostgreSQL), Assembler, ASP, JSP, Pascal. Dopasowuje i automatycznie domyka nawiasy, jak również dodaje wcięcia linii kodu. Zawiera liczne kreatory znaczników, zaawansowane autouzupełnianie, podpowiedzi i automatyczne zamykanie znaczników. Umożliwia podgląd dokumentu w kilku trybach oraz przeglądarkach (Konqueror, Firefox, Mozilla, Netscape, Opera, Lynx). Posiada edytor znaczników i atrybutów, a także zaawansowany eksplorator struktury dokumentu. Załączona jest dokumentacja dla języków HTML, CSS, JavaScript, PHP. Zawiera szablony dokumentów i skryptów. Obsługuje wtyczki oraz integruje się z innymi aplikacjami. Posiada zintegrowane narzędzie wyszukiwania i zamiany w wielu plikach jednocześnie, porównywania plików oraz edytor map odsyłaczy. Wspiera CVS. Wbudowana jest funkcja sprawdzania pisowni.

SCREEM - Site CRreation and Editing EnvironMent (darmowy)

Zawiera eksplorator linków z możliwością sprawdzenia martwych odnośników. Udostępnia kreatory, autouzupełnianie, podpowiedzi i automatycznie zamykanie znaczników. Obsługuje szablony dokumentów (interpretuje pliki programu Dreamweaver). Wspiera CVS. Posiada wbudowany eksplorator struktury dokumentu. Integruje się z innymi aplikacjami. Zawiera narzędzie wyszukiwania i zamiany w wielu plikach jednocześnie.

Mac OS X

Bluefish (darmowy)

Oprócz wersji dla systemu Linux, edytor ten dostępny jest także dla Mac OS X. Opis powyżej.

Smultron (darmowy)

Oferuje podświetlanie składni, tworzenie biblioteki snippetów, czyli często używanych bloków kodu. Posiada eksplorator funkcji występujących w edytowanym dokumencie. Obsługuje autouzupełnianie i automatyczne domykanie znaczników. Zawiera wbudowane narzędzie wyszukiwania i zamiany w wielu plikach jednocześnie. Obsługuje AppleScript.

Taco HTML Edit (darmowy)

Obsługuje podświetlanie składni HTML i PHP. Kontroluje poprawność składni. Udostępnia podgląd edytowanych dokumentów - w tym dynamiczny. Zawiera liczne kreatory. Umożliwia zapisywanie często używanych bloków kodów w bibliotece.

Jeśli nie wiesz, który edytor (X)HTML będzie dla Ciebie odpowiedni albo wolisz poszukać programu obcojęzycznego, to dodatkowe opisy i porównania wraz z plikami do ściągnięcia znajdziesz np. w serwisie ...