Pagini Web

Pagini web

O pagină web este o resursă aflată în spațiul web (WWW) din Internet, de obicei în format HTML sau XHTML (extensia numelui fișierului fiind de cele mai multe ori .html sau .htm) și avândhiperlinkuri (hiperlegături) pentru navigarea simplă (cu un singur clic de maus) de la o pagină sau secțiune de pagină la alta. Pagina web se numește astfel deoarece ea se poate afișa pe unmonitor sau ecran de calculator și se aseamănă într-o oarecare măsură cu o pagină de ziar. Lățimea paginii web este de obicei astfel făcută ca ea să încapă în întregime pe lățimea ecranului disponibil. În schimb înălțimea ei poate depăși cu mult pe cea a ecranului. În aceste cazuri browserul și mausul permit de obicei vizionarea simplă și rapidă a întregii pagini, și anume prin "tragerea" ei în sus și în jos, după dorință. Pentru a furniza nu numai texte dar și imagini și sunete, paginile web utilizează deseori fișiere grafice sau sonore integrate, dar și hiperlinkuri către alte resurse neintegrate în pagina respectivă.

De obicei furnizorul de informații își grupează și organizează paginile în cadrul unui site web, care la cerere, și pentru a putea fi regăsit, primește un identificator Internet unic numit URI.

O pagină web poate conține:

texte în cele mai diferite formate (forme, mărimi, culori, poziții etc.)

imagini (fișiere cu formatele .gif, .jpeg, .png ș.a.)

audio (fișiere în formatele .mid, .wav ș.a.)

conținut multimedial interactiv care, pentru a fi văzut și utilizat, necesită de obicei un plugin ca de ex. cu formatul Adobe Flash sau Adobe Shockwave

miniaplicații (așa-numite "applets") – subprograme care rulează la chemarea paginii și care deseori oferă filme, imagini, interacțiune și sunete.

Paginile web mai pot conține și elemente care nu sunt făcute pentru a fi afișate de browser, cum ar fi:

scripturi (de obicei în formatul JavaScript), care adaugă paginii funcționalitate suplimentară (de exemplu creează efecte vizuale sau verifică datele introduse intr-un formular web),

meta-etichete – furnizează informații despre pagină, instrucțiuni pentru roboții motoarelor de căutare, etc. Cuvintele cheie și celelalte descrieri din meta-etichete ajută motoarele de căutare să catalogheze pagina corect și, în cazul acțiunilor de căutare, să ofere rapid informații și rezultate.

foi de stil (așa-numite "Cascading Style Sheets" sau "CSS"), care stabilesc modul cum este formatată pagina

comentarii

Atenție, paginile web mai pot conține și așa-numiți viruși informatici precum și alte funcțiuni dăunătoare (malițioase) dar greu de văzut/recunoscut.

Scrierea corecta unei pagini de Web în HTML 

Desigur paginile de Web sunt scrise într-un limbaj numit HTML (Hypertext Markup Language limbaj de marcare hipertext). HTML permite utilizatorilor să producă, pagini care includ texte, grafică și indicatori la alte pagini de Web. Vom începe să studiem HTML acești indicatori, pentru că ei reprezintă tocmai mecanismul care ține Web-ul conectat.

URL- Uniform Resource Locators

O pagină de Web poate să conțină referințe la alte pagini. Să explicăm cum sunt implementate aceste referințe. Încă de la crearea Web-ului a fost clar că pentru a avea o pagină care să indice spre altă pagină este necesar un mecanism care să permită numirea și regăsirea paginilor. În particular sunt trei întrebări la care trebuie sa se răspundă înainte de a se putea afișa o pagină: 

l. Cum se numește pagina ?
2. Cum este localizată pagina ?
3. Cum se face accesul la pagină ?

Dacă fiecare pagină ar avea un nume unic, atunci nu ar exista nici o ambiguitate în identificarea paginilor. Totuși, problema nu este încă rezolvată. Să considerăm de exemplu o paralelă între oameni și pagini. În SUA aproape fiecare persoană are un număr de asigurare socială; care este un identificator unic, astfel încât nu există două persoane cu același număr. Totuși, cunoscând numai numărul respectiv nu există nici o posibilitate de a găsi adresa persoanei respective, și sigur nu se poate afla dacă persoanei respective trebuie să i se scrie în engleză, spaniolă sau chineză. Web-ul are practic același fel de probleme. 

Soluția aleasă identifică paginile într-un mod care rezolvă toate trei problemele în același timp. Fiecare pagină are un URL (Uniform Resource Locater – adresa uniformă pentru localizarea resurselor) care funcționează ca nume al paginii general valabil. Un URL are trei componente: protocolul, numele DNS al mașinii pe care este memorat fișierul și un nume local, care indică în mod unic pagina (de obicei numele fișierului care conține pagina). De exemplu, URL-ul departamentului din care face parte autorul este: 

http: //www. cs. vu. nl/welcome. Html

Dacă fiecare pagină ar avea un nume unic, atunci nu ar exista nici o ambiguitate în identificarea paginilor. Totuși, problema nu este încă rezolvată. Să considerăm de exemplu o paralelă între oameni și pagini. În SUA aproape fiecare persoană are un număr de asigurare socială; care este un identificator unic, astfel încât nu există două persoane cu același număr. Totuși, cunoscând numai numărul respectiv nu există nici o posibilitate de a găsi adresa persoanei respective, și sigur nu se poate afla dacă persoanei respective trebuie să i se scrie în engleză, spaniolă sau chineză. Web-ul are practic același fel de probleme. 

Soluția aleasă identifică paginile într-un mod care rezolvă toate trei problemele în același timp. Fiecare pagină are un URL (Uniform Resource Locater – adresa uniformă pentru localizarea resurselor) care funcționează ca nume al paginii general valabil. Un URL are trei componente: protocolul, numele DNS al mașinii pe care este memorat fișierul și un nume local, care indică în mod unic pagina (de obicei numele fișierului care conține pagina). De exemplu, URL-ul departamentului din care face parte autorul este: 

http: //www. cs. vu. nl/welcome. Html

Acest URL este format din trei componente: protocolul (http), numele DNS al serverului (www. cs. vu. nd) și numele fișierului (welcome. html), cu semnele de punctuație corespunzătoare. Se utilizează notații care reprezintă prescurtări standard. De. exemplu user/ poate să fie pus în corespondență cu directorul WWW al utilizatorului user, folosind convenția că o referință la directorul respectiv implică un anumit fișier, de exemplu index. html. De exemplu pagina autorului poate să fie referită ca: 

http: //www. cs. vu. nl/~ast/

chiar dacă de fapt numele fișierului este diferit. Pe multe servere un nume de fișier indică implicit pagina organizației căreia îi aparține serverul. 

Acum ar trebui să fie clar cum funcționează hipertextul. Pentru a face o porțiune de text selectabilă, cel care scrie pagina trebuie să furnizeze două elemente: textul prin care se face selecția și URL-ul paginii care trebuie adusă dacă textul este selectat. Când se face selecția, programul de navigare caută numele serverului utilizând DNS-ul. Pe baza adresei IP a serverului, programul de navigare stabilește o conexiune TCP spre server. Utilizând această conexiune, se transmite numele fișierului utilizând protocolul specificat. Bingo. Acum sosește pagina. Protocolul http este protocolul nativ pentru Web; e1 este utilizat de către serverele de HTTP. Protocolul ftp este utilizat pentru accesul la fișiere prin FTP (File Transfer Protocol – protocol pentru transferul de fișiere), protocolul Internet de transfer de fișiere. FTP este utilizat de peste douăzeci de ani și este foarte răspândit. Numeroase servere de FTP din toată lumea permit ca de oriunde din Internet să se facă o conectare și să se aducă orice fișier plasat pe un server FTP. Web-ul nu aduce schimbări aici, face doar ca obținerea fișierelor să se facă mai ușor, pentru că FT'P are o interfață mai puțin prietenoasă. În viitor probabil că FTP-ul va dispare, deoarece nu există nici un avantaj pentru o organizație să aibă un server de FTP în loc de un server de HTTP, care poate să facă tot ce face un server de FTP, și chiar mai mult (desigur mai există niște argumente legate de eficiență). Este posibil să se facă acces la un fișier local ca la o pagină de Web, fie utilizând protocolul file (fișier), sau pur și simplu utilizând numele fișierului. Această abordare este similară utilizării protocolului FTP, dar nu implică existența unui server. Desigur funcționează numai pentru fișiere locale. 

{Protocolul news permite unui utilizator de Web să citească un articol din știri ca și cum ar fi o pagină de Web. Aceasta înseamnă de fapt că un program de navigare este în același timp și un cititor de știri. De fapt multe programe de navigare au butoane sau elemente de meniu care permit citirea știrilor USENET mai ușor decât daca se utilizează cititoare de știri obișnuite. 

  Definitie.

             O adresa URL (Uniform Resource Locators), numita locatia uniforma de resurse, este folosita de reteaua WWW pentru a specifica(localiza) fisierele ce contin paginile Web sau diverse informatii stocate pe un anumit server din sistemul Internet in vederea accesarii lor de catre utilizatorii-clienti.

              O adresa URL include tipul de resursa accesat ( de exemplu WWW, Gopher, WAIS, news, telnet, etc.), adresa serverului si calea(path) fisierului accesat.

               Sintaxa pentru a descrie o adresa(locatie) URL:

                        <scheme >://host.domain/path/file    ,

unde <scheme> poate reprezenta unul din elementele:

        file – pentru un fisier local (din sistemul utilizatorului);

        ftp  – pentru un fisier de pe un server  FTP anonim;

        http – pentru un fisier de pe un server WWW;

        gopher – pentru un fisier de pe un server Gopher;

        wais –  pentru un fisier de pe un server WAIS;

        news – pentru un grup (group) de stiri UseNet;

        telnet – pentru o conexiune la un serviciu bazat pe Tenet.

Accesarea paginii Web a Institutului de Matematica al Academiei Romane:

Crearea si editarea paginii HTML

Sunt mai multe programe cu care se pot crea pagini web, chiar fara a cunoaste limbjul HTML, cum sunt Microsoft FrontPage sau Macromedia Dreamweaver.
Editoarele de text sunt programele de baza, si cele mai folosite, pentru editarea paginii web. Avantajul folosirii lor este simplitatea, pentru creare paginii web sunt necesare câteva din codurile invizibile ale limbajului HTML, astfel se creaza documente rapid si usor, in plus ocupa foarte putin spatiu si resurse de memorie, acestea insa necesita cunoasterea limbajului HTML.
Dintre editoarele de text cunoscute cel mai folosit este NotePad, care este folosit si pentru acest curs, dar poate fi utilizat orice editor de text. Pentru începatori si pentru usurinta cu care se lucreaza, eu recomand folosirea aplicatie NotePad sau Notepad++, dar cei avansati pot folosi si altele cum ar fi Dreamweaver.

1. Crearea bazei de început a unui document

Cum ati vazut in Lectia 1, sunt elemente sigure, generale, care sunt necesare pentru crearea unui document HTML.
Pentru început deschideti aplicatia NotePad si scrieti structura de baza a unei pagini web. Aceasta este:

<html>
  <head>
    <title> Titlul </title>
  </head>
  <body>
    Continut
  </body>
</html>

Acum pagina dv. are HEAD si BODY in interiorul bazei <HTML>.
In interiorul elementului HEAD are elementul TITLE, pe care ar trebui sa-l completati cu un text reprezentativ ca titlu al documentului dv.; si in BODY un text "Continut".
Ceea ce scrieti la TITLE va apare in linia cea mai de sus a browseru-lui (deasupra meniurilor). La TITLE puteti pune orice text, dar este bine sa scrieti ceva care sa descrie cat mai bine obiectul si continutul paginii deoarece este ceea ce cauta si indexeaza multe portaluri de cautare de pe internet, si indicat, sa nu depaseasca 70 caractere.
Ceea ce adaugati intre tag-urile <body> </body> reprezinta continutul paginii, care va fi afisat in browser.
Mai jos gasiti un exemplu cum ar putea fi completat tag-ul TITLE si un mic continut in pagina:

<html>
  <head>
    <title>MarPlo.net – Cursuri, Jocuri si Anime</title>
  </head>
  <body>
    <h1>Pagina HTML</h1>
    Lectii, exemple si explicatii.
  </body>
</html>

 <h1> </h1> este o eticheta HTML pentru afisare de text mare (ca un titlu) in pagina.
– Ca sa vedeti rezultatul, copiati acest cod intr-o pagina noua deschisa cu Notepad si apoi salvati fisierul cu extensia .html. Daca nu stiti deja, pt. a-l salva alegeti la "Save as type" – All Files, apoi la "File name" ii scrieti numele si extensia (ex.: "pagina.html"). Dupa ce a fost salvat fisierul, deschideti-l cu un browser (trebuie sa mearga cu dublu-click pe el).

2. Setarea proprietarilor documentului

– Proprietatile documentului pot fi controlate de atributele elementului BODY, de exemplu cum ar fi culorile pentru fondul paginii, pentru text si diferite faze ale link-urilor. Culorile sunt setate folosind culorile de baza: rosu, verde si albastru; expresia folosita RGB (Red, Green, Blue), acestea sunt reprezentate ca valori hexadecimale si sunt scrise intre ghilimele (" "), la inceput trebuie adaugat caracterul '#'. Fiecare 2 unitati ale codului reprezinta una din culorile RGB. De exemplu:

 #00aa11  reprezinta o culoare care nu are Rosu (00), are Verde (aa) si Albastru mai putin (11).

Dupa ce a-ti creat baza de început a unui document si a-ti setat proprietatile, trebuie sa salvati fisierul. Salvarea trebuie facuta intr-un format pe care browser-ul îl poate recunoaste. Extensia standard pentru un fisier care reprezinta o pagina web este ".htm" sau ".html". De obicei folosesc (".html"):
– Pentru a salva documentul ca sa arate ca o pagina web, in NotePad alegeti din meniul File comanda Save si salvati fisierul cu orice nume doriti dar cu extensia html(sau "htm") – (La File name: scrieti si numele si extensia ".html", exemplu: index.html). Daca nu scrieti extensia, NotePad va salva documentul in format "txt".
– Pentru a vedea documentul ca o pagina web, duceti-va in directorul in care a-ti salvat fisierul si deschideti-l pur si simplu (cu Enter sau dublu-click la mouse), acesta va fi deschis automat de browser-ul pe care-l folositi (Mozilla Firefox, Internet Explorer, Opera). Sau deschide-ti browser-ul si din comanda Open deschideti documentul pe care l-ati salvat.
– Pentru a continua munca, a face modificari paginii sau pentru a adauga altceva in documentul HTML, deschideti documentul cu NotePad. Una din metode este sa deschideti aplicatia NotePad si din meniul File alegeti Open apoi gasiti fisierul pe care vreti sa-l modificati si dati clic pe butonul Open. Dupa ce terminati modificarile salvati, astfel daca redeschideti documentul ca o pagina web acesta va fi deschis cu noul format.