Klasa 8

 

Materiały do pobrania:

adresowanie względne: https://1drv.ms/x/s!AuUBlvKlkrLUg0E4fcxo_ek56faG?e=DR66bf

adresowanie bezwzględne:

zad 1: https://1drv.ms/x/s!AuUBlvKlkrLUgz73hvCfvPFYUpY4?e=NfflJb

zad 2: https://1drv.ms/x/s!AuUBlvKlkrLUgz-d85UtYO2g4J-i?e=cc4yQw

zad 3:https://1drv.ms/x/s!AuUBlvKlkrLUg0Bot0TRrH4J0i1y?e=eZKOLa

Nauczanie zdalne

Temat: Tworzenie strony internetowej z wykorzystaniem języka HTML

Lekcja1

Na dzisiejszej lekcji:

  • poznasz ogólne zasady tworzenia stron internetowych
  • poznasz narzędzia do tworzenia storn internetowych
  • dowiesz się, czym jest kod źródłowy strony internetowej

Zapoznaj się z informacjami ogólnymi na team tworzenia stron internetowych  umieszczonymi na stronie internetowej  – rozdziały:

  • Projektowanie i tworzenie stron WWW
  • Rodzaje stron internetowych
  • Zasady projektowania stron WWW
  • Tworzenie stron WWW za pomocą edytorów graficznych i tekstowych)

https://epodreczniki.pl/a/projektowanie-i-tworzenie-stron-www/D12oVbC7T

lub w podręczniku str. 186-188

Do zeszytu przedmiotowego przepisz notatkę:

Zapamiętaj:

  • Witryna jest zbiorem stron WWW powiązanych ze sobą hiperłączami, umieszczonych pod tym samym adresem internetowym
  • Strona internetowa powinna być przejrzysta, czytelna, atrakcyjna graficznie (m.in. nie przeładowana elementami graficznymi, z odpowiednio dobraną kolorystyką tła i tekstu oraz innych elementów oraz poprawna pod względem merytorycznym i i redakcyjnym
  • Standardowym sposobem opisu stron WWW jest język znaczników HTML
  • Strony można tworzyć w edytorach tekstu lub w specjalnych edytorach HTML.
  • Edytory graficzne stosowane są rzadko przez osoby zajmujące się tworzeniem stron WWW.
  • Podstawowy język HTML, możesz poznać podczas korzystania edytorów tekstowych. Do tego rodzaju edytorów zaliczany: Notatnik – edytor bezpłatny, Notepad++ – edytor bezpłatny, Pajączek – edytor płatny – zawiera gotowe szablony i poradniki dla początkujących
  • Korzystając ze znaczników możemy formatować tekst na stronie oraz wstawiać obrazy, hiperłącza do innych stron, tabele

 Lekcja 2 – lekcja przygotowana na podstawie informacji  umieszczonych na stronie internetowej https://epodreczniki.pl/a/projektowanie-i-tworzenie-stron-www/D12oVbC7T

Temat: Tworzenie stron WWW z wykorzystaniem języka HTML

Dokument HTML to zwykły plik tekstowy, który możesz tworzyć i modyfikować praktycznie w każdym edytorze tekstu.

Do obejrzenia efektów pracy konieczna będzie dowolna przeglądarka, która odczytuje plik HTML z dysku lokalnego, a następnie przetwarza go i wyświetla tak samo, jak pliki z sieci WWW np. Mozilla FireFox.

Struktura dokumentu HTML

Na początku dokumentu powinien znajdować się znacznik <!doctype html>. Nazywany jest definicją typu i może być użyty tylko raz, na samym początku pliku. Mówi on przeglądarce, że nie jest to zwykły plik tekstowy, ale dokument HTML.

Z kolei znacznik <html> występujący zaraz za definicją typu wskazuje początek właściwego dokumentu i jednocześnie deklaruje język, w którym dokument zostanie napisany.

Na samym końcu znajduje się znacznik </html>, który wskazuje jego koniec.

Pomiędzy tymi znacznikami znajduje się treść dokumentu, która podzielona jest na dwie części: nagłówek <head> i część główną, tzw. ciało <body>.

Podstawowa struktura dokumentu, która odpowiada pustej stronie jest następująca:

<!doctype html>

<html>

<head></head>

<body></body>

</html>

Krok 1.

Utwórz katalog HTML na swoim komputerze. Uruchom program Notatnik i przepisz podstawową strukturę dokumentu HTML, odpowiadającą pustej stronie.

<!doctype html>

<html>

<head>

</head>

<body>

</body>

</html>

Zapisz plik we wcześniej utworzonym folderze jako plik tekstowy, nadając mu nazwę index z rozszerzeniem html (inex.html. Pamiętaj o zmianie sposobu kodowania na UTF-8 (rys2). Obejrzyj wynik swojej pracy w przeglądarce internetowej rys. 3 (aby to zrobić zamknij plik idex.html otwarty w Notatniku, a następnie kliknij prawym przyciskiem myszy na ten dokument i wybierz Otwórz za pomocą np. Mozilla Firefox). Efektem Twojej pracy będzie pusta strona rys. 4.

Nagłówek strony <head>

Nagłówek wyznacza początek strony i zawiera informacje o tytule dokumentu i jego autorze, rodzaju języka, którym będzie się posługiwał oraz odwołania, do innych powiązanych z nim tym dokumentem, stron i zasobów.

Jedynym jego widocznym elementem na stronie jest tytuł wyświetlany na górnym pasku okna przeglądarki.  Zawartość tytułu jest ponadto wykorzystywana przez wyszukiwarki przy poszukiwaniu dokumentów w sieci. Umieszcza się go w nagłówku, posługując się znacznikami <title>….</title>

Krok 2

Otwórz dokument index.html za pomocą Notatnika.

 

 

 

 

 

Dodaj do kodu źródłowego utworzonego w kroku 1 pliku, tytuł dokumentu, który będzie widoczny na górnym pasku okna przeglądarki.

Koniecznie zapisz zmiany naciskając przycisk ZAPISZ, a następnie obejrzyj wynik swojej pracy w przeglądarce internetowej ( rys.3). Wynik twojej pracy będzie następujący:

Oprócz tytułu w nagłówku strony znajdują się informacje, umieszczane w pojedynczym znaczniku <meta>, z wykorzystaniem tzw. atrybutów oraz ich wartości, podawanych w cudzysłowach, np.

<meta name=”nazwa” content=”treść” />

gdzie name to nazwa atrybutu, a nazwa jest wartością tego atrybutu

Najbardziej rozpoznawalne rodzaje atrybutów znacznika <meta> to:

    author – autor strony;

<meta name=”author” content=”dane autora” /> 

 description – opis strony do wykorzystania przez katalogi lub wyszukiwarki;

<meta name=”description” content=”opis strony” />

generator – nazwa programu, przy pomocy którego powstała strona;

<meta name=”Generator” content=”nazwa edytora” />

keywords – lista słów kluczowych (informujących wyszukiwarki o treściach strony) oddzielonych przecinkami;

<meta name=”keywords” content=”wyraz1, wyraz2, wyraz3″ />

charset – określa kodowanie dokumentu HTML.

W html5 używając polskich znaków korzystamy z kodowania domyślnego UTF-8, będącego kodowaniem uniwersalnym pozwalającym na zapisanie niemal dowolnych symboli.

Krok 3

W dokumencie index.html (otworzonym za pomocą Notatnika) dodaj do kodu źródłowego  następujący wpis

<meta charset=”utf-8”/>

<meta name=”author” content=”Sankowska”/>

<meta name=”keywords” content=”pasma górskie, Europa, góry”/>

<meta name=”description” content=”Storna o europejskich pasmach górskich” />

Koniecznie zapisz zmiany naciskając przycisk ZAPISZ.

Część główna strony <body>

Zaraz po sekcji nagłówka występuje sekcja <body>…</body>, w której znajduje się właściwa zawartość dokumentu. W niej umieścisz treści, zdjęcia i multimedia, wykorzystując znaczniki, ich atrybuty i wartości.

Podstawowe znaczniki HTML i ich zastosowanie

Nagłówki

Żeby dodać tytuł i podtytuły w treści tworzonej strony, możesz skorzystać ze znaczników

<h1>, <h2>, <h3>, <h4>, <h5> oraz <h6>.

Nagłówek największy to <h1>, a najmniejszy to <h6>.

Jeśli wiec tworzysz stronę WWW zawierającą artykuł, to do nadania mu tytułu możesz użyć znacznika <h1>.

Nagłówki <h2> mogą wskazywać rozdziały,

a <h3> podrozdziały.

Tekst nagłówków jest pogrubiony.

Rozpoczynając pracę, zacznij od nagłówka pierwszego poziomu, umieszczając pomiędzy znacznikami <body>…</body> tytuł opisujący treść, którą chcesz zamieścić na stronie, np.

<h1> …..</h1>,

a następnie wstaw nagłówki poziomu drugiego i trzeciego.

Nagłówki oddzielone są od siebie pustą linią.

Krok 4

W dokumencie index.html (otworzonym za pomocą Notatnika)w odpowiednim miejscu kodu źródłowego  dodaj następujący wpis

<body>

<h1>Europejskie pasma górskie,</h1>

<h2>Alpy</h2>

<h2>Karpaty</h2>

<h3>Rysy</h3>

<h6>Tatry</h6>

<h2>Pireneje</h2>

</body>

</html>

Koniecznie zapisz zmiany naciskając przycisk ZAPISZ. Obejrzyj efekt swojej pracy przeglądarce internetowej.

link do testu

https://www.testportal.pl/test.html?t=3EGWV9JeSQtp

Lekcja 3

Temat: Tworzenie strony internetowej z wykorzystaniem języka HTML

Znaki specjalne

W celu wstawiania w dokumencie różnych symboli możesz skorzystać z tzw. encji HTML. Encja HTML to specjalny zestaw znaków określających nazwę encji, poprzedzonych znakiem & (ampersand), np.: „&lt;” – mniejszy niż (ang.less than), „&gt;” – większy od (ang. greather than).

Tekst poprawnie rozmieszczony na stronie powinien być również pozbawiony pojedynczych liter na końcach linii. W tym celu możesz pomiędzy spójnik, a słowo występujące bezpośrednio po nim, wprowadź tzw. niedzielącą spację, którą uzyskasz wprowadzając znacznik specjalny &nbsp;. Wyrazy połączone ze sobą tą spacją nie zostaną rozdzielone. Wprowadza on także dodatkową spację w dokumencie, a przez to umożliwia, po kilkakrotnym wpisaniu, zwiększanie odstępu między poszczególnymi wyrazami.

Encji, np. &nbsp; nie wpisujemy pomiędzy znakami większości.

Więcej encji znajdziesz na stronie: http://dev.w3.org/html5/html-author/charref

Krok 5

Poprzedni wpis uzupełnij znakami specjalnymi:

 

Formatowanie tekstu na stronie

Tekst umieszczany na stronie pisany jest standardową czcionką. Możemy jednak to zmienić, formatując wygląd i wielkość czcionki.

  • <i>…</i> Jeśli umieścisz tekst pomiędzy znacznikami, to przeglądarka odwzoruje go jako pisany kursywą.
  • <b>…</b> (styl pogrubiony)
  •  <u>…</u> (styl podkreślony)
  • <s>…</s> tekst przekreślony
  • <mark>…</mark> zaznaczenia fragmentu tekstu żółtym tłem
  • <hr> wstawia linię – którą można użyć np. do rozdzielenia wprowadzanych na stronie treści, podobnie jak znacznik <br>, nie posiada znaczników zamykających.
  • <sup> i </sup> oraz <sub> i </sub>tekst zawarty pomiędzy znacznikami  będzie zmodyfikowany, odpowiednio jako indeks górny i dolny, np. <b>a<sup>2</sup>+b<sup>2</sup>=c<sup>2</sup></b> pozwoli na przedstawienie na stronie zapisu: a2+b2=c2

Należy zwrócić uwagę na prawidłowe zagnieżdżanie znaczników. Znaczniki otwierane jako powinny być zamykane ostatnie, np.

<b><u><i>Formatowanie tekstu</i></u></b>

Znaczniki mogą występować z atrybutami, określającymi szczegółowe działanie danego znacznika np.

Aby wyśrodkować tekst „Warszawa jest stolicą Polski”

należy ustawić atrybut align znacznika <p> na wartość center:

<p align=center> Warszawa jest stolicą Polski</p>

Krok 6

Uzupełnij kod źródłowy:

 

 

 

 

 

 

 

 

Zapisz zmiany w kodzie źródłowym i obejrzyj wynik swojej pracy. Efekt powinien być następujący:

Jeżeli chcesz zacytować czyjąś wypowiedź, możesz skorzystać ze znacznika <blockquote>… </blockquote> oznaczającego cytat. Jego zawartością są całe akapity, oznaczone dodatkowym wcięciem tekstu.

Informację o autorze możesz przedstawić w postaci tekstu wyświetlonego po nakierowaniu kursora na cytat. Efekt ten uzyskasz, jeżeli dodasz do znacznika <blockquote> atrybut title, np: <blockquote title=”Autor: Jan Kasprowicz”>

Krok 7

Uzupełnij kod źródłowy:

 

 

 

 

 

 

 

Zapisz zmiany w kodzie źródłowym i obejrzyj wynik swojej pracy. Efekt powinien być następujący:

 

 

 

 

Lekcja 4

Temat: Tworzenie strony internetowej z wykorzystaniem języka HTML

Listy

Język HTML5 pozwala grupować treści, wykorzystując do tego celu trzy rodzaje list:

  • nieuporządkowaną (punktową),
  • uporządkowaną (numerowaną),
  • definiowaną.

Listę punktową utworzysz używając znaczników <ul> …</ul>,

a listę numerowaną – używając znacznika <ol>….</ol>

Wewnątrz list jedynymi dopuszczalnymi znacznikami są <li>…</li> Tylko wewnątrz niego zawarte mogą być kolejne elementy listy. Zawartością znacznika <li> może być zarówno tekst, jak i kolejne listy, tzw. zagnieżdżone.

W listach uporządkowanych można zmienić sposób oznaczania elementów listy, korzystając z atrybutów type oraz start. Atrybut start pozwala na rozpoczęcie numeracji od dowolnej liczby. Istnieje możliwość zastosowania jednego z pięciu sposobów numerowania elementów listy:

type=”A” – wielkie litery alfabetu (A, B, C, D),

type=”a” – małe litery alfabetu (a, b, c d),

type=”I” – wielkie cyfry rzymskie (I, II, III, IV),

type=”i” – małe cyfry rzymskie (i, ii, iii, iv),

type=”1” – cyfry arabskie.

Przykładowo, lista numerowana wielkimi cyframi rzymskimi, rozpoczynająca się od IV ma postać: <ol type=”I” start=”4”>

Krok 8

Uzupełnij kod źródłowy:

Wynik Twojej pracy powinien być następujący:

Obrazy

Poza tekstem, na strony WWW możesz wstawić grafikę. Służy do tego znacznik <img> z atrybutem src, określającym nazwę pliku. Znacznik ten nie potrzebuje znacznika zamykającego.Wstawiana grafika powinna być zapisana w formacie GIF, JPG, PNG lub SVG (format stworzony do wykorzystania na stronach internetowych).

Przykładowo:

<img src=”nazwa.jpg”>

Grafika zostanie wyświetlona po lewej stronie względem otaczającego tekstu.

(height) i szerokości (width) – to kolejne atrybuty pozwalają na określenie rozmiaru wczytywanej  grafiki, np.

Krok 9

Wyszukaj w Internecie zdjęcie przedstawiające pasma górskie. Zapisz zdjęcie w katalogu HTML (który utworzyłeś w kroku 1, w tym katalogu powinien również znajdować plik index.html) pod nazwą pasma z rozszerzeniem jpg, a następnie uzupełnij kod źródłowy:

 

 

 

Odnośniki

Jak już zapewne wiesz, odnośniki (hiperpołączenia) to odsyłacze do innych stron internetowych. Połączenia definiowane są za pomocą znacznika rozpoczynającego <a> oraz kończącego </a>, wewnątrz których zawarte są informacje określające hiperpołączenia.

Etykieta określająca połączenie do dowolnego adresu w Internecie ma postać

<a href=„http://adres strony”>tekst</a>,

gdzie:

<a> – etykieta otwierająca,

  href=” =„http://adres strony”- docelowy adres hiperpołączenia, czyli miejsce gdzie zostaniesz przeniesiony po kliknięciu w jego nazwę,

tekst– nazwa połączenia (odnośnika),

</a> – etykieta zamykająca.

Krok 10

Uzupełnij kod źródłowy. Zapisz zmiany. Obejrzy wynik pracy. Dodaj jeszcze 3 dowolne hiperłącza do strony.

 

 

 

 

 

Wynik Twojej pracy powinien być następujący:

 

 

 

Gotowe 🙂

Więcej informacji na temat tworzenia stron w języku HTML znajdziesz na stronach:

https://epodreczniki.pl/a/projektowanie-i-tworzenie-stron-www/D12oVbC7T

https://lekcjewsieci.pl/tworzenie-hiperlaczy-wewnetrznych-i-zewnetrznych-w-jezyku-html/

https://lekcjewsieci.pl/zmieniamy-czcionke-kolor-i-wielkosc-liter-w-jezyku-html/

https://lekcjewsieci.pl/wstawianie-zdjec-w-jezyku-html/

podręcznik str. 186 – 195

Uwaga: Utworzą na zajęciach stronę internetową proszę przesłać na adres sangosia1@gmail.com.

Należy spakować cały folder HTML i przesłać na podany wyżej adres (jeżeli prześlecie tylko plik index.html nie wszystkie elementy na stronie wyświetlą się).

Poniżej instrukcja instrukcja instalowania programu 7-Zip i archiwizowania:

https://1drv.ms/w/s!AuUBlvKlkrLUgguXO17Xh7P0ZGpm?e=wN5npm

Kryteria oceny:

ocena dostateczna – strona internetowa utworzona w wyniku wykonania kolejnych kroków z lekcji 2-4

ocena dobra – strona internetowa utworzona w wyniku wykonania kolejnych kroków z lekcji 2-4 została zmodyfikowana np. dodano nowe zdjęcia, zmieniono  kolor i grubość linii, zmieniono parametry czcionki …

ocena bardzo dobra lub celująca – uczeń utworzył nową stronę internetowa wykorzystując wiadomości zdobyte na lekcjach jak również czerpiąc dodatkowe informacje z wyżej wymienionych źródeł.

Powodzenia 🙂

Lekcja 5

Temat: Blogi — systemy zarządzania treścią

(podręczni str.198-206)

Internet pozwala szybko, efektywnie i efektownie dzielić się z innymi tym, co robisz i co cię interesuje. Korzystanie z tej możliwości może nie tylko pomóc w rozwijaniu umiejętności medialnych, lecz także wpływa na ożywianie i rozkwit życia w sieci. W sieci dostępne są narzędzia, tzw. systemy zarządzania treścią, z których możesz korzystać za darmo: np. WordPress, Blogger, Tumblr.

Zanim zaczniesz dzielić się informacjami i treściami, zastanów się, co i jak chcesz powiedzieć. Wybierz temat i znajdź sposób, żeby przedstawić go jak najatrakcyjniej. Jeśli dobrze piszesz, pisz pamiętnik albo recenzje czy artykuły. Jeśli lepiej czujesz się w bardziej bezpośredniej komunikacji, korzystaj z mikrofonu i kamery. Blog czy strona może być gazetą internetową, serwisem informacyjnym, platformą wymiany myśli czy twórczości. Treści, jakie zamieszczasz, mogą mieć dowolną formę:

  • teksty
  • zdjęcia
  • filmy
  • podcasty
  • narracje cyfrowe łączące różne media i środki ekspresji itd.

Ważne, żeby forma odpowiadała treści. Wybieraj środki wyrazu najlepiej współgrające z tematem.

W sieci dostępne są różne narzędzia do wspólnego tworzenia treści. Jednym z ciekawszych jest narzędzie WordPress. Jest to system zarządzania treścią. W trakcie zajęć będziecie mieli okazję stworzyć i edytować własnego bloga.

Na dzisiejszej lekcji:

  • samodzielnie stworzysz bloga z użyciem systemu zarządzania treścią WordPress,
  • z modyfikujesz wygląd strony,

Karta pracy: Systemy zarządzania treścią

Stronę, którą utworzymy na zajęciach możesz obejrzeć pod adresem https://sangosia.wordpress.com/

1.Wejdźcie na stronę

https://pl.wordpress.com/start/

  1. Załóż konto na serwisie podając swój adres e-mail, nazwę użytkownika, hasło.

 

 

 

 

 

 

Zapamiętaj koniecznie dane

3. W następnym ekranie podaj adres swojego bloga, wybierz Darmową opcję

 

 

 

 

  1. Sprawdź pocztę elektroniczną i aktywuj konto.

5.Na następnej stronie wybierz: Zacznij od bezpłatnej witryny.

 

 

  1. Uzupełnijcie tytuł witryny i jej krótki opis: Zarządzaj -> Ustawienia

Np.

Tytuł witryny: Informatyka

Slogan witryny: O algorytmice i programowaniu

Koniecznie zapisz ustawienia naciskając przycisk Save settings

  1. Wybierzcie wygląd bloga np.

Wybierz moty, kliknij w niego i aktywuj ten motyw naciskając8. , Yes, Activate …, następnie naciśnij przycisk Edit Homepage.

7. Naciśnij przycisk Moja witryna w lewym górnym rogu, rozwiń menu WITRYNA -> Strony. Wybierz stronę About i zmień informacje (zamiast About napisz „O mnie” i dodaj informacje, usuń niepotrzebne elementy). Zapisz zmiany klikając Zaktualizuj.

  1. Następnie edytuj stonkę Contact (wpisz dane, usuń elementy, które nie chcesz aby wyświetlały się na stronie). Zaktualizuj zmiany.

Zmodyfikuj odpowiednio strony Blog oraz Home. Pamiętaj o zaktualizowaniu zmian.

Uwaga: jeśli chcesz zmienić obrazek główny kliknij na niego i dodaj wcześniej przygotowaną grafikę (zapisana na swoim komputerze).

 

 

 

 

Wyloguj się

Lekcja 6

Temat: Lekcja: Blogi — systemy zarządzania treścią

Na dzisiejszej lekcji:

  • dodasz wpisy,
  • opublikujesz treści na blogu

Zanim przejdziesz do realizacji tematu proponuję obejrzeć następujące materiały:

9.Zaloguj się na stronie

10.Naciśnij przycisk Moja witryna w lewym górnym rogu, rozwiń menu WITRYNA -> Wpisy. Usuń przykładowe wpisy.

11. Dodaj nowy wpis klikając przycisk Dodaj nowy wpis 

 

Opublikuj wpis. Jeżeli chcesz obejrzeć wynik swojej pracy wpis powinien być publiczny.

12.Dodaj kolejny wpis

Aby wstawić dres internetowy należy wybrać Odnośnik, wpisać adres internetowy i zatwierdzić ENTEREM

13.Aby obejrzeć witrynę

14.Publikowanie witryny:

To jest adres utworzonej przez Ciebie strony.

 

 

 

 

15.Proszę pochwalić się swoją pracą wysyłając adres bloga na  sangosia1@gmail.com

16.Kasować utworzonego bloga (ale to dopiero kiedy sprawdzę pracę).

Lekcja 7

Temat: Prezentacje multimedialne i filmy

Na dzisiejszej lekcji:

  • poznasz podstawy montażu filmu
  • przygotujesz film na wybrany przez Ciebie temat

Umiesz już tworzyć prezentacje multimedialne. Przypomnij sobie najważniejsze wiadomości korzystając z wiadomości w podręczniku na str. 214-223.

Prezentację multimedialną można urozmaicić, wstawiając do niej film. Może to być film nagrany kamerą cyfrową, telefonem. Może to być również film utworzony ze zdjęć.

Istnieje wiele programów do edycji filmów.  Poniżej znajdziesz linki do filmików, które pomogą ci stworzyć film.

Program Zdjęcia będący w pakiecie systemu Windows 10 jest w istocie prostym edytorem wideo pozwalającym na szybkie i łatwe zmontowanie filmiku ze zdjęć i ujęć filmowych i podkładem muzycznym lub narracją.

Obejrzyj film instruktażowy (https://www.youtube.com/watch?v=-f7WlTp09Pc):

 

Video Editor bardzo prosty w obsłudze program (a dodatkowo bezpłatny), dzięki któremu przygotujecie swój własny film (np. z wakacji lub kręcony przy zupełnie innej okazji). W filmie instruktażowym krok po kroku, pokazane są etapy montażu https://www.youtube.com/watch?v=NyBAXr4o4so.

Link do strony z programem: https://icecreamapps.com/Video-Editor/

Ćwiczenie

Korzystając z wiedzy uzyskanej z filmów instruktażowych zmontuj film na wybrany przez siebie temat. Film zapisz na swoim komputerze. Nie musisz go odsyłać do mnie.

Lekcja 8

Temat: Historia i rozwój informatyki.

Na dzisiejszej lekcji:

  • poznasz przykłady dawnych urządzeń do obliczeń,
  • dowiesz się, jak powstały pierwsze komputery oraz poznasz kilka istotnych faktów z rozwoju informatyki i technologii informacyjnej
  • wykonasz projekt „Historia i rozwój informatyki”

Obejrzyj interesującą prezentację multimedialną na temat przeszłości i przyszłości informatyki autorstwa prof. dr hab. Macieja M Sysło:

Możesz też przeczytać informacje w podręczniku str. 230-239.

Praca domowa: Zapoznaj się z zdaniami projektowymi w podręczniku str.240-241. Stwórzcie dwuosobowe zespoły.  Wybierzcie jedno z zadań i zrealizujcie temat. Efektem waszej pracy powinien być film stworzony np. w aplikacji Zdjęcia. Czas na wykonanie pracy 2 tygodnie.

Lekcja 9.

Temat: Wprowadzenie do programowania w języku C++
Obejrzyj 2 filmiki.
Pierwszy: CZYM JEST PROGRAMOWANIE?
https://www.youtube.com/watch?v=k3Cv-fNlHTk

Drugi filmik o sposobie instalacji programu CodeBlocks (http://www.codeblocks.org/downloads/26) do programowania w języku C++.
Spróbuj zainstalować ten program na swoim komputerze według instrukcji z filmu.
Kurs C++ odc. 0: Programowanie w C++, instalacja CodeBlocks

https://www.youtube.com/watch?v=ErOzmh3BiXU

Składnia języka i stosowanie zmiennych.

  1. Obejrzyj filmik.
    Pierwszy: Kurs C++ odc. 1: Pliki projektu, pierwszy program
    https://www.youtube.com/watch?v=Kc98tH59A_U
  2. Zapoznaj się z  tematem „Wprowadzenie do programowania w języku C++” (Podręcznik s.40-45)

Lekcja 10

Temat:  Instrukcje warunkowe i iteracyjne w języku C++. (podręcznik str. 46-50)

Na dzisiejszej lekcji:

  • skorzystasz z instrukcji warunkowej pełnej
  • zastosujesz instrukcję warunkową uproszczoną
  • użyjesz instrukcji iteracyjnej for

 Obejrzyj poniższe filmy i wykonaj zawarte tam ćwiczenia.

Kurs C++ odc. 2: Instrukcja warunkowa if. Decyzje w programie

 https://www.youtube.com/watchv=hXLbgSh1Wo0&list=PLOYHgt8dIdoxx0Y5wzs7CFpmBzb40PaDo&index=3

Kurs C++ odc. 3: Pętla: for, while, do..while. Pętle wyjaśnione

https://www.youtube.com/watch?v=y6GOYVTVvqo&list=PLOYHgt8dIdoxx0Y5wzs7CFpmBzb40PaDo&index=4

Dla chętnych: Wykonaj ćwiczenia 3-9 z podręcznika (str.46-50) pomocne będą filmy:

Ćw. 3/45. Deklarujemy zmienne w programie i wykonujemy na nich obliczenia

https://www.youtube.com/watch?v=_1uNCEeHN9E&list=PLXpAX6-g9Ta75q7X-dNW2vdzL2o8PtVGq&index=3

Ćw. 4/45. Modyfikujemy program w języku C++

https://www.youtube.com/watch?v=zPJ__4qhzPE&list=PLXpAX6-g9Ta75q7X-dNW2vdzL2o8PtVGq&index=4

Ćw. 5/46 Uzupełniamy program w języku C++

https://www.youtube.com/watch?v=p3emvDzPhmQ&list=PLXpAX6-g9Ta75q7X-dNW2vdzL2o8PtVGq&index=5

Ćw. 6/47 Stosujemy instrukcję warunkową

https://www.youtube.com/watch?v=NJtIcs2olq4&list=PLXpAX6-g9Ta75q7X-dNW2vdzL2o8PtVGq&index=8

Ćw. 7/48 Stosujemy instrukcję warunkową w wersji uproszczonej

https://www.youtube.com/watch?v=fDK_yD2F8-o&list=PLXpAX6-g9Ta75q7X-dNW2vdzL2o8PtVGq&index=9

Ćw. 8/49 Stosujemy instrukcję iteracyjną for w języku C++

https://www.youtube.com/watch?v=Z3eT37UjAAc&list=PLXpAX6-g9Ta75q7X-dNW2vdzL2o8PtVGq&index=6

 Ćw. 9/50 Wyszukujemy największy element wśród n liczb

https://www.youtube.com/watch?v=RqQHCi7fR5o&list=PLXpAX6-g9Ta75q7X-dNW2vdzL2o8PtVGq&index=7

 Lekcja 11

Temat: Stosowanie funkcji i tablic w języku C++ do zapisywania algorytmów wyszukiwania i porządkowania. Funkcje i tablice w języku C++. (podręcznik str. 53-60)

Na dzisiejszej lekcji:

  • poznasz i zastosowanie funkcji w języku C++
  • poznasz i zastosujesz tablic w języku C++

Przeczytaj tekst w podręczniku str. 53-60, a następnie wykonaj ćwiczenia od 2 do 6. Pomocne będą poniższe filmy:

Ćw. 2/ 55. Definiujemy w języku C++ funkcję niezwracającą wartości

https://www.youtube.com/watch?v=y6tga19P-4w&list=PLXpAX6-g9Ta75q7X-dNW2vdzL2o8PtVGq&index=12

Ćw. 3/56 Definiujemy w języku C++ funkcję zwracającą wartość

https://www.youtube.com/watch?v=KPPil1JNsok&list=PLXpAX6-g9Ta75q7X-dNW2vdzL2o8PtVGq&index=10

Ćw. 4/57. Wywołujemy funkcję w programie głównym

https://www.youtube.com/watch?v=XWcUO9qk60M&list=PLXpAX6-g9Ta75q7X-dNW2vdzL2o8PtVGq&index=11

Ćw. 5/59. Wprowadzamy dane do tablicy

https://www.youtube.com/watch?v=RJqQzobhLVY&list=PLXpAX6-g9Ta75q7X-dNW2vdzL2o8PtVGq&index=16

Ćw. 6/59. Wyprowadzamy dane z tablicy na ekran

https://www.youtube.com/watch?v=bin6gFSmkig&list=PLXpAX6-g9Ta75q7X-dNW2vdzL2o8PtVGq&index=13

 Lekcja 12

Temat: Algorytmy porządkowania i wyszukiwania w języku C++

Na dzisiejszej lekcji:

  •  zastosujesz funkcje i tablice w algorytmach wyszukiwania i porządkowania w języku C++

Przeczytaj tekst w podręczniku str. 60-65, a następnie wykonaj ćwiczenia od 7 do 9. Pomocne będą poniższe filmy:

Ćw. 7/ 61. Algorytm porządkowania metodą przez wybieranie

https://www.youtube.com/watch?v=agSHgND8b0g&list=PLXpAX6-g9Ta75q7X-dNW2vdzL2o8PtVGq&index=14

Ćw. 8/63. Algorytm porządkowania metodą przez zliczanie

https://www.youtube.com/watch?v=1D7G0-fTaU0&list=PLXpAX6-g9Ta75q7X-dNW2vdzL2o8PtVGq&index=15

 

 

 

 

 

Prace proszę przesłać na adres sankowskam@op.pl.

W temacie wiadomości proszę wpisać : praca dodatkowa

W treści wiadomości: imię i nazwisko ucznia, klasę,

Temat: Komórka, adres, formuła

Podstawowe pojęcia

Arkusz kalkulacyjny to jakby pokratkowana kartka stanowiąca wielką tabelę.
Arkusz składa się z komórek wchodzących w skład kolumn i wierszy. Każda komórka arkusza kalkulacyjnego ma swój niepowtarzalny adres np. A1, F4. Adres komórki aktywnej wyświetla się w polu nazwy

Do komórek arkusza użytkownik wpisuje dane – teksty i liczby oraz formuły obliczeniowe.

Formuły rozpoczynają się znakiem =. To wzory pozwalające obliczyć wartość na podstawie zawartości innych komórek. Formuła może zawierać adresy komórek, biorących udział w obliczeniach, operatory matematyczne oraz funkcje.

Linie oddzielające kolumny i wiersze to linie siatki.

Po uruchomieniu programu na ekranie pojawia się skoroszyt (zeszyt).
Skoroszyt to zbiór arkuszy. W nowo otwartym skoroszycie są zazwyczaj trzy czyste arkusze. Skoroszyt zapisywany jest w postaci pliku na dysku.

Adresowanie bezwzględne

Każda komórka w arkuszu kalkulacyjnym ma swój adres.

W komórkach tych możesz wpisywać dowolne dane (liczby, litery..), które będą pobierane podczas wykonywania formuł.

Aby formuła „wiedziała”, jakie dane ma pobrać, należy użyć odpowiednich adresów komórek.

Dodatkowo podczas kopiowania formuł adresy komórek mogą się zmieniać. Mogą również pozostać niezmienione. Decydować o tym będzie sposób adresowania komórek w formułach.

  • adresowanie względne – polega na tym, że ogólna postać formuły po skopiowaniu nie zmienia się, natomiast odpowiednio zmieniają się adresy komórek zawarte w tej formule.

Pozostałe sposoby adresowania komórek poznasz na następnych lekcjach

Praca dodatkowa dla chętnych:

1) zadanie 1 – podręcznik str. 17

2) plik do pobrania z ćwiczeniami

Temat: Arkusz kalkulacyjny, czyli kalkulacje

Funkcje to zaprojektowane algorytmy obliczające lub wyszukujące określone wartości (np. średnia, maksimum).
Funkcja pobiera wartości z określonych komórek i podaje wynik. Komórki, z których funkcja pobiera wartości, nazywają się argumentami funkcji.

Składnia funkcji obejmuje:

  • nazwę (wyświetlaną wielkimi literami) np. SUMA , ŚREDNIA,
  • nawiasy okrągłe – nawias otwierający zaczyna się bezpośrednio po nazwie funkcji, nawias zamykający następuje po argumentach,
  • argumenty – adresy komórek, zakresy; jeżeli funkcja ma kilka argumentów rozdzielone są one średnikiem.
Przykłady zastosowania funkcji

Przykładowe formuły zawierające funkcje: =SUMA(A5:A10), =ŚREDNIA(A3;B12;C12),

Arkusze kalkulacyjne posiadają kilkaset funkcji. Funkcje zebrane są w kategorie.

Wstawianie funkcji do formuły ułatwia kreator funkcji.

W formułach nazwy funkcji wyświetlane są wielkimi literami.

Do analizowania wyników bardzo przydają się funkcje statystyczne. Najprostsze z nich to funkcje:

  • MAX – zwraca największą wartość spośród podanych argumentów.
  • MIN – zwraca najmniejszą wartość spośród podanych argumentów.
  • ŚREDNIA – zwraca średnią arytmetyczną podanych argumentów.

 

JEŻELI należy do grupy funkcji logicznych czyli takich, które testują pewne warunki i na tej podstawie wyświetlają odpowiedni wynik.

Jej składnia wygląda następująco:

=JEŻELI(test_logiczny;wartość_jeżeli_prawda; wartość_jeżeli_fałsz)

Do budowania warunków używa się operatorów porównań:

= (równe)

> (większe niż)

< (mniejsze niż)

>= (większe lub równe)

<= (mniejsze lub równe)

 

ARKUSZ KALKULACYJNY-  ZADANIA POWTÓRZENIOWE

Zadania powtórzeniowe