-
Причали смо о зечевима
-
све ово време,
описујући их кроз пасусе и листе,
-
али, могли бисмо ставити
и слику на нашу веб страницу
-
и заправо приказати како зечеви изгледају.
-
Па, да би ставили слику на веб страницу,
користимо IMG таг,
-
који, као што можете погодити,
потиче од речи слика (енгл. image).
-
Ако само укуцамо "image"
нећемо видети ништа.
-
Зашто не?
-
Па, нисмо претраживачу рекли
коју слику да прикаже.
-
Постоји милион слика на интернету,
-
и сигурно не желимо
да се нека изабере насумице,
-
пошто то може бити нека ружна
која нам се не свиђа.
-
И то такође неће бити
оно што желимо да буде.
-
Треба да претраживачу
проследимо URL слике.
-
URL је оно што се прикаже на врху
-
претраживача у адресном пољу.
-
И то је оно што то јесте - адреса.
-
То је начин за проналажење
неког ресурса на вебу.
-
И то значи да можемо
убацити само ону слику
-
која се већ налази негде на интернету.
-
Не можемо просто да убацимо слике
које су само на нашем рачунару.
-
Постоји много начина
да пронађемо слике на интернету,
-
али смо вам ми то овде олакшали
-
тако што смо направили бирач слика
из колекције фотографија.
-
Да би он искочио, треба да додамо
-
један атрибут нашем тагу за слику.
-
Атрибут је додатно парче
-
информације о тагу и ово је
-
први атрибут са којим се сусрећемо.
-
Да бисмо претраживачу рекли URL, ми ћемо
-
додати атрибут назван:
извор (енгл: source, src).
-
И додаћемо размак и онда откуцати SRC.
-
Сада, то значи извор (енгл: source),
али је јако важно
-
да га укуцате као SRC,
пошто ће претраживач
-
то игнорисати, ако погрешимо у писању.
-
Сада, треба да ставим
један знак једнакости како би рекла
-
претраживачу која је вредност атрибута.
-
И сада ћу додати наводнике, а едитор ће
-
аутоматски додати завршне наводнике,
-
како би вредности атрибута увек биле
уоквирене дуплим наводницима.
-
У реду, дакле, сада би иначе почели
да уносимо наш URL,
-
али овде на Кхан Академији, тада ће
-
наш бирач слика искочити.
-
Само ћемо изабрати слику,
а желим слику зеца,
-
тако да ћу кликнути на
картицу животиња и изабраћу
-
овог неодољивог зеца и кликнути OK.
-
Видите ли како је ту URL
унутар наших наводника?
-
И видите ли како тај URL почиње са http?
-
То је како знамо да показује
-
на неку слику негде на интернету.
-
И хеј! Видите, ено га зека
на мојој веб страници!
-
Али шта да је сервер
који складишти ту слику у квару,
-
и да претраживач не може је учита?
-
Како би посетилац знао шта је
на мојој феноменалној слици?
-
Не би видели ништа и питали би се остатак
-
својих живота шта су то пропустили.
-
Баш због тога таг за слику
поседује други атрибут - ALT,
-
који користимо да претраживачу кажемо
-
који је алтернативни текст за слику.
-
Да додамо други атрибут,
само ставимо размак
-
после завршних наводника последњег.
-
Затим пишемо ALT,
знак једнакости, наводнике,
-
а унутар ових наводника, текст ће бити
-
неки помоћни опис за слику
-
попут "зец са спуштеним ушима у амбару."
-
То такође помаже људима
који виде веб странице
-
али их не могу заиста видети,
попут слепих.
-
Они користе апликацију
која се назива читач екрана,
-
који им буквално чита веб страницу,
-
описујући сваки таг који види.
-
Када она види таг за слику,
прочитаће алтернативни текст
-
пошто слепа особа не може да види слике.
-
Дакле, требали бисте увек,
увек користити алтернативни текст,
-
како би цео свет могао искусити
вашу веб страницу.
-
У реду, вратимо се на слику
коју можемо видети.
-
Мало је велика.
-
Хајде да јој променимо величину.
-
Можемо урадити то са више атрибута.
-
Са нашом ширином или висином.
-
Рецимо, "ширина је једнака 100."
-
У реду, дакле, сада је широка 100 пиксела.
-
То је малчице премало.
-
Ставимо наш курсор унутра и искористимо
-
мењач броја да је начинимо већом.
-
У реду, то изгледа много боље.
-
Сада, покушајмо да додамо висину.
-
Само ћу рећи, "висина је једнака са 50."
-
Ух-ох!
-
Згњечила сам мог зеку, јадни зека!
-
Видите, зато бисте иначе
требали само да наведете
-
или ширину или висину, али не обоје.
-
Јер можете унети погрешне димензије
-
и тако згњечити ваше зеке.
Тако да ћу ја једноставно
препустити претраживачу
-
да уради математику и одлучи
колика треба да буде друга димензија.
-
Обрисаћу висину.
-
Сада када можете да правите слике,
почните да размишљате
-
о комбиновању свих тагова
које имате у кутији са алатима.
-
Листе са сликама и пасусима,
топ 10 најлуђих животиња...
-
Само немојте ставити превише
слика на вашу страницу,
-
пошто ће особа
која вам посећује страницу
-
морати да учита све њих.
-
Али, и даље се можете пуно забавити!