Кампутары, Праграмаванне
Як ўставіць спасылку ў HTML? Стварэнне і выкарыстанне гіперспасылак ў HTML
Гіпертэкст ўяўляе сабой тэкст, які змяшчае спасылкі на іншы тэкст. Прыкладам могуць служыць заўвагі аўтара на складаныя вызначэння або зноскі перакладчыкаў ўнізе старонкі кнігі, калі ў ёй сустракаецца тэкст на замежнай мове. Сайты Інтэрнэту ўяўляюць сабой складаную сістэму гіпертэкставых пераходаў з адной старонкі на іншую, у межах самой старонкі, а таксама паміж незвязанымі адзінай тэматыкай рэсурсамі. Такая структура практычная, эканоміць шмат часу, дазваляе наведвальніку хутка знайсці неабходную інфармацыю і не разгубіцца ў вялікай колькасці пераходаў.
устаўка гіперспасылкі
У HTML для ўстаўкі гіперспасылкі выкарыстоўваецца дэскрыптар (тэг) , які ўстаўляецца ў патрэбнае месца. Звычайна яго размяшчаюць сярод тэксту, так як гіперспасылка сама па сабе з'яўляецца тэкставай структурай. Але спасылкі бываюць яшчэ графічнымі (абразкі, кнопкі, малюнкі); пра іх будзе расказана далей. Іх размяшчэнне на вэб-старонцы не абмяжоўваецца тэкстам, а залежыць ад дызайнерскага рашэння стваральніка сайта.
Гэта прыклад таго, як ўставіць спасылку ў HTML-дакумент, што ажыццяўляецца з дапамогай тэга . Наведвальнік сайта ўбачыць падкрэслены тэкст, выдатны ад колеру навакольнага тэксту (колер HTML-спасылкі можа быць любым), «галоўная старонка Google», націснуўшы на які, ён патрапіць на галоўную старонку пошукавай сістэмы «Гугл». Варта адзначыць, што тэкст гіперспасылкі павінен змяшчаць інфармацыю аб тым, куды будзе ажыццёўлены пераход. Гэтага прынцыпу варта прытрымлівацца і прыняць за правіла!
Структура тэга ...
Можна заўважыць, што тэг - парны: неабходны які зачыняе тэг .
href - атрыбут тэга, паказвае прызначэнне спасылкі.
https://google.com/ - значэнне атрыбуту, які заключае ў сабе URL-адрас рэсурсу, на які ажыццявіцца пераход. Яно заключаецца ў падвойныя або адзінарныя двукоссі. Гэта залежыць ад структуры ўкладзенасці тэгаў па правілах HTML.
уся гэтая канструкцыя называецца элементам вэб-дакумента.
Па правілах HTML, адны элементы могуць утрымліваць іншыя элементы. Тэг не выключэнне. Калі праграмісту неабходна вылучыць тоўстым слова Google, то робіцца гэта з дапамогай тэга па агульных правілах фарматавання тэксту, выконваючы паслядоўнасць ўкладзенасці тэгаў. Вэб-майстар павінен ведаць, як стварыць спасылку ў HTML без памылак, інакш яны не будуць працаваць. Непрацуючыя спасылкі на кампутарным слэнга называюць «бітымі».
Тут: элемент
змяшчае укладзены элемент
Гугл
Цяпер наведвальнік старонкі ўбачыць гіперспасылку з вылучаным тоўстым тэкстам словам «Гугл».
абсалютныя гіперспасылкі
Гіперспасылкі, якія выкарыстоўваюць абсалютныя URL-адрасы сайтаў, якія змяшчаюць імёны даменаў (.ru, .com, .org, .gov), называюцца абсалютнымі і маюць наступны сінтаксіс:
пратакол: // назву дамена / шлях да файла
Прыклад адрасу распаўсюджанага ў Амерыцы пошукавіка: https://aol.com - абсалютны, бо ўтрымоўвае імя дамена .com.
Абсалютныя гіперспасылкі выкарыстоўваюцца для пераходаў на старонкі іншых сайтаў або для доступу да рэсурсаў, размешчаным на іншым серверы. Пераход ажыццяўляецца з дапамогай пратаколаў Інтэрнэту. Пратаколы - гэта не тэма дадзенага артыкула, але паколькі яны ўдзельнічаюць у стварэнні гіперспасылак, неабходна хаця б коратка пра іх згадаць:
- http і https - найбольш часта сустракаемыя; па іх ажыццяўляецца пераход паміж інтэрнэтам-старонкамі розных сайтаў;
- ftp - пратакол для загрузкі файлаў на сервер або запампоўкі карыстальнікам з сайта;
- mailto - паштовы пратакол, па якім адпраўляецца электронная пошта непасрэдна з сайта, не заходзячы ў асабістую пошту.
Існуюць яшчэ некалькі пратаколаў асаблівага прызначэння (gopher, telnet), якія сустракаюцца даволі рэдка, выкарыстанне якіх патрабуе спецыяльных ведаў у праграмаванні або сістэмным адміністраванні.
адносныя гіперспасылкі
Пры адноснай адрасавання выкарыстанне гіперспасылак ў HTML служыць для пераходаў ўнутры рэсурсу і не вядзе за яго межы. Калі старонка настолькі вялікая, што працуе вертыкальная паласа прагорткі, часам вельмі доўгая, як, напрыклад, у слоўніках, то вельмі зручна і мэтазгодна выкарыстоўваць адносныя спасылкі для хуткага пераходу да патрэбнай літары.
Ствараючы інтэрнэт-слоўнік, праграміст ў пачатку старонкі размяшчае алфавіт, і калі б не прымяненне спасылак, то карыстачу прыйшлося б вельмі доўга круціць кола мышы, каб дабрацца да літары "Я".
Для стварэння адноснай спасылкі выкарыстоўваецца атрыбут name тэга :
дзе ya называецца якарам, а Перайсці да літары Я - якарам прызначэння. Для правільнага адлюстравання якароў рэкамендуецца выкарыстанне лацінскіх літар і лічбаў, таму не варта пісаць «Я», хоць так было б больш зразумела.
Зараз, каб ажыццяўляўся пераход ад алфавіту ў пачатку старонкі да літары "Я", трэба зрабіць прывязку якара ў тым месцы HTML-дакумента, у якім пачынаюцца словы на літару "Я":
перад якарам стаіць знак рашоткі, без якога пераход да літары не будзе працаваць.
Адносная адрасаванне пры стварэнні сайта
Зручны і самы агульнапрыняты алгарытм стварэння сайта праграмістам:
- стварэнне тэчкі ў кампутары і размяшчэнне яе ў месцы хуткага доступу для зручнасці;
- стварэнне ў гэтай тэчцы галоўнай старонкі сайта index.html;
- стварэнне другарадных вэб-старонак (index.html / page2);
- стварэнне тэчкі і размяшчэнне ў ёй графічных файлаў;
- стварэнне тэчкі і размяшчэнне ў ёй іншых аб'ектаў (файлы для запампоўкі, напрыклад);
- напаўненне сайта кантэнтам;
- размяшчэнне файлаў сайта на хостынгу.
Абавязкова прыйдзецца выкарыстоўваць спасылкі для сувязі паміж элементамі сайта, і вельмі дарэчы будзе ведаць, як ўставіць спасылку ў HTML на іншую старонку гэтага ж сайта. Калі файлы сайта знаходзяцца ў аднаго каталога, на адным сэрвэры, то няма неабходнасці выкарыстоўваць абсалютную адрасаванне. Пры перадачы файлаў сайта на хостынг сувязь паміж аб'ектамі захаваецца, таму што яны на хостынгу таксама размесцяцца ў аднаго каталога.
Дапусцім, праграміст стварыў галоўную старонку сайта index.html, на якой маецца спасылка на іншую старонку page2.html, упрыгожаную малюначкам img.png. Тады адносны шлях да гэтай малюнку будзе выглядаць так:
Савет: пры вывучэнні гэтай тэмы лепш за ўсё выкарыстоўваць просты рэдактар тэксту па прычыне таго, што трэба набыць спрыт у правільным напісанні адрасоў пераходу і каб навучыцца разбірацца ў чужым кодзе. На гэтым этапе будзе добрым вынікам без памылак прапісаная гіперспасылка ў нататніку, HTML іх не даруе і выдае памылкі.
Спосабы пераходаў па гіперспасылка
Па змаўчанні новая старонка адкрываецца ў бягучым акне браўзэра, калі карыстальнік клікае па спасылцы. Але вэб-праграміст можа змяніць значэнне па змаўчанні і прымусіць адчыняцца старонку, да прыкладу, у новым акне. Для гэтага існуе атрыбут target з вызначаным сваім значэннем. Навочней за ўсё гэта можна выказаць табліцай.
| _blank | адкрывае старонку ў новым акне браўзэра |
| _self | адкрывае старонку ў бягучым акне (значэнне па змаўчанні) |
| _parent | адкрывае старонку ў бацькоўскай фрэйме |
| _top | пры выкарыстанні фрэймаў адмяняе іх усё і адкрывае старонку ў бягучым акне браўзэра |
Сінтаксіс прымянення атрыбуту target:
Галоўная старонка «Гугл» адкрыецца ў новым акне.
Заўвага: для адкрыцця старонак у новай ўкладцы не існуе значэнняў для дадзенага атрыбуту, а задаецца самім карыстальнікам у наладах браўзэра.
колер гіперспасылак
Дасведчаны карыстальнік Інтэрнэту з часам павінен быў заўважыць, што гіперспасылкі адрозніваюцца па колеры ад навакольнага тэксту, і звычайна яны сінія. Спасылкі, па якіх ён пераходзіў і затым вярнуўся на ранейшую старонку, становяцца бэзавым. Выкарыстанне гіперспасылак ў HTML у нестандартнай каляровай гаме трохі, але вылучае сайт сярод астатніх.
Задаюцца колеру спасылак ў тэгу
з дапамогай атрыбутаў і іх значэнняў, у якіх выступае колер HTML у сістэме rgb (# 00FF00) або з прамым указаннем імя колеру ( «green»). Існуе тры выгляду атрыбутаў для спасылак:- link - задае колер непосещённой спасылкі;
- vlink - задае колер спасылкі, па якой карыстальнік ўжо пераходзіў;
- alink - задае колер спасылкі ў момант пераходу на іншую старонку. Гэта адбываецца хутка, таму не заўсёды можна ўлавіць гэты эфект.
Прыклад разметкі:
Калі ўжыць гэтыя атрыбуты ў тэгу
, спасылкі дадзенага вэб-дакумента будуць цёмна-сінімі, наведаныя - ліловага, а актыўныя - памяранцава-чырвонага колеру.графічныя гіперспасылкі
Прагрэс і развіццё вэб-дызайну абавязваюць ведаць, як ўставіць спасылку ў HTML у якасці малюнка. Зразумела, што карцінка павінна адпавядаць змесціва старонкі прызначэння. Напрыклад, галоўная старонка сайта аб лекавых раслінах можа быць прадстаўлена ў выглядзе фатаграфій раслін, клікнуўшы па якіх, карыстальнік пяройдзе на старонку, на якой апісваюцца лекавыя ўласцівасці расліны.
Шырока ўжываецца спосаб замены статычных кнопак () на прыгожыя графічныя, створаныя вэб-дызайнерам у рэдактарах графікі (GIMP, Photoshop).
Для ўстаўкі графікі ў якасці гіперспасылак на старонкі сайта выкарыстоўваецца той жа сінтаксіс, толькі замест тэксту выкарыстоўваецца тэг ўстаўкі малюнка па правілах HTML:
Да тэгу дакладна так жа дастасавальныя атрыбуты задання альтэрнатыўнага тэксту, шырыні, вышыні і іншыя.
Званкі з сайта
Стандарт html5 пашырыў функцыянальныя магчымасці выкарыстання Інтэрнэту, і цяпер здзяйсняць званкі можна не толькі з тэлефона, але непасрэдна з сайта. Для гэтай мэты таксама можна выкарыстоўваць гіперспасылкі ў HTML дакуменце, і яны маюць такі сінтаксіс:
Замест слова «абанент» прапісваецца зразумелы які тэлефануе кантакт, як у тэлефоннай кнізе. Таксама можна размясціць графічны файл (фатаграфію абанента).
Каб званкі здзяйсняліся з сайта, неабходна наяўнасць не толькі спасылкі на нумар тэлефона абанента, але і гарнітуры (мікрафон, навушнікі), усталяванай на кампутары VoIP-праграма, хуткасць інтэрнэту павінна перавышаць 0,5 Мб / сек. Аплата за званкі ажыццяўляецца выдаткам трафіку. Таму, калі Інтэрнэт безлімітны, то званкі бясплатныя.
Этыка стварэння гіперспасылак
Размяшчаючы сайт у Інтэрнэце, вэб-майстар павінен ведаць, якія віды гіперспасылак існуюць у HTML, і не толькі правільна, прафесійна іх ужываць, але і прытрымлівацца наступных палажэнняў:
- Гіперспасылка павінна быць добра бачная, адрознівацца ад навакольнага яе тэксту. Карыстальнік павінен ведаць, што гэта - гіперспасылка.
- Карыстачу павінна быць зразумела, куды ён патрапіць, націснуўшы на спасылку. Для гэтага мэтазгодна выкарыстоўваць яшчэ атрыбут title, які лаканічна апісвае старонку пераходу. Сінтаксіс прымянення атрыбуту такі:
- Карыстальнік павінен атрымаць праўдзівую інфармацыю аб файле, які будзе запампаваны пры пераходзе па спасылцы.
Патрапіўшы ня на чаканую старонку або запампаваўшы не той файл, карыстач у 99% выпадкаў тут жа пакіне сайт і ў будучыні ніколі на яго не зойдзе.
Анты-Seo пры стварэнні гіперспасылак
Акрамя тэхнічнага боку пытання аб тым, як ўставіць спасылку ў HTML, варта асвятліць яшчэ і маральны аспект. Існуе шмат сайтаў, доступ да якіх карыстальнікам блакуецца праграмамі бяспекі (антывірусам) або нават дзяржавай. Гэта тыя сайты, якія былі створаны нячыстымі на руку вэб-праграмістамі.
Адна з выкрутаў, да якой яны звяртаюцца, - гэта ўстаўка «нябачных» гіперспасылак на вэб-старонку. Ашуканцы ведаюць, як стварыць спасылку ў HTML, а пры дапамозе атрыбутаў прыбраць падкрэсленне спасылкі і прызначыць ёй колер навакольнага тэксту з тым, каб радавы карыстальнік не ўбачыў яе. А пры дапамозе іншых інструментаў вэб-тэхналогій (CSS, JavaScript, PHP) можна запраграмаваць іх паводзіны. Да прыкладу, падзея OnMouseOver мовы JavaScript актывуе дзеянне элемента вэб-старонкі. Калі карыстальнік праводзіць курсорам па нябачнай спасылцы, ён трапляе на рэкламную старонку іншага сайта. Ці яшчэ горш, калі прысутнічае нябачная спасылка на файл і на яго кампутар пачынае спампоўвацца і ўсталёўвацца непатрэбнае праграмнае забеспячэнне. Звычайна гэта вірусы, якія мяняюць хатнюю старонку браўзэра, захламляюць жорсткі дыск масай праграм і іншае.
Хутка такія сайты трапляюць у «чорны спіс» вірусных баз, сістэм бяспекі і сярод саміх карыстальнікаў Інтэрнэт. Такія сайты доўга не жывуць, і ім даводзіцца мяняць свае назвы, бясконца міграваць па Інтэрнэце, змяняючы хост-правайдэраў. Гэта не спрыяе раскрутцы сайта, да чаго заўсёды імкнецца яго стваральнік, ніколі не зробіць яго мегапарталы, такім як, напрыклад, соцсеть. Акрамя іншага, такія хітрыкі выклікаюць шмат адмоўных эмоцый у пацярпелых ад гэтых дзеянняў людзей.
Similar articles
Trending Now