muzruno.com

Как да направите връзка в HTML?

Сайтове, блогове, уеб страници вече са познати понятия в наше време. С развитието на интернет сайтовете за поставяне на уеб страници станаха невероятно популярни и не е изненадващо: за някои хора съществуването на уебсайт е необходимост, а за другите - приятно забавление. В първия случай обикновено се отнася до фирми, корпорации, частни предприемачи, когато рекламират някакъв продукт или изискват услуги. Във втория - за блогъри.

Освен това има потребители на интернет, които просто търсят информация, четат блогове, гледат видеоклипове и т.н.

За да създадете качествен уебсайт, има много опции. Ще се съсредоточим върху уеб програмирането чрез HTML.

Какво представлява HTML?

HTML означава Hyper Text Mark-Up Language. На английски означава "хипертектен език за маркиране".

С други думи, HTML е набор от кодове, с които можете да създадете основните елементи на сайта, неговата рамка, точно както думите са съставени от думи.

Кодовете в HTML са написани изключително с латински букви и се наричат ​​етикети, като всеки код е ограден в ъглови скоби. Някои от маркерите са двойка, а някои са неподредени.

Сдвоени означава, че те трябва да се използват по двойки без неуспех. Например, етикетът за отваряне показва къде уеб страницата започва да действа, а затварящият маркер показва къде приключва действието му. Последният се различава от първия при наличието на символа "наклонена черта" след ъгъла на отваряне. Например, - етикетът за отваряне, - затваряне.

Неподдържаните маркери в "партньора" не се нуждаят.

Много етикети могат да имат атрибути - допълнителни елементи, които дават по-конкретен смисъл. Например, маркер .

уеб дизайн

Къде се използва HTML?

Класическо разбиране за това, къде е необходим HTML е създаването на сайтове.

На практика това може да е достатъчно, тъй като HTML ви позволява да създавате основни елементи на сайта, менюта (включително много нива), задаване на фон, вмъкване на текст, изображения, аудио, видео, редактиране на шрифтове и много други.

Има обаче и други езици, които ви позволяват да добавяте по-интересни и често необходими елементи от уеб страница:

  • CSS настройва стиловете за целия сайт, без да се налага непрекъснато да се използват маркерите, за да се оформят характеристиките на отделните елементи - например цветът и шрифтът на текста.
  • скриптов език ви позволява да проектирате и да вградят към вашия сайт мини-програми (скриптове), вариращи от баналните неща, естетически (Промяна на цвета на връзките, когато движите мишката) към функционалните (събиране на имейл адреси на клиенти, телефонни номера).
  • С PHP можете да създадете своя собствена книга за гости или система за коментиране.

Също така, HTML се използва за създаване на електронна поща за разпространение.

интернет бюлетин

Какво представлява връзка

Те ви позволяват да преминете към друга уеб страница, както в сайта, така и извън него.

Обикновено се използват HTML връзки:

  • За да отидете на външен уеб ресурс.
  • За да се придвижвате през страниците в сайта.
  • За да отидете до формуляри в Google.

Връзката към източника в HTML също често се посочва, особено когато, когато копирате материал от друг сайт, трябва да посочите автора. В противен случай копирането без приписване може да попадне в дефиницията за нарушаване на авторски права, кражба на съдържание и има неприятни последици. Освен това използването на заимствани, не-уникални материали намалява показателите за SEO, а позоваването на източника намалява рисковете.

Видове връзки

В класически смисъл, връзката е адресът на уеб ресурс, към който можете да отидете, като кликнете върху него.

видове връзки

Освен това има хипервръзки: текст и изображения. В тези случаи връзката HTML се "скрива" под всяко изречение (дума) или картина, а за да кликнете върху нея, трябва да кликнете върху текста или изображението.

Други видове връзки:

  • Unvisited е връзка, с която все още не е извършен преход по време на конкретна сесия. Например, ако сте кликнали върху тази връзка вчера, след това изключите компютъра и днес той е включен отново, но сега връзката отново не се посещава, тъй като е започнала нова сесия.
  • Активно - в това състояние връзката се запазва за много кратко време: пропастта между кликването върху връзката и прехода към нея.
  • Посетена - връзка, която вече е минал поне веднъж по време на една сесия.


Ако става дума за обикновени текстови връзки, посетителите обикновено променят цвета си, ако не е посочено друго.

Изображението на хипервръзката не променя външния вид, независимо дали е посетено или не.

Как да вмъкнете редовна връзка

Много уеб ресурси възприемат адреса на сайта като връзка, веднага го правят кликван и подчертават с цвят. Например, ако адресът е изпратен по куриер или по електронна поща, като кликнете върху него, можете да отидете на сайта.

В случай че сте създали сами сайт чрез HTML, трябва да поставите връзка, като използвате специален маркер. Тя ще изглежда така: адрес на сайта. Текстът на връзката в HTML трябва да бъде уточнен изцяло с протокола.

Как да вмъкнете текстова хипервръзка

По-рано се казва, че текстовата хипервръзка изпълнява същата функция като нормална връзка, но изглежда по-естетична: вместо адрес на уебсайт, който често е твърде дълъг, се посочва дума или фраза. Например, в изречението "Потърсете информация тук" можете да скриете връзката в думата "тук". Тя ще бъде подчертана в цвят и когато се кликне върху нея, потребителят ще отиде на желания сайт.

вмъкване на хипервръзка

Как да направите HTML връзка вече е споменато. Можете да вмъкнете текстова хипервръзка, използвайки същия маркер. Единствената разлика е, че трябва да посочите текста между маркерите, под които ще бъде скрита връзката: видим текст.

Как да вмъкнете изображение на хипервръзка

Тук е малко по-сложно. Използваме един и същ маркер, но вместо текст трябва да посочим пътя към изображението.

Пътят е мястото на изображението. Ако снимката (снимката) е във файла хостинг, тогава трябва да посочите всички папки по пътя към изображението чрез наклонена черта. Можете също да поставите връзка към изображението, ако е възможно.

Отидете на маркера В допълнение към src са приложими и други атрибути, които ви позволяват да регулирате височината, ширината и местоположението на картината и много други. Някои от тях:

  • Src - определя пътя към изображението.
  • Lowsrc - идентичен с предишния атрибут, но е показан за изображения с ниско качество.
  • Височина - височината на картината.
  • Ширина - широчината му.
  • Alt - описание на изображението. Когато задържите курсора на мишката върху снимка или снимка, ще се появи текстът, посочен в този атрибут.
  • Граница - определя дебелината на границата около изображението.

Атрибутите са посочени след маркера и са включени в неговия състав. След атрибута трябва да посочите стойността му. Например, за атрибути "височина" или "ширина", е зададена височината на изображението в уеб страницата. Единицата за измерване е пиксела, освен ако не е посочено друго.

Тя ще изглежда така :. Тези атрибути ще ви помогнат да зададете подходящ размер за картината. Границата помага да се създаде невидима граница около изображението.

кликнете върху връзката

Горните атрибути са приложими и отделно за маркера за вмъкване на изображение. Например :.

Какво представляват връзките с котва?

Създаването на котвени връзки е много полезно умение. Често има нужда да се създаде уеб страница с дълъг текстов блок или няколко подраздела на една страница. В този случай можете да направите незабавно в началото на списък с връзки към подразделения на текст или уеб страница и когато кликнете върху тях, потребителят ще отиде направо в исканата секция.

За да създадете котварски връзки, ще трябва да използвате етикети с атрибути по-активно, отколкото да създавате други типове връзки.

свързваща анкера

Първо, трябва да зададете обща стойност за всеки блок от информация или подраздел на текста, като използвате горния атрибут, и след това да го свържете със съответната връзка.

Техните черти са по-широки, затова е желателно първо да се овладее създаването на по-прости връзки и след това да се пристъпи към образуването на референтни котви.

Съвети

Поставяне на различни блокове от информация в уеб страница

Помощ от опитни програмисти:

  • Можете да се уверите, че информацията се показва за връзката, когато задържите курсора на мишката в HTML. За тази цел, атрибутът alt може да бъде полезен, който използваме и за графични елементи.
  • Възможно е да направите списък с връзки чрез HTML. По-специално, това може да бъде полезно, когато свързвате котви и когато трябва да направите списък с уеб ресурси, които можете да кликнете директно от текущата уеб страница.
  • С помощта на CSS и jаvascript, както и някои HTML функции, можете да създадете различен дизайн на текстови връзки и хипервръзки, който е различен от обичайния. Например, ако задържите курсора на мишката над дадена връзка, той може да промени цвета си и да върне предишния, когато курсорът е далеч от него. Това може да се реализира с помощта на специален скрипт в jаvascript. В допълнение, цветът на връзката може да бъде зададен на други, а не синьо за невидирано или лилаво за посещение. Това е задача за CSS.
  • Не злоупотребявайте с връзки. Уеб страница, в която има много нерелевантни връзки, изглежда небрежно и объркано.
  • Уверете се, че потребителят разбира, че хипервръзката с изображението е наистина нея, а не само картина.

заключение

В HTML е лесно да се направи връзка към страница. Важно е да се спазват всички основни точки на този език, защото дори една малка грешка може да доведе до резултата, че няма резултат и кодът няма да работи.

Споделяне в социалните мрежи:

сроден