Podstawy tworzenia stron WWW w języku HTML Koło Naukowe Elektroniki Przemysłowej - KNEP Wykonali:Mariusz Zawistowicz i Karol Witowski

Tworząc strony www w języku HTML można skorzystać z programów znacznie ułatwiających ich konstruowanie. Skorzystamy z freeware’owego programu EdHTML v2.7 i na jego podstawie postaramy się wyjaśnić podstawowe zasady tworzenia stron www. Program EdHTML można bezpłatnie Ściągnąć z internetu! np. ze strony: Poprzedni slajd

Pierwsze kroki – Zarys Strony i podstawowe ustawienia... Włączenie trybu tworzenia w języku HTML Szybkie tworzenie dokumentu HTML Przykładowe wypełnienie okien konfiguracyjnych Poprzedni slajd

Wygląd dokumentu po wprowadzeniu podstawowych danych Sekcja w której znajduje się większość wprowadzonych przed chwilą informacji np. autor strony,jego , tytuł strony, kodowanie, słowa kluczowe (ułatwiają innym odnalezienie w inetrnecie stron o poszukiwanej tematyce), itp.. Większość z tych informacji nie jest jednak wymagana do prawidłowego działania Strony www. Sekcja w której znajduje się Właściwa treść (ciało) dokumentu. W dalszej części prezentacji zajmiemy się dokładniej tą sekcja. Poprzedni slajd

Sekcja - kolor tla, wstawianie rysunku... Najprościej jest użyć skrótu na pasku powodującego włączenie generatora Sekcji BODY Ustawienie koloru tła lub użycie dowolnego rysunku jako tła. Jeśli jako tło ustawiony został konkretny plik graficzny w sekcji BODY zostanie umieszczony do niego pełna ścieżka. Poprzedni slajd

Sekcja BODY – wstawianie tekstu do dokumentu W menu HTML wybieramy pod-menu ‘tekst’, a następnie dowolny typ tekstu. dla przykładu wybrana została czcionka pogrubiona, powiększona i wyróżniona.Można ją również dowolnie wyrównać w pod-menu ‘wyrównywanie’ Czcionka pogrubiona Czcionka powiększona Czcionka wyróżniona Czcionka wyrównana do środka Każdy rozpoczęty znacznik nie tylko w przypadku tekstu należy zakończyć odpowiednim znacznikiem np. Czcionka pogrubiona powinna być zakończona lub czcionka powiększona zakończona jest znacznikiem. Zauważmy że cała sekcja BODY rozpoczęta znacznikiem zakończona jest odpowiednio przez !!! Poprzedni slajd

Po tych kilku krokach strona wygląda następująco... Poprzedni slajd

Sekcja BODY – wstawianie poziomej lini, rysunku i hiperłącza. W menu HTML wybieramy pod-menu hiperłącza, rysunku lub poziomej linii. w sekcji body pojawiają nam się odpowiednie polecenia które należy jeszcze uzupełnić. np. tak jak poniżęj Polecenie wstawiające Poziomą linie do dokumentu. Wewnątrz określony Został dodatkowo jeszcze kolor linii Polecenie powodujące przejście do następnego akapitu Polecenie powoduje wycentrowanie wszystkich elementów znajdujących się w ramach polecenia Polecenie Powoduje umieszczenie na stronie odnośnika w podanym przykładnie o nazwie ‘KNEP’ do podanej strony internetowej. jak widać w tym przypadku jest to strona Koła Naukowego. Odnośnikiem niekoniecznie musi być storna www – może być to dowolna grafika, plik Tekstowy itp.. Polecenie powodujące wstawienie Konkretnej grafiki wprost do dokumentu. Polecenia wewnętrzne ‘width’ i ‘height’ jak Sama ich nazwa mówi określą wielkość obrazka. Poprzedni slajd

Wygląd strony po kolejnych krokach... Wpisany tekst Pozioma linia Odnośnik do strony Koła Naukowego Wstawiona grafika W ten oto sposób stworzona została przez nas najprostsza strona WWW którą można oczywiście urozmaicać i wzbogacać zgodnie z naszą fantazją. Można dodać np. tabelę, wypunktowane listy, odsyłacze do innych stron i wiele wiele innych urozmaiceń które skuszą innych internautów do obejrzenia naszej strony. Dziękujemy za cierpliwe dotrwanie do końca. Mamy nadzieję, że sposób prezentacji był stosunkowo klarowny i nie sprawił większych kłopotów ! (Za niedociągnięcia w niniejszej prezentacji przepraszamy. Wszelkie uwagi proszę kierować na e autorów.) Poprzedni slajd