5: Linkuri in html – cod html link – Tutoriale html

Nici nu trebuie sa zic ca cea mai importanta parte a codului html pe web, sunt linkurile. Tagul folosit pentru un link in limbajul html este scurt si simplu. Linkurile, legaturile sunt cei care fac conexiunea cu alte pagini, si sunt foarte importante si din punctul de vedere al motoarelor de cautare. Haideti sa vedem ce cod html putem folosi pentru diferite tipuri de linkuri.

Exemplu cod html link

<a href="https://it.webdesign-galaxy.ro/">Tutoriale it</a>

Rezulta in: Tutoriale it

Deci:

<a href=”adresa-sitului-paginii-url”>Cuvant care apare la vizitator</a>

“href” – inseamna Hypertext Reference.

Cod html link – in fereastra noua, in tab nou

<a target="_blank" href="https://google.ro/">Google</a>

Rezulta intr-un link catre google.ro intr-un tab nou: Google

Cand se va da click pe linkul respectiv, pagina noua se va deschide intr-un tab nou, intr-o fereastra noua. Acest lucru e specializat cu “target=”_blank”.
Mai exista si “target=”_parent”, “target=”_self” si “target=”_top”, care deschid in aceasi fereastra pagina noua, deci nu prea veti folosi, pentru ca daca nu se specifica un “target”, “by default”, linkul se deshide in acelasi fereastra, tab, in care ne aflam.

Link title – text deasupra unui link

<a
title="Tutoriale it, Tutoriale html" target="_blank"
href="https://it.webdesign-galaxy.ro/">
Tutoriale
</a>

Rezulta in: Tutoriale it, Tutoriale html.

Aceasta facilitate a atributului “title“, este folositor din mai multe puncte de vedere. In primul rand, sunt cazuri cand un cuvant, un link, nu are loc sa fie prea lung, sau vrem sa definim multe informatii vizitatorului. Deci, in primul rand este avantajos sa folosim “link title” pentru utilizator, vizitator. Al doilea punct pentru care este avantajos folosirea acestei optiuni, este optimizarea site-ului pentru motoarele de cautare. Folosind link title, putem sa folosim mai des cuvintele cheie pe o pagina, si in acelasi timp sa fim mai informativi.

Imagine folosita pentru link

Foarte simplu, in loc de cuvantul folosit pentru link, incadram cu cod html o imagine.
Exemplu:

<a
href="/cum-sa-avem-grija-de-un-laptop/">
<img
src="/laptopuri/placa-video-laptop.png"
border="0" />
</a>

Rezulta intr-un link format dintr-o imagine:


Temperatura laptop

Daca mergeti cu mouse ul deasupra imagini, veti vedea ca este de fapt un link care duce catre o pagina de unde puteti afla cum sa monitorizati temperatura unui laptop!

5 Comentarii

  1. Mircea a scris la: 12 February 2013 at 9:44

    Lcurez la un site si, dupa ce am creat linkurile catre unele fisiere, daca-l pun pe internet site-ul sau il mut pe alt calculator, nu mai functioneaza linkurile. Am incercat si sa folosesc calea alternativa conform tutorialelor de aici si tot nu merge.
    Sunt incepator!
    Multumesc pentru ajutor!
    Daca e cineva care vrea sa ma ajute, sa-mi dea un email la: mirceab26@yahoo.com

  2. istvan a scris la: 12 February 2013 at 10:29

    Salut Mircea!
    Exista 4 tipuri de ghilimele in programare.

    1 – ‘ (langa butonul Enter la stanga)
    2 – ” (shift + acelasi buton langa Enter)
    3 – ` (langa butonul 1, la stanga, sus la numere, butonul Tilda (~)

    In html se foloseste varianta 2, adica ( ” ).
    Din pacate exemplele de mai sus au fost scrise cu varianta 3, care nu functioneaza ca si cod, (pentru ca nu sunt interpretate de browser”, era numai pentru vizualizare. Problema a fost corectata, linkurile acum se pot copia, si functioneaza.

    • Andrei a scris la: 25 May 2013 at 18:55

      Istvan poti sa imi spui ce trebuie sa invat dupa ce am invatat tutorialul html? ..si daca cu toate cunostintele din acest tutorial pot sa fac o baza de date sau nush ..sunt incepator..pre incepator.

  3. istvan a scris la: 27 May 2013 at 10:51

    Salut Andrei – dupa tutorialele html trebuie sa urmezi tutorialele css, html-ul nu este de ajuns. Ca sa dai stil unei pagini, trebuie sa stii css. Ca sa poti lucra cu baze de date, trebuie sa stii si un limbaj de programare server side (cum este de exemplu Php), dar poti lucra cu baze de date si fara cunostinte de programare daca folosesti WordPress, sau orice alt framework similar. Iti recomand sa inveti css daca html-ul nu-ti mai reprezinta dificultati. Dupa ce te descurci bine ca sa faci un design in html si css, poti incepe sa inveti sa folosesti chestii mai avansate, dar prima data, neaparat 1:html, 2:css si pe locul 3 sunt mai multe variante pe care poti sa urmezi.

    • Andrei a scris la: 28 May 2013 at 12:05

      Poti sa imi dai un id de mess sau de skype sa iti arat ce am lucrat in html sa imi spui daca moai trb sa lucrez .Ce si cum, Doar daca poti .