Myslím, že už chápete, o čem bude v této kapitole řeč.. a víte, co je odkaz, pokud ne, klikněte sem.. Existuje několik typů odkazů a také "mechanismů" pro jejich sledování. V této kapitole se vám pokusím podrobně říci, jak registrovat odkazy, a věnovat se také složitosti práce s nimi.
Lyrická odbočka:
Jednou v armádě za mnou přišel náčelník generálního štábu a vydal rozkaz, cituji:
Přineste mi ten dokument, i když nevím, kde a co to je!! co to stojíš? Utíkejme!! Jdu pozdě!!!
Proč tedy prohlížeč, stejně jako já, neupadl do strnulosti, potřebuje znát: přesný název dokumentu, cestu k dokumentu a místo, kam jej přinést, nebo spíše kam otevřít.
Na tento moment pomocí poznámkového bloku jsme vytvořili pouze jeden HTML dokument, mám ho s názvem index.html (proč jsem zvolil tak divný název index.html a proč se na to musím dívat) nevím čím, ty sám název vymyslel, ale myslím, že si pamatujete a víte, kde leží, pokud samozřejmě nejste můj náčelník štábu :).V tomto dokumentu se pokusíme vytvořit odkaz na jiný dokument, který ještě nemáme.. Takže než se na to odkážete, musíte si to vytvořit, děkuji, že už to znáte.
- Otevřete poznámkový blok.
- Kód píšeme v html. Například stránka s řadou fotografií.
- Uložíme to jako html stránku ve stejném pracovní složka, kde je již vytvořen první dokument, který jsme vytvořili. Abychom nebyli zmateni, říkejme tomu primer.html a možná také přejmenujme první na index.html
Teď vím, že máš dva html dokument a index.html a primer.html a nyní máte minimální sadu pro další učení.
Textové odkazy.
Seznamte se tag (z kotva - kotva), můžete do ní vložit text nebo obrázek, který se stane odkazem na určité dokumenty. Atribut značky href určuje název a cestu k dokumentu, na který odkaz odkazuje.
Vše dohromady je napsáno takto:
Tady jsou moje obrázky!!Jak jste pravděpodobně pochopili primer.html je název našeho druhého html dokumentu a nápis "Tady jsou moje fotky!!" toto je část textu ze souboru index.html.
Analogicky s obrázky tag
cesta odkazu k otevíranému dokumentu se zapisuje stejným způsobem:
Tady jsou moje obrázky!!- A to znamená, že soubor primer.html je umístěn o úroveň výše od dokumentu
Tady jsou moje obrázky!!- dokument je umístěn na webových stránkách www.site.ru..
No, zkusíme to? Níže je uveden příklad dvou dokumentů najednou, ve kterých jsou registrovány odkazy směřující na sebe.
soubor index.html:
Řekni mi, milé dítě: ve kterém uchu mi bzučí?
V zákon nebo vlevo, odjet?
soubor primer.html:
Příklad ukazuje, že odkazy jsou barevně zvýrazněny, ve výchozím nastavení modrá je odkaz a červená je již navštívený odkaz, tyto barvy lze změnit pomocí úvodní značky, která je nám již dobře známa < body > a jeho atributy.
odkaz- barva odkazu.odkaz- barva aktivního odkazu, na který kliknete.
vlink- barva navštíveného odkazu.
Píše se to takto:
>Když budeme pokračovat v povídání o barvě textového odkazu, stojí za zmínku, že v případě potřeby můžete vynutit barevné zvýraznění celého odkazu i jeho jednotlivých částí (fráze, slova, písmena) pomocí známé značky a jeho atribut barva. To se však netýká pouze barvy, ale samostatně si můžete nastavit i velikost, styl a font textu. Pamatujte však, že manipulace s barvami musí být provedena uvnitř značky tady a ne přes palubu, jinak bude barva odkazu buď ve výchozím nastavení, nebo jak je napsáno v tagu
soubor index.html:
link="#008000" alink="#ff0000" vlink="#ffff00">
Hledejte frázi, která vám pomůže zapamatovat si místa barev v duze.
R
ALE
D
V
G
ALE
soubor primer.html:
link="#008000" alink="#ff0000" vlink="#ffff00">
Každý
lovec
přání
znát
kde
sedí
bažant
Vraťte se na hlavní stránku
Jedna z vašich stránek na webu nezbytně by se mělo volat index.html Je to soubor s tímto názvem na vašem webu, který program robota vyhledá, když osoba zadá název vašeho webu. Od stránky index.html se otevře jako první, udělejte z něj hlavní. Zbytek stránek můžete nazvat, jak chcete... už žádné nuance se jmény nejsou.
O případu .. Při psaní cesty a názvů dokumentů pamatujte, že například: Stránka.html, stránka.html a STRÁNKA.html jsou názvy různé dokumenty! Totéž platí pro názvy záložek a kresby. Při psaní kódu vždy rozlišujte malá a velká písmena, existuje velká šance, že taková jména konkrétní prohlížeč nerozpozná. Udělejte si pravidlo psát vše a volat názvy malými latinskými písmeny, pak se riziko lidského faktoru a vrtochů programů sníží na nulu.
Pravidlo tří kliknutí.
Snažte se vytvořit „strom odkazů“ tak, aby se návštěvník webu dostal z kterékoli jeho stránky na jakékoli místo na webu za minimální počet kliknutí na odkazy. Více než tři přechody do správné místo to už na webu není dobré.. Nekonečné načítání stránek, které člověk nepotřebuje, může vést k nervovému zhroucení a předčasnému uzavření webu. Ušetřete lidem čas, peníze a nervy.
Hlavním rysem HTML dokumentu je, že obsahuje hypertextové odkazy(nebo jednoduše odkazy) na jiné dokumenty, stránky, soubory, obrázky atd. Byla to právě schopnost vkládat odkazy do stránek na objekty mimo ně, díky čemuž byl internet tak populární a pohodlný na používání. Při tvorbě svých stránek proto vždy pamatujte na „kouzlo“ odkazů.
V této lekci si promluvíme jak vytvořit odkaz na web, na jeho samostatnou stránku nebo soubor. Dozvíte se, jak změnit text odkazu, jak jej otevřít v novém okně, jak z odkazu udělat obrázek, co jsou externí a interní odkazy a mnoho dalšího. Navíc už máte informace o práci s odkazy, kterých jsme se dotkli v předchozích lekcích (mluvili jsme například o tom, jak můžete změnit barvu odkazu v ).
Obecně platí, že tato lekce učiní vaši představu o linkbuildingu úplnou a dostatečnou. Pochopíte, jak vytvořit hypertextový odkaz v HTML a proč. A naučit se hospodařit s jeho vlastnostmi.
Podmínky
§ 1. Odkaz na soubor, odkaz na web, odkaz na stránku
Četné otázky o rozdílu mezi odkazem na soubor a odkazem na web nebo jeho jednotlivou stránku mě donutily dát odpověď na úplný začátek této lekce. Odpověď zní: nic. Všechny uvedené odkazy jsou externí originál stránku a jsou vytvořeny stejným způsobem.
Aby se myšlenka nešířila podél stromu, ukážu vše na příkladu.
V prohlížeči uvidíme toto:
V prohlížeči uvidíme toto:
Jak vidíte, všechny typy odkazů jsou vytvořeny úplně stejným způsobem. Jediný rozdíl je adresa objekt, na který se má odkazovat. Nyní přejdeme k hlavní části lekce.
§ 2. Vytváření externích odkazů
Odkazy se od sebe liší tím externí a domácí, stejně jako na text a grafický. Externí odkazy vedou mimo "limity" html stránky, interní odkazy na různé části stejný stránky. Textové odkazy jsou textové (ve výchozím nastavení jsou zvýrazněny modře a podtrženy) a grafické odkazy jako objekt, na který je potřeba kliknout, obsahují nějaký druh obrázku. Všechny tyto typy odkazů jsou vytvářeny v HTML pomocí tagu (zkratka pro anglické kotva – kotva). Podívejme se na to podrobněji.
K vytvoření externího odkazu na web, stránku nebo soubor se používá atribut tag - href. Tento atribut bere jako svou hodnotu URL web, stránka nebo soubor (o tom jsme hovořili výše). Mezi značkami a je viditelná část odkazu (kotva odkazu), tedy to, co vidíme na obrazovce prohlížeče. Kotva odkazu může být buď prostý text (textový odkaz) nebo grafický obrázek (odkaz na obrázek). Odkaz na obrázek se vytvoří vložením známé značky mezi značky a . Obecně platí, že syntaxe pro vytvoření odkazu vypadá takto:
Chcete-li například vytvořit textový odkaz na domovská stránka tento web, musíte napsat následující HTML kód:
http://www.seoded.ru/"> Domovská stránka webu
V prohlížeči to bude vypadat takto:
Jak jsem psal na samém začátku tohoto návodu, barvu textu odkazu (kotvy) lze změnit pomocí . Obecně platí, že na text odkazů můžete aplikovat vše stejně jako na hlavní text stránky, tedy tučné písmo, kurzíva, používat nadpisy atd.
§ 2.1 Grafické odkazy (odkazy na obrázky)
Jak jsem řekl výše, k vytvoření odkazu na obrázek musíte použít . Příklad takového odkazu vypadá takto:
A prohlížeč zobrazí:
Ve výchozím nastavení prohlížeč obklopí obrázek v odkazu na obrázek rámečkem. Pokud to není žádoucí, pak atribut okrajštítek img by mělo být nastaveno na 0:
border="0">
Hlavní strana
§ 3. Interní odkazy
Pro pohodlnou navigaci po stránkách s velkým množstvím obsahu slouží interní odkazy. S jejich pomocí jsem vytvořil obsah lekce (viz na začátku této stránky). Interní odkazy se vytvářejí stejným způsobem jako externí odkazy. Pouze v hodnotě atributu href je označena "kotva" odkazu. Kotva je vytvořena atributem název:
name="název kotvy">text
A jméno "kotvy" je nastaveno libovolně. Zde stojí za zmínku, že ne všechny prohlížeče rozumí ruským názvům „kotev“, proto doporučuji používat latinku. Text mezi značkami pro vytvoření "kotvy" je volitelný a nejčastěji není specifikován.
„Jsem spalničky“ se nachází na těch místech stránky, na která by měl uživatel přejít po kliknutí na odkaz.
Jak jsem řekl výše, v atributu href interní odkaz místo adresy, název požadované „kotvy“ je označen povinným symbolem hash ( # ) před ním. Vezměme si příklad.
Vytvořil jsem "kotvu" s názvem záhlaví a umístil jej do kódu stránky vedle názvu této lekce („Hypertextové odkazy v HTML“). Kód "kotvy" je následující:
name="title">
href="#zagolovok">Přejít na nadpis
A v prohlížeči takto:
Pokud si všimnete, že po kliknutí na interní odkaz na nadpis se adresa URL změnila adresní řádek prohlížeč:
Na původní adresu:
http://www.html
http://www..html#header
A pomocí této funkce můžete odkazovat na konkrétní místo na stránce z jakéhokoli zdroje na internetu! To znamená, že jste vytvořili stránku s obsáhlým článkem o něčem (nebo jste jej na stránku zveřejnili velké číslo fotografie) a označili jej interními odkazy. Když jste v , museli jste odkazovat nejen na stránku s článkem (nebo fotografiemi), ale na určité místo na ní (nebo určitou fotografii). Pomocí možnosti s interním odkazem v adrese snadno dosáhnete toho, co potřebujete.
§ 4. Absolutní a relativní odkazy
Hlavní strana
S relativními vazbami je to ale trochu složitější. V takových odkazech je uvedena také adresa poměrně kořenová složka webu (ta, ve které se nachází hlavní stránka), nebo vzhledem k původní stránce. Takové odkazy jsou potřeba, například pokud se web nachází na domácí počítač. Nebo to není web, ale ukazatel stránky na jiné dokumenty.
Řekněme, že potřebujeme vytvořit odkaz na stránku klient.html, která leží v jedné složce s hlavní stránkou webu. Pak bude relativní kód odkazu vypadat takto:
/clienty.html">Klienti
Nyní předpokládejme, že je ve stejné složce jako hlavní stránka pořadí složek a už v něm leží stránka klienty.html. Potom bude relativní kód odkazu vypadat takto:
/zakazy/clienty.html">Klienti
Nyní se podíváme na vytváření hypertextových odkazů vzhledem k původní stránce. Řekněme, že máme stránku cena.html(zdrojová stránka) a z ní je potřeba na stránku odkazovat klient.html Zde jsou následující typické možnosti:
1. Stránky price.html a clienty.html jsou v jedné složce.
clientty.html">Klienti
2. v kořenové složce webu, stránka cena.html je ve složce objednávky o úroveň výš).
Kód bude vypadat takto:
../clienty.html">Klienti
Dvě tečky označují, že je třeba opustit aktuální složku na vyšší úroveň.
3. Stránka klienty.html a složka zakazy jsou v kořenové složce webu, složka na nábytek je ve složce objednávky, stránka cena.html je ve složce mebel(tj. stránka klienty.html vzhledem k původní stránce price.html leží o dvě úrovně výš).
../../clienty.html">Klienti
To znamená, že každá úroveň je označena dvěma tečkami a lomítkem " / ».
4. v kořenové složce webu, stránka clienty.html je ve složce objednávky(tj. nyní je stránka klienty.html relativní k původní stránce price.html o úroveň níže).
zakazy/clienty.html">Klienti
V tomto případě se tečky a lomítka nevkládají.
5. Stránka price.html (původní stránka) a složka zakazy jsou v kořenové složce webu, složka na nábytek je ve složce objednávky, stránka clienty.html je ve složce mebel(tj. nyní je stránka klienty.html relativní k původní stránce price.html leží o dvě úrovně níže).
zakazy/furniture/clienty.html">Klienti
6. V kořenové složce webu jsou tam dvě složky: zakazy a oplata. stránka clienty.html je ve složce objednávky, původní stránka price.html leží ve složce oplata(tj. obě stránky lžou v různé složky o úroveň níže z kořenové složky webu).
../zakazy/clienty.html">Klienti
§ 5. Odkaz na e-mail
Na vytvořit e-mailový odkaz, potřebujete místo adresy URL v hodnotě atributu href napište e-mailovou adresu s protokolem ( mailto:). A když na takový odkaz kliknete, otevře se okno poštovní program s e-mailovou adresou zadanou do pole „Komu“. V HTML kódu to vypadá takto:
mailto: [e-mail chráněný]">Můj mail
A tak je to i v prohlížeči.
Dobrý den, milí čtenáři tohoto blogu. Dnes budeme mluvit o jak vytvořit hypertextové odkazy v html, naučte se používat značku „A“ a její atributy href a target, naučte se udělat z obrázku odkaz.
Hypertextové odkazy jsou klíčovými prvky webové stránky. Spojují různé html stránky dohromady do kompletní webové stránky. Odkazy se obvykle zobrazují jako podtržený text, když na něj najedete, kurzor myši se stane ukazováčkem.
Kromě toho může hypertextový odkaz vypadat grafický obrázek nebo jeho fragment. Po kliknutí na odkaz prohlížeč načte webovou stránku specifikovanou v atributech odkazu. Hypertextové odkazy vám umožňují odkazovat na interní stránky vašeho webu a také na jakékoli jiné zdroje na internetu.
Vytvářejte textové hypertextové odkazy
Začněme jednoduše a podíváme se na vytváření pravidelných text Odkazy. Chcete-li vytvořit textový hypertextový odkaz, stačí přiložit jakýkoli text, který by se měl stát odkazem párová značka A. A dovnitř atribut href Pro tuto značku musíte zadat adresu cílové webové stránky na internetu:
Tento kus html kódu vytvoří odstavec, který obsahuje odkaz. Odkaz ukazuje na webovou stránku page15.html, která se nachází ve složce katalogu uložené v kořenové složce webu www.site.ru.
Pokud stránka nepoužívá css styly a nejsou použity žádné další atributy, pak se hypertextové odkazy na stránce zobrazí ve výchozím nastavení takto:
- běžné odkazy jsou zobrazeny modře;
- navštívené odkazy jsou zvýrazněny fialovou barvou;
- aktivní hypertextový odkaz (na který se aktuálně kliká) je zobrazen červeně, ale protože doba mezi kliknutím na odkaz a začátkem načítání nového dokumentu je poměrně krátká, je tento stav odkazu velmi krátkodobý;
- Text odkazu je podtržený.
internetové adresy
Úplná adresa obsahuje internetovou adresu webového serveru a cestu k souboru, který má být načten. Například:
Zde www.site.ru je adresa webového serveru a /catalog/page15.html je cesta k souboru na tomto serveru. Obecně platí, že úplné internetové adresy se obvykle používají pouze v případě, že je nutné vytvořit hypertextový odkaz směřující na některé zdroje umístěné na jiné webové stránce.
Při vytváření hypertextových odkazů směřujících na soubory, které jsou součástí stejného webu jako aktuální webová stránka, je nejlepší použít zkrácené internetové adresy. Zkrácená adresa obsahuje pouze cestu k souboru na serveru, protože Prohlížeč již zná adresu webového serveru.
Zkrácené internetové adresy jsou absolutní a relativní. Absolutní adresa určuje cestu k cílovému souboru vzhledem ke kořenové složce webu. Taková adresa začíná znakem / (lomítko), který označuje kořenovou složku. Například adresa "/page15.html" ukazuje na soubor page15.html, který je uložen v kořenové složce webu. Nebo adresa "/catalog/page.html" ukazuje na soubor page.html, který je umístěn ve složce katalogu vnořené v kořenové složce webu.
Relativní adresa je cesta k souboru vzhledem k souboru aktuální webové stránky. Relativní adresy neobsahují úvodní lomítko. Podívejme se na pár příkladů.
Například adresa "page.html" ukazuje na soubor, který je ve stejné složce jako soubor aktuální webové stránky. A adresa "catalog/page.html" otevře soubor page.html uložený ve složce katalogu, vnořený ve složce, kde je uložena aktuální stránka.
Pomocí dvou teček na začátku adresy můžete určit složky předchozí úrovně vnoření. Takže například adresa „.../stranka.html“ ukazuje na stránku.html uloženou ve složce, ve které je vnořena složka s aktuální webovou stránkou.
Odkaz na mail
Používáním html jazyk můžete vytvořit poštovní hypertextové odkazy, kliknutím na který se program spustí poštovní klient. Při zadávání adresy v atributu href dát před email "mailto:", tj. něco takového: href="mailto: [e-mail chráněný] Kromě toho by za dvojtečkou neměly být mezery před poštovní adresou.
Jak udělat z obrázku odkaz
Protože se jedná o vložený prvek html stránky, jednoduše vložíme tuto značku do značky „A“ místo textu:
kromě jednoduchá možnost vytvoření obrázku hypertextového odkazu vám html umožňuje přeměnit část grafického obrázku na hypertextový odkaz. Navíc je možné obrázek rozdělit na části, z nichž každá bude hypertextovým odkazem směřujícím na jeho internetovou adresu. Tato možnost se nazývá obrazová mapa.
V současné době se obrazová mapa používá zřídka, protože vyžaduje velmi velký počet značek a html kód se stává nepraktickým a matoucím.
Obrazová mapa se vytváří ve třech fázích:
Úplný html kód, který vytváří obrazovou mapu, vypadá takto:
Zde jsme vytvořili jednu obdélníkovou oblast ukazující na hlavní stránku webu webcodius, jednu kruhovou oblast ukazující na stránku se všemi články na stejném webu a jednu polygonální oblast bez odkazu.
Kotvy
Kotva popř označení- jedná se o druh hypertextového odkazu, který označuje samostatný fragment stránky html a umožňuje procházet obsahem dokumentu.
Možná jste již viděli stránky, kde se hned za nadpisem nacházel seznam názvů sekcí článků, kliknutím na které se dostanete do sekce, která vás zajímá.
Kotvy se vytvářejí, stejně jako běžné hypertextové odkazy, pomocí spárovaná značka A, pouze místo atributu href je v něm umístěn atribut name nebo id, jehož hodnota nastavuje jedinečný identifikátor štítku. V tomto případě samotná značka „A“ obvykle nemá žádný obsah:
Existuje druhý způsob, jak vytvořit kotvu, která nepotřebuje vytvářet prázdné prvky „A“. Nebo můžete použít prvky, které již na webové stránce jsou, např. Chcete-li to provést, přidejte atribut universal id k požadovanému prvku:
Dobrý den, milí čtenáři tohoto blogu! Jak víte, pro úspěšnou propagaci webu a zvýšení jeho pozice ve výsledcích Výsledky vyhledávání, je nutné provést kvalitní SEO optimalizaci stránek. Pojem „“, který se zase dělí na interní a externí, je neoddělitelně spojen s pojmy jako „interní a externí odkazy na stránky“. Proto je pro nás velmi důležité vědět, kolik odkazů by mělo být na webu, jak kontrolovat jejich počet, jak z webu odstranit nepotřebné odkazy a zavřít je z indexování, jak zvýšit množství odkazů atd. K zodpovězení všech těchto a dalších otázek týkajících se vnitřních a externí odkazy, pojďme nejprve pochopit, co je odkaz (nebo hypertextový odkaz) v HTML.
V tomto článku vysvětlím, co je to odkaz, jak vytvořit hypertextový odkaz v HTML na webu, jak otevřít odkaz v novém okně, jak vytvořit odkaz na e-mailovou adresu (e-mail) a jak udělat z odkazu obrázek. Dotkneme se také takových pojmů, jako jsou značky html a atributy hypertextových odkazů, kotva odkazů, kotva html (kotva) a hash odkazy. Takže, začněme.
Co je odkaz (hypertextový odkaz).
Pokud hypertextový odkaz vede na webovou stránku nebo soubor, který neexistuje (smazán, přesunut) nebo je jeho adresa nesprávná, pak se takový odkaz nazývá přerušený. Na stránkách by neměly být nefunkční odkazy, protože klamou návštěvníky a kliknutím na takový odkaz se člověk na váš web pravděpodobně nevrátí. O tom, proč se nefunkční odkazy objevují, jak je najít a opravit, si povíme podrobněji v samostatném článku. A teď pokračujme.
Jak vytvořit odkaz (hypertextový odkaz) v HTML na webové stránce.
Odkaz na jinou stránku vašeho webu nebo jiný web je velmi snadný. Chcete-li vytvořit hypertextový odkaz, musíte prohlížeči sdělit, o jaký odkaz jde, a uvést adresu dokumentu, na který povede. To se provádí pomocí HTML tagu. a požadovaný atribut href:
Zde URL je adresa dokumentu, na který chcete přejít. A text hypertextového odkazu umístěného mezi značkami a, se nazývá kotva odkazu a je viditelná pro návštěvníka webové stránky. Kromě toho, že text odkazu (kotva) informuje čtenáře, kde bude přechod proveden, je také velmi důležitý při optimalizaci pro vyhledávače (SEO), protože je jedním z určujících faktorů ovlivňujících hodnocení vašeho webu podle klíčová slova obsažené v této kotvě. Obvykle se tento typ hodnocení nazývá referenční.
Absolutní odkaz
Používají se k odkazování na dokument na jiném webu (externí odkaz).
Je povoleno vytvářet absolutní odkazy v rámci stejného webu, nicméně správnější je použít relativní adresy k vytvoření interního odkazu, které vypadají kratší. Ale při analýze různých stránek jsem si všiml, že velká většina webmasterů vytváří interní odkazy s absolutními adresami. Zde je plus, protože pokud je vaše stránka zkopírována, pak tímto způsobem získáte zpět externí odkazy.
Jak vidíte, s absolutní odkazy vše je jednoduché. S relativními je to obtížnější, protože při jejich vytváření musíte pochopit, jakou hodnotu atributu href musíte zadat, protože závisí na původním umístění dokumentů. Jak jsem řekl, nikdo se s tím opravdu neobtěžuje a všechny odkazy na webu jsou absolutní. Pokud však máte zájem dozvědět se více o tom, jak správně vytvořit relativní odkazy pro web, mohu doporučit článek od Dmitryho, autora blogu ktonanovenkogo.ru. Podrobnější a srozumitelnější vysvětlení jsem ještě neviděl.
Ukážu například, jak bude vypadat odkaz vedoucí na soubor vzhledem ke kořenu webu (stačí odříznout vše nalevo od třetího lomítka v podobném absolutním odkazu):
Relativní odkaz
Na hlavní
Text odkazu (kotva)
Barvy a vzhled vyskakovacího textu závisí pouze na nastavení operační systém a prohlížeč.
Jak otevřít odkaz v novém okně.
Ve výchozím nastavení se po kliknutí na odkaz v aktuálním okně otevře nový dokument. Při osobním prohlížení stránek mi to však nevyhovuje. Při čtení článku a sledování odkazu mi vyhovuje, že se stránka otevře v novém okně a já mohu kdykoliv pokračovat ve čtení předchozího článku. Dalším důvodem, proč otevřít odkaz v novém okně, je, že když přejdete na cizí stránky, je velká pravděpodobnost, že se čtenář nevrátí. Zvláště pokud provede několik přechodů a jednoduše si nepamatuje, kde byl před několika minutami.
Atribut cílové značky nám pomůže otevřít odkaz v novém okně. . Výchozí hodnota je _self , která se obvykle nezapisuje. Chcete-li otevřít dokument v novém okně, změňte hodnotu cílového atributu na _blank :
| 1 | <a href = "http://site" target = "_blank" > Nové okno</a> |
Nové okno
Co když když navštívíte web někoho jiného, kde se odkazy otevírají v aktuálním okně, chcete je otevřít v novém? Stačí na ně kliknout ne tlačítkem, ale kolečkem myši. V tomto případě nová stránka se otevře v novém okně.
Jak vytvořit odkaz na e-mail (e-mailovou adresu).
Kliknutím na tento odkaz se otevře program pro práci e-mailem, ve výchozím nastavení vámi nainstalované, kde již bude vyplněno pole „Komu“. Chcete-li automaticky vyplnit předmět dopisu, musíte vytvořit odkaz na e-mail následujícího formuláře:
Místo slov „předmět_dopisu“ musíte napsat požadované téma a samozřejmě latinkou. Děláme to proto, že mnoho prohlížečů a e-mailových programů nepracuje dobře s azbukou a v předmětu je možné vidět nejrůznější nesmysly. Pomocí této neošidné rady budete moci vytvořit odkaz na e-mail bez obav ze zbytečných překvapení.
Jak udělat z obrázku odkaz.
Zde je atribut title tooltip a text napsaný v atributu alt (alternativní zdroj informací) se objeví na stránce, pokud jsou v prohlížeči zakázány obrázky. Pokud atribut title slouží především pro pohodlí čtenářů, pak se vyhledávače snaží pochopit, co je na obrázku znázorněno atributem alt. Do těchto značek se doporučuje psát klíčová slova, která budou mít velký význam při optimalizaci pro vyhledávače. Hledání podle obrázků totiž nikdo nezrušil.
Jak vytvořit hypertextový odkaz (html kotvu) na jedné html stránce.
Výše jsme již zvažovali, jak vytvořit odkaz na webovou stránku, bez ohledu na interní nebo externí. Někdy však musíte vytvořit hypertextové odkazy na stejné webové stránce. za co? No například tak, že při čtení velmi dlouhého textu máme možnost rychle přeskočit na jakoukoli jeho část. Nebo se vám bude hodit, když na začátku článku zveřejníte jeho obsah bod po bodu. Poté kliknutím na požadovanou položku okamžitě přejdete k materiálu, který vás zajímá. Takové přechody se provádějí pomocí záložek předinstalovaných v těle článku, nazývaných kotvy html (nezaměňovat s kotvou textu) a speciálních hash odkazů.
Chcete-li vytvořit kotvu, nejprve vytvořte záložku s libovolným názvem (používají se pouze latinská písmena, číslice, pomlčky a podtržítka) určeným pomocí atributu name značky. :
Nahoru
| 1 | <a href = "javascript:scroll(0,0);" > |
Dmitrij KtoNaNovenkogo radí jiný způsob, jak nastavit záložky v textu webové stránky, bez použití html kotev. Za tímto účelem vytvoříme záložku z libovolné HTML značky dostupné na stránce a předepíšeme jí univerzální atribut id. Záložku vytvoříme například ze značky záhlaví h3:
Text nadpisu
Je důležité napsat latinku do atributu id jako první znak názvu kotvy, poté můžete použít jakékoli další povolené znaky.
Vraťme se například k nadpisu „ “ a pak pokračujte.
Pomocí hashovacích odkazů můžete přejít na správné místo nejen v rámci jedné stránky, ale také přejít na jinou stránku webu. K tomu nastavíme html kotvu na správné místo na správné stránce a do samotného hash odkazu před hash symbol napíšeme adresu této stránky. Například:
Propojit text s kotvou záložek html
Typy a barvy hypertextových odkazů v HTML.
- Nenavštívený odkaz je modrý a podtržený.
- Aktivní odkaz – zčervená v době mezi kliknutím na odkaz a zahájením načítání nové stránky. Samozřejmě v tomto stavu nebyla dlouho.
- Navštívený odkaz - po kliknutí na něj změní barvu na fialovou.
Pomocí značky můžete změnit barvu hypertextových odkazů v dokumentu html
a následující atributy:- Odkaz – barva nenavštívených odkazů.
- Alink - barva aktivního odkazu.
- Vlink je barva navštívených odkazů.
Všechny výše uvedené atributy lze kombinovat:
| 1 | <body link = "#1122cc" vlink = "#6611cc" alink = "#d14836" > |
Doufám, že je nyní jasné, jak vytvořit hypertextový odkaz na HTML stránce a na e-mail, jak udělat z obrázku odkaz, co jsou textové kotvy, hash odkazy a html kotvy, co jsou html značky a atributy odkazů. Snažil jsem se co nejlépe popsat, co jsou odkazy v HTML a co to je. Připomínám, že vkládání hypertextových odkazů do textu se provádí pouze v režimu HTML.
Nikdy jsem nemusel psát tak dlouhé články, více než 10 000 znaků. Ale toto téma odkazů není vyčerpáno, na pokračování.
Pokud byl pro vás tento článek užitečný, klikněte na níže uvedená tlačítka sociálních sítí. Uvidíme se na stránkách!
Hlavním rozlišovacím znakem HTML dokumentů je vytváření speciálních aktivních odkazů na jiné dokumenty, které se nazývají hypertextové odkazy.
Když na ně najedete myší, kurzor má podobu ruky a po kliknutí do okna prohlížeče se otevře další webová stránka nebo konkrétní dokument. Hypertextové odkazy mohou být textové nebo obrázkové.
Bude fungovat, pokud je cílový dokument umístěn ve stejném adresáři jako aktuální. Také můžete zadat cestu k souboru vzhledem ke kořenovému adresáři webu pomocí symbolu "/".
Například:
Například:
Vytváření hypertextových odkazů v HTML je jednoduchý proces. Ve výchozím nastavení jsou podtržené a zvýrazněné modře, zatímco navštívené jsou fialové.
- link - barva odkazů webové stránky;
- vlink - barva hypertextových odkazů navštívených webových stránek;
- alink je barva aktivních odkazů na webové stránce.
Například:
Zadané atributy určují barvy odkazu celého dokumentu HTML. Pokud tento kód vložíte do značky
, nemusíte pokaždé nastavovat barvu písma.Základní atributy hypertextových odkazů
1. nadpis – umožňuje vytvořit text popisku, který se objeví, když najedete kurzorem myši na hypertextový odkaz.
Například:
2. cíl – říká prohlížeči, ve kterém okně má odkaz otevřít.
Může nabývat následujících hodnot:
- _blank - odkaz musí být otevřen v nové záložce;
- _self - Hypertextový odkaz HTML musí být otevřen na aktuální kartě. Výchozí hodnota;
- _parent - prohlížeč by měl načíst odkaz v nadřazeném okně;
- _top - hypertextový odkaz se načte přes celý prostor okna prohlížeče (v tomto případě rámování zmizí).
Například:
Název odkazu
Odpověď na otázku často kladenou začínajícími webmastery " jak vložit hypertextový odkaz do html» přijato.
Přejeme vám úspěch ve výuce webového programování!