Ознака ИМГ: Неопевани херој мачјих мемова на мрежи

click fraud protection

Тхе ХТМЛ ИМГ ознака управља уметањем слика и других статичних графичких објеката унутар веб странице. Ова уобичајена ознака подржава неколико обавезних и опционалних атрибута који додају богатство вашој способности да дизајнирате занимљиву веб локацију усредсређену на слике.

Пример потпуно формиране ХТМЛ ИМГ ознаке изгледа овако:


Обавезни атрибути ИМГ ознаке

срц = "/ пут / до / имаге.јпг"

Једини атрибут који вам је потребан да би слика била приказана на веб страници је срц атрибут. Овај атрибут идентификује име и место датотеке слике која ће се приказати.

алт = "Опис слике"

За писање важећих КСХТМЛ и ХТМЛ4, алт атрибут је такође потребан. Овај атрибут се користи за пружање невизуелним прегледачима текста који описује слику. Прегледачи приказују алтернативни текст на различите начине. Неки га приказују као искачући прозор када ставите миш преко слике, други га приказују у својствима када кликнете десним тастером миша на слику, а неки га уопште не приказују.

Користити алт текст да дају додатне детаље о слици који нису релевантни или важни за текст веб странице. Али, имајте на уму да ће се у читачима екрана и другим прегледачима само са текстом текст читати у линији са остатком текста на страници. Да бисте избегли забуну, користите описни алт текст који каже (на пример) „О веб дизајну и ХТМЛ-у“ уместо само „логотип“.

instagram viewer

Тхе алт текст је такође битан за СЕО (оптимизација за претраживаче). Ботови које претраживачи, попут Гоогле-а, користе за истраживање садржаја на сајтовима, не могу да „виде“ слике. Они се ослањају на алт текст да бисте утврдили шта је на страници.

У ХТМЛ5, алт атрибут није увек потребан, јер можете да користите Наслов да бисте му додали још описа. Овим атрибутом такође можете да означите ИД који садржи потпун опис:

ариа-десцриби = "Опис слике"

Алтернативни текст такође није потребан ако је слика искључиво декоративна, као што је графика на врху веб странице или иконе. Али ако нисте сигурни, додајте алт текст за сваки случај.

Величина атрибута

ширина = "500"
и.
висина = "500"
У зависности од вашег дизајна, користите. висина и. ширина

Генерално, желећете да величина слике буде постављена у вашем ЦСС-у. Чешће него не, то ће бити резултат димензија надређеног контејнера слике. Овај приступ омогућава највећу флексибилност приликом прилагођавања различитим величинама екрана. Ипак, још увек постоје случајеви када бисте можда желели да одредите димензије слике као ХТМЛ атрибуте.

Остали корисни атрибути ИМГ

титле = "Описно име слике"
Атрибут је глобални атрибут који се може применити на било који. ХТМЛ елемент. Штавише,. наслов

Већина прегледача подржава наслов атрибут, али то раде на различите начине. Неки приказују текст као искачући прозор, док га други приказују на информативним екранима када корисник кликне десним тастером миша на слику. Можете користити наслов атрибут за писање додатних информација о слици, али не рачунајте да ће ове информације бити сакривене или видљиво. Дефинитивно не бисте требали користити ово да бисте сакрили кључне речи за претраживаче. Већина претраживача ову казну сада кажњава.

усемап = ""
и.
исмап = ""
Ова два атрибута постављају на страни клијента () и на страни сервера (ИСМАП) мапе слика
лонгдесц = "Детаљнији опис ваше слике"
Тхе. лонгдесц

Застарели и застарели ИМГ атрибути

Неколико атрибута је застарело у ХТМЛ5 или застарело у ХТМЛ4. За најбољи ХТМЛ, требало би да пронађете друга решења уместо да користите ове атрибуте.

бордер = "3"
алигн = "лефт"
Овај атрибут вам омогућава да слику уметнете у текст и да текст прелази око ње. Можете поравнати слику удесно или улево. Застарело је у корист.
флоат ЦСС својство
хспцаце = "10"
и.
вспаце = "10"
Тхе. хспаце и. вспаце атрибути додају размак хоризонтално ( хспаце) и вертикално ( вспаце
ловсрц = "/ путања / до / ловрес.јпг"
Тхе. ловсрц атрибут пружа алтернативну слику када је извор слике толико велик да се преузима изузетно споро. На пример, можда имате слику величине 500 КБ, коју желите да прикажете на својој веб страници, али преузимање датотека требало би дуго времена. Тако креирате много мању копију слике, можда црно-белу или само изузетно оптимизовану, и ставите је у. ловсрц

Тхе ловсрц атрибут је додат ознаци Нетсцапе Навигатор 2.0. Био је део ДОМ нивоа 1, али је затим уклоњен са ДОМ нивоа 2. Подршка прегледача је за овај атрибут била неуобичајена, иако многе веб локације тврде да је подржавају сви савремени прегледачи. Није застарео у ХТМЛ4 нити застарео у ХТМЛ5, јер никада није био званични део било које спецификације.

Избегавајте употребу овог атрибута и уместо тога оптимизујте слике тако да се брзо учитавају. Брзина учитавања страница је пресудан део доброг веб дизајна, а велике слике изузетно успоравају странице - чак и ако користите ловсрц атрибут.

instagram story viewer