Tinklalapiai skiriasi nuo bet kokios komunikacijos priemonės, kuri buvo prieš juos. Vienas iš pagrindinių dalykų, kuris nustato svetaines, išskyrus ankstesnius žiniasklaidos formatus, pvz., Spausdintą, radiją ar netgi televizorių, yra " hipersaito " sąvoka.
Hipersaitai, taip pat paprastai vadinami "nuorodomis", yra tai, kas daro žiniatinklio dinamiškumą. Skirtingai nuo spausdinto leidinio, kuris gali nukreipti į kitą straipsnį ar kitą šaltinį, tinklalapiai gali naudoti šias nuorodas, kad faktiškai siųstų lankytojus tiems kitiems puslapiams ir šaltiniams. Jokia kita transliavimo terpė negali tai padaryti. Skelbimą galite išgirsti radijo arba televizoriaus peržiūros metu, tačiau nėra jokių nuorodų, leidžiančių nukreipti jus į šiose skelbimuose esančias kompanijas taip, kaip lengvai galima tai padaryti. Nuorodos tikrai yra nuostabus komunikacijos ir sąveikos įrankis!
Dažnai tinklalapyje rastos nuorodos yra teksto turinys, kuris nukreipia lankytojus į kitus tos pačios svetainės puslapius. Svetainės naršymas yra vienas pavyzdžių tekstinių nuorodų praktikoje, tačiau nuorodos neturi būti teksto pagrindu. Taip pat galite lengvai susieti vaizdus savo svetainėje. Pažvelkime į tai, kaip tai daroma, o po to kai kuriais atvejais norėtumėte naudoti vaizdinius hipersaitus.
Kaip susieti vaizdą
Pirmas dalykas, kurį turėsite padaryti, - patalpinti vaizdą į savo HTML dokumentą. Dažnai naudojama vaizdinė nuoroda yra svetainės logotipą, kuris vėliau yra susietas su svetainės pagrindiniu puslapiu. Toliau pateiktame pavyzdiniame kodelyje naudojamas failas yra mūsų logotipo SVG . Tai yra geras pasirinkimas, nes tai leis mūsų įvaizdžiui skleisti skirtingas raišką, tuo pačiu išlaikant vaizdo kokybę ir mažą bendrą failo dydį.
Štai kaip galite pateikti savo vaizdą HTML dokumente:
Aplink paveikslėlio žymą, dabar pridėsite inkaro nuorodą, atversdami inkaro elementą prieš vaizdą ir uždarę inkarą po paveikslėlio. Tai panašu į tai, kaip tekste susieti, tik užuot sukandę žodžius, kuriuos norite susieti su tvirtinimo žymomis, apvyniokite vaizdą. Toliau pateiktame pavyzdyje mes susiejame atgal prie mūsų svetainės pagrindinio puslapio, kuris yra "index.html".
Pridedant šį HTML į savo puslapį, tarp žymos žymos ir vaizdo žymos neturėkite tarpų. Jei tai padarysite, kai kurios naršyklės šalia vaizdo pridės mažai erkių, kurios atrodys keistai.
Logotipo vaizdas dabar taip pat veiktų kaip pagrindinio puslapio mygtukas, kuris šiandien yra gana daug interneto standartas. Atkreipkite dėmesį, kad mūsų HTML žymeklyje neįtraukiami jokie vizualiniai stiliai, pvz., Nuotraukos plotis ir aukštis. Mes paliksime šiuos vizualiuosius stilius CSS ir palaikome švarų HTML struktūros ir CSS stilių atskyrimą.
Kai tik pateksite į CSS, stiliai, kuriuos rašote norėdami nukreipti į šį logotipą, gali apimti vaizdo dydį, įskaitant jautrius stilius įvairiems įrenginiams palankius vaizdus, taip pat visus vaizdus, kuriuos norite pridėti prie nuotraukos / nuorodos, pvz., Sienos ar CSS palikti šešėliai. Taip pat galite suteikti savo įvaizdį arba susieti klasės atributą, jei jums reikės papildomų "kabliukų", kuriuos galėsite naudoti su savo CSS stiliais.
Naudokite "Image Links" atvejus
Taigi pridedant vaizdo nuorodą yra gana paprasta. Kaip ką tik matėme, viskas, ką turite padaryti, yra įvynioti vaizdą su atitinkamomis tvirtinimo žymomis. Jūsų kitas klausimas gali būti "kada jūs iš tikrųjų tai padarysite praktikoje, be paminėto logotipo / pagrindinio puslapio nuorodų pavyzdžio?"
Štai keletas minčių:
- Galerijoje esančios miniatiūros vaizdai, susiejantys su didesnėmis tų vaizdų versijomis.
- Vaizdai, naudojami atskirai, kad atstovauti turinį, pvz., E-komercijos svetainės produktų nuotraukos.
- "Teaser" vaizdai, kurie yra kito turinio dalis, pvz., Tinklaraščio straipsnis arba spaudos pranešimas, skatina žmones pastebėti, kad turinys suteikia jiems tikslinę sritį, kad būtų galima paliesti arba spustelėti, jei norite perskaityti visą straipsnį.
- Piktogramos atvaizdai, naudojami kaip mygtukai, skirti prisijungti prie konkrečios svetainės funkcijų ar puslapių.
- Socialinės žiniasklaidos nuorodos, kuriose naudojami atpažįstami įvairių socialinės žiniasklaidos svetainių logotipai, kurie yra svarbūs šiai svetainei ar bendrovei.
- Vaizdai, naudojami kaip mygtukai tam tikroms funkcijoms, pvz., Formos pateikimas (geriausios praktikos pavyzdžiai - iš svetainės našumo perspektyvos, mygtukai, kurių stiliai yra tik CSS, yra geresnis pasirinkimas nei vaizdo mygtukai).
Priminimas naudojant vaizdus
Vaizdai gali atlikti svarbų vaidmenį svetainės sėkme. Vienas iš pirmiau minėtų pavyzdžių, naudojant vaizdus kartu su kitu turiniu, atkreipia dėmesį į šį turinį ir leidžia žmonėms jį skaityti.
Naudodamiesi vaizdais, turėtumėte nepamiršti, kad pasirinkote tinkamą jūsų poreikių įvaizdį , įskaitant tinkamą vaizdo medžiagą, formatą, taip pat įsitikinkite, kad bet kokie jūsų svetainėje naudojami vaizdai tinkamai optimizuojami svetainių pristatymui . Tai gali atrodyti kaip daug darbų, tik norint pridėti vaizdus, bet atlyginimas yra vertas! Vaizdai tikrai gali tiek daug prisidėti prie svetainės sėkmės.
Nedvejodami naudoti tinkamus vaizdus į savo svetainę ir susieti juos su vaizdais, jei reikia, kad interaktyviai pridėti savo turinį, tačiau taip pat atkreipkite dėmesį į geriausius vaizdus ir tinkamai ir atsakingai naudodami šias grafikas ar nuorodas savo interneto dizaino darbe.