Utworzyć w notatniku plik o nazwie "index" z tekstem podanym na czerwono. Uwaga! Zapisując plik ("Zapisz jako") wybrać kodowanie "uft-8" a nie "ANSI"!
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=uft-8" />
<title>Your page title on browser tab</title>
</head>
<body>
Treść naszej strony internetowej...
</body>
</html>
By strona została otworzona w przeglądarce należy zmienić rozszerzenie pliku z ".txt" na ".html". Uwaga: rozszerzenia plików są zazwyczaj ukryte w Windowsie.
By włączyć widzialność rozszerzeń plików otwieramy dowolny folder i wybramy "Organizuj"a potem "Opcje folderów i wyszukiwania". Następnie w zakładce "Widok" odznaczamy opcję "Ukryj rozszerzenia znanych typów plików". Wtedy możemy zmienić rozszerzenie pliku (a nie tylko nazwę).
Ikonka powinna nam się zmienić na inną i po podwójnym kilknięciu "index.html" powienien otworzyć się w przeglądarce. Naszym oczom pokazać się strona z tekstem "Treść naszej strony internetowej...".
Elementy htmla
Jesteśmy teraz w stanie wzbogacić naszą stronę w nowe elementy edytując zawartość naszego pliku przez prawy przycisk myszy i "Otwórz za pomocą" -> Notatnik.
Headings, czyli nagłówki
Nagłówki jak te powyżej ("Startowy szablon", "Komendy htmla") tworzymy poprzez kod:
<h3>Headings, czyli nagłówki </h3>
Mamy 6 różnych wielkości nagłówków h1, h2, h3, h4, h5, h6 (od największego do najmniejszego). Ważne: nagłówki pozwalają nam na zgrabne podzielenie strony na sekcje/rozdziały i są one same z siebie pogrubione i powiększone.
Link prowadzący do pliku na serwerze w folderze "pliki" o nazwie <a href="pliki/art.pdf">art.pdf</a>.
<br />
Link prowadzący do innej <a href="http://www.ift.uni.wroc.pl/~rdurka">strony internetowej</a> .
Link prowadzący do pliku na serwerze w folderze "pliki" o nazwie art.pdf.
Link prowadzący do innej strony internetowej .
<ol>
<li> Pierwszy element</li>
<li> Drugi element</li>
</ol>
<ul>
<li> Pierwsza rzecz</li>
<li> Druga rzecz</li>
</ul>
Pierwszy element
Drugi element
Pierwsza rzecz
Druga rzecz
Filmy z youtube.com
Znajdź film i pod nim znajdź opcję "Udostępnij" a potem "Umieść". W rezultacie otrzymasz kod do wklejenia na stronie!
<iframe width="560" height="315" src="http://www.youtube.com/embed/JaAWdljhD5o" frameborder="0" allowfullscreen></iframe>
W tym celu wymyślić sobie nazwę loginu będącego nazwą strony! (ja
np. teraz podałem "dr-rd" więc moja strona nazywać się będzie http://dr-rd.cba.pl/) Proszę wybrać jakąś dobrą, profesjonalną nazwę (nawet typu imięnazwisko). Osobista strona internetowa to rzecz bardzo przydatna w życiu.
Po aktywacji konta i zalogowaniu wchodzimy w "Konta FTP", gdzie
podajemy dodatkowo hasło do konta admin@login.cba.pl (oczywiście
"login" należy zastąpić nazwą użytą do rejestracji na www.cba.pl)
Otwieramy "Mój Komputer" w Windows i w pasku adresu wpisujemy ftp://login.cba.pl:
-użytkownik: admin@login.cba.pl
-hasło
Teraz możemy umieszczać pliki oraz foldery na naszym serwerze poprzez
skopiowanie plików z własnego dysku. Zadbaj by na serwerze znalazł się folder "files" wraz z użytymi do powstania strony obrazkami, dokumentami, itp.
Sprawdźmy ich widoczność w przeglądarce internetowej:
-ftp://login.cba.pl/
-http://login.cba.pl/ (jeśli w katalogu głównym naszego serwera nie będzie pliku o nazwie "index.html, nie zobaczymy niczego)
Wreszcie do katalogu głównego przekopiuj swoją stronę "index.html".
ZADANIA DO WYKONANIA
Pierwsze zajęcia z htmla:
Zrób analogiczną stronę do tej poniżej z uwzględnieniem: wstawienia obrazka, linków do plików na serwerze, linków do innych stron, oknem z filmem, wypunktowaniem, wyliczeniem, kolorem, pogrubieniem, pochyleniem, wyrównaniem do prawej, odpowiednimi nagłówkami.
Następnie umieść ją na serwerze i link do strony wyślij prowadzącemu na jego adres mejlowy: remigiuszdurka@gmail.com
