Category Archives: Cursuri IT – Internet

Aici veti invata despre limbajul HTML, care sunt elementele acestuia, cum sa realizati o pagina web, cum functioneaza si ce este internetul, cam tot ce consideram ca este util de stiut despre internet.

Curs de realizare pagini Web folosind limbajul HTML

Capitolul XII – Continut pe Web

Daca vrei ca pagina ta sa fie vizitata si sa aiba succes, gandeste-te bine ce pui pe ea. Continutul este mult mai important decat forma (prezentarea) paginii. Nu face o pagina care sa contina doar “link-uri catre paginile prietenilor mei”, “motoare de cautare” si vesnicul UNDER CONSTRUCTION.

Incearca sa pui ceva interesant si util pe internet. Vrei sa faci o pagina personala? perfect. Dar nu pune doar o poza cu tine si un link catre www.yhaoo.com. Ai un anumit domeniu de interes? Esti pasionat de ozn-uri, integrame, excursii in Muntii Bucegi, automobilism, administrarea retelelor, filme SF sau muzica techno? strange date, aduna link-uri, scrie materiale si creaza continut despre acest domeniu pentru a fi pus pe internet. Vrei sa faci o pagina pentru firma ta? Nu pune doar numele firmei, numarul de telefon si o poza pe tot ecranul cu noul sediu din centru – nu asta este rolul internetului. In schimb, prezinta firma ta si activitatea acesteia. Eventual scrie niste materiale generale, informative sau educative despre domeniul de activitate al firmei – vizitatorii vor avea de ce sa vina pe pagina.
Read more …

Curs de realizare pagini Web folosind limbajul HTML

Capitolul XI – Design Web

Modul in care sunt prezentate informatiile (texte, imagini, link-uri, etc) si caracteristicile acestora (culori, pozitionare, aranjamente, etc) reprezinta design-ul paginii tale. Pentru ca pagina ta sa se bucure de succes si sa fie usor de utilizat trebuie sa ai grija cum prezinti informatiile in pagina. In aceasta directie, o lista cu lucururi care nu trebuie facute intr-o pagina web este probabil utila:
Read more …

Curs de realizare pagini Web folosind limbajul HTML

Capitolul X – Grafica Web

Dupa ce in capitolele precendente am invatat notiunile HTML de baza, vom scrie cateva cuvinte si despre grafica web. Exista mai multe posibilitati in aceasta directie, cea mai simpla fiind utilizarea unor elemente grafice (poze, desene) din colectii de grafica specializate, colectii ce se pot gasi fie pe internet, fie impreuna cu programe precum Corel Draw, Photo Draw, etc. Desigur, exista si o posibilitate mai simpla de atat – copierea unor elemente grafice din alte pagini web. Acest lucru nu este recomandat insa, in primul rand datorita faptului ca elementele grafice respective vor fi rupte din context. In plus, pentru majoritatea exista drepturi de autor, astfel incat nu pot fi utilizate fara permisiune, in mod normal.

Cel mai bun lucru de facut in aceasta directie este utilizarea unor elemente grafice ca sursa de pornire si prelucrarea acestora intr-un program specializat de tipul Adobe Photoshop. Acesta este un program excelent pentru grafica web ce permite diverse prelucrari ale pozelor si desenelor precum si crearea de la zero a unor elemente de grafica pentru pagina ta. Vom prezenta o serie de operatiuni de baza ce se pot aplica unei poze incarcate in Photoshop. Mai intai, mergi in Image/Mode si selecteaza RGB Color, daca acest mod nu este deja selectat. Sa incepem: modifcarea dimensiunilor unei poze prin marire/micsorare – Image/Image Size, modificarea dimensiunilor prin taiere/completare – Image/Canvas Size, rotire imagine – Image/Rotate Canvas. Photoshop prezinta si o serie de unelte pentru completari/retusari ale imaginii (pencil, eraser, blur, paint bucket, etc). De asemenea, vei dori sa utilizezi si diversele filtre disponibile in meniul Filter – unele dintre ele sunt foarte reusite (nu uita sa setezi modul RGB pentru imagine inainte de folosirea filtrelor).

O operatiune destul de simpla in Photoshop este crearea de texte pentru butoane, titluri, etc. Deschide un fisier nou (File/New) si selecteaza unealta Text din toolbar (cea cu un “T”). Fa click oriunde in imaginea ta – se va deschide o fereastra noua unde vei putea scrie textul dorit si stabili parametrii acestuia (font, dimensiune, culoare, etc). Pentru efecte aplicate textelor deschide fereastra Layers (Window/Show Layers, daca aceasta nu exista deja pe ecran), fa click cu butonul din dreapta pe Layer-ul (nivelul) care contine textul scris de tine, selecteaza Effects si testeaza diversele efecte disponibile. La sfarsit, selecteaza din Toolbar unealta din stanga sus (in forma de patrat cu linii punctate), incadreaza textul scris de tine cu ajutorul acesteia si mergi la Image/Crop pentru a dimensiunea in mod exact fisierul.

Read more …

Curs de realizare pagini Web folosind limbajul HTML

Capitolul IX – Despre cadre ( frames )

Poti imparti fereastra in mai multe zone sau cadre (numite frames). Acest lucru este foarte util in mai multe situatii. Spre exemplu, poti imparti pagina pe verticala in doua zone: una mai mica unde poti avea un meniu cu mai multe optiuni, si una mai mare unde se incarca informatiile.
<HTML>
<FRAMESET COLS=”120,*” FRAMEBORDER=”NO” BORDER=”0″ FRAMESPACING=”0″>
<FRAME NAME=”index” SRC=ex11_idx.html>
<FRAME NAME=”main page” SRC=ex11_dat.html>
</FRAMESET>
</HTML>

Read more …

Curs de realizare pagini Web folosind limbajul HTML

Capitolul VIII – Despre imagini

Prezentarea imaginilor in pagini HTML se face folosind tag-ul <IMG SRC=nume>, unde nume este numele unui fisier gif sau jpg. Exemplu:

<IMG SRC=sigla.gif>, va afisa (presupunand ca avem deja fisierul sigla.gif):

Tag-ul IMG poate primi si atributul BORDER cu formele BORDER=0 (implicit) sau BORDER=n – pentru un chenar in jurul pozei de dimensiune n pixeli. O poza intr-un chenar arata mai bine:

 

<IMG SRC=sigla.gif BORDER=1>, va afisa: Read more …

Curs de realizare pagini Web folosind limbajul HTML

Capitolul VII – Ultimile retusuri

Suntem foarte aproape de a da o forma finala fisierului nostru index.html deschis in Notepad si care a servit ca exemplu pana acum. Mai intai vom introduce si tag-ul <HR>. Acesta are un rol foarte simplu si anume – de a trasa o linie orizontala pe toata latimea ferestrei. Acest tag functioneaza la fel ca si BR (adica, nu se foloseste </HR>). Tag-ul HR primeste si atributul WIDTH sub forma WIDTH=x sau WIDTH=x% care specifica lungimea liniei in pixeli sau ca procent din latimea totala a ferestrei. Exemplu:

<HR WIDTH=600>
Read more …

Curs de realizare pagini Web folosind limbajul HTML

Capitolul VI – Link-uri si pozitionare

Un element important al oricarei pagini web il constituie link-urile catre alte pagini. Acestea pot fi link-uri externe, care fac referire catre un alt site, sau link-uri interne care fac referire catre alte pagini ale aceluiasi site. Ambele tipuri se codifica asemanator prin folosirea unui tag de tipul <A HREF=link.html>…</A> (pentru un link intern) sau
<A HREF=http://www.abc.abc>…</A> pentru un link extern. Astfel codul de mai jos va afisa textul “Apasati aici pentru pagina 2″ care prin apasare va incarca fisierul pag2.html:
Read more …

Curs de realizare pagini Web folosind limbajul HTML

Capitolul V – Exemple de tabele

In continuare vom da doua exemple de tabele care pot fi incarcate si in fisierul index.html desxhis in Notepad:

<TABLE WIDTH=700 BORDER=0 CELLPADDING=5 CELLSPACING=5>
<TR>
<TD WIDTH=30% BGCOLOR=#006666 ALIGN=LEFT>
<FONT FACE=VERDANA,ARIAL SIZE=2 COLOR=#FFFFFF>
<B> Adresa: </B></FONT></TD>
<TD BGCOLOR=”#CCEEEE” ALIGN=LEFT>
<FONT FACE=VERDANA,ARIAL SIZE=2>
<I> Bulevardul Independentei nr. 0, Bloc 0, Ap 0, Sector 0, Bucuresti </I></FONT></TD>
</TR>
<TR>
<TD WIDTH=30% BGCOLOR=#006666 ALIGN=LEFT>
<FONT FACE=VERDANA,ARIAL SIZE=2 COLOR=#FFFFFF>
<B> Activitate: </B></FONT></TD>
<TD BGCOLOR=”#CCEEEE” ALIGN=LEFT>
<FONT FACE=VERDANA,ARIAL SIZE=2>
<I> ABC SRL va ofera o gama larga de produse si servicii necesare dezvoltarii activitatii societatii Dumneavoastra. Ne recomandam prin structura deosebita a ofertei noastre precum si prin politica de preturi practicata. </I></FONT></TD>
</TR>
</TABLE>

Read more …

Curs de realizare pagini Web folosind limbajul HTML

Capitolul IV – Despre tabele

Tabelele se utilizeaza folosind tag-ul <TABLE>…</TABLE>. Imaginati-va un tabel simplu deschis in Word care cuprinde mai multe casute. In fisierul HTML, casutele sunt organizate pe randuri (rows – linii orizontale de casute). La randul lor, randurile sunt organizate in elemente (casute). Read more …

Curs de realizare pagini Web folosind limbajul HTML

Capitolul III – Despre culori

Am vazut in capitolul anterior ca textele din paginile HTML pot avea diverse culori cu un tag de tipul <FONT COLOR=#00FF00>…</FONT>. Vom prezenta in continuare sistemul de codificare a culorilor pentru paginile web. Read more …