Optimizare SEO Timisoara
blog: opinii, comentarii, articole...


Pagina unui website si ce inseamna webdesign pentru aceasta (4)

Cum spuneam, prima pagină a unui website va fi un fișier index.html. Rețineți, fișierul reprezintă o pagină cu un titlu specific, care să vă popularizeze afacerea sau să descrie genul de servicii pe care le prestați, etc. Adică numele de fișier este una, iar titlul paginii este cu totul altceva. Oricum, voi reveni.

O pagină web, schematic vorbind, are două părți: prima este cuprinsă între etichetele <head> și </head>, adică antetul paginii, iar cea de-a doua parte este cuprinsă între etichetele <body> și </body>, respectiv cuprinsul efectiv al paginii. Amândouă aceste părți formează un fișier html cuprins între etichetele <html> și </html>.

Head-ul

Denumirea de antet pentru pagina web este foarte potrivită, deoarece aici se introduc enunțuri, definiții, caracteristici de afișare, scripturi, ș.a.m.d. Cele mai importante elemente ale antetului sunt titlul paginii și câteva definiții denumite meta-tag. Acestea sunt vitale pentru funcționarea paginii web, nu pentru că ea nu ar fi afișată pe internet, ci pentru că absența titlului sau a unor meta-tag-uri ar face ca Google să nu dea de ea, să nu realizeze la ce și cui folosește această pagină sau să nu știe cum să o indexeze, iar în acest caz este o pagină inutilă, deci nu funcționează.

Pentru a sintetiza, un antet conține, în principal, definiții și reguli de afișare sau de citire a conținutului.

Body-ul

Body-ul unei pagini este chiar conținutul acesteia, de fapt textul și imaginea, căci acestea sunt elementele care constituie cuprinsul unei pagini web și implicit a unui website, fără text și/sau imagine eu nu văd necesară o pagină de internet. În body se introduc așadar paragrafe de text, fotografii, tabele cu date, sau fișiere multimedia.

Webdesign-ul se adresează conținutului din body. O pagină web, scrisă în html se bazează în mare măsură pe tabele, de felul în care sunt poziționate căsuțele dintr-un tabel depinde aspectul vizula al paginii. Din conceptul de tabel a derivat cel al căsuței, folosit în „Cascading Style Sheets” (CSS), acesta din urmă nefiind practic un limbaj de programare ci mai curând un set de reguli despre cum să fie afișată o căsuță. Cu alte cuvinte, un instrument care alăturat html-ului dă putere paginii web. Materialul de față nu va trata CSS-ul decât în măsura în care câteva elemente din acesta sunt necesare ca să vă creați pagina și să înțelegeți funcționarea.

De reținut că CSS înseamnă stilul de afișare al paginii, el poate fi inclus în interiorul codului html al paginii sau într-un fișier extern la care se face trimitere. În acest ultim caz, modificând fișierul css modificăm aspectul întregului site sau doar al paginilor care depind de acesta.

Conținutul obligatoriu al unei pagini html

Mai jos aveți conținutul unei pagini web, așa cum este el redat într-o pagină goală creată de Kompozer.

<!DOCTYPE html PUBLIC „-//W3C//DTD HTML 4.01//EN” „http://www.w3.org/TR/html4/strict.dtd”>
<html>
<head>
<meta content=”text/html; charset=ISO-8859-1″
http-equiv=”content-type”>
<title></title>
</head>
<body>
<br>
</body>
</html>

Codul de mai sus nu afișează nimic, este o pagină goală cu adevărat. Primul rând ne spune că documentul este unul scris în html versiunea 4.1, în limba engleză. Eticheta meta content definește caracterul de litere ca fiind latine, west-european, considerat standard în html 4. Ca să folosim caractere românești putem modifica cifra 1 în 2, adică avem ISO-8859-2. În conținut avem

<br>, adică un fel de carriage return, ca și când am tasta „enter” dacă ajugem la capătul rândului.

Pentru a învăța ceva despre cum se face un site si un webdesign pentru paginile acestuia, vom efectua câteva modificări. Apoi, vom salva pagina sub numele de index.hml in folderul nostru pe care l-am denumit deja website. Codul noii noastre pagini va fi ceva de genul:
<!DOCTYPE html PUBLIC „-//W3C//DTD HTML 4.01//EN” „http://www.w3.org/TR/html4/strict.dtd”>
<html>
<head>
<meta content=”text/html; charset=ISO-8859-1″
http-equiv=”content-type”>
<title>Ion Popovici din Timisoara, mecanic de motociclete si
masini vechi.</title>
<meta name=”description”
content=”Reparatii de motociclete si autoturisme care au motoare in doi timpi, restaurare masini si motociclete de epoca, vanzari in regim de consignatie.”>
<meta name=”keywords”
content=”mecanic, motoare in doi timpi, masini vechi, motociclete vechi, restaurare, reparatii”>
</head>
<body>
<div style=”text-align: center;”>Sunteti in site-ul de
prezentare al unui mecanic si al atelierului lui.<br>
Reparatii de motociclete si autoturisme cu motor in doi timpi, atelier situat in cartierul Iosefin din Timisoara.
</div>
</body>
</html>
După cum vedeți, în head am introdus titlul paginii și meta-tag-urile cu descrierea paginii respectiv cuvintele cheie. Despre rolul acestora vom reveni la timpul potrivit. Un scurt text format din două paragrafe, iar în capitolul următor vom evolua cu construcția website-ului și vom aprofunda noțiuni elementare de webdesign.

About Matei Bitea

Am fost jurnalist. M-am retras. Sunt frelancer și mă ocup de SEO. Scriu și fac site-urile altora...