Site-uri web, bloguri, pagini web - concepte deja familiare în vremea noastră. Odată cu dezvoltarea internetului, site-urile pentru găzduirea paginilor web au devenit incredibil de populare, iar acest lucru nu este surprinzător: pentru unii oameni, a avea propriul site web este o necesitate, pentru alții este un divertisment plăcut. În primul caz, vorbim de obicei de firme, corporații, antreprenori privați, atunci când fac reclamă la orice produs sau serviciu la cerere. Al doilea este despre bloggeri.
Pe lângă aceasta, există utilizatori de internet care pur și simplu caută informații, citesc bloguri, vizionează videoclipuri și așa mai departe.
Pentru a crea un site web de calitate, există multe opțiuni. Ne vom concentra pe programarea web prin HTML.
Ce este HTML
HTML înseamnă Hyper Text Mark-Up Language. Tradus din engleză, aceasta înseamnă „Hypertext Markup Language”.
Cu alte cuvinte, HTML este un set de coduri cu ajutorul cărora poți crea elementele principale ale site-ului, cadrul acestuia, cum ar ficum sunt alcătuite cuvintele din propoziții.
Codurile HTML sunt scrise exclusiv cu litere latine și se numesc etichete, iar fiecare cod este cuprins între paranteze unghiulare. Unele etichete sunt asociate, altele sunt neîmperecheate.
Împerecheate înseamnă că trebuie folosite fără greșeală în perechi. De exemplu, eticheta de deschidere indică unde începe pe o pagină web, iar eticheta de închidere indică unde se oprește. Acesta din urmă diferă de primul prin prezența unui caracter oblic după paranteza unghiulară de deschidere. De exemplu, este eticheta de deschidere,este eticheta de închidere.
Etichetele neîmperechete nu au nevoie de un partener.
Multe etichete pot avea atribute - elemente suplimentare care îi dau un sens mai specific. De exemplu, eticheta.
Unde se folosește HTML
Înțelegerea clasică a locului în care este necesar HTML este crearea de site-uri.
În practică, acest lucru poate fi suficient, deoarece HTML vă permite să creați elementele principale ale site-ului, meniuri (inclusiv cele cu mai multe niveluri), să setați fundalul, să inserați text, imagini, audio, video, editați fonturi și multe altele.
Cu toate acestea, există și alte limbi care vă permit să adăugați elemente mai interesante și adesea necesare unei pagini web:
- CSS stabilește stiluri pentru întregul site, fără a fi nevoie să prescrii în mod constant caracteristicile de stil ale elementelor individuale folosind etichete - de exemplu, culoarea și fontul textului.
- Limbajul de script vă permite să dezvoltați și să încorporați mini-programe (scripturi) pe site, variind de lalucruri estetice banale (schimbarea culorii link-ului la trecerea cu mouse-ul) și terminând cu cele funcționale (colectarea adreselor de e-mail ale clienților, numerelor de telefon).
- Cu PHP vă puteți dezvolta propria carte de oaspeți sau sistemul de comentarii.
De asemenea, HTML este folosit la crearea de e-mailuri pentru distribuire.
Ce este un link
Vă permit să navigați la o altă pagină web, atât în interiorul site-ului, cât și extern.
Link-urile HTML sunt utilizate în mod obișnuit:
- Pentru a accesa o resursă web externă.
- Pentru a vă deplasa printre paginile site-ului.
- Pentru a accesa formularele Google.
De multe ori este indicat și un link către sursa în HTML, mai ales că atunci când copiați material de pe alt site, trebuie să specificați autorul. În caz contrar, copierea fără atribuire poate intra sub incidența definițiilor de încălcare a drepturilor de autor, furt de conținut și backfire. În plus, utilizarea materialelor împrumutate, neunice reduce performanța SEO, iar indicarea unui link către sursă reduce riscurile.
Tipuri de linkuri
În sensul clasic, un link este adresa unei resurse web la care puteți accesa făcând clic pe ea.
Pe lângă aceasta, există hyperlinkuri: text și imagini. În aceste cazuri, linkul HTML este „ascuns” sub o propoziție (cuvânt) sau imagine și, pentru a o urma, trebuie să faceți clic pe text sau pe imagine.
Alte tipuri de link-uri:
- Nevizitat - un link pe care nu a fost încă făcut clic în timpul unei anumite sesiuni. De exemplu, dacă ați urmat acest link ieri, apoi ați oprit computerul și l-ați repornit astăzi, acum linkul nu este vizitat din nou, deoarece a început o nouă sesiune.
- Activ - în această stare, linkul este salvat pentru o perioadă foarte scurtă de timp: intervalul dintre clic pe link și urmărire.
- Vizitate - un link care a fost deja vizitat cel puțin o dată în timpul unei sesiuni.
Pentru linkurile text obișnuite, cele vizitate tind să-și schimbe culoarea, dacă nu se specifică altfel.
O imagine cu hyperlink nu își schimbă aspectul, indiferent dacă este vizitată sau nu.
Cum se inserează un link obișnuit
Multe resurse web percep adresa site-ului ca pe un link, o fac imediat clicabilă și o evidențiază cu culoare. De exemplu, dacă adresa este trimisă printr-un messenger sau prin e-mail, făcând clic pe ea, puteți accesa site-ul.
În cazul în care creați singur un site folosind HTML, trebuie să introduceți un link folosind o etichetă specială. Va arăta astfel: adresa site-ului web. Textul linkului în HTML trebuie specificat în întregime, cu protocol.
Cum se inserează un hyperlink text
S-a spus mai devreme că un hyperlink text îndeplinește aceeași funcție ca un link obișnuit, dar arată mai plăcut din punct de vedere estetic: în loc de adresa unui site, care este adesea inutil de lungă, este indicată un cuvânt sau o expresie. De exemplu, în propoziția „Căutați informații aici”, puteți ascunde linkul încuvântul „aici”. Acesta va fi evidențiat și făcând clic pe acesta va duce utilizatorul la site-ul dorit.
Cum se creează un link HTML a fost deja discutat mai devreme. Puteți insera un hyperlink text folosind aceeași etichetă. Singura diferență este că trebuie să specificați între etichete textul sub care va fi ascuns linkul: text vizibil.
Cum se inserează un hyperlink de imagine
E puțin mai complicat aici. Folosim aceeași etichetă, dar în loc de text, trebuie să specificați calea către imagine.
Calea este locația imaginii. Dacă imaginea (fotografie) se află într-un serviciu de partajare a fișierelor, atunci trebuie să specificați toate folderele de-a lungul căii către imagine printr-o bară oblică. De asemenea, puteți include un link către o imagine, dacă este posibil.
Pentru a eticheta
pe lângă src, sunt aplicabile și alte atribute, permițându-vă să reglați înălțimea, lățimea și locația imaginii și multe altele. Unele dintre ele:
- Src - specifică calea către imagine.
- Lowsrc - identic cu atributul anterior, dar specificat pentru imagini de calitate scăzută.
- Înălțime - înălțimea imaginii.
- Lățime - lățimea sa.
- Alt - descrierea imaginii. Când treceți cu mouse-ul peste o fotografie sau o imagine, va apărea textul specificat în acest atribut.
- Border - determină grosimea marginii din jurul imaginii.
Atributele sunt specificate după etichetă și sunt incluse încompoziția sa. Atributul trebuie să fie urmat de valoarea sa. De exemplu, pentru atributele „înălțime” sau „lățime” (înălțime, lățime) se specifică înălțimea imaginii de pe pagina web. Unitatea de măsură sunt pixeli, dacă nu se specifică altfel.
Va arăta astfel: <a href="adresa paginii web"
. Aceste atribute vor ajuta la setarea dimensiunii potrivite pentru imagine. Chenarul ajută la crearea unui chenar invizibil în jurul imaginii.
Atributele de mai sus se aplică separat etichetei de inserare a imaginii. De exemplu:.
Ce sunt linkurile ancora
Crearea de link-uri ancora este o abilitate foarte utilă. Adesea este nevoie de a aranja o pagină web cu un bloc de text lung sau cu mai multe subsecțiuni pe o singură pagină. În acest caz, puteți începe imediat cu o listă de link-uri către subsecțiuni ale textului sau ale paginii web, iar când faceți clic pe ele, utilizatorul va merge direct la secțiunea solicitată.
Crearea link-urilor de ancorare va necesita mai multă utilizare a etichetelor de atribut decât alte tipuri de linkuri.
În primul rând, trebuie să setați valoarea globală pentru fiecare bloc de informații sau subsecțiune de text folosind atributul de sus, apoi să o asociați cu linkul corespunzător.
Caracteristicile lor sunt mai extinse, prin urmare este recomandabil să stăpâniți mai întâi crearea de legături mai simple, apoi să treceți la formarea de legături de ancorare.
Sfaturi
Ajutor de la experiențăprogramatori:
- Puteți face astfel încât informațiile despre un link să fie afișate la trecerea cursorului în HTML. Pentru aceasta, atributul alt, pe care îl folosim și pentru elementele grafice, poate fi util.
- Este posibil să faci o listă de link-uri folosind HTML. În special, acest lucru poate fi util pentru legăturile de ancorare, precum și atunci când trebuie să faceți o listă de resurse web care poate fi urmată de un link direct de pe pagina web curentă.
- Cu ajutorul CSS și JavaScript, precum și a unor funcții HTML, puteți crea un design diferit de link-uri text și hyperlink-uri decât de obicei. De exemplu, când treceți cu mouse-ul peste un link, acesta își poate schimba culoarea și poate reveni la cea anterioară când cursorul este departe de acesta. Acest lucru se poate face cu un script JavaScript personalizat. În plus, culoarea linkului poate fi setată la altceva decât albastru pentru nevizitate sau violet pentru vizitat. Aceasta este treaba CSS.
- Nu abuzați de link-uri. O pagină web cu multe linkuri neadecvate arată neglijentă și neglijentă.
- Asigurați-vă că utilizatorul înțelege că hyperlinkul cu imaginea este într-adevăr o imagine, și nu doar o imagine.
Concluzie
Este foarte ușor să faci link la o pagină în HTML. Este important să urmați toate punctele principale ale acestui limbaj, deoarece chiar și o mică greșeală poate duce la faptul că nu va exista niciun rezultat, iar codul nu va funcționa.
