ComputersProgrammering

Hoe voeg ik een hyperlink in HTML? Hyperlinks maken en gebruiken in HTML

Hypertext is een tekst die links bevat naar een andere tekst. Een voorbeeld hiervan is de notitie van de auteur over complexe definities of voetnoten van vertalers onderaan de pagina van het boek, als het een tekst in een vreemde taal bevat. Internet sites zijn een complex systeem van hypertextovergangen van de ene pagina naar de andere, binnen de pagina zelf, evenals tussen niet-gerelateerde unified topics resources. Deze structuur is praktisch, bespaart veel tijd, waardoor de bezoeker snel de nodige informatie kan vinden en niet in een groot aantal overgangen verdwijnt.

Een hyperlink invoegen

In HTML wordt een handvat ( tag) gebruikt om een hyperlink in te voegen, die op de juiste plaats wordt ingevoegd. Meestal wordt het onder de tekst geplaatst, omdat de hyperlink zelf een tekststructuur is. Maar links zijn nog steeds grafisch (iconen, knoppen, foto's); Over hen zullen verder worden verteld. Hun locatie op de webpagina is niet beperkt tot tekst, maar hangt af van de beslissing van de ontwerper van de maker van de site.

homepage van Google

Dit is een voorbeeld van hoe u een hyperlink in een HTML-document invoert, dat wordt gedaan via de tag. De bezoeker van de site ziet de onderstreepte tekst, die verschilt van de kleur van de omliggende tekst (de kleur van de HTML-link kan er zijn), de 'Google-startpagina', waarop u klikt op, die naar de hoofdpagina van de Google-zoekmachine gaat. Opgemerkt moet worden dat de hyperlinktekst informatie moet bevatten over waar de overgang plaatsvindt. Dit principe moet in principe gevolgd en aanvaard worden!

De structuur van de tag ...

U kunt opmerken dat de tag een paar is: een afsluitingscode is nodig .

href - Attribuut van de tag, geeft het doel van de link aan.

Https://google.com/ - de waarde van het attribuut , dat de URL bevat van de bron waarop de overgang plaatsvindt. Het bestaat uit dubbele of enkelvoudige citaten. Het hangt af van de structuur van het nestelen van tags volgens HTML-regels.

google startpagina

Dit hele ontwerp heet een element van een webdocument.

Volgens HTML-regels kunnen sommige elementen andere elementen bevatten. De tag is geen uitzondering. Als de programmeur het woord Google moet bolden, dan wordt dit gedaan met behulp van de tag voor algemene regels voor het opmaken van tekst, waarbij de volgorde van nesting tags wordt gevolgd. De webmaster moet weten hoe u een hyperlink in HTML kunt maken zonder fouten, anders werken ze niet. De gebroken links op de computerslang worden "gebroken" genoemd.

startpagina Google

Hier: item

startpagina Google

Bevat een genesteld element

Google

Nu zal de bezoeker van de pagina een hyperlink zien met de vetgedrukte tekst die door het woord "Google" wordt gemarkeerd.

Absolute hyperlinks

Hyperlinks die absolute URL's gebruiken van sites met domeinnamen (.ru, .com, .org, .gov) worden absoluut genoemd en hebben de volgende syntaxis:

Protocol: // domeinnaam / pad naar bestand

Voorbeeld van het adres van de populaire zoekmachine in Amerika: https://aol.com - absoluut, omdat het de domeinnaam bevat .com.

Absolute hyperlinks worden gebruikt om te navigeren naar pagina's van andere sites of toegang te krijgen tot bronnen die op een andere server zijn geplaatst. De overgang wordt uitgevoerd met behulp van internetprotocollen. Protocollen zijn niet het onderwerp van dit artikel, maar aangezien zij deelnemen aan het maken van hyperlinks, is het noodzakelijk om ze tenminste kort te noemen:

  • Http en https zijn de meest voorkomende; Op hen is er een overgang tussen de internetpagina's van verschillende sites;
  • Ftp - het protocol voor het uploaden van bestanden naar de server of downloaden door de gebruiker van de site;
  • Mailto is een mailprotocol dat e-mail direct van de site verzendt zonder toegang te krijgen tot uw privé-mail.

Er zijn verschillende andere speciale protocollen (gopher, telnet), die vrij zeldzaam zijn, waarvan het gebruik speciale kennis vereist in de programmering of systeemadministratie.

Relatieve hyperlinks

Met relatief adresseren dient het gebruik van hyperlinks in HTML voor overgangen binnen de bron en leidt er niet verder. Als de pagina zo groot is dat de verticale scrollbalk werkt, soms heel lang, zoals in woordenboeken, is het erg handig en passend om relatieve links te gebruiken om snel naar de gewenste letter te springen.

Door een internet woordenboek op te zetten, heeft de programmeur aan het begin van de pagina een alfabet, en indien niet voor de toepassing van links, moet de gebruiker het muiswiel langdurig draaien om de letter "I" te krijgen.

Als u een relatieve referentie wilt maken, gebruikt u het kenmerk van de tag:

Ga naar brief Я

Waar je het anker heet , en ga naar de letter I - het anker van de bestemming. Voor een correcte weergave van ankers, wordt het gebruik van Latijnse letters en cijfers aanbevolen, dus schrijf niet 'I', hoewel het meer begrijpelijk zou zijn.

Nu, om de overgang van het alfabet aan het begin van de pagina naar de letter "I" te maken, moet u het anker plaatsen in de plaats van het HTML-document, waarin de woorden beginnen met de letter "I":

Voordat het anker een teken is van het raster, zonder welke de overgang naar de brief niet zal werken.

Relatief adresseren bij het maken van een site

Een handig en meest voorkomend algoritme voor het creëren van een website door een programmeur:

  • Maak een map in de computer en plaats het op een snelle toegangsplaats voor het gemak;
  • Maak in deze map de hoofdpagina van de site index.html;
  • Creatie van secundaire webpagina's (index.html / page2);
  • Een map maken en grafische bestanden erin plaatsen;
  • Een map maken en andere objecten daarin plaatsen (bijvoorbeeld bestanden om te downloaden);
  • De site invullen met inhoud;
  • Plaatsen van de site bestanden op de hosting.

Het is nodig om links te gebruiken voor communicatie tussen site-elementen en zal heel opportuun weten hoe u een hyperlink in HTML invoert op een andere pagina op dezelfde site. Als de site bestanden in dezelfde directory zijn, op dezelfde server, hoeft u geen absolute adressering te gebruiken. Wanneer de site bestanden worden overgebracht naar de hosting, wordt de verbinding tussen de objecten behouden, omdat ze ook in dezelfde directory op de hosting zullen zijn.

Laten we zeggen dat de programmeur de hoofdpagina van de site index.html heeft gemaakt, waarop er een link is naar een andere pagina page2.html, versierd met een afbeelding img.png. Dan ziet het relatieve pad naar deze foto er zo uit:

Tip: bij het bestuderen van dit onderwerp is het best om een eenvoudige tekstverwerker te gebruiken, omdat u vaardigheden moet verwerven om de adressen correct te kunnen spellen en om te leren hoe u de code van anderen wilt behandelen. Op dit moment is een goed geschreven hyperlink in een notitieboek een goed resultaat zonder fouten. HTML vergeven hen niet en levert fouten op.

Manieren om door hyperlinks te navigeren

Standaard wordt een nieuwe pagina geopend in het huidige browservenster wanneer de gebruiker op de hyperlink klikt. Maar de webprogrammerer kan de standaardwaarde wijzigen en de pagina dwingen om bijvoorbeeld te openen in een nieuw venster. Om dit te doen is er een doelattribuut met een specifieke waarde. Dit kan duidelijkst uitgedrukt worden in een tabel.

De waarden van het doelattribuut
_blank Opent de pagina in een nieuw browservenster
_self Opent de pagina in het huidige venster (de standaardwaarde)
_parent Opent de pagina in het ouder kader
_top Wanneer frames worden gebruikt, worden ze allemaal geannuleerd en wordt de pagina geopend in het huidige browservenster

De syntaxis voor het toepassen van het doelattribuut is :

target = "_ blank"> google homepage

Startpagina 'Google' wordt geopend in een nieuw venster.

Opmerking: om pagina's in een nieuw tabblad te openen zijn er geen waarden voor dit attribuut, maar worden door de gebruiker in de browserinstellingen ingesteld.

Kleur van hyperlinks

Een ervaren internetgebruiker met de tijd zou moeten hebben gemerkt dat hyperlinks in kleur van de omliggende tekst verschillen en meestal zijn ze blauw. Links, waarmee hij overgaat en dan terugkeerde naar de vorige pagina, wordt lila. Het gebruik van hyperlinks in HTML in een niet-standaard kleurenschema is niet veel, maar het onderstreept de site onder de rest.

De kleuren van de koppelingen in de -tag worden gespecificeerd met attributen en hun waarden, waarin de HTML-kleur wordt weergegeven in het rgb (# 00FF00) systeem of met een directe aanduiding van de kleurnaam ("groen"). Er zijn drie soorten attributen voor links:

  • Link - stelt de kleur van de unvisited link in;
  • Vlink - stelt de kleur in van de link waarmee de gebruiker al heeft geschakeld;
  • Alink - stelt de kleur van de link op het moment van overschakelen naar een andere pagina. Dit gebeurt snel, dus je kunt dit effect niet altijd vangen.

Voorbeeld van opmaak:

Als u deze attributen toepast in de tag , worden de links van dit webdocument donkerblauw, bezocht - lila en actief - oranje-rood.

Grafische hyperlinks

De vooruitgang en ontwikkeling van webdesign vereist dat u weet hoe u een hyperlink in HTML plaatst als een afbeelding. Het is duidelijk dat de foto moet overeenkomen met de inhoud van de bestemmingspagina. Bijvoorbeeld, de hoofdpagina van de site over geneeskrachtige planten kan worden gepresenteerd in de vorm van foto's van planten, waarbij wordt geklikt op welke gebruiker de pagina zal gaan, welke de geneesmiddelen van de plant beschrijft.

Wijd gebruikt is de methode om statische knoppen te vervangen () met mooie graphics gemaakt door een webdesigner in grafische editors (GIMP, Photoshop).

Als u grafieken wilt invoegen als hyperlinks op de pagina's van de site, wordt dezelfde syntax gebruikt, maar in plaats van de tekst wordt de image-insertion-tag volgens HTML-regels gebruikt:

Aan de -tabel gelden de kenmerken van het opgeven van alternatieve tekst, breedte, hoogte en anderen op dezelfde manier.

Oproepen van de site

Standaard html5 heeft de functionaliteit van het gebruik van internet uitgebreid, en nu kunt u oproepen niet alleen vanuit de telefoon, maar ook direct van de site. Hiervoor kunt u ook hyperlinks gebruiken in het HTML-document, en ze hebben deze syntaxis:

... abonnee ...

In plaats van het woord 'abonnee' is een contact duidelijk voor de beller, zoals in het telefoonboek. U kunt ook een grafisch bestand plaatsen (een afbeelding van de abonnee).

Om oproepen van de site te maken heeft u niet alleen een link naar het telefoonnummer van de abonnee nodig, maar ook een hoofdtelefoon (microfoon, koptelefoon) die op het VoIP-programma van de computer is geïnstalleerd, moet de snelheid van de internet hoger zijn dan 0,5 Mb / sec. Betaling voor oproepen wordt uitgevoerd ten koste van het verkeer. Daarom, als het internet onbeperkt is, dan zijn bellen gratis.

De ethiek van het maken van hyperlinks

Door de site op internet te plaatsen, moet de webmaster weten welke hyperlinks er bestaan in HTML, en niet alleen juist, professioneel toepassen, maar ook aan de volgende bepalingen voldoen:

  • De hyperlink moet duidelijk zichtbaar zijn, anders dan de omliggende tekst. De gebruiker moet weten dat dit een hyperlink is.
  • De gebruiker moet begrijpen waar hij zal krijgen door op de link te klikken. Om dit te doen, is het raadzaam om het titelattribuut te gebruiken , dat de transitiepagina concreet omschrijft. De syntaxis voor het toepassen van een attribuut is:

title = privacy internet portal Yandex

  • De gebruiker moet echte informatie ontvangen over het bestand dat wordt gedownload wanneer u op de link klikt.

Als u niet op de verwachte pagina bent gevallen of het verkeerde bestand hebt gedownload, vertrekt de gebruiker in 99% van de gevallen onmiddellijk de site en in de toekomst zal het nooit komen.

Anti-Seo bij het maken van hyperlinks

Naast de technische kant van de vraag hoe u een hyperlink in HTML invoert, moet u ook het morele aspect benadrukken. Er zijn veel sites, toegang tot welke gebruikers worden geblokkeerd door beveiligingsprogramma's (antivirus) of zelfs de staat. Dit zijn de sites die zijn gecreëerd door de onreine webontwikkelaars.

Een van de trucs die zij toevlucht nemen is het invoegen van "onzichtbare" hyperlinks op een webpagina. Scammers weten hoe u een hyperlink in HTML maakt en gebruik de attributen om de onderstreep van de link te verwijderen en de kleur van de omliggende tekst toe te wijzen zodat de gemiddelde gebruiker het niet ziet. En met behulp van andere webtechnologie tools (CSS, JavaScript, PHP) kunt u hun gedrag programmeren. Bijvoorbeeld, de JavaScript OnMouseOver-gebeurtenis activeert de actie van het webpagina-element. Wanneer een gebruiker de cursor over een onzichtbare link verplaatst, slaat het op de advertentiepagina van een andere site. Of nog erger, wanneer er een onzichtbare link naar het bestand is en op zijn computer begint te downloaden en onnodige software te installeren. Meestal zijn dit virussen die de homepage van de browser veranderen, een harde schijf met veel programma's en spullen verwarren.

Binnenkort vallen dergelijke sites in de "zwarte lijst" van virusdatabases, beveiligingssystemen en onder de internetgebruikers zelf. Dergelijke sites leven niet lang, en ze moeten hun namen veranderen, eindeloos migreren via internet, veranderende gastleveranciers. Dit bevordert geen promotie van de site, die altijd door zijn maker wordt gezocht, het zal nooit een megaportal maken, zoals bijvoorbeeld sociale netwerken. Zo'n dergelijke trucs veroorzaken onder andere veel negatieve emoties bij mensen die door deze acties worden getroffen.

Similar articles

 

 

 

 

Trending Now

 

 

 

 

Newest

Copyright © 2018 nl.atomiyme.com. Theme powered by WordPress.