21
Własna strona Własna strona internetowa internetowa

Własna strona internetowa. Do zrobienia strony internetowej wystarczy nam zwykły edytor tekstu, np.: Notatnik oraz znajomość kilku komend. 1.Pisanie strony

  • View
    222

  • Download
    2

Embed Size (px)

Citation preview

Page 1: Własna strona internetowa. Do zrobienia strony internetowej wystarczy nam zwykły edytor tekstu, np.: Notatnik oraz znajomość kilku komend. 1.Pisanie strony

Własna strona Własna strona internetowainternetowa

Page 2: Własna strona internetowa. Do zrobienia strony internetowej wystarczy nam zwykły edytor tekstu, np.: Notatnik oraz znajomość kilku komend. 1.Pisanie strony

Do zrobienia strony internetowej Do zrobienia strony internetowej wystarczy nam zwykły edytor tekstu, np.: wystarczy nam zwykły edytor tekstu, np.: Notatnik oraz znajomość kilku komend.Notatnik oraz znajomość kilku komend.

<html>

</html>

1. Pisanie strony rozpoczynamy od znacznika <html>, podobnie kończymy: </html>2. Następnie powinny się tam znaleźć informacjenagłówkowe, które oznaczamy <head>…</head> <head

>

</head>

(a)Tytuł strony wpisujemy między znacznikami<title>…</title>

<title> </title>

3. Treść strony znajduje się w sekcji body, Oznaczmy ją: <body>…</body>. Ponadtow sekcji body możemy wstawiać:(a)Hiperłącza, np.:<a href=„www.google.pl">Google</a>

(b) Obrazki, np.:<img src=„obrazek.jpg" alt=„Tytuł obrazka">

(c) Formatowanie tekstu <font size="48" color="blue" face="Arial"> Formatowany tekst </font>

<body>

</body>

Page 3: Własna strona internetowa. Do zrobienia strony internetowej wystarczy nam zwykły edytor tekstu, np.: Notatnik oraz znajomość kilku komend. 1.Pisanie strony

Przykładowa stronaPrzykładowa strona

Page 4: Własna strona internetowa. Do zrobienia strony internetowej wystarczy nam zwykły edytor tekstu, np.: Notatnik oraz znajomość kilku komend. 1.Pisanie strony

<html><html><head><head><meta http-equiv="content-type" content="text/html; charset=windows-<meta http-equiv="content-type" content="text/html; charset=windows-

1250"><title>Stronka</title>1250"><title>Stronka</title></head></head><body><body><body bgcolor="black"><body bgcolor="black"><font size="48" color="blue" face="Arial"> Tak spędziłem wakacje</font></br><font size="48" color="blue" face="Arial"> Tak spędziłem wakacje</font></br><img src=http://bdu.bzwbk.pl/_items/bdu/img/przebojowe_wakacje_1.jpg <img src=http://bdu.bzwbk.pl/_items/bdu/img/przebojowe_wakacje_1.jpg

alt=„MoJe wAkAcJe"> alt=„MoJe wAkAcJe"> <font color="red" size="5" face="Arial"><font color="red" size="5" face="Arial">Morze Bałtyckie, Bałtyk – płytkie morze śródlądowe na szelfie kontynentalnym w Morze Bałtyckie, Bałtyk – płytkie morze śródlądowe na szelfie kontynentalnym w

Europie północnej. Połączone z Morzem Północnym przez Cieśniny Duńskie Europie północnej. Połączone z Morzem Północnym przez Cieśniny Duńskie (Sund, Mały i Wielki Bełt) oraz Kattegat i Skagerrak. Za zachodnią granicę (Sund, Mały i Wielki Bełt) oraz Kattegat i Skagerrak. Za zachodnią granicę Bałtyku przyjmuje się cieśninę Sund i próg podwodny ciągnący się na Bałtyku przyjmuje się cieśninę Sund i próg podwodny ciągnący się na głębokości 18–20 m od przylądka Gedser (wyspa Falster) do przylądka Darßer głębokości 18–20 m od przylądka Gedser (wyspa Falster) do przylądka Darßer Ort (Darß).</br>Ort (Darß).</br>

Źródło:</font> </br> <a href="http://pl.wikipedia.org/wiki/Morze_BaŹródło:</font> </br> <a href="http://pl.wikipedia.org/wiki/Morze_Ba%C5%82tyckie"> %C5%82tyckie">

<font size="5">Wikipedia </font><font size="5">Wikipedia </font></body></body></html></html>

Oto kod źródłowy tej Oto kod źródłowy tej stronystrony

<- obsługa polskich <- obsługa polskich znakówznaków

<-kolor tła<-kolor tła<-formatowanie tekstu<-formatowanie tekstu<- wstawianie obrazka<- wstawianie obrazka

Page 5: Własna strona internetowa. Do zrobienia strony internetowej wystarczy nam zwykły edytor tekstu, np.: Notatnik oraz znajomość kilku komend. 1.Pisanie strony

Inny przykład stronyInny przykład strony

Page 6: Własna strona internetowa. Do zrobienia strony internetowej wystarczy nam zwykły edytor tekstu, np.: Notatnik oraz znajomość kilku komend. 1.Pisanie strony

<html><head><meta http-equiv="content-type" content="text/html; charset=windows-1250"><title>Stronka</title></head><body><h1>Plan lekcji</h1><table border="3"><tr><td>Lp</td><td>Poniedziałek</td><td>Wtorek</td><td>Środa</td><td>Czwartek</td><td>Piątek</td></tr><tr><td>1</td><td>Historia</td><td>Matematyka</td> <td>Polski</td> <td>Plastyka</td> <td>Polski</td></tr><tr><td>2</td> <td>Przyroda</td> <td>Przyroda</td> <td>Matematyka</td> <td>Angielski</td> <td>W.F</td></tr><tr><td>3</td><td>Religia</td><td>Polski</td><td>W.F</td> <td>Muzyka</td> <td>Angielski</td></tr><tr><td>4</td> <td>Matematyka</td> <td>Godz.Wych</td> <td>W.F</td> <td>Muzyka</td> <td>Angielski</td></tr><tr><td>5</td> <td>Plastyka</td> <td>Matematyka</td> <td>Matematyka</td> <td>Informatyka</td> <td>Przyroda</td></tr><tr><td>6</td> <td>Religia</td> <td>Angielski</td> <td>Angielski</td> <td> </td> <td>Polski</td></tr></table><h1>Dodatkowe zajęcia</h1>Matematyka</br>Piłka nożna</br>Przyroda</br>Basen</br><h1>LINKI</h1><a href="http://www.matematyka.pl">Strona matematyka.pl</a></br><a href="http://spstepnica.republika.pl/basen2.JPG">Zdjęcie z zajęć na basenie</a></br></br></br>Wyróżniamy 6 rzędów tytułów. Można ich używać do tytułowania rozdziałów, podrozdziałów, itp. Oznaczamy je odpowiednio:<h1>Pierwszy tytuł </h1> <h2>Drugi tytuł</h2> <h3>Trzeci tytuł</h3> <h4>Czwarty tytuł</h4> <h5>Piąty tytuł</h5> <h6>Szósty tytuł</h6></body></html>

Oto kod źródłowy tej Oto kod źródłowy tej stronystrony

<-Początek tabeli<-Początek tabeli

<-Początek nowego <-Początek nowego wierszawiersza

<-Początek nowej kolumny<-Początek nowej kolumny

Page 7: Własna strona internetowa. Do zrobienia strony internetowej wystarczy nam zwykły edytor tekstu, np.: Notatnik oraz znajomość kilku komend. 1.Pisanie strony

W dalszej części prezentacji poznamy W dalszej części prezentacji poznamy ciekawe i łatwe narzędzie do tworzenia ciekawe i łatwe narzędzie do tworzenia stron internetowych w trybie WYSIWYG stron internetowych w trybie WYSIWYG (What You See Is What You Get - to (What You See Is What You Get - to skrótowiec stosowany w informatyce dla skrótowiec stosowany w informatyce dla określenia metod, które pozwalają uzyskać określenia metod, które pozwalają uzyskać wynik w publikacji identyczny lub bardzo wynik w publikacji identyczny lub bardzo zbliżony do obrazu na ekranie) o nazwie zbliżony do obrazu na ekranie) o nazwie Google Sites.Google Sites.

Page 8: Własna strona internetowa. Do zrobienia strony internetowej wystarczy nam zwykły edytor tekstu, np.: Notatnik oraz znajomość kilku komend. 1.Pisanie strony

Początki projektuPoczątki projektu

Pod koniec 2006 roku poinformowano o Pod koniec 2006 roku poinformowano o przejęciu przez Google niewielkiej firmy przejęciu przez Google niewielkiej firmy JotSpot, a wraz z nią wygodnego w JotSpot, a wraz z nią wygodnego w obsłudze zestawu narzędzi internetowych, obsłudze zestawu narzędzi internetowych, opartych na mechanizmie wiki, do pracy opartych na mechanizmie wiki, do pracy grupowej online. Po wielomiesięcznym grupowej online. Po wielomiesięcznym procesie integracji narzędzi JotSpot z procesie integracji narzędzi JotSpot z Google Apps gigant z Kalifornii udostępnił Google Apps gigant z Kalifornii udostępnił je 27 lutego br. internautom pod nazwą je 27 lutego br. internautom pod nazwą Google Sites. Google Sites.

Page 9: Własna strona internetowa. Do zrobienia strony internetowej wystarczy nam zwykły edytor tekstu, np.: Notatnik oraz znajomość kilku komend. 1.Pisanie strony

Zanim przejdziemy do Zanim przejdziemy do zakładania strony…zakładania strony…

Powinniśmy założyć konto w Powinniśmy założyć konto w serwisie Google, np.: E-mail na serwisie Google, np.: E-mail na stronie stronie www.mail.google.comwww.mail.google.com

Przejść na adresPrzejść na adres www.sites.google.comwww.sites.google.com

Zalogować sięZalogować się

Page 10: Własna strona internetowa. Do zrobienia strony internetowej wystarczy nam zwykły edytor tekstu, np.: Notatnik oraz znajomość kilku komend. 1.Pisanie strony

W dalszej części pokazu obejrzymy W dalszej części pokazu obejrzymy prezentację wideo, pokazującą jak prezentację wideo, pokazującą jak założyć własną stronę oraz jak dodać założyć własną stronę oraz jak dodać do niej różne ciekawe rzeczy.do niej różne ciekawe rzeczy.

Page 11: Własna strona internetowa. Do zrobienia strony internetowej wystarczy nam zwykły edytor tekstu, np.: Notatnik oraz znajomość kilku komend. 1.Pisanie strony

Zakładanie stronyZakładanie strony

Page 12: Własna strona internetowa. Do zrobienia strony internetowej wystarczy nam zwykły edytor tekstu, np.: Notatnik oraz znajomość kilku komend. 1.Pisanie strony

Edycja strony głównejEdycja strony głównej

Page 13: Własna strona internetowa. Do zrobienia strony internetowej wystarczy nam zwykły edytor tekstu, np.: Notatnik oraz znajomość kilku komend. 1.Pisanie strony

Dodawanie stron, podstron Dodawanie stron, podstron i hiperłączyi hiperłączy

Page 14: Własna strona internetowa. Do zrobienia strony internetowej wystarczy nam zwykły edytor tekstu, np.: Notatnik oraz znajomość kilku komend. 1.Pisanie strony

Dodawanie obrazkówDodawanie obrazków

Page 15: Własna strona internetowa. Do zrobienia strony internetowej wystarczy nam zwykły edytor tekstu, np.: Notatnik oraz znajomość kilku komend. 1.Pisanie strony

Dodawanie klipów z Dodawanie klipów z YouTubeYouTube

Page 16: Własna strona internetowa. Do zrobienia strony internetowej wystarczy nam zwykły edytor tekstu, np.: Notatnik oraz znajomość kilku komend. 1.Pisanie strony

Strona z ogłoszeniamiStrona z ogłoszeniami

Page 17: Własna strona internetowa. Do zrobienia strony internetowej wystarczy nam zwykły edytor tekstu, np.: Notatnik oraz znajomość kilku komend. 1.Pisanie strony

Edycja paska bocznegoEdycja paska bocznego

Page 18: Własna strona internetowa. Do zrobienia strony internetowej wystarczy nam zwykły edytor tekstu, np.: Notatnik oraz znajomość kilku komend. 1.Pisanie strony

Gotowa stronaGotowa strona

Page 19: Własna strona internetowa. Do zrobienia strony internetowej wystarczy nam zwykły edytor tekstu, np.: Notatnik oraz znajomość kilku komend. 1.Pisanie strony

Na koniec pokażemy jak dodać stronę Na koniec pokażemy jak dodać stronę do zasobów Google, tj. żeby do zasobów Google, tj. żeby wyszukiwarka google.pl znajdowała wyszukiwarka google.pl znajdowała ją po wpisaniu odpowiednich słów.ją po wpisaniu odpowiednich słów.

Page 20: Własna strona internetowa. Do zrobienia strony internetowej wystarczy nam zwykły edytor tekstu, np.: Notatnik oraz znajomość kilku komend. 1.Pisanie strony

Dodanie strony do zasobów Dodanie strony do zasobów GoogleGoogle

Page 21: Własna strona internetowa. Do zrobienia strony internetowej wystarczy nam zwykły edytor tekstu, np.: Notatnik oraz znajomość kilku komend. 1.Pisanie strony

Oczywiście to tylko niektóre z Oczywiście to tylko niektóre z elementów, dzięki którym można elementów, dzięki którym można sprawić, że nasza strona będzie sprawić, że nasza strona będzie ciekawsza i ładniejsza. Można jeszcze ciekawsza i ładniejsza. Można jeszcze dodawać logo strony, zmieniać kolor dodawać logo strony, zmieniać kolor tła stron i podstron, itp.tła stron i podstron, itp.