Обично при уређивању веб странице користимо одређени алат за уређивање, као што су Адобе Дреамвеавер, ЦоффееЦуп, Блуефисх или неки други алат за развој. Али шта је с тим да само размишљамо или желимо да испробамо нешто на страници уживо? Могли бисмо направити копију странице у нашем алату по избору и играти се са тим. Или бисмо то могли учинити у нашем веб претраживачу. Овај туториал ће вам показати како да уредите веб страницу у прегледачу.
Названи као Алати за развојне програмере, Фирефок назива функцију Инспецт Елемент, док је Цхроме назива Инспецт. Било како било, то је начин да прегледач завири иза сјаја вашег дизајна и погледа код који га покреће. Ова карактеристика је прилично позната и много се користи. Оно што није баш тако добро познато је могућност да се промене у том шифри у току.
Свака измена коју унесете неће бити сачувана и неће утицати на „ливе“. Ако не желите да учитате страницу у својој алатки за развојне програмере, ово је уредан начин експериментирања.
Уредите било коју веб страницу у прегледачу
Дреамвеавер и слични алати имају уграђени емулатор прегледача који симулира изглед дизајна у различитим прегледачима. Колико год били добри, нису увек тачни и често приликом покретања веб странице утврдите да оно што је изгледало фантастично у вашем алату за програмере изгледа мало другачије у самосталном прегледачу.
Обично бисте сајт покренули на унутрашњем веб серверу и тестирали у прегледачу пре него што сте управо из тог разлога лансирали уживо. Ако је страница већ активна или једноставно желите нешто да испробате, нема потребе да је копирате и учитавате у развојни алат, можете само да користите алатку за развојне програмере прегледача.
Користим Фирефок па ћу вам показати како то користити. Цхроме је много исти.
- Отворите веб страницу са којом желите да експериментишете у прегледачу.
- Кликните десним тастером миша било где на страници и изаберите Провери.
Требали бисте видети своју страницу подељену на два дела, при чему ће се на дну појавити ново окно с неким кодом. Овај код је покретачка снага странице коју сте одабрали. Различити елементи странице доступни су са картица на врху доње картице. На пример, у Фирефоку видимо инспектора, конзолу, исправљање погрешака, уређивач стилова и тако даље.
Ако покажете показивач преко линија у доњем окну, видећете различите делове истицања веб странице. Линија кода коју користите током означавања је код који утиче на тај део странице.
- Ако желите да се поиграте са изгледом странице, покушајте са Уређивач стилова.
- Ако желите да се поиграте са начином рада странице, испробајте Конзола или Приступачност.
- Ако желите отклонити грешке или решити проблем, користите Цонсоле или Дебуггер
Перформансе су корисне за СЕО на терену, али меморија, мрежа и складиштење се не користе толико.
Не заборавите да се унутар Алатке за програмере можете бркати колико год желите и то неће утицати на веб локацију. Све промене се врше само у начину на који се страница приказује у вашем појединачном прегледачу, на то не утичете на сам веб локацију. Једном када затворите алат, све промене се губе.
Уношење промена на страници
Сада знате да можете променити све што желите без утицаја на стварну веб локацију, хајде да се мало забавимо. На страници пронађите елемент који желите да уредите. Можете променити фонт, боју фонта, позадинску слику или шта год желите. У овом примеру ћу променити боју фонта наслова.
- Кликните десним тастером миша тачан елемент који желите да промените и изаберите Инспецт.
- Означите линију било са 'титле' или 'Х1' тако да је текст означен у горњем окну.
- Дођите до лијеве двије плоче и пронађите боју фонта.
- Промените вредност у нешто другачије или одаберите тачку боје да бисте користили селектор.
Промјена ће се појавити динамично док завршите промјену. Можете променити боју, величину, фонт, позадину и све о фонту. Не можете да сачувате дело, али промене ће остати за ту сесију.
Можете променити све о страници која је идеална ако имате идеју и желите да је брзо проверите пре активирања свих развојних апликација. Све што требате учинити је запамтити које сте промјене направили и гдје их не можете овдје сачувати. Морате да направите снимак заслона или снимите измене и поновите их у оквиру својих алата за развојне програмере како бисте их залепили.
Уређивање веб странице у прегледачу је уредан начин експериментирања или играња са страницама. То је такође добар начин да научите мало о веб развоју без потребе да купујете у скупе алате за програмере. Сада знате како, играјте се и играјте се!
