czwartek, 17 grudnia 2015

Tabela HTML
<table>
Kolejnym sposobem prezentowania i grupowania danych w języku Html jest tabela. Sposób prezentowania danych w tabeli html jest taki sam jak w każdej innej tabeli , którą znamy z życia codziennego. Tabele tworzymy przy użyciu elementu<table>.
<table>
</table>
Wiersz
<tr>
Jednak, żeby tabela powstała, musimy do niej dodać jeszcze wiersze oraz umieścić tam komórki. Wiersze do tabeli dodajemy poprzez element <tr>(ang.table row - wiersz tabeli)
<table>
<tr></tr>
</table>
wiersz 1
Wiersz 1 Wiersz 2

czwartek, 10 grudnia 2015

Tło na Facebooku

Zdjęcie w tle na Fcebooku powinno mieć rozmiar 399x150 pikseli
o wielkości pliku nie przekraczającym 100 KB.
Przykładowe zdjęcie


Przygotowanie zdjęcia na Facebooka

Zdjęcie profilowe na Facebooka powinno mieć rozmiar 180x180 pikseli, o wielkości pliku nie przekraczającym 100 kilobajtów.
Przykładowe zdjęcie








Przygotowanie obrazu na stronę internetową w czterech krokach

Pierwszy krok
Poprawienie kontrastu zdjęcia i nasycenia kolorów.
Drugi krok
Sprawdzenie szerokości bloga, strony internetowej, na której będzie opublikowane zdjęcie, zmniejsz rozmiar zdjęcia do ustalonego rozmiaru.
Trzeci krok
Wyostrzyć zdjęcie
Czwarty krok
Zapisz zdjęcie w formacie JPG o wielkości pliku nie przekraczającym 300 kilobajtów, czyli 0,3 megabajty.
Przykładowe zdjęcie w którym poprawiono kontrast, nasycenie kolorów oraz zmniejszono rozmiar.


czwartek, 3 grudnia 2015

Kompresja JPG

Format ten został opracowany na potrzeby zmniejszenia rozmiaru (kompresji) zdjęć fotograficznych. Jest to format tzn. stratnej kompresji, tzn. zmniejszenie rozmiaru kosztem jakości zdjęcia.
Pokrótce kompresja ta polega na zmniejszeniu liczby kolorów na zdjęciu w podobnych obszarach i zastąpieniem ich jednym bądź kilkoma odcieniami tego samego koloru. Tak na prawdę nie musimy do końca wiedzieć jak działa ta kompresja, warto jednak znać jej efekty.
Kompresji możemy dokonać w programach graficznych i możemy sami regulować jej stopień In większy stopień tym mniejszy rozmiar pliku ale i niższa jakość Właśnie głównie rozchodzi się o tą jakość. Zbyt duży stopień kompresji powoduje pojawienie się skutków ubocznych czyli tzw.
Artefakty są to grupy pikseli, które niejako zaśmiecają nam obraz, a których wcześniej nie było Są to dodatkowe piksele wprowadzone przez algorytm kompresji.
Powyższy obraz ukazuje dwa pliki zapisane w formie JPG. Po lewej stronie mamy plik zapisany bez kompresji, a po prawej stronie plik skompresowany. W skompresowanym pliku gołym okiem widać artefakty, które zaśmiecają nam obraz.
Kompresja zastosowania na powyższej grafice znacznie pogorszyła jej jakość, a głównym przesłaniem kompresji jest zmniejszenie rozmiaru pliku, przy minimalnej stracie jakości danego pliku. Więc jak zmniejszyć rozmiar powyższej grafiki nie tracąc na jakości?
Powyższa grafika używa jedynie dwóch kolorów: czarnego i żółtego. Do zapisu grafik, które nie używają zbyt dużej ilości kolorów używamy innych formatów plików (np .PNG, GIF). Format JPG natomiast najlepiej nadaje się do plików graficznych wykorzystują setki kolorów, czyli głównie zdjęć. Stratna kompresji wykonana na zdjęciu, jest zazwyczaj niezauważalna.
Powyżej znajduje się to samo zdjęcie w dwóch połówkach, po lewej stronie mamy połowę zdjęcia, która nie uległa kompresji. Natomiast po prawej stronie mamy zdjęcie które zostało skompresowane. Różnica między  nimi na pierwszy rzut oka jest niezauważalna. Tak, oczywiście straty jakości są, tyle że po szybkim przeskanowaniu zdjęcia nie znajdziemy różnicy.

Obrazy JPG

JPG jest chyba najbardziej popularnym formatem pliku graficznego. Zapewne każdy z Was już miał z nim styczność, bo zapewne każdy przynajmniej raz wykonał zdjęcie aparatem cyfrowym tudzież aparatem telefonicznym, czyli tzn. komórką,Właśnie zdjęciom format zawdzięcza tak dużą popularność. Większość robionych obecnie zdjęć zapisywana w tym formacie . Skoro jest taki popularny to dowiedzmy się trochę więcej o nim.
Trzyliterowy skrót JPG jest skróconą formą czteroliterowego skrótu JPEG (ang. Joint photographic Experts  Group - połączona grupa ekspertów fotograficznych) Skrót ten pochodzi od grupy osób, która zajmowała się rozwojem tego standardu plików. Ze względu na praktykę używania rozszrzeń trzyliterowym dłuższy skrót JPG zazwyczaj zapisujemy jako JPG.

Linki

<a>
W języku html do zapisywania linków używamy elementu <a> (ang. anchor- kotwica, bądź zakotwiczenie). Pomiędzy znacznikami wpisujemy tekst odsyłacza, tzn. tekst który zostanie wyświetlony na ekranie. Jeśli byśmy chcieli , aby tekst linka  wskazywał na kurs html zapis ten wyglądałby następująco.
<a> kurs html </a>
Adres Linka
<a href>
Jednak po najechaniu na link nic się nie dzieje, po kliknięciu również nie przenosi nas w inne miejsce. Chyba czegoś tu brakuje... Owszem owszem, brakuje tzn. atrybutu . Atrybut jest to dodatkowa informacja o samym elemencie html zawarta w znaczniku otwierającym. Elementy html mogą posiadać atrybuty (ang. attribute ) i przypisane do nich własności (ang. property),
Jednym z atrybutów elementu <a> jest atrybut href (ang. hypertext refernce - odniesienia w hipertekście). Informuje on przeglądarkę, o stronie na którą link nas przekierowuje.  Dopiero po dodaniu tego atrybutu i uzupełnieniu jego własności taki link będzie kompletny. A więc dodajmy atrybut do naszego linka.
<a href="how2html.pl"> kurs html </a>

czwartek, 19 listopada 2015

HTML5

W pierwszej linijce każdego dokumentu HTML5 zamieszcza się specjalny fragment kodu - doctype -czyli deklaracje typu dokumentu. Element ten określa, że dana zawartość powstała w oparciu o strukturę HTML5.
<!DOCTYPE html>
Formatowanie tekstu
<strong> wyraz  pogrubiony
<b> wyraz pogrubiony
<em> wyraz pochylony
<i> wyraz pochylony
<small> wyraz pomniejszony
<mark> podświetlony wyraz
<sup> indeks górny
<sup> indeks dolny
<s> wyraz nieaktualny
<ins> wyraz wstawiony
<del> wyraz usunięty

czwartek, 12 listopada 2015

CSS

CSS - kaskadowe arkusze stylów pozwalają tworzyć reguły określające wygląd zawartości elementów. Możemy np. podać, że tło strony ma być koloru kremowego, wszystkie akapity powinny być wyświetlone czcionką Arial w kolorze szarym albo że nagłówki pierwszego poziomu mają być wyświetlane niebieską pochyloną czcionką Times.
color określa kolor tła, tekstu
przykład zapisywania kolorów w CSS:
Wartości RGB wyrażają kolory jako ilość tworzących go trzech kolorów podstawowych: czerwonego, zielonego i niebieskiego, np. rgb(100,100,90). Wartości kolorów czerwonego, zielonego i nibieskiego są podawane jako liczby z zakresu od 0 do 255.
Kody szesnastkowe to sześciocyfrowe kody reprezentujące ilość trzech kolorów podstawowych, poprzedzone znakiem #, np. #ee3e80.
System szesnastkowy
Szesnastkowy system liczbowy znany również pod nazwą system heksadecymalny – pozycyjny system liczbowy, w którym podstawą jest liczba 16. Do zapisu liczb w tym systemie potrzebne jest szesnaście znaków (cyfr szesnastkowych).
W najpowszechniejszym standardzie poza cyframi dziesiętnymi od 0 do 9 używa się pierwszych sześciu liter alfabetu łacińskiegoABCDEF (wielkich lub małych). Cyfry 0-9 mają te same wartości co w systemie dziesiętnym, natomiast litery odpowiadają następującym wartościom: A = 10, B = 11, C = 12, D = 13, E = 14 oraz F = 15.
Nazwy kolorów dostępnych jest 147 predefiniowanych nazw kolorów, które rozpoznają przeglądarki, np. DarkCyan.
Kolor tła - background - color określamy tak samo jak kolory liter. 
Tekst 
Czcionka szeryfowa charakteryzuje się dodatkowymi kreseczkami na końcach głównych linii tworzących znaki. Elementy te są nazywane szeryfami. np. TimesNewRoman
Czcionka Bezszeryfowa charakteryzuje się prostym zakończeniem liter. np. Arial
Czcionka o Stałej szerokości znaków np. Courier
Grubość  cienka , średnia, pogrubiona, bardzo gruba 
Styl normalny, kursywa, pochylone 
Rozciągnięcie zwarty, normalny, rozszerzony
Umieszczenie stylu CSS w kodzie HTML w nagłówku jako link do zewnętrzego pliku styl.css

<head>
  <title>Przykład działania CSS</title>
  <link rel="stylesheet" type="text/css" href="styl.css" />
</head>

czwartek, 5 listopada 2015

Formaty obrazów w internecie

Zapisuj obrazy w odpowiednim formacie: JPG, GIF, PNG.
Zapisuj obrazy w odpowiednich wymiarach i i właściwych proporcjach.
Używaj odpowiedniej rozdzielczości.
Gdy obraz ma wiele kolorów używamy formatu JPG. Formatów GIF lub PNG należy używać do zapisywania obrazów zawierających niewiele kolorów lub duże obszary tego samego koloru.
Obrazy wektorowe różnią się od obrazów rastrowych i są niezależne od rozdzielczości.
Format ten służy do tworzenia logo, ilustracji, diagramów.
Format GIF służy do tworzenia prostych animacji.
Przykłady
JPG





























Logo wektorowe


















animowany GIF

Wstawianie zdjęć

Aby umieścić obraz na stronie WWW,należy użyć elementu img. Jest to element pusty (to oznacza, że nie ma znacznika zamykającego). W elemencie img należy określić wartości następujących atrybutów: src Atrybut ten informuje przeglądarkę, gdzie może znaleźć plik obrazu. Zazwyczaj wartością tego atrybutu będzie względny adres URL wskazujący w tej samej witryna. alt Ten atrybut zawiera tekst stanowiący opis obrazu, z którego można skorzystać, gdy obraz nie będzie widoczny. title Można także skorzystać z atrybutu title elementu img, by przekazać dodatkowe informacje o obrazie
Atrybuty określające wymiary obrazu: height - określa wysokość obrazu, width - określa szerokość obrazu.
Przykład

czwartek, 29 października 2015

Wstawianie tabel

Tabele wstawiamy za pomocą następujących znaczników:
Znacznik table służy do tworzenia tabel
Znacznik tr służy do tworzenia wierszy
Znacznik td służy do tworzenia komórek
Znacznik th służy do oznaczenia nagłówków-zarówno kolumny jak i wierszy
Przykładowe tabele:
15 15 30
45 60 45
60 90 90


Sobota Niedziela
Liczba sprzedanych biletów:
120
135
Wartość sprzedaży
600 zł
675 zł
Za pomocą atrybutu scope elementu <th> można określić czy reprezentuje on nagłówek wiersza czy kolumny. Atrybut ten może przyjmować następujące wartości: row- jeśli dany element jest nagłówkiem, lub col -jeśli jest on nagłówkiem kolumny.
TVN Polsat TVP1
19:30-20:00 Film komedia dziennik
20:00-20:30 sport serial
Data Przychód Wydatki
1 stycznia 250 36
2 stycznia 285 48
31 stycznia 129 64
7824 1241

czwartek, 22 października 2015

Formularze na stronie www

Przykładowy formularz
Co myślisz o tym koncercie?


Wyjaśnienie sposobu tworzenia formularzy
Wszystkie pola formularzy są umieszczone wewnątrz  elementu <form>
Każdy element <form> wymaga określenia atrybutu action Jest nią adres URL strony na serwerze, do której w momencie wysłania formularza należy przekazać podane w nim informacje.
Atrybut method
Formularze można wysyłać używając jednej z dwóch metod:get albo post.
W przypadku  stosowania metody get wartości pól są dodawane na końcu adresu URL podanego w atrybucie action.Najlepiej nadaje się ona do:

  • przesyłania krótkich formularzy (takich jak formularz wyszukiwania);
  • formularzy służących jedynie do pobierania danych z serwera (a nie np. przesyłania informacji które mają być zapisane lub usunięte z bazy danych).


W przypadku zastosowania metody post wartości są przesyłane w tzw. nagłówkach HTTP. Jako ogólną zasadę należy przyjąć, że metoda post powinna być użyta, gdy formularz:

  • pozwala na przesyłanie plików:
  • jest bardzo duży:
  • zawiera wrażliwe dane (takie jak hasła):
  • powoduje dodanie informacji z bazy danych.

Atrybut id jego wartość jest używana do unikalnego identyfikowania elementu formularza i odróżniania od pozostałych elementów strony.
Element <input> służy do tworzenia kilku różnych rodzajów pól. Rodzaj pola, które zostanie, utworzone , zależy od wartości atrybutu type tego elementu.
Jeśli atrybut type będzie mieć wartość text, zostanie utworzone pole tekstowe.
Atrybut name identyfikuje pole formularza i jest przesyłane z jego zawartością na serwer.
Atrybut maxlength ogranicza liczbę znaków wpisywanych w polu.
Atrybut password powoduje że wpisywane pole znaki będą niewidoczne

Opracowano na podstawie książki:. Jon Duckett pt. HTML i CSS Zaprojektuj i zbuduj witrynę WWW.

czwartek, 10 września 2015

Języki za pomocą którą zbudujemy strone internetową

Prostą stronę zbudujemy za pomącą języka HTML
Przykładowe ogłoszenie napisane w tym języku;

Poszukujemy deveropera HTML i CSS

środa, 9 września 2015

wtorek, 8 września 2015

czwartek, 3 września 2015

Acer Liugid

Acer Liguit

został wyposażony w 5,5 calowy ekran o rozdzielczości HD.
http://www.chip.pl/news/sprzet/telefony/2015/09/acer-liquid-z630-i-z630s-sredniaki-w-dobrej-cenie
http://www.phonearena.com/phones/Acer-Liquid-Z630_id9603
http://www.cnet.com/products/acer-liquid-z630/

Miniaturowa kamera

/Miniaturowa kamera/ Polaroid Cuba + to kamera sportowa Najważniejszą zmianą to wybudowany moduł WI -FI
http://www.komputerswiat.pl/nowosci/foto/2015/36/miniaturowa-kamera-polaroid-cubeplus-odpowiedz-na-gopro-hero4-session-ifa-2015.aspx
http://www.fotomaniak.pl/91460/polaroid-cube-opini/
http://gadzetomania.pl/56949,polaroid-cube-wideotest-jak-miniaturowa-kamera-sprawdza-sie-w-praktyce

Miniaturowy komputer

/Komputer Asus Pen Stick/ że możliwie zamknięcie pełnoprawnego komputera w obudowie wielkości nie wiele większej niż pendrive.

http://swiat-informatyki.eu/
http://pclab.pl/news64220.html
http://liliputing.com/2015/06/asus-pen-stick-is-a-windows-10-cherry-trail-pc-on-a-stick.html

Witam na moim blogu

Ten blog będzie poświęcony ciekawostkom z informatyki oraz bieżącym tematom zajęć z informatyki.
Zapraszam do przeglądania mojego bloga