Teoretic totul este simplu dacă știm care este calea și avem abilitățile necesare. Practic, adeseori avem nevoie de ghidare. Înainte de a începe învățarea unui nou limbaj de programare trebuie să identificăm motivul pentru care dorim să o facem. Dacă învățăm doar "să știm" nu prea tragem foloase de pe urma studiului, dar putem face lucruri deosebite dacă ne facem un mic plan.
1. Vreau să învăț PHP pentru că vreau să pot face o pagină de contact și nu vreau să mai apelez la nimeni.
Când nu știm încotro ne întreptăm nu avem cum să luăm în calcul toți factorii implicați în mica noastră dorință de studiu sau chiar practică.
A. Realizarea unei pagini de contact presupune preluarea unor informații de la persoana care o accesează și transmiterea acestora către destinatar.
B. Trimiterea datelor presupune o verificare atentă a acestora, în prealabil, pentru a ne asigura că operațiunea se va încheia cu succes.
C. Verificarea datelor introduse și tratarea posibilelor erori este o temă de studiu nu foarte complicată, dar una peste care începătorii adeseori nu reușesc să treacă.
Bun. Punctul 1 a picat și trebuie să pornim de la bază. Paginile de internet sunt afișate în programele de navigare (Internet Explorer, Mozilla Firefox, Opera etc) cu ajutorul codului HTML sau XHTML. HTML (HyperText Markup Language) nu este un limbaj de programare, ci doar un limbaj de evidențiere a textului din paginile de internet. Cu alte cuvinte, ceea ce facem într-un editor de texte (Wordpad, Word, Writer) facem și în paginile de internet, cu ajutorul HTML. Diferența constă în modul de lucru și structura documentelor.
Structura unui document HTML este simplă: ANTET + CORP.
* În antetul documentului se scrie tilul paginii, se specifică setul de caractere folosit - în funcție de limba în care redactăm documentul -, se introduc cuvintele cheie după care va fi găsită pagina cu ajutorul motoarelor de căutare + alte informații.
* Corpul documentului conține tot textul pe care îl vedem în pagina de internet.
Limbajul HTML are o caracteristică logică de marcare a elementelor din document și anume etichetele. Atât demarcarea zonei de antet, cât și cea a corpului documentului HTML sunt realizate cu etichete, câte una pentru începutul marcajului și una pentru sfârșit.
De exemplu:
<eticheta>continutul demarcat</eticheta>
După cum se vede, semnele "mai mic" și "mai mare" sunt folosite pentru definirea etichetelor. Cea de început folosește doar cele două caractere, în timp ce eticheta de încheiere are și caracterul "slash", pentru a face diferențierea între eticheta de start, astfel ca programul de navigare să știe "de unde până unde" va aplica efectul sau stilul dictat de cele două etichete.
Documentele HTML se salvează cu extensiile .htm și .html - ambele însemnând același lucru, fiind interpretate la fel de orice navigator. Acum, că știm cum este structurat un document HTML și care este treaba cu etichetele, pot da ca exemplu structura de bază a unei pagini HTML.
<html>
<head>
</head>
<body>
</body>
</html>
Evident, antetul trebuie pus înaintea corpului documentului. Pe lângă aceasta puteți observa faptul că secțiunile HEAD și BODY sunt cuprinse de două etichete, al căror rol este acela de a defini începutul și sfârșitul documentului HTML. Singurul lucru pe care mai trebuie să-l știți pentru început despre structura unui document HTML este că acestea pot fi de mai multe tipuri:
Tipurile uzuale de documente HTML:
- HTML Strict
- HTML Transitional
- HTML Frameset
Limbajul HTML este încă în curs de dezvoltare, următoarea versiune fiind HTML 5, supravegheată de World Wide Web Consortium și colaboratorii acestei organizații. Utilizarea HTML presupune respectarea standardelor emise de W3C, deși în branșa dezvoltatorilor de pagini de internet este cunoscut faptul că producătorii navigatoarelor mai au o cale lungă până să conțină suport pentru toate regulile stabilite în standardele HTML și CSS. Cel mai bun sfat pe care îl pot da unui începător este să respecte standardele când scrie codul. Piața de navigatoare evoluează și în viitorul apropiat tot mai multe se vor alinia la regulile jocului, astfel că paginile de internet scrise corect vor fi afișate la fel în toate programele.
Alegerea tipului de document stă la latitudinea dezvoltatorului, fie în funcție de preferințele acestuia sau de nevoile particulare proiectului pe care îl are de realizat. Cel mai utilizat tip de document HTML este cel tranzițional, care este mai permisiv la redactarea codului. Nu îmi propun să rescriu manualele HTML existente, ci doar să trasez regulile generale în vederea lucrului cu PHP. Am menționat și acronimul CSS - Cascading Style Sheets - sau foi de stiluri în cascadă. Acestea sunt fișiere în care se poate specifica stilul anumitor elemente din paginile de internet. Putem crea pagini și fără să le atașăm o foaie de stiluri, dar CSS are un set de avantaje care ușurează munca dezvoltatorilor. În exemplul următor voi prezenta un model de pagină HTML Transitional cu titlu și cu un fișier CSS adăugat printr-o legătură din antetul paginii.
HTML și CSS:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Titlul documentului HTML</title>
<link rel="stylesheet" href="stiluri.css" type="text/css">
</head>
<body>
Text din corpul documentului HTML.
</body>
</html>
Fișierul CSS (stiluri.css) conține definițiile stilului aplicat în pagina HTML, stocate sub formă de clase. De exemplu:
body {
font-family: Verdana, Arial, Tahoma;
font-size: 12px;
color: black;
}
Indicațiile din fișierul CSS vor avea ca rezultat afișarea textului cu specificațiile de mai sus:
- Fonturile care vor fi încercate pentru afișarea conținutului sunt cele de mai sus. Ele sunt luate în ordine și primul găsit, dintre cele menționate, va fi folosit pentru afișarea textului din corpul paginii;
- Dimensiunea caracterelor din pagină va fi de 12 pixeli;
- Culoarea textului din pagină va fi neagră.
Realizarea unui formular necesită adăugarea a cel puțin două elemente: un câmp text pentru introducerea unor date sau o opțiune de tipul unei căsuțe care poate fi bifată sau nu și un buton de trimite a opțiunii utilizatorului. Odată familiarizați cu conceptul de etichete și modul de utilizare al acestora veți găsi o logică în formularul de mai jos.
Formular preluare nume:
<form action="procesare.php" method="post">
<input type="text" name="nume_utilizator">
<input type="submit" value="Trimite">
</form>
Standardele HTML au fost scrise în limba engleză. Acesta este motivul pentru care denumirile etichetelor sunt în această limbă. Codul formularului de mai sus se citește în felul următor:
Formularul va trimite acțiunea realizată de utilizator către fișierul procesare.php prin metoda de postare a datelor. Conținutul formularului constă într-o căsuță de introducere a datelor, de tip text, cu numele "nume_utilizator", iar butonul care permite trimiterea acestei informații se numește "Trimite". Deoarece formularul apare în pagina de internet, acesta trebuie să fie plasat între etichetele care marchează corpul documentului HTML.
În continuare aveți fișierul HTML complet care vă permite afișarea formularului de preluare a numelui de utilizator:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Formular preluare nume utilizator</title>
<link rel="stylesheet" href="stiluri.css" type="text/css">
</head>
<body>
<form action="procesare.php" method="post">
<input type="text" name="nume_utilizator">
<input type="submit" value="Trimite">
</form>
</body>
</html>
Fișierul procesare.php va conține codul PHP care permite afișarea datelor introduse de utilizator. La fel ca limbajul HTML, codul PHP trebuie delimitat de două etichete. Începutul codului PHP este marcat cu eticheta <?php și încheierea acestuia se face cu ?>
Iată conținutul fișierului procesare.php:
<?php
echo "Numele de utilizator este: " . $_POST['nume_utilizator'];
?>
Acesta va afișa numele introdus în căsuța de tip text numită nume_utilizator. Desigur, pentru executarea codului PHP trebuie să dispuneți de un server de internet cu PHP instalat. Funcția PHP care afișează text în paginile de internet se numește echo și utilizarea acesteia o voi explica în detaliu în articolul despre PHP.
ATENȚIE! Codul PHP folosit servește strict ca exemplu și nu este securizat doar din motive de prezentare a unui cod simplu, funcțional și ușor de citit. Despre securitatea datelor de intrare veți putea citi în următoarele articole.
În încheiere, vă recomand câteva tutoriale cuprinzătoare despre HTML și CSS:
- Tutorial HTML, creat de Cătălin Drogoreanu
- Tutorial CSS, creat de Cătălin Drogoreanu
- Specificațiile oficiale HTML 4.01, publicate de World Wide Web Consortium
- Specificațiile oficiale CSS 2.1, publicate de World Wide Web Consortium
- Tutorial HTML concis, bine documentat, cu exemple și teste de aptitudini, realizat de W3Schools
- Tutorial CSS bine organizat, de asemenea cu exemple și teste, realizat de W3Schools
Succes în continuare! |
La mulţi ani! 
Ok , let's read !
