Ćwiczenia

Teoria bez praktyki jest niczym. Dlatego zachęcam do stałego eksperymentowania z kodem HTML w trakcie czytania kursu. Dzięki temu poznane informacje na pewno zostaną lepiej utrwalone w Twojej pamięci. Ponadto często dopiero na etapie ćwiczeń praktycznych okazuje się, że tak naprawdę nie do końca właściwie zrozumieliśmy teorię. Jednak przede wszystkim to praktyka sprawia, że stajemy się coraz lepsi w danej dziedzinie. To z kolei pobudza i rozwija naszą pasję, dzięki której możemy stać się prawdziwymi mistrzami - praktyka czyni mistrza. Dlatego nie zaniedbuj tego etapu nauki. Zainstaluj edytor HTML i zacznij systematycznie ćwiczyć.

W ramach rozwoju umiejętności praktycznych zalecam wykonanie serii ćwiczeń. Będą one polegać na stworzeniu prostej strony internetowej bazującej na poznanych informacjach. W kolejnych rozdziałach będziemy ją stopniowo rozbudowywać, dlatego nie zapomnij zapisać jej sobie gdzieś na komputerze. Na tym etapie opublikowanie strony w internecie nie będzie jeszcze konieczne.

1. Znajdź temat, który szczególnie Cię interesuje. Może to być np. Twoja ulubiona książka, gra komputerowa, zespół muzyczny, dyscyplina sportu itp.

   Jeżeli do Twojej strony zamierzasz zaczerpnąć informacje z internetu, pamiętaj o poszanowaniu praw autorskich! Nie zawsze można sobie swobodnie skopiować na swoją stronę dowolny tekst, jeżeli autor nie wyraził na to zgody. Każdy cytat powinien być wyraźnie oznaczony z podaniem jego źródła.

   Możesz również stworzyć stronę o sobie, w której opiszesz krótko swoją biografię, zainteresowania, hobby itp.
2. Otwórz edytor HTML. Jeśli korzystasz z edytora graficznego, przełącz się do trybu bezpośredniej edycji kodu źródłowego HTML.
3. W edytorze utwórz nowy plik HTML i wklej w nim szkielet strony uzupełniając konieczne fragmenty.
4. Zacznij wpisywanie właściwej treści strony. Wyniki swojej pracy możesz na bieżąco oglądać w przeglądarce internetowej. W tym celu zapisz plik pod nazwą index.html, a następnie odszukaj go na dysku za pomocą dowolnego programu do przeglądania plików (w systemie Windows możesz użyć np. Eksploratora plików) i dwukrotnie kliknij ikonę stworzonego właśnie dokumentu. Dzięki temu Twoja strona otworzy się w przeglądarce. Za każdym razem kiedy coś na niej zmienisz, po prostu ponownie zapisz plik w edytorze, a następnie przełącz się do przeglądarki i odśwież stronę (klawisz F5), aby zobaczyć efekty.
5. Wróć do edytora HTML. Podziel tekst na akapity, tak aby był wygodniejszy w czytaniu.
6. Wybierz fragmenty tekstu, na które Twoim zdaniem czytelnik powinien zwrócić szczególną uwagę i umieść je w znacznikach pogrubienia.
7. Dodaj do strony ilustracje.

   W przypadku zdjęć i grafik należy szczególnie pamiętać o poszanowaniu praw autorskich! Nie każdy obrazek można sobie swobodnie skopiować na swoją stronę, jeżeli autor nie wyraził na to zgody.

   Jeśli tworzysz stronę o sobie, może to być po prostu Twoje zdjęcie.
8. Stwórz podstronę o nazwie linki.html (nowy plik HTML w edytorze) i umieść do niej odsyłacz na stronie głównej (czyli w pliku index.html). O tym co to są i jak się tworzy podstrony przeczytasz w podrozdziale: Ramy dokumentu.
9. Na podstronie linki.html wstaw odsyłacze do ciekawych stron w internecie, na których czytelnik będzie mógł znaleźć więcej informacji na opisywany przez Ciebie temat. Jeżeli tworzysz stronę o sobie, możesz tutaj umieścić odnośniki do Twojego profilu w serwisach społecznościowych: Facebook, Twitter, YouTube, LinkedIn itp.
10. Stwórz podstronę o nazwie kontakt.html (nowy plik HTML w edytorze) i umieść do niej odsyłacz na stronie głównej (czyli w pliku index.html). Wstaw na niej odsyłacz pocztowy z Twoim adresem e-mail.