poniedziałek, 6 grudnia 2010

Podstawowe elementy języka HTML

BAZOWY KOD PUSTEJ STRONY WWW

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

<head>

<title>TYTUŁ STRONY</title>

<meta http-equiv="Content-Type" content-"text/html; charset-iso-8859-2">

</head>

</body>

</html>

BAZOWY KOD PUSTEJ STRONY WWW (XHTML)



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" http://www.w3.org/TR/xhtml1/DTD/xhtml1/strict.dtd">

<html xhtml=http://www.w3.org/1999/xhtml"  xml:lang="pl" lang="pl">

<head>

<title>TYTUŁ STRONY</title>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2" />

</head>

<body>

</body>

</html>



PODSTAWOWE ELEMENTY JĘZYKA HTML
ELEMENTPRZYKŁADOPIS
<!DOCTYPE>Strict DTD

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR?html4/strict.dtd">

Transitional DTD

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

Frameset DTD

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"

"http://www.w3.org/TR/html4/framset.dtd">

XHTML DTD

<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">		Definiuje typ dokumentu. Deklaracja ta powinna pojawić się jako pierwszy element kodu HTML. Informuje ona przeglądarkę, z którą wersją języka HTML ma do czynienia.

<html><html>

<head>

</head>

<body>

<p>Zawartość dokumentu…</p>

</body>

</html>		Informuje przeglądarkę, że plik zawiera kod HTML. Strona WWW napisana w języku XHTML (bardziej bardziej sformalizowanej odmianie HTML, której bliżej do uniwersalnego języka znaczników XML) musi zawierać w elemencie<HEAD>dodatkowe parametry następującej postaci:

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl" lang="pl">
<body><body>

<p>Oto treść dokumentu.</p>

</body>		Definiuje zawartość dokumentu.
<h1>do<h6><h1>To jest nagłówek poziomu 1</h1>

<h2>To jest nagłówek poziomu 1</h2>

<h3>To jest nagłówek poziomu 3</h3>

<h4>To jest nagłówek poziomu 4</h4>

<h5>To jest nagłówek poziomu 5</h5>

<h6>To jest nagłówek poziomu 6</h6>		Definiuje nagłówki
<p><p>To jest akapit.</p>

<p>To jest kolejny akapit</p>		Definiuje akapit.
<br><p>W tym akapicie<br> />

Zła-<br />

Mano wiersz</p>		Wprowadza w akapicie złamanie wiersza.
<hr><p>Znacznik hr wprowadza linię poziomą:</p>

<hr />

<p>między akapitami</p>		Umożliwia wstawienie na stronie linii poziomej.
<!--><!—KomentarzàZnacznik stosowany do wstawiania w kodzie HTML komentarza (komentarz jest ignorowany przez przeglądarką). Komentarz jest pomocny przy wyjaśnieniu funkcji kodu, ale ma jeszcze jedną niezwykle istotną rolę- pozwala wprowadzać do kodu skrypty.
Autor: o Brak komentarzy:

sobota, 4 grudnia 2010

TABLICE HTML

Myślę, że komuś się przyda.



PROSTE FORMATOWANIE TEKSTU:
ELEMENT
PRZYKŁAD
OPIS
<b>
<b>tekst jest pisany czcionką pogrubioną</b>
Wprowadza formatowanie fizyczne-tekst pogrubiony
<strong>
<strong>ten teks też jest pisany czcionką pogrubioną</strong>
Wprowadza formatowanie logiczne-tekst pogrubiony
<i>
<i>tekst pisany kursywą</i>
Wprowadza formatowanie fizyczny – kursywa
<em>
<em>ten tekst będzie wyróżniony</em>
Wprowadza formatowanie logiczne-tekst przypominający kursywę
<big>
<big>tekst wyświetlany czcionką powiększoną</big>
Definiuje tekst o większym rozmiarze czcionki niż tekst otaczający
<small>
<small>tekst wyświetlany czcionką pomniejszoną</small>
Definiuje tekst o mniejszym rozmiarze czcionki niż tekst otaczający
<sup>
W tekście umieszczono indeks<sup>dolny</sup>
Definiuje indeks dolny
<sub>
W tekście umieszczono indeks<sub>górny</sub>
Definiuje indeks górny
<bdo>
<bdo dir=”rtl”>tekst będzie pisany na opak!</bdo> efekt:
!kapo an ynasip eizdęb tsket
Zmienia kierunek tekstu. Wymagany atrybut dir
<dfn>
<dfn>teks ten stanowi termin definicji</dfn>
Formatuje dany teks tak aby się wyróżniał od pozostałego
<pre>
<pre>tekst prze formatowany</pre>
W tekście umieszczonym w elemencie pre zachowane zostają odstępy i łamania wierszy. Tekst będzie wyświetlany czcionką o stałej szerokości.
<code>
<code>tekst kodu programu<code>
Stosowany do prezentacji kodu programu. Tekst będzie wyświetlany o stałej szerokości.
<tt>
<tt>
Stosowany do prezentacji kodu programu.
<kbd>
<kbd>tekst pisany czcionką komputerowa
Stosowany do prezentacji kodu programu.
<var>
<var>zmienna</var>
Stosowany do prezentacji kodu programu- wskazuje nazwę zmiennej
<Samp>
<samp>tekst przykładowy<samp>
Stosowany do prezentacji kodu programu lub tekstu przykładowego


Autor: o Brak komentarzy:

środa, 1 grudnia 2010

KURS HTML cz.3

Zapraszam na 3 część tutorialu:




KONIEC LINII



Powyższy znacznik (br)
stosuje się gdy chcemy natychmiastowo zakończyć linię. Zapytasz zapewne: Po co go stosować, nie można po prostu nacisnąć Enter i przenieść kursor tekstowy do następnej linii? Otóż nie można. Przeglądarka internetowa ignoruje wszelkie znaki przejścia do następnej linii za pomocą klawisza Enter (ignoruje również postawienie obok siebie więcej niż jednej spacji - zobacz: Znaki specjalne). Na przykład jeśli wpiszesz w edytorze taki tekst:
To jest pierwsza linia...
a to jest druga linia.
w przeglądarce pojawi się:

To jest pierwsza linia... a to jest druga linia.


Linia zostanie zakończona automatycznie tylko wtedy, gdy podany tekst będzie zbyt długi, aby zmieścić się w jednym wierszu. Jeśli jednak koniecznie chcemy natychmiast zakończyć linię, możemy to zrobić, stawiając w miejscu gdzie ma być ona zakończona, znacznik
. Np. wpisanie w edytorze:
To jest pierwsza linia...

a to jest druga linia.
spowoduje wyświetlenie tekstu:

To jest pierwsza linia...
a to jest druga linia.


Jeśli postawisz obok siebie więcej niż jeden znacznik
, możesz "zejść" kilka linijek niżej, np. wpisanie:
To jest pierwsza linia...



...a to jest kolejna linia.
spowoduje wyświetlenie:

To jest pierwsza linia...


...a to jest kolejna linia.


Zwróć uwagę, że samego znacznika
nie widać na ekranie przeglądarki. Widać jedynie efekty jego działania, tzn. zakończenie linii.

Znacznik
nie ma znacznika zamykającego (to jest właśnie jeden z nielicznych wyjątków)!
PARAGRAF
Tu wpisz treść paragrafu

Paragraf (czyli nowy akapit) to pewien ustęp w tekście. Następujące po sobie paragrafy, są rozdzielone linijką przerwy. Treść paragrafu (akapitu) należy wpisać pomiędzy znacznikami
oraz
. Przyjęło się, że praktycznie każdy zwykły tekst na stronie WWW umieszcza się w paragrafach. Pojedynczy akapit przedstawia ustęp w tekście, który nieco różni się tematycznie od poprzedniego. Zamiast stosować dwa znaczniki końca linii:

, można po prostu objąć wybrany fragment tekstu paragrafem, a efekt będzie identyczny. Dzięki temu strona będzie wyglądała estetyczniej i łatwiej będzie można odszukać na niej interesujące informacje.

Paragraf jest bardzo ważny w składni HTML, ponieważ pozwala w określony sposób sformatować tekst na ekranie (ułożyć go w podany sposób). Robi się to podając atrybuty znacznika. Atrybut wpisuje się zawsze wewnątrz znacznika otwierającego - bezpośrednio po jego nazwie (oddzielony od niej spacją), a przed znakiem zamknięcia nawiasu ostrego, czyli przed ">". Każdy znacznik ma ściśle określone atrybuty, które obsługuje. W przypadku paragrafu można zastosować m.in. następujące:

1. Wyrównanie tekstu do lewej strony (domyślnie):
Treść paragrafu
lub
Treść paragrafu


2. Wyrównanie tekstu do prawej:
Treść paragrafu


3. Wyśrodkowanie tekstu:
Treść paragrafu


4. Justowanie tekstu (wyrównanie do obu marginesów jednocześnie):
Treść paragrafu


We wszystkich przypadkach czcionką podkreśloną zostały zaznaczone właśnie atrybuty znacznika.
W miejsce tekstu: Treść paragrafu, należy wpisać tekst, który ma zostać sformatowany w sposób określony przez parametr.

Przykład:

ALIGN="left",
wyrównanie do lewej,
wyrównanie do lewej (ALIGN="left"),
(ALIGN="left")...

ALIGN="right",
wyrównanie do prawej,
wyrównanie do prawej (ALIGN="right"),
(ALIGN="right")...

ALIGN="center",
wyśrodkowanie,
wyśrodkowanie (ALIGN="center"),
(ALIGN="center")...

justowanie, czyli wyrównanie do obu marginesów jednocześnie (ALIGN="justify"); justowanie, czyli wyrównanie do obu marginesów jednocześnie (ALIGN="justify"); justowanie, czyli wyrównanie do obu marginesów jednocześnie (ALIGN="justify"); justowanie, czyli wyrównanie do obu marginesów jednocześnie (ALIGN="justify"); justowanie, czyli wyrównanie do obu marginesów jednocześnie (ALIGN="justify"); justowanie, czyli wyrównanie do obu marginesów jednocześnie (ALIGN="justify"); justowanie, czyli wyrównanie do obu marginesów jednocześnie (ALIGN="justify"); justowanie, czyli wyrównanie do obu marginesów jednocześnie (ALIGN="justify"); justowanie, czyli wyrównanie do obu marginesów jednocześnie (ALIGN="justify"); justowanie, czyli wyrównanie do obu marginesów jednocześnie (ALIGN="justify")...
TEKST POGRUBIONY
Tu wpisz tekst

Znacznik ten pozwala pogrubić (wytłuścić) część tekstu (ang. "bold"), który się wewnątrz niego znajduje. Podobna funkcja jest zwykle dostępna w zwykłych edytorach (np.: WordPad), podczas tworzenia normalnego dokumentu tekstowego.

Przykład:
Ten tekst jest pogrubiony (wytłuszczony)

TEKST POCHYLONY
Tu wpisz tekst

Pozwala napisać tekst pismem pochylonym, czyli kursywą (ang. "italic").

Przykład:
Ten tekst jest napisany pismem pochylonym, czyli kursywą

TEKST PODKREŚLONY
Tu wpisz tekst

Pozwala podkreślić fragment tekstu (ang. "underline").

Przykład:
Ten tekst jest podkreślony

WIELKOŚĆ CZCIONKI
Tu wpisz tekst

gdzie jako "n" należy wpisać wartość od 1 (czcionka najmniejsza) do 7 (czcionka największa).

Przykład:
Czcionka o rozmiarze 1
Czcionka o rozmiarze 2
Czcionka o rozmiarze 3 (domyślna)
Czcionka o rozmiarze 4
Czcionka o rozmiarze 5
Czcionka o rozmiarze 6
Czcionka o rozmiarze 7

KOLOR CZCIONKI


gdzie jako "kolor" można wpisać:
black (czarny)
white (biały)
silver (srebrny)
gray (szary)
maroon (kasztanowy)
red (czerwony)
purple (purpurowy)
fuchsia (fuksja)
green (zielony)
lime (limonowy)
olive (oliwkowy)
yellow (żółty)
navy (granatowy)
blue (niebieski)
teal (zielonomodry)
aqua (akwamaryna)



Edytory HTML posiadają często specjalny selektor kolorów, za pomocą którego można w prosty sposób wybrać barwę o dowolnym odcieniu.

Autor: o Brak komentarzy:

piątek, 26 listopada 2010

Dekalog internetowej-edukacji.

Jesteśmy istotami społecznymi i uczenie się w grupie zostało wymyślone przed tysiącleciami nie, dlatego, aby zaoszczędzić czas nauczyciela, ale po to, aby wykorzystać prawidłowości psychologiczne do wzmacniania motywacji. Obecność innych podnosi poziom naszego pobudzenia — trudniej nam zasnąć nad książką w czytelni niż pustym pokoju. Interakcja z
człowiekiem będzie zawsze wzbudzała dużo większe zainteresowanie niż interakcja z
komputerem udającym nauczyciela.

Na początku komputer może być bardziej atrakcyjny, ale szybko odkryjemy zasady jego działania. Ludzie są dużo mniej przewidywalni. Środki techniczne wykorzystywane przez twórców reklam z czasem tracą wartość stymulacyjną (nie robią wrażenia, a czasem nużą). Efekty specjalne prezentacji przygotowanej w Power Poincie wzbudzały początkowo zachwyt odbiorców. Gdy stały się bardziej powszechne okazało się, że mogą raczej irytować, budząc podejrzenia, że wyszukana forma ma rekompensować niedobór treści.

Inni ludzie są lepszym źródłem stymulacji. Sama obecność innych ludzi w klasie powoduje wzrost pobudzenia i w konsekwencji poprawia efektywność procesu uczenia się. Mimo, że relacja jeden nauczyciel — jeden uczeń z punktu widzenia ucznia wydaje się optymalna, to jednak od wieków ludzie uczą się w grupach. Wbrew pozorom nie jest to wymuszone rachunkiem ekonomicznym, ale koniecznością utrzymania odpowiedniego poziomu motywacji. Edukacja internetowa może podnieść jakość dydaktyki, ale nie powinna całkowicie zastąpić bezpośrednich spotkań "twarzą w twarz".

Proces uczenia się jest żmudny i skomplikowany — zapoznanie się z nowymi informacjami to zaledwie czubek góry lodowej. Aby przejść przez wszystkie etapy, jest konieczne utrzymanie odpowiedniego poziomu motywacji. Nasze postanowienia dotyczące nauki, na przykład nowego języka, przegrywają z codziennymi zajęciami. Ratują nas zobowiązania społeczne, zainwestowane z góry pieniądze, które dla większości są silniejszym motywatorem niż postanowienia. Stojące na półkach wspaniale przygotowane programy multimedialne przegrywają z kursami prowadzonymi przez dobrego lektora. Dlaczego? Przecież program multimedialny pozwala się uczyć o dogodnej dla nas porze, w dogodnym dla nas miejscu.

Właśnie jednak ten nadmiar wolności okazuje się zabójczy. Realizacji celu sprzyja określenie, kiedy i gdzie będę się uczyć. Cóż za problem – pomyślą niektórzy – komputer powinien mieć wpisane terminy i molestować nas ciągłym przypominaniem o nauce. Tu znów wkracza psychologia społeczna — komputerowi możemy z łatwością "powiedzieć", aby "zresetował" swoje oczekiwania — innemu człowiekowi, nawet jeśli jest on daleko od nas, powiedzieć to jest dużo trudniej. Dlaczego? Ewolucja ukształtowała w nas wrażliwość na akceptację innych. Przeżycie zależało (a zdarza się, że i teraz zależy) od pomocy udzielonej przez innych ludzi (często zupełnie obcych). Stąd lekceważenie tego, co pomyślą o nas inni, jest obarczone uczuciem dyskomfortu.

Największy sukces nie cieszy, gdy nie mamy komu o tym powiedzieć. W obecności innych zachowujemy się inaczej, niż gdy jesteśmy sami (lub w towarzystwie komputera). Te same słowa pochwały lub nagany "wypowiedziane" przez komputer mają o wiele słabsze znaczenie niż ta sama ocena przesłana przez żywego człowieka. Jesteśmy ewolucyjnie nastawieni na interakcję z innymi ludźmi. Zdecydowana większość tego, co robimy jest motywowana (pośrednio lub bezpośrednio) społecznie. Nasza ewolucyjnie wykształcona wrażliwość powoduje, że w procesie uczenia się maszyna nie może zastąpić nauczyciela.




Tutaj możesz zapisać się na listę, a w zamian otrzymasz specjalny raport w jaki sposób możesz zarobić na swojej stronie WWW.

Zgadzam się z Polityką Prywatności
Autor: o Brak komentarzy:

O czym powinna wiedzieć osoba tworząca stronę WWW.

Wkrótce, na blogu pojawi się adres do tutorialu jak stworzyć stronę WWW, programem Adobe Photoshop oraz wystawieniem jej na serwerze. Ale teraz opiszę co o stronach WWW powinna wiedzieć osoba, która chce zlecić jej stworzenie firmie lub innej osobie wyspecjalizowanej w tym zakresie, tak aby razem mogli wypracować naprawdę skuteczną witrynę, która przyniesie jej właścicielowi wymierne korzyści.


  A teraz trochę statystyki z badań wynika, że połowa polaków ma dostęp do Internetu, a ok. 60% polaków posiada komputer w domu i co więcej ponad 60% poszukuje informacji o firmach właśnie przez Internet. Jak podaje serwis webankieta.pl 90% małych i średnich firm zaopatruje się właśnie za pomocą Internetu. Co więcej, dla jednej czwartej mikroprzedsiębiorstw Internet jest głównym kanałem zbytu. Również zwyczajni klienci zaczynają dostrzegać biznesowe aspekty sieci. Już, co 6 z nas dokonuje e-zakupów, a liczby te stale rosną. W obliczu takiej rzeczywistości posiadanie własnej strony WWW staje się wręcz koniecznością.
Dalszą część znajdziesz tu.Wystarczy kliknąć.
Autor: o Brak komentarzy:

czwartek, 25 listopada 2010

KURS HTML cz.2

Co to jest ciało dokumentu HTML

Do czego służą polecenia META

Jak zmienić kolor tekstu i tła strony

W jaki sposób wstawić obrazek w tle (tapeta)



Znaczniki BODY oraz META określają pewne informacje na temat strony, jako całości. Polecenie BODY powinno wchodzić w skład każdego dokumentu HTML. Stanowi ono właściwą treść, czyli tzw. ciało, w którym zawierają się wszystkie inne znaczniki, dotyczące formatowania, a także zwykły tekst. Podając dodatkowe atrybuty dla znacznika BODY, można określić niektóre cechy wyglądu całej strony, takie jak kolor tła oraz tekstu lub szerokość marginesów. W jednym dokumencie może się znajdować tylko jeden znacznik BODY - zaraz po nagłówku strony (HEAD).

Natomiast znacznik META stanowi tzw. metainformację, pozwalającą określić pewne ogólne wiadomości, dotyczące dokumentu, m.in. sposób kodowania znaków, opis zawartości strony, jej autora czy język, w którym została napisana. Metainformacje nie wpływają bezpośrednio na wygląd dokumentu, lecz cechy, które podają, są równie ważne. Chociaż nie są one wymagane, warto je stosować, ponieważ może to np. pomóc w odszukaniu strony przez wyszukiwarki sieciowe. Każdy dokument powinien zawierać obowiązkowo przynajmniej deklarację strony kodowej, bez której polskie litery na stronie mogą zostać błędnie wyświetlone! W pojedynczym dokumencie znajduje się zwykle kilka znaczników META - każdy dotyczy innej wiadomości - wszystkie muszą znajdować się wewnątrz nagłówka strony (HEAD).





Druga część tutorialu:




KOLOR TEKSTU STRONY

<BODY TEXT="kolor">...</BODY>

gdzie "kolor" oznacza definicję koloru. Stosuje się ang. słowa kolorów np. red.

Polecenie pozwala określić kolor tekstu na Twojej stronie internetowej (domyślnie jest to czarny). Staraj się używać barw, które będą się dobrze wyróżniały na kolorze tła.

Edytory HTML posiadają często specjalny selektor kolorów, za pomocą, którego można w prosty sposób wybrać barwę o dowolnym odcieniu.

Równocześnie z kolorem tekstu strony powinniśmy koniecznie określić odpowiedni kolor tła, nawet, jeśli odpowiada nam domyślny. Pamiętaj, że użytkownik może zmienić domyślny kolor tła w swoim systemie operacyjnym, a wtedy istnieje prawdopodobieństwo, że będzie on podobny do koloru tekstu ustalonego na Twojej stronie, co wywoła brak możliwości odczytania treści lub bardzo utrudni czytanie.

Atrybut TEXT jest zdeprecjonowany przez specyfikację HTML 4.01 - Zaleca się stosowanie arkusza stylów.



KOLOR TŁA STRONY

<BODY BGCOLOR="kolor">...</BODY>

Gdzie "kolor" oznacza definicję koloru .

Polecenie pozwala określić kolor tła na Twojej stronie internetowej (domyślnie jest to biały). Pamiętaj, że nie powinno się używać barw bardzo jaskrawych, jako kolory tła. Sprawiają one, że oczy szybko się męczą i dodatkowo zaciemniają treść strony. Dodatkowo należy pamiętać, aby na ustalonym kolorze tła, tekst był dobrze widoczny.

Równocześnie z kolorem tła strony powinniśmy określić odpowiedni kolor tekstu, nawet, jeśli odpowiada nam domyślny. Pamiętaj, że użytkownik może zmienić domyślny kolor tekstu w swoim systemie operacyjnym, a wtedy istnieje prawdopodobieństwo, że będzie on podobny do koloru tła ustalonego na Twojej stronie, co wywoła brak możliwości odczytania treści lub bardzo utrudni czytanie.
To samo dotyczy koloru odsyłaczy hipertekstowych.

Atrybut BGCOLOR jest zdeprecjonowany przez specyfikację HTML 4.01 - Zaleca się stosowanie arkusza stylów.

<BODY BACKGROUND="ścieżka dostępu do obrazka">...</BODY>

lub

<BODY BACKGROUND="ścieżka dostępu do obrazka" BGPROPERTIES="fixed">...</BODY>

(tło nieruchome - znak wodny - tylko Internet Explorer!)

gdzie jako "ścieżka dostępu do obrazka" należy podać lokalizację na dysku, gdzie znajduje się obrazek, który chcemy umieścić w tle.

Jeśli znudziły Ci się już strony o jednolitym kolorze, możesz umieścić w tle dowolny obrazek. Dzięki temu strona może wyglądać dużo lepiej. Ponadto drugie z podanych poleceń pozwala zdefiniować tło obrazkowe, które jest nieruchome, tzn. nie przesuwa się wraz z tekstem, gdy przewijamy zawartość okna (tylko Internet Explorer).

Pamiętaj jednak, że obrazki o dużych rozmiarach spowalniają wczytywanie strony. Dlatego staraj się używać pliki tylko w formacie *.jpg (dla zdjęć wielokolorowych) lub *.gif (dla rysunków). Są to formaty skompresowane, zajmujące dużo mniej miejsca niż zwykłe mapy bitowe *.bmp. Trzeba również pamiętać, aby obrazek w tle nie był zbyt jaskrawy - spowoduje to tylko zaciemnienie zawartości strony i utrudni czytanie.

Zauważ, że nie ma potrzeby stosowania obrazka tła o rozmiarze takim jak strona, ponieważ jego kopie są ustawiane obok siebie tak, że zajmują cały obszar strony. Dlatego wystarczy wyciąć mały powtarzający się wzór, który zostanie następnie powielony przez przeglądarkę.

Należy unikać stosowania w tle dużych obrazków wyciętych ze zwykłych zdjęć. Tło powinno: mieć łagodne kolory (pastelowe, blade albo całkiem ciemne, ale nie jaskrawe; szczególnie odradza się jednoczesnego stosowania barw jasnych oraz ciemnych, ponieważ uniemożliwia to dobranie odpowiednio czytelnego koloru tekstu), składać się z powtarzalnych wzorów o niezbyt wielkich rozmiarach oraz być nieco rozmyte - nieostre (można to uzyskać w dowolnym bardziej rozbudowanym programie graficznym - odpowiedni efekt nazywa się zwykle: Rozmywanie albo Blur). Dobrym pomysłem są tła imitujące strukturę jakiejś powierzchni.

Jeśli nie masz zacięcia artystycznego, nie musisz samodzielnie rysować obrazków tła. W Internecie na pewno znajdziesz wiele stron, gdzie możesz je darmowo pobrać. Często są one dostępne również w edytorach HTML (np.: FrontPage) oraz programach graficznych.



Równocześnie z atrybutem BACKGROUND często podaje się dodatkowo zwyczajny kolor tła strony. W takim przypadku, jeśli obrazek będzie niedostępny lub użytkownik wyłączy wyświetlanie obrazów, tło przyjmie podany kolor. Ponadto, jeżeli obrazek posiada przezroczystość (np. format *.gif), zostanie ona zastąpiona podanym kolorem.

Jeśli ustalimy kolor tekstu strony (TEXT) zbliżony do domyślnego koloru tła (biały), wskazane jest podanie dodatkowo takiego koloru tła(BGCOLOR), aby tekst był na nim czytelny. Jeżeli tego nie zrobimy, a obrazek nie zostanie wyświetlony, może wystąpić sytuacja typu: "biały tekst na białym tle".

Może się to zdarzyć np. gdy obrazek w tle strony jest dość ciemny. Wtedy określa się zwykle jasny kolor tekstu, zapominając o ustaleniu równocześnie ciemnego koloru tła - jako zabezpieczenie. Dopóki obrazek jest widoczny, wszystko jest w porządku, lecz jeśli nie zostanie on wyświetlony, tło przyjmie najczęściej kolor biały, (jako domyślny) i w ten sposób otrzymamy stronę, której nie można przeczytać :-(





Atrybut BACKGROUND jest zdeprecjonowany przez specyfikację HTML 4.01 - Zaleca się stosowanie arkusza stylów.

Atrybut BGPROPERTIES nie wchodzi w skład specyfikacji HTML 4.01 - zaleca się stosowanie arkusza stylów.

Atrybut BGPROPERTIES nie wchodzi w skład specyfikacji HTML 4.01 - zaleca się stosowanie arkusza stylów (css).




Skoro to czytasz na prawdę interesuje Cię założenie własnej strony www. Mam dla Ciebie prezent zupełnie za darmo tylko kliknij tu i bierz. Powodzenia.








 
Autor: o Brak komentarzy:

środa, 24 listopada 2010

KURS HTML


Pierwsza strona www.

Do stworzenia strony internetowej wystarczy komputer o przeciętnych parametrach technicznych. Komputer musi mieć zainstalowany system operacyjny. Ja posługuje się systemem Windows XP. Jeżeli potrafimy posługiwać się kodem języka HTML, możemy pracować w oparciu o Notatnik- prosty edytor tekstu dostępny w Akcesoriach systemu operacyjnego systemu Windows. Najpierw otwórzmy Notatnik. Rozwijamy menu Start ,następnie Wszystkie programy/ Akcesoria i klikamy na Notatnik.


Stronę WWW tworzy się podobnie jak zwykły dokument tekstowy: po otwarciu edytora HTML, należy wybrać opcję z menu: Plik/Nowy (lub File/New). Teraz można już zacząć pisanie strony. Jednak dokument HTML nie jest całkowicie zwykłym plikiem tekstowym (zawiera hipertekst, osadzone obrazki i musi być poprawnie wyświetlany w różnych systemach operacyjnych na całym świecie), dlatego wymyślono specjalny szablon dokumentu HTML, który powinien być przestrzegany.

Oto jak przykładowo powinny wyglądać ramy każdego dokumentu w formacie HTML (istnieją również inne podobne szablony):

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<HTML>
<HEAD>
  <META HTTP-EQUIV="Content-type" CONTENT="text/html; charset=UTF-8">
  <META NAME="Description" CONTENT="Tu wpisz opis zawartości strony">
  <META NAME="Keywords" CONTENT="Tu wpisz wyrazy kluczowe rozdzielone przecinkami">
  <META NAME="Author" CONTENT="Tu wpisz swoje imię i nazwisko">
  <META HTTP-EQUIV="Content-Language" CONTENT="pl">
  <TITLE>Tu wpisz tytuł strony</TITLE>
</HEAD>
<BODY>

Tu wpisuje się treść strony

</BODY>
</HTML>

Poniżej przedstawiam pierwszą część tutorialu tworzenia strony www:



Mam coś dla Ciebie zupełnie ZA DARMO kliknij tu i pobierz. Naprawdę warto.

Wskazówka dla "bardzo" początkujących.
Nie musisz za każdym razem, gdy tworzysz nową stronę, przepisywać całego tekstu powyższego szablonu. Wystarczy w przeglądarce internetowej naprowadzić wskaźnik myszki na początek tekstu (wskaźnik powinien zmienić kształt) i wcisnąć lewy klawisz myszki. Trzymając cały czas wciśnięty lewy przycisk, przeciągnij myszką do końca tekstu szablonu, po czym zwolnij przycisk - tekst zostanie zaznaczony. Teraz wciśnij na klawiaturze jednocześnie klawisze: Ctrl+C, co wywoła skopiowanie zaznaczonego tekstu do schowka systemowego. Następnie w edytorze HTML po otwarciu nowego pliku wystarczy wcisnąć: Ctrl+V, a do dokumentu zostanie wklejony tekst ze schowka.

Aby stronę zobaczyć w przeglądarce, należy plik w notatniku zapisać z rozszerzeniem (nazwa).html lub(nazwa).htm. Do zapisywania nazw nie używamy polskich liter, znaków specjalnych oraz spacji. Ponieważ może to uniemożliwić ich odczytanie.

Tekstu napisanego w powyższym szablonie kolorem czarnym nie powinno się zmieniać. Natomiast można (a nawet należy) zmieniać tekst, który został napisany kolorem czerwonym.



Cała treść, która znajduje się pomiędzy wyrazami <HEAD> oraz </HEAD> (w szablonie powyżej) jest nazywana nagłówkiem dokumentu (treść nagłówkowa), natomiast wszystko pomiędzy <BODY> oraz </BODY> stanowi tzw. ciało dokumentu (treść właściwa).

A teraz wyjaśnimy sobie ważniejsze linijki.

  • W miejsce tekstu: Tu wpisz opis zawartości strony, należy wpisać słowny opis, co znajduje się na Twojej stronie internetowej. Z wiadomości tej korzystają wyszukiwarki sieciowe. Tekst który tutaj wpiszesz, pojawi się w wyszukiwarce, po odnalezieniu przez nią Twojej strony. Jeśli nie wpiszesz tutaj nic, wyszukiwarka wyświetli najczęściej kilka pierwszych linijek, które znajdują się na stronie. Ciekawy, ale niezbyt długi, opis może zachęcić internautów do odwiedzenia Twojego serwisu! Każda pojedyncza strona, która znajduje się w serwisie, powinna mieć swój własny opis, przedstawiający jej treść.
  • W miejsce tekstu: Tu wpisz wyrazy kluczowe rozdzielone przecinkami, należy wpisać słowa kluczowe, których można użyć w wyszukiwarce sieciowej, aby została odnaleziona przez nią Twoja strona. Staraj się tutaj wpisać wyrazy, które jak najlepiej oddają zawartość strony. Wyrazy muszą być oddzielone od siebie przecinkami (np.: wyraz1, wyraz2, wyraz3)! Dobrze dobrane słowa kluczowe, pomogą wyszukiwarkom, w odnalezieniu Twojej strony! Każda pojedyncza strona, która znajduje się w Twoim serwisie, powinna mieć swoje własne wyrazy kluczowe.
  • Tekst: Tu wpisz swoje imię i nazwisko, jest informacją o autorze strony. Dlatego możesz tu podać swoje imię i nazwisko (choć wcale nie musisz). Jeśli chcesz pozostać anonimowy, wykasuj całą tą linijkę.
    W opisie zawartości strony, wyrazach kluczowych oraz autorze strony nie należy używać znaków cudzysłowu. Jeśli musimy to zrobić, należy zamiast nich wpisywać: &quot;
  • Pomiędzy wyrazami <TITLE> oraz </TITLE> (w miejsce czerwonego tekstu: Tu wpisz tytuł strony) należy wpisać tytuł, jaki będzie nosiła Twoja strona. Może on być dowolny, zaleca się jednak, aby nie był zbyt długi (najwyżej kilka wyrazów). Powinien on również odnosić się w jakiś sposób do treści zawartych na danej stronie. Tytuł pojawia się na belce tytułowej przeglądarki internetowej (na samej górze okna programu), a także w wyszukiwarkach sieciowych, po odnalezieniu Twojej strony - dlatego właśnie nie może on być zbyt długi. Trafny tytuł może również zachęcić internautów do obejrzenia Twojej strony!
  • I najważniejsze - w miejsce tekstu: Tu wpisuje się treść strony (pomiędzy wyrazami <BODY> oraz </BODY>) należy wpisać właściwą zawartość strony. Może to być po prostu zwykły tekst, który ma się pojawić na stronie. Są to również tzw. znaczniki sterujące wyglądem dokumentu, (które zostaną opisane dalej).




 
Autor: o Brak komentarzy:
Subskrybuj: Posty (Atom)