Si të konfiguroni telefonat inteligjentë dhe PC. Portali informativ
  • në shtëpi
  • Gabimet
  • Krijimi i hiperlidhjes më të thjeshtë në një fletore. Çfarë është një lidhje dhe si të krijoni një hiperlink në HTML

Krijimi i hiperlidhjes më të thjeshtë në një fletore. Çfarë është një lidhje dhe si të krijoni një hiperlink në HTML

Një hiperlidhje mund të lidhë faqe brenda një sajti ose të drejtojë në çdo faqe në internet. Kur ndërtoni lidhje me faqet e njerëzve të tjerë, duhet të përdorni gjithmonë adresën absolute të faqes (http://www.site.com/page.html). Kur lidheni me një faqe brenda një sajti, preferohet të përdorni një URL relative (page.html, katalog / faqe.html). Kur krijoni një lidhje grafike, mbani mend se grafika nuk është e disponueshme për disa përdorues, prandaj sigurohuni që të përfshini elementët e duhur të tekstit.

Shembull:

Hiperlidhja brenda faqes html

Ndonjëherë është e nevojshme të krijoni një hiperlidhje brenda së njëjtës faqe. Për shembull, në këtë faqe, këto janë hiperlidhje në fillim të mësimit, që ju lejojnë të shkoni në shikimin e një pyetjeje specifike, dhe në fund të faqes, duke ju lejuar të shkoni në krye të faqes.

Shembull:

Hiperlidhja e postës

Shembull:

Kodi HTML:


[email i mbrojtur]

Shfaq në shfletues:


Hapja e faqeve html në një dritare të re

Duke përdorur atributin TARGET, mund ta ngarkoni faqen në një dritare të re të shfletuesit. Ky atribut përdoret për të vendosur emrin e dritares. Emri i dritares përdoret për qëllime biznesi. Për të hapur faqen në një dritare të re, përdorni konstantën _blank.

Shembull:

Ngjyra e tekstit të hiperlidhjes

Atributet LINK, ALINK, VLINK vendosin ngjyrën e shkronjave të hiperlidhjeve.

Atributi LINK përdoret për të theksuar hiperlidhjet që nuk janë vizituar ende nga përdoruesi.

Rendi i lidhjeve të mëposhtme

Disa shfletues mund të mbështesin tastin Tab për të ndjekur hiperlidhjet. Shfletuesi, si parazgjedhje, thekson lidhjet në rendin që shfaqen në tekstin e faqes. Ju mund të ndryshoni rendin e kërcimit duke përdorur atributin TABINDEX të etiketës ... Për të përfshirë një hiperlidhje në listën që përshkruan rendin e ri të navigimit, duhet t'i caktoni atributit TABINDEX një numër të plotë pozitiv në rangun nga 1 deri në 32767. Për të përjashtuar një hiperlidhje nga lista, duhet t'i caktoni atributit çdo numër negativ. Kur përdoruesi shtyp tastin Tab, kursori kalon te hiperlidhja me vlerën më të ulët të indeksit pozitiv. Nëse disa hiperlidhje kanë të njëjtën vlerë indeksi, e para e përzgjedhur do të jetë ajo që është më e lartë në tekstin e faqes.

Duhet thënë se atributi TABINDEX mund të përdoret për të zgjedhur objekte të tjera, si për shembull grafik.

Hiperlidhjet janë pasuria kryesore e ueb faqeve. Kjo, në fakt, është thelbi i rrjetit të gjerë botëror. Kjo, pa të cilën do të kishte mbetur vetëm një mjet tjetër për shfaqjen e dokumenteve. Ato janë një shfaqje e dukshme e teknologjisë së komunikimit të një shumëllojshmërie të gjerë burimesh të internetit, e cila krijon integrimin unik të Uebit.

Ne të gjithë e dimë shumë mirë se nëse, kur shikoni një faqe në internet, rri pezull kursorin e miut mbi një hiperlidhje të ngulitur në përmbajtjen e një faqeje interneti, kursori do të marrë formën e një dore me një gisht tregues të zgjatur dhe një klikim të vetëm në kjo hiperlidhje do të bëjë që shfletuesi të gjejë atë burim në ueb, tek i cili tregon hiperlidhja dhe ta shkarkojë atë.

Çdo fragment i përmbajtjes së dukshme të një faqe interneti, domethënë teksti dhe grafika, mund të veprojë si një lidhje hiperlidhjeje. Për këtë, aplikohet etiketa<а>me binjakun e saj mbulues... Le të shohim shembullin më të thjeshtë.

Listimi 1.15

"http://www.w3.org/TR/html4/strict.dtd">

Hiperlidhjet
<р>0 tekst i zakonshëm.
Hiperlidhja me një faqe tjetër në internet

Oriz. 1.15. Dritarja e shfletuesit që tregon rezultatin e shfaqjes së skedarit në Listimin 1.15

Është e lehtë të shihet në fig. 1.15, hiperlidhja është gjithashtu e theksuar për ta dalluar atë nga teksti normal. Ngjyra e theksimit vendoset nga përdoruesi i largët në shfletuesin e tij, por ne kemi mundësinë të specifikojmë në mënyrë eksplicite se cilën ngjyrë të përdorim për të theksuar lidhjet duke përdorur fletët e stilit. Ne do të shohim përdorimin e tyre në kapitullin tjetër. Nëse shikojmë kodin në Listimin 1.15, mund të shohim se teksti me të cilin është lidhur hiperlidhja është i rrethuar nga etiketa<а>dhe... Në këtë rast, etiketa hapëse ka parametrin href, vlera e të cilit është URL-ja e burimit të Internetit në të cilin tregon hiperlidhja e krijuar. Në këtë rast, URL-ja mund të jetë ose e plotë, domethënë përfshin emrin e protokollit të hyrjes në burim, emrin e faqes dhe faqen, si, për shembull, "http://www.mysite.com/mypage.htm", dhe relative, kur specifikoni shtegun drejt një dokumenti që ndodhet në të njëjtin sajt me faqen origjinale të internetit. Kjo do të përdorë një kod të ngjashëm me sa vijon:

<а href="/chap2/page1.htm">

Këtu i referohemi një faqe interneti në një skedar të quajtur pagel.htm që ndodhet në direktorinë chap2.
Në përgjithësi, URL-ja duhet të shpjegohet më në detaje. Është mjeti i vetëm dhe absolutisht i saktë për të identifikuar çdo burim në Web. Në përgjithësi, mund të shkruhet si më poshtë:

http://www.mysite.com/fоlder1/file1.htm

URL-ja në vetvete mund të ndahet në tre pjesë logjike. Në fillim të URL-së, ne përshkruajmë protokollin e përdorur për të hyrë në burimin e Internetit. Faqet e internetit përdorin protokollin HTTP, si në shembullin tonë. Nëse keni nevojë të vendosni një hiperlidhje me një skedar të vendosur në ndonjë server FTP, atëherë ky emër shkruhet në pjesën fillestare të URL-së. Ekziston gjithashtu një mekanizëm që lejon, kur kursori i miut klikon në një hiperlidhje, të aktivizojë klientin e postës të instaluar nga përdoruesi në sistem si parazgjedhje dhe të fillojë mënyrën e shkrimit të një letre, duke specifikuar njëkohësisht adresën e marrësit. Për këtë, përdoret një hiperlidhje e formës së mëposhtme:

<а href="mailto://[email i mbrojtur]">

Siç mund ta shihni, fusha kryesore mailto përdoret si përcaktim protokolli, dhe pas një dy pika dhe një palë të pjerrëta, të cilat gjithmonë ndajnë emrin e protokollit nga pjesa kryesore e adresës, shkruhet adresa e emailit në të cilën shkruhet emaili. nga përdoruesi do të dërgohet.

Pjesa e dytë e URL-së përshkruan vetë adresën e burimit. Për një faqe në internet, ky është emri i domenit të faqes. Zakonisht përdoret një emër domain i nivelit të dytë ose të tretë. Emrat e domenit të nivelit të parë shkruhen në fund të emrit të domenit. Brenda çdo domeni të nivelit të parë, organizatat rregullatore alokojnë emra domenesh të nivelit të dytë. Dhe pronarët e emrave të domeneve të nivelit të dytë krijojnë në mënyrë të pavarur emra domenesh të nivelit të tretë. Pra, praktikisht, çdo pronar i një emri domeni të nivelit të dytë i cakton vetes një emër domaini të nivelit të tretë WWW.

Dhe pjesa e tretë e URL-së është shtegu drejt një skedari specifik në hapësirën e brendshme të skedarit të serverit në internet. Këtu ka një digresion të vogël për të shpjeguar se si funksionojnë serverët e uebit.

Në mënyrë që çdo përdorues i largët të jetë në gjendje të hyjë në çdo faqe interneti, e cila, siç e dini, është një koleksion i faqeve individuale të internetit dhe aplikacioneve të specializuara të ekzekutueshme - skripteve, është e nevojshme që të gjitha këto faqe të internetit të jenë në një kompjuter të veçantë, duke funksionuar. një aplikacion i specializuar i quajtur web server. Përgjegjësia e një serveri të tillë ueb është të marrë kërkesa nga përdorues të largët, t'i përpunojë ato kërkesa dhe t'ua dërgojë përmbajtjen e faqeve të internetit përdoruesve në distancë përmes HTTP.

Për një server në internet, një direktori e veçantë ndahet në diskun e kompjuterit, në të cilin ndodhen skedarët html që përmbajnë faqe në internet, dhe aplikacionet - skriptet që ofrojnë funksionet ndërvepruese të sitit. Natyrisht, brenda drejtorisë së përgjithshme të rezervuar për faqet e internetit, ne mund të krijojmë strukturat tona të dosjeve për të ndarë më qartë burimet e sajtit. Kështu, imazhet grafike të përdorura në hartimin e faqeve të internetit zakonisht ndahen në dosje të veçanta, vetë faqet e internetit grupohen në katalogë, sipas përkatësisë së tyre në një seksion të caktuar të faqes. Dhe shtegu i plotë për një skedar html ose burim tjetër që përdoret në hartimin e faqeve në internet dhe është pjesa e tretë e URL-së. Le të shohim një shembull të vogël:

http://www.mysite.com/content/about.html

Kjo URL tregon për një skedar të quajtur about.html, i cili ndodhet në direktorinë e përmbajtjes në hapësirën e skedarëve të serverit të internetit www.mysite.com. Në këtë rast, transferimi te përdoruesi i përmbajtjes së skedarit të dëshiruar do të kryhet duke përdorur protokollin HTTP.

Sidoqoftë, në fushën për futjen e adresës së burimit të Internetit të çdo shfletuesi, mund të vendosni vetëm emrin e domenit të faqes, dhe ne tashmë do të kemi akses në faqen kryesore të internetit të kësaj faqeje. Fakti është se nëse nuk e specifikoni protokollin në fushën e hyrjes, atëherë shfletuesi do të përdorë automatikisht protokollin HTTP. Dhe nëse nuk specifikoni emrin e plotë të skedarit html me faqen e internetit, atëherë serveri i uebit që pranon kërkesën e përdoruesit në distancë do të shfaqë faqen kryesore të faqes, që shpesh quhet në shtëpi faqe, e cila domosdoshmërisht ruhet në një skedar të quajtur index.html, domethënë, çdo faqe duhet të përmbajë një skedar me këtë emër, që është faqja fillestare e faqes së internetit.

Por në të njëjtën kohë është e nevojshme të kuptojmë se nëse në shfletues mund të përballojmë të shkruajmë adresën në mënyrë jo të plotë, duke u mbështetur në interpretimin e saktë të saj nga vetë shfletuesi, atëherë në hiperlidhje jemi të detyruar të shkruajmë URL-në e plotë, me përjashtim të ato raste kur dokumentet e treguara nga hiperlidhja ndodhen në të njëjtin sajt me faqen origjinale të internetit. Në raste të tilla, ne mund të mos tregojmë emrin e domenit të faqes, duke u kufizuar në specifikimin e protokollit dhe emrit të plotë, duke përfshirë shtegun në sistemin e skedarëve të serverit në internet, të burimit të treguar nga hiperlidhja.

Në fakt, etiketa<а>ka një numër mjaft të madh parametrash që ju lejojnë të vendosni një sërë veçorish të hiperlidhjes. Ndërsa studiojmë materialin, do t'i shikojmë të gjitha.

Hiperlidhjet zakonisht ndahen në globale dhe lokale. Hiperlidhjet globale tregojnë burimet e internetit të vendosura jashtë faqes origjinale të internetit. Lidhjet lokale i referohen disa burimeve të vendosura në faqen aktuale. Kjo teknikë përdoret shpesh nëse faqja përmban një sasi mjaft të madhe informacioni që nuk përshtatet plotësisht në portin e shikimit. Për shembull, ne postojmë një histori ose një dokument teksti të ndarë në seksione në një faqe interneti. Në të njëjtën kohë, në fillim të këtij dokumenti, ne mund të krijojmë tabelën e tij të përmbajtjes, duke vepruar në bazë të hiperlidhjeve, secila prej të cilave do të tregojë një seksion të dokumentit. Më pas përdoruesi që ngarkon faqen e internetit do të jetë në gjendje të lundrojë në dokument duke përdorur këto hiperlidhje, dhe jo vetëm duke përdorur shiritin vertikal të lëvizjes, i cili padyshim lehtëson navigimin.

Në mënyrë që ne të përdorim hiperlidhjet lokale në dokument, së pari duhet të shënojmë ato fragmente të dokumentit në të cilat ato do të tregojnë. Për shembull, nëse duam një hiperlidhje lokale për të lëvizur përdoruesin në distancë në një paragraf të caktuar, atëherë në këtë paragraf duhet të vendosim etiketën<а>me parametrin e emrit. Në këtë rast, vetë hiperlidhja do të krijohet duke përdorur një vlerë pak të modifikuar të parametrit href. Por është më e lehtë të shihet e gjithë kjo me një shembull (Fig. 1.16).

Listimi 1.16

"http://www.w3.org/TR/html4/strict.dtd">

Hiperlidhjet

Është e lehtë të shihet nga teksti i listimit se kur i referohemi një identifikuesi të vendosur në trupin e një faqeje interneti, ne specifikojmë emrin e këtij identifikuesi me një shenjë hash përpara tij si vlerën e parametrit href. Megjithatë, në këtë mënyrë, ne mund të përdorim hiperlidhje jo vetëm për fragmente të përmbajtjes së faqes origjinale të internetit, por edhe për fragmente të faqeve të tjera të internetit të shënuara në mënyrë të ngjashme. Një hiperlidhje e tillë do të duket diçka si kjo:

<а href="http://www.mysite.com/doc2.htm/anch3">

Kjo do të thotë, ne kombinojmë përdorimin e URL-së së plotë të dokumentit dhe në të njëjtën kohë tregojmë një fragment të caktuar të tij, të shënuar si "anch3".

Oriz. 1.16. Dritarja e shfletuesit që tregon rezultatin e shfaqjes së skedarit në Listimin 1.16

Duhet të theksohet se nëse teksti i treguar nga hiperlidhja shfaqet tashmë në portin e shikimit, siç ndodhi në shembullin tonë të fundit, atëherë nuk do të ndodhë asnjë ndryshim. E tëra çfarë ju duhet të bëni është të ndryshoni madhësinë e pamjes së shfletuesit vertikalisht për të fshehur rreshtin e fundit të përmbajtjes që tregon hiperlidhja dhe rezultati i veprimit të tij mund të demonstrohet vizualisht.

Natyrisht, të gjithë emrat e shënuesve të tillë të faqerojtësve, të cilët përcaktohen duke përdorur vlerën e parametrit të emrit, duhet të jenë unikë. Sidoqoftë, kini parasysh se HTML nuk bën dallimin midis shkronjave të mëdha dhe të vogla. Prandaj, nëse në dokumentin tonë HTML përcaktohen dy faqerojtës, të cilët më pas do të referohen nga hiperlidhje që ndryshojnë vetëm në rastin e karaktereve, atëherë për analizuesin HTML të integruar në shfletues, këta identifikues do të konsiderohen të njëjtë dhe nuk do të përpunoni ndonjë prej tyre.

Megjithatë, ne tashmë e dimë se është e mundur të identifikohet çdo element i një dokumenti HTML duke përdorur parametrin id, i cili mund të përdoret si pjesë e çdo etikete. Në të njëjtën kohë, hiperlidhjet që tregojnë fragmentet e dokumentit mund të përdorin gjithashtu këto parametra, domethënë, për të vendosur një shënues faqerojtës në një etiketë, nuk është e nevojshme të përdorni etiketën<а>me parametrin e emrit, thjesht duhet të përdorni parametrin id.

Vlerat për parametrin e emrit dhe parametrin id janë identifikues unik për elementët në dokumentin HTML. Prandaj, asnjë vlerë për parametrin e emrit nuk duhet të përputhet me asnjë vlerë për parametrin id.

Por cilin opsion duhet të zgjidhni për faqet tuaja të internetit, cilin opsion duhet të përdorni? Kini parasysh këtu se ndërsa parametri id mund të shërbejë për disa qëllime, të tilla si identifikimi i një shënuesi të faqeshënuesve, krijimi i identifikuesve unikë për skriptet DHTML të ekzekutueshme dhe stilimi, disa shfletues të vjetër mund të mos i pranojnë këta identifikues për të synuar hiperlidhjet.

Së bashku me etiketën<а>parametri i titullit mund të përdoret për të ndihmuar në identifikimin e hiperlidhjes për përdoruesin në distancë. Vlera e këtij parametri është një varg teksti që do të shfaqet si një aluzion i vogël kur përdoruesi vendos kursorin e miut mbi lidhjen e dëshiruar. Një reklamë për një hiperlidhje të tillë duket si më poshtë:

<а href="www.site.com" title="faqe shume e bukur">

Duke përdorur parametrin hreflang, ne mund të specifikojmë gjuhën në të cilën është shkruar përmbajtja e tekstit të burimit të Internetit në të cilin tregon kjo hiperlidhje. Vlera e parametrit është një nga konventat standarde të gjuhës që kemi diskutuar më parë në këtë kapitull.
Por, nuk mjafton të specifikosh gjuhën në të cilën është shkruar përmbajtja tekstuale e një faqeje interneti. Është gjithashtu e nevojshme të tregohet kodimi i përdorur. Dhe këtu mund të ndihmohemi nga parametri tashmë i njohur i grupit të karaktereve, vlera e të cilit është përcaktimi standard i kodimit të përdorur për të shfaqur përmbajtjen e tekstit të burimit të Internetit të treguar nga hiperlidhja e dëshiruar.

Duke përdorur parametrin xhel, mund të tregojmë qëllimin e dokumentit që tregon hiperlidhja, domethënë vlera e këtij parametri tregon qartë marrëdhënien midis dokumentit origjinal dhe dokumentit me të cilin po lidhemi. Përdorimi i këtij parametri nuk ndikon në asnjë mënyrë se si shfaqet hiperlidhja ose si merret burimi, por mund të jetë i dobishëm. Nëse faqet e internetit janë të destinuara jo vetëm për shikim me shfletues, por edhe për përpunim nga disa aplikacione të specializuara. Të tilla, për shembull, si motorë kërkimi të avancuar, të cilët janë në gjendje të njohin dhe trajtojnë saktë marrëdhënie të tilla midis dokumenteve, të treguara me anë të hiperlidhjeve.

Parametri rel përdor një nga fjalët kyçe të paracaktuara që do të shikojmë tani.

  • Alternuar. Vlera tregon që dokumenti është një paraqitje alternative e dokumentit origjinal. Nëse parametri lang përdoret në hiperlidhje me një vlerë që është e ndryshme nga gjuha e dokumentit origjinal, atëherë një hiperlidhje e tillë zakonisht konsiderohet si një lidhje me një kopje të dokumentit origjinal në një gjuhë tjetër.
  • Fletë stili. Tregon që dokumenti i referuar nga hiperlidhja është një fletë stili. Mekanizmi për aplikimin e fletëve të stilit përshkruhet në detaje në kapitullin e dytë.
  • Filloni. Përdoret për të përcaktuar dokumentin fillestar, fillestar të një grupi të caktuar dokumentesh. Për një faqe interneti, kjo do të ishte padyshim faqja kryesore.
  • Tjetra. Vlera përdoret nëse dokumenti fillestar dhe dokumenti i treguar nga hiperlidhja janë në një sekuencë të renditur lineare të dokumenteve, dhe kjo e fundit është e radhës në rend në lidhje me faqen origjinale të internetit.
  • Prev. Vlera përdoret në të njëjtën mënyrë si ai i mëparshmi, por tani tregon që dokumenti në zinxhir nuk është tjetri, por ai i mëparshmi, në lidhje me dokumentin fillestar.
  • indeks. Përdoret në hiperlidhje që tregojnë një dokument që është përmbajtja e indeksuar e faqes origjinale të internetit.
  • Fjalorth. Vlera tregon që dokumenti përmban një fjalorth të termave të përdorur në dokumentin origjinal.
  • e drejta e autorit. Përdoret kur dokumenti i referuar nga hiperlidhja përmban një njoftim për të drejtën e autorit për përmbajtjen e dokumentit origjinal.
  • kapitulli. Përdoret në hiperlidhje që tregojnë dokumente që janë kapituj të veçantë në një grup dokumentesh.
  • seksioni. Hiperlidhja me këtë vlerë parametri rel tregon një dokument që është një seksion në një grup të përbashkët dokumentesh që formojnë një tërësi të vetme të përmbajtjes.
  • nënseksioni. Kuptimi është një vazhdimësi e konceptit të treguar nga kuptimi i mëparshëm që kemi shqyrtuar. Do të thotë që dokumenti është tashmë nënseksioni.
  • Shtojca. Vlera tregon se dokumenti i treguar nga hiperlidhja është një bashkëngjitje e dokumentit origjinal.
  • Ndihmë. Përdoret për lidhje me dokumente që ofrojnë informacion shtesë referimi në lidhje me përmbajtjen e dokumentit origjinal.
  • Shënoni faqeshënues. Përdoret për lidhje me dokumentet HTML që përmbajnë lidhje me disa fragmente kryesore të theksuara të dokumentit origjinal.

Kur përdorni këto vlera, duhet të kihet parasysh se në këtë rast analizuesit HTML do të jenë të ndjeshëm ndaj shkronjave, kështu që duhet t'i përmbaheni plotësisht drejtshkrimit të treguar në listën tonë.

Në fakt, në HTML ka një mundësi për të krijuar vlerat tuaja për atributin që po shqyrtojmë, por meqenëse për të përdorur plotësisht këtë parametër, është e nevojshme të përdoren mjete të specializuara për përshkrimin e këtyre vlerave të reja dhe softuerët që synojnë. në njohjen e këtyre llojeve të lidhjeve. Meqenëse jemi të interesuar për shfletues, nuk kemi nevojë të krijojmë lloje të reja lidhjesh.

Kjo teknologji është në fakt një paliativ, i cili është krijuar për të ofruar të paktën një pjesë të aftësive të ofruara nga gjuha e re për përshkrimin e dokumenteve në internet - XML ​​(extensible Markup Language), e cila parashikohet të jetë pasardhësi dhe "vrasësi". të HTML. Por ende nuk ka shfletues të përhapur XML. aplikacione që përpunojnë dokumente XML. Dhe për një kohë mjaft të gjatë kjo teknologji nuk do të bëhet përgjithësisht e pranuar, që do të thotë se teknologjia HTML ka ende çdo të drejtë për jetë dhe do të përdoret si bazë për faqet e internetit për një kohë të gjatë.

Por kthehemi te shikojmë atributet e etiketës<а>... Atributi rev është e kundërta e atributit rel. Nëse atributi rel specifikon llojin e dokumentit tek i cili tregon hiperlidhja, atëherë atributi rev specifikon llojin e dokumentit origjinal që përmban hiperlidhjen. I njëjti grup fjalë kyçe që është përdorur për atributin rel përdoret si vlera për këtë atribut.

Duke përdorur parametrin e synuar, ne tregojmë se në cilën kornizë do të shfaqet dokumenti, ku tregon hiperlidhja. Çështja është se zakonisht një dokument shfaqet në një pamje të shfletuesit. Por në HTML është e mundur të ndahet porta e shikimit në disa zona, të quajtura korniza, secila prej të cilave do të shfaqë dokumentin e vet HTML. Ne do të shikojmë teknologjinë e përdorimit të kornizave në një nga seksionet vijuese të këtij kapitulli, por tani për tani thjesht vërejmë se parametri i synuar ju lejon të tregoni qartë se në cilën kornizë duhet të shfaqet faqja e internetit. Vendosja e një hiperlidhjeje duke përdorur këtë parametër do të duket diçka si kjo:

<а href="http://www.mysite.com/docl.html" target="_top">

Një hiperlidhje e tillë do të bëjë që shfletuesi të ngarkojë faqen e internetit, URL-ja e së cilës është specifikuar si vlera e parametrit href në kornizën e sipërme, emri i të cilit është specifikuar në parametrin objektiv. Parametri i fundit përdor fjalë kyçe të përcaktuara në specifikimin HTML. Ne do t'i mbulojmë ato në seksionin e kornizave.

Disa organe hyrëse dhe hiperlidhje ju lejojnë të lëvizni fokusin e hyrjes ndërmjet tyre duke përdorur tastin tab, domethënë, një shtypje e këtij tasti aktivizon organin tjetër të hyrjes të përfshirë në sekuencën e përgjithshme. Dhe rendi i lëvizjes midis kontrolleve të përfshira në sekuencën e përgjithshme vendoset duke përdorur parametrin tabindex. Si vlerë e këtij parametri, përdoret një numër i plotë pozitiv i zakonshëm dhe sa më i madh të jetë ky numër në çdo trup ose hiperlidhje të futjes së të dhënave, aq më vonë do të vijë tek ai kur fokusi i hyrjes të zhvendoset. Natyrisht, asnjë palë elemente të dizajnit të faqeve të internetit nuk duhet të ketë të njëjtën vlerë, përndryshe shfletuesi thjesht nuk do t'i përfshijë ato në sekuencën e elementeve me lëvizje fokusi.

Megjithatë, përveç hyrjes me goditje të njëpasnjëshme të tastit të tastit të tabelës, mund të përdorim parametrin e tastit të hyrjes, vlera e të cilit është një karakter. Kur përdoruesi shtyp tastin që është përgjegjës për futjen e këtij karakteri, fokusi i hyrjes transferohet automatikisht në hiperlidhjen e dëshiruar, në deklaratën e së cilës është ngulitur parametri i çelësit të hyrjes dhe përdoruesi mund ta aktivizojë atë pa përdorur miun, vetëm duke duke shtypur tastin ... Le të shohim një shembull të vogël:

<а href="http://www.mysite.com/docl.html" tabindex="2" accesskey="U">

Bartësi i një hiperlidhjeje mund të jetë jo vetëm teksti, por edhe një imazh grafik. Për ta bërë këtë, ju duhet të vendosni një etiketë që njofton futjen e grafikëve në përmbajtjen e një faqe interneti midis etiketave.<а>dhe... Por fakti është se ne mund të "varim" jo një, por disa hiperlidhje në imazhin grafik, domethënë, disa zona aktive theksohen brenda imazhit, duke klikuar në secilën prej tyre aktivizohet hiperlidhja përkatëse. Një teknologji e ngjashme quhet grafika e segmentuar.

Për të krijuar imazhe të tilla grafike të lidhura me lidhje të shumta, përdoren etiketa të specializuara. Së pari, deklarohen zonat aktive të vizatimit, të quajtura edhe segmente. Të gjithë së bashku përbëjnë një hartë të segmenteve aktive të figurës, të cilës i caktohet një emër i caktuar. Dhe pastaj ky emër i hartës shoqërohet me vetë imazhin, të deklaruar duke përdorur etiketën . Le të shqyrtojmë një shembull tipik.

Listimi 1.17

! DOCTYPE HTML PUBLIC "- // W3C // DTD HTML 4.01 // EN"
"http://www.w3.org/TR/htm!4/strict.dtd">


Grafika të segmentuara

<р>Ky është tekst i thjeshtë.



Zona e parë
Zona e dytë
Zona e tretë

Në këtë shembull, mund të shihni se kur deklaroni një foto, etiketën vendosim parametrin usemap, vlera e të cilit është emri i hartës së segmenteve aktive të imazhit të lidhur me hiperlidhjet. Një simbol hash futet përpara emrit të hartës së segmentit aktiv të përdorur. Përshkrimi i kësaj karte vendoset midis etiketave dhe... Në këtë rast, etiketa hapëse ekziston një emër parametri i kërkuar, vlera e të cilit është emri i kartës.

Harta përbëhet nga një përshkrim i segmenteve. Çdo segment përshkruhet me një etiketë<агеа>... Ne mund të aplikojmë pikat e nxehta në tre forma të ndryshme: drejtkëndësha, rrathë dhe shumëkëndësha. Forma specifikohet duke përdorur parametrin e kërkuar të formës. Si vlerë e këtij parametri, ne mund të përdorim një nga tre vlerat e paracaktuara.

  • Kuptimi drejt përdoret për të krijuar pika të nxehta drejtkëndëshe.
  • Kuptimi rrethi përdoret për të krijuar një segment rrethor.
  • Kuptimi poli ju lejon të krijoni segmente aktive në formën e shumëkëndëshave konveks.

Pasi të kemi vendosur llojin e formularit, është e nevojshme të përcaktojmë me saktësi madhësinë dhe vendndodhjen e tyre në imazhin tonë grafik. Për këtë përdoret parametri i kodeve, si vlerë e të cilit shkruhet një listë e koordinatave që përcaktojnë segmentin aktiv. Në Listën 1.17, mund të shohim se koordinatat në listën e përgjithshme ndahen me presje të rregullt. Koordinatat numërohen nga këndi i sipërm i majtë i figurës, i cili ka koordinatat (0; 0).

Për segmentet drejtkëndore, specifikoni koordinatat e qosheve sipër-majtas dhe poshtë-djathtas. Dhe për shumëkëndëshat, koordinatat e të gjitha pikave renditen në mënyrë sekuenciale, sipas renditjes së lidhjes së tyre sipas vijave. Natyrisht, çifti i parë dhe i fundit i koordinatave duhet të përputhen, përndryshe shumëkëndëshi do të jetë i hapur dhe segmenti aktiv nuk do të përpunohet.

Në etiketë<аrеа>është përfshirë edhe parametri href, vlera e të cilit është URL-ja e burimit të treguar nga hiperlidhja e këtij segmenti.
Por ky parametër, çuditërisht, është fakultativ. Në rastin kur një segment është duke u krijuar, por nuk duhet të lidhet me një hiperlink, duhet të përdoret parametri nohref, i cili është i parëndësishëm.
Por një parametër i kërkuar për etiketën<аrеа>cdo gje eshte ashtu. Ky është parametri alt, i cili është një varg teksti që është një paraqitje alternative e figurës. Siç e dimë, kjo linjë shfaqet si një aluzion kur përdoruesi vendos kursorin e miut mbi objekt. Në rastin tonë, një objekt i tillë është një segment aktiv i ngulitur në një imazh grafik.

Gjithashtu në etiketë<агеа>Ashtu si me etiketat normale të hiperlidhjeve, indeksi i skedës dhe parametrat kyç të aksesit përdoren për të aktivizuar hiperlidhjen pa përdorur miun, duke përdorur vetëm tastierën. Ne shqyrtuam strukturën e vlerave të këtyre parametrave pak më herët. Si një rrugë anësore, duhet theksuar se çdo webmaster i duhur duhet t'i përdorë këto parametra, pasi vetëm përdorimi i tyre mund të garantojë aktivizimin e hiperlidhjeve pa ndihmën e miut.

Pra, ne kuptuam përdorimin e teknologjisë grafike të segmentuar. Por ne nuk kemi mësuar gjithçka për lidhjet. Specifikimet HTML përcakton një etiketë , e cila nuk krijon lidhjen me të cilën jemi mësuar, por një lidhje midis dokumentit të shfaqur dhe disa skedarëve shtesë. Etiketat mund të vendoset vetëm në pjesën kryesore të një dokumenti HTML, midis etiketave dhe Si shembull i përdorimit të etiketës që po shqyrtojmë mund të jepni kodin e mëposhtëm:

Listimi 1.18

"http://www.w3.org/TR/html4/strict.dtd">


Kapitulli 2



Me këtë fragment, ne tregojmë se kjo faqe në internet përmban kapitullin e dytë të një dokumenti të gjerë dhe duke përdorur etiketa lidhje me faqet e internetit që përmbajnë tabelën e përmbajtjes dhe kapitujt e mëparshëm dhe të ardhshëm. Lloji i dokumentit ku tregon lidhja përcaktohet duke përdorur parametrin e njohur rel. Një shfletues normal, natyrisht, nuk do të jetë në gjendje të përpunojë dhe shfaqë lidhje të tilla në asnjë mënyrë. Ato u futën në HTML për të krijuar dokumente që do të përpunoheshin me ndihmën e disa aplikacioneve të specializuara që lejojnë krijimin e sistemeve të menaxhimit të dokumenteve bazuar në këtë format. Por aftësitë e pakta të integruara të HTML për krijimin e sistemeve të menaxhimit të dokumenteve të plota nuk ishin qartësisht të mjaftueshme, dhe kur u zhvillua standardi XML, zhvilluesit me kënaqësi ndryshuan të preferuarën e tyre.

Pra, rezulton se në faqet e zakonshme të internetit etiketa krejtësisht të padobishme? Jo ne te vertete. Vetëm me këtë etiketë mund të lidhim faqet e internetit me fletët e jashtme të stilit, mënyra më e fuqishme për të kontrolluar se si shfaqet një dokument në një shfletues. Por ne do të mësojmë për fletët e stilit pak më vonë, në kapitullin e dytë. Atje do të shqyrtojmë gjithashtu një shembull të përdorimit të etiketës ... Tani për tani, ne vetëm duhet të rendisim parametrat e kësaj etikete. Të gjithë këta parametra vlejnë edhe për etiketat.<а>me të njëjtat vlera të mundshme, kështu që ne nuk do të shqyrtojmë çdo parametër në detaje, por thjesht do t'i rendisim shkurtimisht:

  • grup karakteresh- tregon kodimin e dokumentit në të cilin tregon lidhja;
  • href- URL-ja e dokumentit në të cilin pikat lidhja përdoret si vlerë;
  • hreflang- vlera është përcaktimi i kodit të gjuhës në të cilën është shkruar dokumenti i lidhur;
  • lloji- përcakton llojin e dokumentit në të cilin tregon lidhja;
  • rel- vendos statusin e dokumentit në të cilin tregon lidhja në lidhje me dokumentin origjinal;
  • rev- vendos statusin e dokumentit origjinal në lidhje me atë që tregon kjo lidhje;
  • media- tregon llojin e pajisjes në të cilën do të shfaqet dokumenti i referuar.

Aktualisht mbështeten dokumentet e shfaqura në monitorët konvencionalë, në monitorët brail me dëmtim të shikimit, për printera dhe pajisje për riprodhimin e të folurit. Dhe, natyrisht, përveç këtyre parametrave, përdoret një grup parametrash shtesë identifikimi të përbashkëta për të gjitha etiketat.

Mbetet vetëm një etiketë për t'u marrë parasysh për shërbimin e hiperlidhjeve. Siç e dimë, ne mund të heqim URL-në e plotë për dokumentet me hiperlidhje nëse dokumenti ndodhet në të njëjtin ueb sajt si faqja origjinale e internetit. Por rezulton se ne mund të bëjmë të njëjtën gjë me lidhjet në faqet e internetit që janë pjesë e sajteve të tjera.

Duke përdorur etiketën vendosim bazën për hiperlidhjet me vlera të shkurtuara href. Le të përpiqemi të demonstrojmë funksionimin e këtij mekanizmi duke përdorur një shembull të thjeshtë dhe ilustrues:

"http://www.w3.org/TR/html4/strict.dtd">

Faqe interneti

<Р>Teksti<А href="/pages/birds.gif">Lidhje

Si vlera e etiketës href të parametrit të kërkuar ne përcaktojmë dokumentin që është bazë për përmbajtjen e faqeve të internetit të faqes sonë. Dhe tani, nëse në trupin e dokumentit tonë HTML përdorim një hiperlidhje me një URL të shkurtuar, atëherë jo emri i faqes origjinale do të përdoret si emër domaini për këtë URL, por ai i specifikuar në etiketë. ... Pra, në shembull, hiperlidhja tregon për një dokument

c URL www.mysite.com/pages/birds.gif.

Duhet sqaruar se etiketa vendosur në kokën e dokumentit midis etiketave dhe .

Dhe kjo është gjithçka që mund të flasim për përdorimin e hiperlidhjeve në HTML.

Tipari kryesor i një dokumenti HTML është prania në të hiperlidhjet(ose thjesht lidhje) me dokumente të tjera, sajte, skedarë, fotografi, etj. Është aftësia për të futur lidhje me objekte jashtë tij në faqe që e bënë internetin kaq popullor dhe të përshtatshëm për t'u përdorur. Prandaj, kur krijoni faqen tuaj, mbani mend gjithmonë për "magjinë" e lidhjeve.

Në këtë mësim do të flasim për si të krijoni një lidhje në sajtin, në faqen ose skedarin e tij të veçantë. Do të mësoni se si të ndryshoni tekstin e një lidhjeje, si ta hapni atë në një dritare të re, si ta bëni një lidhje një foto, çfarë janë lidhjet e jashtme dhe të brendshme dhe shumë më tepër. Plus, ju tashmë keni informacione rreth punës me lidhje, të cilat i kemi prekur në mësimet e mëparshme (për shembull, si mund të ndryshoni ngjyrën e një lidhjeje për të cilën folëm).

Në përgjithësi, ky tutorial do ta bëjë të plotë dhe të mjaftueshëm kuptimin tuaj për ndërtimin e lidhjeve. Do të kuptoni se si të krijoni një hiperlink në HTML dhe pse. Dhe do të mësoni të kontrolloni vetitë e tij.


§ 1. Lidhje me skedarin, lidhje me faqen, lidhje me faqen

Pyetjet e shumta në lidhje me ndryshimin midis një lidhjeje në një skedar dhe një lidhjeje në një sajt ose një faqe të veçantë më bënë që t'i përgjigjem asaj që në fillim të këtij mësimi. Përgjigja është: asgjë. Të gjitha lidhjet e listuara janë të jashtme origjinale faqe dhe krijohen në të njëjtën mënyrë.

Për të mos përhapur mendimin përgjatë pemës, unë do të tregoj gjithçka me një shembull.

Në shfletues, ne do të shohim këtë:

Në shfletues, ne do të shohim këtë:

Siç mund ta shihni, të gjitha llojet e lidhjeve krijohen saktësisht njësoj. Dallimi i vetëm është adresë objekti që do të referohet. Tani le të kalojmë në pjesën kryesore të tutorialit.

§ 2. Krijimi i lidhjeve të jashtme

Referencat ndryshojnë nga njëra-tjetra nga e jashtme dhe e brendshme si dhe në teksti dhe grafike... Lidhjet e jashtme çojnë jashtë faqes html, të brendshme në pjesë të ndryshme e njëjta faqet. Lidhjet e tekstit janë tekst (si parazgjedhje, janë të theksuara me blu dhe të nënvizuara), dhe lidhjet grafike përmbajnë një fotografi si një objekt mbi të cilin duhet klikuar për të lundruar. Të gjitha këto lloje lidhjesh krijohen në HTML duke përdorur një etiketë (shkurt për ankorimin). Le ta shqyrtojmë më në detaje.

Për të krijuar një lidhje të jashtme në një sajt, faqe ose skedar, përdorni atributin e etiketës - href... Ky atribut merr si vlerë Url faqe, faqe ose skedar (për këtë folëm më lart). Midis etiketave dhe është pjesa e dukshme e lidhjes (spiranca e lidhjes), domethënë ajo që shohim në ekranin e shfletuesit. Ankorimi i lidhjes mund të jetë ose tekst i thjeshtë (lidhje teksti) ose imazh grafik (lidhje-foto). Një lidhje me foto krijohet duke futur një etiketë të njohur midis etiketave dhe. Në përgjithësi, sintaksa për krijimin e një lidhjeje duket si kjo:

Për shembull, për të krijuar një lidhje teksti në faqen kryesore të kësaj faqeje, ju do të shkruani kodin e mëposhtëm HTML:

http://www.seoded.ru/ "> Faqja kryesore e faqes

Në shfletues do të duket kështu:

Siç shkrova në fillim të këtij mësimi, ngjyra e tekstit të lidhjeve (ankorimi) mund të ndryshohet duke përdorur. Në përgjithësi, mund të aplikoni gjithçka në tekstin e lidhjeve si në tekstin kryesor të faqes, domethënë, ta theksoni atë me shkronja të theksuara, të pjerrëta, të përdorni titujt, etj.

§ 2.1 Lidhje grafike (lidhje me foto)

Siç thashë më lart, për të krijuar një imazh-lidhje, duhet të përdorni në vend të tekstit. Një shembull i një lidhjeje të tillë duket si ky:

Dhe shfletuesi do të tregojë:

Si parazgjedhje, shfletuesi e rrethon figurën në lidhjen grafike me një kornizë. Nëse kjo është e padëshirueshme, atëherë atributi kufiri etiketë IMG ju duhet të caktoni vlerën 0:

kufiri = "0">

Faqja kryesore

§ 3. Lidhjet e brendshme

Lidhjet e brendshme përdoren për lundrim të rehatshëm në faqet me shumë përmbajtje. Ishte me ndihmën e tyre që bëra "Përmbajtja e mësimit" (shih në fillim të kësaj faqeje). Lidhjet e brendshme krijohen në të njëjtën mënyrë si lidhjet e jashtme. Vetëm në vlerën e atributit href specifikohet spiranca e lidhjes. Spiranca krijohet nga atributi emri:

name = "anchor name"> tekst

Dhe emri i spirancës vendoset në mënyrë arbitrare. Duhet thënë këtu se jo të gjithë shfletuesit i kuptojnë emrat e ankorimit rus, kështu që unë rekomandoj përdorimin e alfabetit latin. Teksti midis etiketave për krijimin e një ankorimi është opsional dhe shpesh nuk specifikohet.

I fruthi ndodhet në ato vende të faqes ku përdoruesi duhet të shkojë pasi të klikojë në lidhje.

Siç thashë më lart, në atribut href e një lidhjeje të brendshme, në vend të një adrese, emri i spirancës së dëshiruar tregohet me simbolin e detyrueshëm hash ( # ) përballë tij. Le të marrim një shembull.

Kam krijuar një spirancë të quajtur zagolovok dhe e vendosim pranë titullit të këtij tutoriali (Hyperlinks në HTML). Kodi i ankorimit është si më poshtë:

emri = "zagolovok">

href = "# zagolovok"> Shkoni te titulli

Dhe në shfletuesin si kjo:

Nëse e keni vënë re, pasi klikoni në lidhjen e brendshme të titullit, URL-ja në shiritin e adresave të shfletuesit ndryshoi:


Në adresën origjinale:

http://www..html

http://www..html#zagolovok

Dhe duke përdorur këtë veçori, mund të lidheni me një vend specifik në faqe nga çdo burim në internet! Kjo do të thotë, le të themi se keni krijuar një faqe me një artikull voluminoz për diçka (ose keni postuar një numër të madh fotosh në faqe) dhe e keni shënuar me lidhje të brendshme. Ndërsa ishe, duhej t'i referoheshe jo vetëm faqes me artikullin (ose fotot), por një vend specifik në të (ose një foto specifike). Duke përdorur opsionin me një lidhje të brendshme në adresë, mund të arrini lehtësisht atë që dëshironi.

§ 4. Referenca absolute dhe relative

Faqja kryesore

Lidhjet relative janë pak më të ndërlikuara. Në lidhje të tilla, adresa tregohet ose relativisht dosja rrënjësore e faqes (ajo në të cilën ndodhet faqja kryesore), ose në lidhje me faqen origjinale. Lidhje të tilla nevojiten, për shembull, nëse faqja ndodhet në kompjuterin tuaj të shtëpisë. Ose nuk është një faqe interneti, por një faqe që lidhet me dokumente të tjera.

Le të heqim dorë që duhet të lidhemi me faqen klienty.html që gënjeshtra në një dosje me faqen kryesore të faqes. Pastaj kodi i lidhjes relative do të marrë formën:

/klienty.html">Klientë

Dhe tani supozoni se në të njëjtën dosje me faqen kryesore ka dosje zakazy dhe tashmë në tëështë faqja klienty.html Atëherë kodi i lidhjes relative do të bëhet kështu:

/zakazy/klienty.html"> Klientët

Tani le të shohim krijimin e hiperlidhjeve. në lidhje me faqen origjinale... Le të themi se kemi një faqe çmimi.html(faqe origjinale) dhe prej saj ju duhet të lidheni me faqen klienty.html Ekzistojnë opsionet e mëposhtme tipike:

    1. Janë të vendosura faqet price.html dhe klienty.html në një dosje.

    klienty.html "> Klientët


    2. në dosjen rrënjë të faqes, faqja price.html gjendet në dosjen zekazi një nivel më lart).

    Kodi do të bëhet si ky:

    ../klienty.html"> Klientët

    Dy pika tregojnë se duhet të lëvizni nga dosja aktuale në një nivel më të lartë.


    3. Faqja klienty.html dhe dosja zakazy janë të vendosura në dosjen rrënjë të faqes, dosje mebel gjendet në dosjen zekazi, faqja price.html shtrihet në dosjen mebel(d.m.th. faqja klienty.html është në raport me faqen origjinale të çmimit.html është dy nivele më të larta).

    ../../klienty.html"> Klientët

    Kjo do të thotë, çdo nivel shënohet me dy pika dhe një prerje " / ».


    4. në dosjen rrënjë të faqes, faqe klienty.html gjendet në dosjen zekazi(d.m.th. tani faqja klienty.html është në krahasim me faqen origjinale të çmimit.html është një nivel më poshtë).

    zakazy / klienty.html "> Klientët

    Në këtë rast, pikat dhe prerjet nuk përdoren.


    5. Faqja price.html (faqja burimore) dhe dosja zakazy janë të vendosura në dosjen rrënjë të faqes, dosje mebel gjendet në dosjen zekazi, faqe klienty.html shtrihet në dosjen mebel(d.m.th. tani faqja klienty.html është në raport me faqen origjinale të çmimit.html shtrihet dy nivele më poshtë).

    zakazy / mebel / klienty.html "> Klientët


    6. Në dosjen rrënjë të faqes ka dy dosje: zakazy dhe oplata. Faqja Klienty.html gjendet në dosjen zekazi, çmimi i faqes origjinale.html shtrihet në dosjen oplata(d.m.th. të dyja faqet gënjejnë në dosje të ndryshme një nivel më poshtë nga dosja rrënjë e faqes).

    ../zakazy/klienty.html"> Klientët

§ 5. Lidhja me emailin

Në mënyrë që krijoni lidhjen e emailit, duhet në vend të url-së në vlerën e atributit href shkruani një adresë emaili që tregon protokollin ( mailto:). Dhe më pas, kur klikoni në një lidhje të tillë, do të hapet një dritare e programit të postës me një adresë e-mail të futur në fushën "Për". Në kodin HTML, duket kështu:

mailto: [email i mbrojtur]"> Posta ime

Dhe në shfletuesin si kjo:

Ju gjithashtu mund të përdorni atributin në etiketë titullin... Me ndihmën e tij, krijohet një këshillë mjeti që shfaqet kur kaloni miun mbi lidhjen.

titulli = "(! GJUHA: Shkoni në faqen kryesore">!} Faqja kryesore

§ 7. Përfundim

Ky është informacioni bazë për krijimi i lidhjeve në HTML... Në këtë pikë, ky mësim mund të konsiderohet i përfunduar. Dhe ky fakt sugjeron që ju keni zotëruar tashmë shumicën e bazave të HTML.

Unë ju rekomandoj që tani të kaloni edhe një herë seksionet e mëparshme dhe më pas të krijoni një faqe të plotë HTML të dedikuar, për shembull, të dashurit tuaj. Sipas dizajnit tuaj dhe sipas dëshirave tuaja. Pastaj vendoseni në disa (sigurisht, nëse keni, atëherë mbi të) dhe tashmë admironi plotësisht faqen tuaj të parë.

Mund t'ua tregoni miqve tuaj ose kujtdo tjetër. Në përgjithësi, ndjehuni si pronar i faqes. Dhe më pas, pas një qejfi të vogël në një ngjarje të tillë, kaloni në seksionin tjetër, në të cilin do t'ju tregoj për krijimin e tabelave në HTML.

Dhe ky do të jetë tashmë hapi i parë drejt kthimit të faqes tuaj personale në një burim serioz.


Përshëndetje të dashur lexues të faqes së blogut. Sot dua të flas më në detaje se çfarë është një hiperlidhje në gjuhën Html, si mund t'i vendosni ato në tekst në faqe, si të bëni një lidhje një foto, si të përdorni etiketën "A" dhe atributet e tij " Href” dhe “Target bosh” (hap në dritare të re).

Në përgjithësi, hiperlidhja është elementi kryesor. Përveç kësaj, lidhjet janë tani një nga tre faktorët kryesorë që ndikojnë në promovimin e suksesshëm të faqes në internet. Zbatimi dhe kuptimi i saktë i tyre, për shembull, se si ndikon në llogaritjen e tyre nga motorët e kërkimit, mund të ndikojë ndjeshëm në trafikun drejt burimit tuaj.

Çfarë është një hiperlidhje dhe spirancë

Pra, ne kemi takuar tashmë etiketat e vjetëruara dhe jo të rekomanduara për përdorim të përditshëm. Le të vazhdojmë njohjen tonë të mëtejshme.

Për të krijuar një hiperlidhje në kodin Html, duhet të përdorim edhe etiketën A. Për të, do të jetë e mundur të përdoren atribute të ndryshme që vendosin, për shembull, adresën URL të objektivit të lëvizjes përgjatë kësaj lidhjeje (href ) ose duke udhëzuar për ta hapur atë në një dritare të re (target = _bosh). Por le të flasim për gjithçka në rregull.

Siç e përmendëm më lart, hiperlidhjet janë një element kyç i gjuhës HTML dhe ato ju lejojnë të lidheni si me faqet e brendshme të faqes tuaj ashtu edhe me burimet e tjera të internetit. Unë do të them një banalitet - ndjekja e një lidhjeje kryhet duke klikuar mbi të (çfarë menduat?).

Përveç faktit se ato mund të ndahen në të brendshme ose të jashtme, ato gjithashtu mund të jetë zyrtare dhe përdoret ekskluzivisht për nevojat e shfletuesit me të cilin do të hapen faqet e faqes suaj.

Në këtë rast, ato nuk do të jenë të dukshme në faqe, sepse janë shkruar në zonën Head të kodit burimor të dokumentit, përmbajtja e të cilit nuk shfaqet në faqe (përmenda strukturën e kodit të gjuhës së shënjimit të hipertekstit në artikullin rreth).

Lidhjet e shërbimit nuk krijohen duke përdorur etiketën "A" (si zakonisht), por duke përdorur etiketën "Lidhja"... Ka mjaft detyra të kryera prej tyre, për shembull, me ndihmën e tyre, skedarët e jashtëm me fletë stilesh CSS në kaskadë lidhen me dokumentin Html, ose, për shembull,.

Por sot ne nuk do të shqyrtojmë se si mund t'i krijoni ato (koha do të vijë para tyre), por do të ndalemi në detaje në lidhje të dukshme që mund të krijohen brenda zonës Body dhe, në përputhje me rrethanat, ato do të shfaqen në faqen e internetit.

Por, megjithatë, të gjitha lidhjet (si të dukshme ashtu edhe ato të shërbimit) kanë një gjë të përbashkët - të gjithë kanë në përbërjen e tyre një atribut të detyrueshëm Href... Në të, si vlerë e tij, shkruhet një vend specifik në dokument (nëse ishte shënuar më parë me një spirancë) ose adresa e vetë dokumentit në internet (në Href, ose, me fjalë të tjera, shtegu për në faqe. ose është shkruar ndonjë skedar tjetër).

Hiperlidhjet janë elementë navigimi që janë krijuar për t'ju transferuar në dokumente të tjera në rrjet, ose për të lundruar nëpër përmbajtjen e një faqe interneti që po shikoni tashmë duke përdorur etiketat e bëra paraprakisht në trupin e dokumentit, të cilat quhen gjithashtu Html spiranca(spirancë).

Këtu mund të ketë një konfuzion, pasi në SEO, nën një fjalë, por në gjuhën Html, "anchor" do të thotë pikërisht spirancë (përkthimi i fjalës anchor) ose një etiketë në tekst, të cilit më pas mund t'i referohemi.

Pse përdoren ankorat në Html? Kjo është mjaft e dobishme kur krijoni navigim në një faqe interneti mjaft të gjatë. Me siguri, jeni takuar në rrjet kur në faqen që hapni, menjëherë nën titullin e saj, jepen emrat e seksioneve të artikullit të botuar në këtë faqe.

Kështu, lexuesi do të jetë në gjendje të hidhet menjëherë në vendin e faqes ku ndodhet informacioni me interes, dhe të mos shqetësohet me lëvizjen e tekstit dhe gjetjen vizuale të vendit të duhur. I përshtatshëm dhe përmirëson.

Si krijohen ankorat dhe lidhjet hash

Pra, detyra jonë në këtë rast do të jetë instalimi i ankorave në vendet e duhura në faqe (dokument), i cili në përgjithësi do të duket kështu:

ato. për të bërë spirancë, duhet të shkruani atributin e vetëm "Emri" në etiketën boshe të hiperlidhjes "A", si vlerë e së cilës duhet të përdorni një etiketë unike që nuk duhet të përmbajë hapësira dhe në të cilën mund të përdorni. Karaktere latine, numra, viza dhe vija nënvizore (në analogji të plotë me rregullat me të cilat mund të krijoni url - ,,, [_], [-]).

Në këtë rast, spiranca nuk do të jetë e dukshme në vetë faqen, sepse brenda elementeve “A”, nuk kemi shkruar asnjë tekst. Sidoqoftë, ankorimi i krijuar në këtë mënyrë do të ndotë kodin Html, dhe për këtë arsye tani përdoren shumë më shpesh sesa ankorat një mënyrë tjetër për të krijuar një etiketë.

Në këtë rast, nuk keni nevojë të krijoni një etiketë bosh "A", por mund të përdorni cilindo nga elementët tashmë të pranishëm në vendin e duhur në tekst. Për shembull, mund të jetë.

ato. për të krijuar një analog të një spirancë, mjafton të shkruani një atribut universal ID në çdo etiketë (mund të përdoret për të gjitha etiketat, dhe, nga rruga, ato punojnë në bazë të tij), për shembull, si kjo:

Teksti i titullit

Pra, tani, në vend që të krijojmë sasinë e nevojshme të ankorimit që ndotin kodin dhe aktualisht nuk janë të vlefshëm (nuk rekomandohet nga konsorciumi W3C, i cili zhvillon gjuhën Html), ne thjesht shtojmë Id.

Rezulton se për këtë do t'ju duhet, si zakonisht, brenda hiperlidhjes "A" të futni atributin e detyrueshëm "Href", por vlera e të cilit do të formohet nga emri i etiketës (ankorimit) të dëshiruar me një parashtesë. shenjë hash "#", i cili ka edhe emrin hash (meqë ra fjala, këtu rriten këmbët e emrit të përdorur shpesh: link hash):

do të mbishkruajë faqen e shënuar me një spirancë

Ju lutemi vini re se ndjekja e një hiperlidhjeje të tillë nuk do të hapë një dokument të ri. Shfletuesi do të lëvizë faqen tashmë të hapur në një pozicion të tillë që vendi në tekst ku keni futur spirancën të zërë një pozicion në krye të ekranit. Do të ishte logjike të supozohej se vlerat e të gjitha etiketave (ankorave) në një faqe duhet të jenë unike në mënyrë që të shmanget konfuzioni për shfletuesin.

Nëse bëni një spirancë duke përdorur atributin ID në një etiketë të vendosur në mënyrë të përshtatshme, atëherë duhet të keni parasysh se përveç kufizimit në llojin e simboleve të përdorura (,,, [_], [-]), vlera e ID-së nevojitet duhet të fillojë me një shkronjë latine.

Atëherë të gjithë karakteret e vlefshme mund të vendosen në çdo sasi, por karakteri i parë i etiketës së ankorimit në vlerën e atributit ID duhet të jetë një shkronjë (natyrisht latinisht). Përndryshe, një spirancë e tillë e futur në kodin Html nuk do të funksionojë (në shumicën e shfletuesve).

Nëse nuk shkruani asnjë emër të etiketës së ankorimit (href = "#") pas simbolit hash "#", atëherë një hiperlidhje e tillë do të lëvizë faqen në krye... Kjo është mënyra se si mund të krijoni butonin më të thjeshtë "Lart" duke krijuar një lidhje nga fotografia (ne do të flasim për këtë pak më poshtë) dhe duke e ngjitur në shabllonin e faqes tuaj të internetit, për shembull, si kjo:

Href - atributi i kërkuar i çdo etikete hiperlidhjeje

Tani le të kalojmë nga lundrimi brenda dokumentit (duke përdorur ankorat) në lundrimin jashtë, d.m.th. do të na duhet të krijojmë lidhje që të çojnë në dokumente të tjera të faqes sonë ose të një faqeje tjetër. Tani, në atributin Href, ne duhet të shkruajmë jo etiketat e ankorimit, por shtegun drejt skedarit që hapet (faqja, sipas dizajnit, është një skedar që ngarkohet në shfletues për shfaqjen e mëvonshme).

spirancë

Këtu duhet të flasim më tej, por unë kam shkruar tashmë për to më shumë se në detaje në materialin e përmendur, kështu që ndoshta nuk ka kuptim të përsëris veten. Por ju duhet të dini se si të vendosni shtegun e skedarit në atributin Href të hiperlidhjes që keni krijuar. Prandaj, mos aplikoni njohuni me materialin e dhënë.

Megjithatë, më lejoni t'ju kujtoj se kur krijoni url është e preferueshme të përdorni vetëm personazhet e mëposhtëm: (,,, [_], [-]) dhe mos përdorni hapësira. Nëse marrim parasysh përmbajtjen e atributit Href për lidhjet absolute, atëherë ai mund të përfaqësohet skematikisht si më poshtë:

Nëse e hedhim poshtë atë që do të përdorni rrallë, atëherë mund t'i paraqisni të gjitha të njëjta në një formë disi të thjeshtuar:

Protokolli (zakonisht http): // emri_domeni (për shembull, faqja) / rruga_te_file (faqe ueb)

Përveç protokollit të thjeshtë http në internet, mund të gjeni lidhje me protokollin https, i cili ndryshon në atë që përdor enkriptim. Ky i fundit përdoret në faqet ku ekziston nevoja për të mbrojtur kanalin e komunikimit midis serverit dhe shfletuesit të klientit. Për shembull, përdoret në shërbimet e Web Money.

Në internet mund të gjeni opsione të ndryshme për përmbajtjen e Href, për shembull, kjo:

Https: // faqe / videokursy

Ose si kjo (me një shtesë skedari):

Https://site/seo/kak-raskrutit-sajt.html

Kjo nuk e ndryshon thelbin, por nëse ka një prerje në fund të përmbajtjes së atributit Href brenda hiperlidhjes, atëherë kjo do të thotë që thirrja nuk shkon më në skedar, por në dosjen në të cilën indeksi përkatës. objekti do të kërkohet (për më shumë detaje, shihni artikullin mbi adresat url të përmendura më lart).

Shkarkoni diçka nga lidhja

Siç mund ta shihni, kjo hiperlidhje nuk është e ndryshme nga ajo e zakonshme, thjesht shfletuesi e kupton që duhet të shkarkojë skedarin me shtesën zip dhe të mos përpiqet ta hapë atë për shikim, si, për shembull, skedarët e dokumentit me html zgjerim. Edhe pse, ju mund t'i konfiguroni të gjitha këto thjesht individualisht në shfletuesin tuaj për nevojat tuaja personale.

Shkarkoni nga serveri Ftp

Ju gjithashtu mund, për shembull, të krijoni (postal) duke shtuar URL-në përkatëse në Href:

Shkruaj një letër

Kur klikoni në një lidhje të tillë, programi juaj i paracaktuar i postës do të hapet në kompjuterin tuaj (në shfletues, mund të konfiguroni që lidhjet nga mailto në Href të hapen në Gmail, etj.) dhe do të shfaqet një dialog për krijimin e një letre të re, në e cila në fushën “Për” do të futet adresa postare e dhënë në Href.

Në fakt, mund të bëni lidhje mjaft komplekse postare, me ndihmën e të cilave do të plotësohen fushat e tjera në dialog për dërgimin e një letre, por kjo përdoret mjaft rrallë.

Gjithsesi, webmasters kohët e fundit praktikisht kanë ndaluar përdorimin e hiperlidhjeve nga mailto në Href për faktin se ato analizohen nga spammers me të gjitha pasojat që pasojnë. Më mirë të krijosh në faqe, megjithëse unë kam ende gjithçka të paraqitur në formën klasike në faqen me kontakte. Do të ishte e nevojshme të ndryshoni në kohën e lirë (ose jo ... do të mendoj për këtë).

Si të hapni një lidhje në një dritare të re (objektivi i synuar)

Kur krijojmë lidhje në kodin Html, shpesh përballemi me pyetjen - në cilën dritare të shfletuesit të hapim dokumentin në të cilin ai çon? Si parazgjedhje, ajo do të hapet në një dritare ekzistuese, duke mbivendosur faqen nga e cila është vendosur kjo hiperlidhje.

Personalisht, unë jam një mbështetës i madh një atribut Target me një vlerë të zbrazët, i cili ju lejon të hapni faqen në një dritare të re, duke lënë të hapur dokumentin ku është vendosur lidhja. Nuk e di se si kjo ndikon në përdorshmërinë e blogut tim, por më pëlqen më shumë ky opsion dhe e përdor pothuajse në të gjitha rastet.

Në motorët e kërkimit, më pëlqen gjithashtu të personalizoj hapjen e lidhjeve. në një dritare të re në mënyrë që çështja të jetë gjithmonë pranë dhe ju gjithmonë mund t'i ktheheni asaj. Për këto qëllime, siç është përmendur tashmë, Html përdor një atribut të veçantë Target, i cili si parazgjedhje ka vlerën Vetë:

Hap dokumentin në të njëjtën dritare

Edhe pse, sigurisht, askush nuk përshkruan target = "_ self" në etiketën "A", sepse kjo vlerë përdoret si parazgjedhje, por nëse keni nevojë të hapni faqen në një dritare të re, do t'ju duhet të përshkruani objektivin = " _ bosh":

Hapet në një dritare të re

Vini re se vlerat e atributit Target janë të shkruara me nënvizim në fillim(_blank), sepse kjo është deklaruar në validatorin Wc3, i cili përmban vrimat e gjuhës së shënjimit të hipertekstit. Është interesante se Html ofron mundësinë për të ndryshuar opsionin e paracaktuar të hapjes së lidhjes.

Për shembull, nëse dëshironi që të gjitha hiperlidhjet e faqes tuaj të hapen në një dritare të re, do t'ju duhet të shkruani në zonën Head të shabllonit që po përdorni. Etiketa bazë me objektiv = atribut "_blank":

diçka tjetër

Dhe tani, nëse dëshironi të hapni ndonjë nga lidhjet në të njëjtën dritare, atëherë në etiketën e saj "A" do t'ju duhet të shtoni target = "_ self", sepse si parazgjedhje tani përdorni _blank. Oh si.

Nga rruga, unë përdora elementin bazë siç përshkruhet më sipër, por kam bashkangjitur gjithashtu një rajon kodi me disa hiperlidhje që duheshin hapur në një dritare të re. ato. Kam përdorur gjithashtu një etiketë mbyllëse të bazës brenda zonës së Trupit dhe funksionoi. Edhe pse një kod i tillë, natyrisht, rezulton të jetë i pavlefshëm.

Hiperlidhjet rri pezull dhe kalojnë ngjyrat - si t'i ndryshoni ato

Në gjuhën Html, ajo ishte konceptuar në atë mënyrë që përdoruesi ta kishte të lehtë të navigonte se cilën lidhje kishte hapur tashmë dhe cila mbetej ende e paprekur.

Për këtë qëllim, përdoret një ngjyrë, e cila do të ndryshojë kur përdoruesi të klikon në hiperlink dhe dokumenti i pezulluar në të hapet me sukses. Duke u kthyer në faqen origjinale, përdoruesi do të zbulojë se lidhja që vizitoi ka ndryshuar ngjyrë. Të gjithë shfletuesit mund ta bëjnë këtë mashtrim.

Si parazgjedhje, në Html të pastër (pa veti CSS), lidhjet janë të nënvizuara dhe mund të kenë tre opsione ngjyrash:

  1. Blu është ngjyra për lidhjet e pazgjidhura që përdoruesi nuk i ka klikuar ende
  2. E kuqe - hiperlidhja e pranon atë menjëherë pasi të klikoni mbi të dhe derisa dokumenti i kërkuar të shkarkohet në shfletuesin e përdoruesit përmes rrjetit (në kushte moderne, kapja e këtij momenti nuk është aspak e lehtë dhe është fajtore kudo)
  3. Magenta - ngjyra për lidhjet e përdorura që përdoruesi ka vizituar tashmë

Në Html 4.01, këto ngjyra lidhjesh janë parazgjedhja, por ato mund të ndryshohen duke përdorur atribute të veçanta që shkruhen në etiketën Body, të cilat mund t'i gjeni në një nga skedarët e shabllonit që po përdorni. Për të ndryshuar të tre ngjyrat, përdoren tre atribute, përkatësisht:

  1. Lidhja - vendos ngjyrën e lidhjes së pavizituar
  2. Alink - ngjyra e aktivit aktualisht, e cila përpunohet nga shfletuesi
  3. Vlink - ngjyra e hiperlidhjes tashmë të vizituar nga përdoruesi

Mbani mend, unë kam shkruar tashmë se si të pyesni. Prandaj, atributet e përmendura mund të duken kështu:

Natyrisht, këtu kisha parasysh versionin e Html të pastër, kur për ndonjë arsye nuk është e përshtatshme ose e mundur të përdoret stili, përndryshe të gjitha këto ngjyra mund të vendosen dhe ndryshohen lehtësisht duke përdorur.

Si të bëni një foto një lidhje - dy mënyra

Epo, gjithçka është mjaft e thjeshtë këtu. Sepse është një element inline, atëherë në përgjithësi çdo imazh mund të konsiderohet vetëm një shkronjë, ndoshta vetëm me një madhësi më të madhe.

Në rastin e Html të pastër, rreth imazhit që keni bërë një lidhje, do të keni kornizë tre piksel e gjerë... Për më tepër, ngjyra e kësaj kornize do të korrespondojë plotësisht me ngjyrat e lidhjeve të pranuara për faqen tuaj (kemi folur për to pak më lart në tekst).

Për të hequr shtimin e një kufiri në një foto që keni krijuar një hiperlidhje, duhet të shtoni një atribut Border me një vlerë zero në etiketën Img:

Kjo është një mënyrë shumë e thjeshtë për ta bërë një foto një lidhje, por ekziston edhe një opsion më kompleks që quhet harta e imazhit... Në këtë rast, falë përdorimit të një numri mjaft të madh të etiketave dhe atributeve Html, është e mundur të krijoni një hartë të tërë lidhjesh nga një imazh me zona aktive (të klikueshme dhe me forma të ndryshme - drejtkëndësh, rreth, poligon).

Për shembull, mund të vendosni një foto të madhe në faqen tuaj dhe ta bëni atë në mënyrë që kur klikoni në pjesë të ndryshme të saj, faqe të ndryshme të hapen në hiperlidhje të ndryshme. Në fakt, duhet shumë kohë për të përshkruar një hartë imazhi, dhe vështirë se dikush do ta përdorë atë, kështu që unë nuk do ta bëj këtë, sepse "loja nuk ia vlen mundimi".

Paç fat! Shihemi së shpejti në faqet e faqes së blogut

mund të shikoni më shumë video duke shkuar te
");">

Ju mund të jeni të interesuar

Zgjidh, Option, Textarea, Label, Fieldset, Legend - Etiketat Html të formës me zbritje dhe të kutisë së tekstit
Si të futni një lidhje dhe një fotografi (foto) në etiketat HTML - IMG dhe A
Iframe dhe Frame - cilat janë ato dhe si të përdoren më mirë kornizat në Html
Karakteret e hapësirës së bardhë dhe formatimi i tyre i kodit në Html, si dhe karakteret e hapësirës pa ndërprerje dhe kujtimet e tjera
Si vendosen ngjyrat në kodin Html dhe CSS, përzgjedhja e hijeve RGB në tabela, Yandex dhe programe të tjera

Si të krijoni lidhje në një dokument HTML

(Më shumë shembuj do të gjeni në fund të kësaj faqeje)

Hiperlidhjet HTML (Lidhjet)

Etiketë mund të përdoret në dy mënyra:

  1. Për t'u lidhur me një dokument tjetër - duke përdorur atributin href
  2. Për të shënuar brenda një dokumenti - duke përdorur atributin e emrit

Lidhje sintaksore HTML

Shembull

Vizitoni faqen

kjo do të shfaqet nga shfletuesi si kjo:

Lidhjet HTML - Atributi i synuar

Atributi i synuar (destinacioni) specifikon se ku të hapet dokumenti i lidhur (ai të cilit i referohet lidhja).

Shembulli i mëposhtëm do të hapë dokumentin e lidhur në një dritare ose skedë të re të shfletuesit:

Lidhjet HTML - Atributi i Emrit

Atributi i emrit përdoret për të krijuar një faqeshënues ("anchor" / "anchor") brenda një dokumenti HTML.

Koment:
Standardi i ardhshëm HTML5 sugjeron përdorimin e atributit id në vend të atributit name për të specifikuar emrin e lidhjes.
Përdorimi i atributit id funksionon në të vërtetë në HTML4 edhe në të gjithë shfletuesit modernë.

Faqerojtësit nuk shfaqen në ndonjë mënyrë të veçantë. Ata nuk janë të dukshëm për lexuesin.

Koment: Gjithmonë shtoni një vijë të pjerrët pasuese në lidhjet e nëndirektorive. Nëse krijoni një lidhje si kjo: href = "http: // site / html", atëherë serveri gjenerohen dy kërkesa, së pari serveri shton një të pjerrët në adresë dhe më pas krijon një kërkesë të re: href = "http : // sajti / html /" ...

Këshilla: Lidhjet me emër përdoren shpesh për të krijuar një "tabela të përmbajtjes" në fillim të një dokumenti të madh. Secilit kapitull brenda dokumentit i caktohet një referencë me emër dhe referencat për secilën prej këtyre ankorave të emërtuara futen në fillim të dokumentit.

Këshilla: Nëse shfletuesi nuk gjen lidhjen e specifikuar me emër, ai shkon në fillim të dokumentit. Nuk ndodhin gabime.

Artikujt kryesorë të lidhur