Witryna w Internecie zasady tworzenia i funkcjonowania.NET
37
0
0
Pełen tekst
(2) Plan wykładu • Wprowadzenie • Działanie strony internetowej – statycznej – dynamicznej. • Tworzenie stron internetowych – technologie i narzędzia. • Projektowanie witryny – wskazówki. • Podsumowanie informatyka +. 2.
(3) Przykłady witryn i serwisów utworzonych przez uczniów Informatyka+. informatyka +. 3.
(4) Historia i przyszłość • 1969 Pierwsza sieć ARPANet (50 lat temu!) – przeznaczenie militarne – Paul Baran. • 1971/72 protokół poczty elektronicznej – Ray Tomlinson. • 1983 Narodziny Internetu protokół TCP/IP – Vinton Cerf, Robert Kahn. • 1991 Pierwsza strona internetowa – Tim Berners-Lee. • • • •. 1991 Internet w Polsce 2009 Web 2.0 … 201x Web 3.0. informatyka +. 4.
(5) Plan wykładu • Wprowadzenie • Działanie strony internetowej – statycznej – dynamicznej. • Tworzenie stron internetowych – technologie i narzędzia. • Projektowanie witryny – wskazówki. • Podsumowanie informatyka +. 5.
(6) Podstawowe pojęcia 1#3 • Strona internetowa – wynik interpretacji dokumentu HTML <HTML>. • <HEAD> Strona a witryna, serwis, portal <TITLE> Prosta strona WWW </TITLE> • </HEAD> Przeglądarka <BODY> – „tłumaczy” kod HTML na postać <FONT FACE="Arial"> <CENTER> oglądaną na ekranie <H1> Informatyka + </H1> Witajcie na zajęciach Wszechnicy popołudniowej! </CENTER> </BODY> </HTML>. informatyka +. 6.
(7) Podstawowe pojęcia 2#3 • Serwer – komputer, na którym znajduje się opis strony internetowej, wraz z elementami składowymi (grafika, pliki do pobrania). informatyka +. 7.
(8) Podstawowe pojęcia 3#3 • Adres URL – unikatowy adres, pod którym jest dostępna konkretna strona internetowa • Struktura adresu URL http://www.informatykaplus.edu.pl/upload/dokumenty/regulamin.pdf http://. nazwa_serwera.pl/. katalog/. https:// nazwa protokołu sieciowego (sposobu przesyłania danych z serwera do przeglądarki). plik.html plik.pdf. nazwa domenowa serwera, z którego zostanie pobrany dokument HTML (wyświetlony jako strona). nazwa folderu (katalogu) na serwerze. informatyka +. nazwa pobieranego pliku (dokumentu HTML) znajdującego się w tym folderze (katalogu). 8.
(9) Zasada działania strony internetowej • Architektura klient – serwer. informatyka +. 9.
(10) Zasada działania strony dynamicznej • Opis strony dynamicznej jest tworzony przez serwer w momencie, kiedy użytkownik zażąda jej wyświetlenia. informatyka +. 10.
(11) Strony statyczne a strony dynamiczne 1#2 • Strony statyczne. •. – ta sama treść – wszyscy użytkownicy widzą to samo. Strony dynamiczne - treść generowana na bieżąco - różni użytkownicy mogą widzieć inną treść - baza danych częstym uzupełnieniem. informatyka +. 11.
(12) Strony statyczne a strony dynamiczne 2#2 Wady Strony statyczne. Strony dynamiczne. Zalety. - nie można szybko zmienić treści - interakcja z użytkownikiem bardzo ograniczona. - łatwo je utworzyć (kod HTML). - trudniej je utworzyć (języki skryptowe są trudniejsze do opanowania niż HTML) - wymagają bazy danych na serwerze. - łatwo i szybko można zmienić treść - umożliwiają interakcję z użytkownikiem. informatyka +. 12.
(13) Tworzenie stron dynamicznych - języki skryptowe <HTML> <HEAD> <TITLE> Prosta strona WWW </TITLE> </HEAD> <BODY> <H1> Informatyka + </H1> Witaj na zajęciach Wszechnicy Popołudniowej w dniu: <?php echo date("Y-m-d"); ?> </BODY> </HTML>. informatyka +. 13.
(14) Plan wykładu • Wprowadzenie • Działanie stron internetowych – statycznych – dynamicznych. • Tworzenie stron internetowych – technologie i narzędzia. • Projektowanie witryny – wskazówki. • Podsumowanie informatyka +. 14.
(15) Od czego zacząć?.. -> HTML • Kurs HTML w Internecie – http://www.kurshtml.boo.pl/. • Edytor – Notepad++. Piotr Kopciał informatyka +. 15.
(16) Następny krok.. -> CSS Cascading Style Sheets – kaskadowe arkusze stylów • Przykłady • Kurs CSS w Internecie – http://www.kurshtml.boo.pl/css/. Piotr Kopciał informatyka +. 16.
(17) Witryna na skróty – szablony w Internecie http://www.opendesigns.org/. Piotr Kopciał informatyka +. 17.
(18) PHP & MySQL • PHP – ang. Hypertext Preprocessor – skryptowy język. programowania po stronie serwera używany do tworzenia dynamicznych stron internetowych. • MySQL - system relacyjnych baz danych, wspierający działanie dynamicznych stron internetowych. • Przykład • Kurs PHP w Internecie – http://phpkurs.pl/. Piotr Kopciał informatyka +. 18.
(19) ASP.NET & MS SQL Serwer • ASP.NET – platforma firmy Microsoft, służąca do tworzenia dynamicznych stron internetowych, aplikacji oraz usług sieciowych. • Microsoft Visual Web Developer 2008 Express Edition – http://www.microsoft.com/express/vwd/. • ASP.NET w Internecie – http://www.asp.net/learn/. Piotr Kopciał informatyka +. 19.
(20) Plan wykładu • Wprowadzenie • Działanie strony internetowej – statycznej – dynamicznej. • Tworzenie strony internetowej – Technologie i narzędzia. • Projektowanie witryny – wskazówki. • Podsumowanie informatyka +. 20.
(21) Projektowanie witryny 1#3 „Nie można kopać dołu na fundamenty, nie mając gotowego projektu domu” • co chcę umieścić na stronie? • do kogo strona jest adresowana? • w jaki sposób chcę zaprezentować siebie (swoje hobby, firmę) innym? informatyka +. 21.
(22) Projektowanie witryny 2#3 • Najczęściej umieszczamy: – informacje o sobie (hobby) lub swojej firmie – zdjęcia (prywatne lub oferowanych produktów) – formularz (komentarze, księga gości) – grafika (strona atrakcyjna wizualnie). • Stosujemy obramowanie informatyka +. 22.
(23) Projektowanie witryny 3#3 • Plan na papierze:. Piotr Kopciał informatyka +. 23.
(24) Jak ludzie widzą witryny internetowe • Internauci są niecierpliwi – 15 sekund. • Schemat oglądania strony – 1,2,3. informatyka +. 24.
(25) Nie jesteśmy odbiorcami swojej witryny Nie projektujemy strony dla siebie - projektujemy ją dla innych użytkowników, którzy będą naszą stronę odwiedzać.. • • • •. Nie wszyscy odbiorcy strony są podobni do nas O swojej witrynie wiemy więcej niż inni O odbiorcy wiemy mniej, niż nam się wydaje Najczęściej popełniane błędy: – – – –. używanie żargonu (słowa niezrozumiałe dla innych) złe zaplanowanie układu strony niepogrupowanie informacji na dany temat elementy rozpraszające (zam. przyciągające) uwagę. informatyka +. 25.
(26) Elementy stron internetowych • Tekst • Obrazy – grafika – zdjęcia. • Formularze • Multimedia • Elementy dynamiczne – kalendarz , zegar, horoskop, pogoda …. informatyka +. 26.
(27) Elementy stron internetowych – tekst • Duża wartość informacyjna • Szybkość wyświetlania • Mało atrakcyjny informatyka +. 27.
(28) Elementy stron internetowych – obrazy (grafika, zdjęcia) • Przyciąga uwagę • Możliwość powiększania zdjęć • Szybkość wyświetlania informatyka +. 28.
(29) Elementy stron internetowych – formularze. • Zbieranie informacji od użytkowników – – – –. rejestracja ankieta zamówienia transakcje. Piotr Kopciał informatyka +. 29.
(30) Elementy stron internetowych – multimedia (audio, video). • Najbardziej atrakcyjne. informatyka +. 30.
(31) Elementy dynamiczne • • • • • • • •. Kalendarz Zegar Pogoda Horoskop Waluty Giełda Położenie …. informatyka +. 31.
(32) Kompozycja strony – obramowanie. • Grupowanie informacji • Utrzymanie porządku • Komponowanie zawartości Piotr Kopciał informatyka +. 32.
(33) 5 skutecznych sposobów na odstraszenie użytkowników Wyłączenie serwera. • •. strona niedostępna dla użytkowników. Za dużo elementów multimedialnych. • • •. spowolnienie wyświetlania strony rozproszenie uwagi użytkownika. Zmiana rozmieszczenia elementów. • •. użytkownik się gubi. Niedziałające łącza. • •. użytkownik się denerwuje. Brak aktualizacji. • •. brak powodu do ponownych odwiedzin. informatyka +. 33.
(34) 5 sposobów poprawy witryny Skoncentruj się najpierw na działaniu strony, potem na wyglądzie. •. •. kompromis pomiędzy wyglądem a szybkością. Myśl o użytkowniku. • •. wczuj się w jego rolę. Projektuj zgodnie z konwencją. • •. sprawdzony schemat układu strony. Zwróć uwagę na szczegóły. • •. błahe, ale kłopotliwe błędy. Testuj. • •. i poprawiaj według uwag i sugestii użytkowników. informatyka +. 34.
(35) Plan wykładu • Wprowadzenie • Działanie strony internetowej – statycznej – dynamicznej. • Tworzenie strony internetowej – Technologie i narzędzia. • Projektowanie witryny – wskazówki. • Podsumowanie informatyka +. 35.
(36) Nauka projektowania stron internetowych • Literatura – J. Cohen, Serwisy WWW. Projektowanie, tworzenie, zarządzanie, Wyd. Helion, Gliwice 2004 – J. Price, L. Price, Profesjonalny serwis WWW, Wyd. Helion, Gliwice 2002 – L. Hobbs, Strony WWW. To proste, Wyd. RM, Warszawa 2002. • Adres w Internecie – http://html.projektowanie-stron.edl.pl/. informatyka +. 36.
(37)
(38)
Powiązane dokumenty
Standardowa entalpia reakcji (ΔrH) jest równa sumie standardowych entalpii tworzenia produktów i substratów, w której każdy wyraz jest pomnożony.. przez
► wersje < 4.0 atomowość dla pojedynczych dokumentów, później dla wielu dokumentów (z wielu kolekcji) w pojedynczym shardzie. ► Od wersji 4.2 rozszerzenie atomowości na
Operacja połączenia równościowego, w której jeden z atrybutów połączeniowych jest usunięty ze schematu relacji wynikowej, jest nazywana po łą czeniem naturalnym (ang.
1) naruszenie zakazu dowodzenia określonych faktów oraz naruszenie zakazu dowodowego bezwzględnego i pozyskanie w ten sposób dowodu sprawia, że dowód ten nie
• sumaryczne polegające na tym, że normę czasu ustala się w sposób całościowy bez podziału operacji na elementy składowe ( zabiegi, czynności i ruchy
Metoda separacji zmiennych może być stosowana do rozwiązywania zagadnień granicznych dla równań różniczkowych cząstkowych rzędu wyższego niż drugi.. METODA FOURIERA DLA
n inplementacyjne modele danych stosowane to transformacji wcześniej przygotowanego modelu koncepcyjnego do konkretnego modelu danych bazy danych, a więc do postaci, która jest
Tor teletransmisyjny jest to droga przesyłowa sygnałów elektrycznych (informacji) między dwoma punktami, przestrzennie ograniczona.. praktycznie do walca o
