Kako postaviti pametne telefone i računala. Informativni portal
  • Dom
  • Windows 10
  • Web Developer za Firefox - instalacija i mogućnosti dodatka za dizajnere izgleda i webmastere. Kako instalirati rusku verziju Web Developera u Mozilla Firefox

Web Developer za Firefox - instalacija i mogućnosti dodatka za dizajnere izgleda i webmastere. Kako instalirati rusku verziju Web Developera u Mozilla Firefox

Web Developer Mozilla je nevjerojatno korisno proširenje. Instalira se u preglednike i blogeru donosi opsežne informacije o stanju stranica. U početku se ovaj dodatak mogao instalirati samo u Firefox, ali kasnije ga je isti autor, Chris Pederick, razvio za Chrome. Možete ga preuzeti i instalirati, u najnovijoj verziji, na engleskom jeziku.

Web programer mozilla ruska verzija

Za ruskog blogera moguće je instalirati ovo proširenje na ruskom, ali u ovom slučaju nije instalirana najnovija verzija, već prethodna - Web Developer 1.19.

Prvo, u postavkama preglednika Firefox instalirano je proširenje na engleskom jeziku. Idemo na karticu "dodaci". U novom prozoru s desne strane vidjet ćemo gumbe za nekoliko programa, uključujući "Web Developer". Uključimo gumb "postavke" nakon čega će se pojaviti prozor za postavke ovog alata.

Da biste omogućili ruski jezik, morate slijediti vezu do verzija. U novom prozoru odaberite broj 1.19 i kliknite gumb "dodaj u Firefox". Nakon ponovnog pokretanja preglednika, gornja ploča proširenja bit će na ruskom. Tada sve postaje jasno. Prvo učitajmo vašu stranicu i počnimo je analizirati pomoću brojnih opcija na gornjoj ploči.

Kada ponovno otvorite preglednik, ploča se ponovno pojavljuje na engleskom, tako da morate ponovo instalirati ruski jezik.

Web Developer mozilla onemogućuje neke značajke

U padajućem izborniku vidjet ćemo da možete onemogućiti brojne funkcije kako biste mogli vidjeti druga svojstva.

    • Ja onemogućujem "cache" i "small font", ali možete onemogućiti java script i druge funkcije.
    • “Klik na kolačiće” otvara veliku stranicu s popisom. Ovdje se pojedinačni kolačići mogu mijenjati ili brisati, ali za sada sam pogledao ne dirajući ništa. Nakon gledanja, zatvaram karticu i prelazim na sljedeće točke.
    • “CSS pogreške” - također otvara linije padajućeg izbornika. Stilovi se mogu onemogućiti. Ali želim ih vidjeti, pa kliknem na redak: CSS informacije. Kao rezultat, otvorio se list sa svim stilovima ugrađenim u temu, dodacima i widgetima, što je rezultiralo dugom web stranicom.

« Obrasci" - str Prilikom pregledavanja stranice, trake stranica, obrasci za pretplatu i pretraživanje bili su istaknuti bojom. Ova kartica je potrebna web majstorima prilikom izrade predložaka, jer postoji mnogo redaka s parametrima.

Web Developer mozilla - ostali paneli za ocjenu stranice

    • Grafika - prikaži atribute alt - opisi iznad slika su istaknuti. Možete pregledati sve stranice stranice i identificirati gdje nema opisa kako biste ih mogli ispraviti. Znamo veličinu slika, ali ovdje je navedena težina i broj slika. Meni je sve u redu - težina je mala, svaka slika je 3 kb. Pronađi oštećene slike - na glavnoj stranici - nije pronađeno. Otvara se poseban list s opisima svih slika, uključujući brojače i favicon. Kad sve pogledamo, isključite kućice.
    • Na informacijskoj ploči ima puno redaka. Kliknem na “prikaži id i klasu”, a linkovi su istaknuti na svom mjestu, odnosno na stranici. Ovo je vrlo impresivno jer su atributi naslova i ugniježđenje dokumenta prikazani u boji.
    • Težina dokumenta - stranica je otvorena, ali je u početku bila prazna. Morate malo pričekati za učitavanje. No, ubrzo se pojavljuju vrijedni podaci o težini pojedinih dionica. Velik broj skripti i njihova veličina su upečatljivi. Vrijedno je razmotriti kako se mogu smanjiti i smanjiti.
    • Linkovi s glavne stranice. Sve se uzima u obzir: naslov stranice, kategorije, label cloud oznake, slike, brojač, jvascript widgeti, komentari. Pokušao sam slijediti neke poveznice na stranice stranice. Adrese u komentarima su zatvorene, hvala, Međutim, broj veza se ne smanjuje zbog osobitosti Word Press koda, što je teško popraviti. Ukupno postoji 74 - 86 internih linkova, ali prema SEO pravilima njihov broj ne smije biti veći od 100.
    • Postoje informacije o meta oznakama početne stranice.

Informacije razne

    • Razno - sadrži: ravnalo, povećalo, html editor, skrivene elemente.
    • Obrisi - prikazuje granice naslova, poveznica i obrisa blokova. Možete istovremeno vidjeti obrise dva ili tri elementa stranice.
    • Dimenzije—pokazuje dimenzije prozora i područja za gledanje. Moguće je prilagoditi veličinu prozora i font pritiskom na tipke za povećanje i smanjenje.
    • Alati - izvršen je prijelaz na usluge validatora. Prilikom provjere sam pronašao puno CSS i HTMI grešaka. Na primjer, prvo se provjerava CSS, a zatim se nudi generirana ispravna stilska datoteka.
    • Na temelju ovog savjeta napravio sam sljedeće: aktivirao sam drugu, jednostavnu temu /nakratko/. Kopirao sam svoju datoteku sa stilovima, prebacio je u bilježnicu, spremio i izbrisao iz uređivača stranice. Preuzeo sam ispravnu datoteku s validatora i umetnuo je umjesto svoje.
    • Otišao sam na web stranicu. A što vidim s novim, ispravnim stilovima? Web stranica postoji, ali koja? Pogled je odvratan. Predložak je postao jedan stupac. Tekstovi se protežu od ruba do ruba, boja nema.
    • Stoga sam brzo vratio svoju datoteku s CSS greškama i sve je popravljeno. S druge strane, treba ispraviti greške u validaciji, ali to mi još nije dostupno.

Za preglednik Chrome

Web verzija. developer za preglednik Chrom, od istog autora, poboljšan i proširen. U usporedbi s proširenjem preglednika Mozilla, opcije su malo drugačije. Tekst je na engleskom, ali su neke početne stranice prevedene.

Bolje je kada osoba barem poznaje engleski jezik, jer je to neophodno na internetu. Nakon pregledavanja interneta. razvojni programer, poboljšavaju se ideje o strukturi bloga.

Analiza u ovoj ekstenziji mora biti stalna pa je preporučljivo da je svaki bloger instalira u preglednik. Barem kako bi se kontrolirao broj poveznica na svakoj stranici.

Stalno sam koristio Firefox. Prilično mi je odgovarao, posebno tijekom procesa razvoja i testiranja stranice. Isprobala sam ga odmah nakon što je izašao. Svidjela mi se brzina renderiranja stranice.

Ali nakon kratkog vremena vratio sam se Firefoxu zbog nedostatka ekstenzija i dodataka kao što su Google Page Rank i Webdev web developer panel. Sada nema problema, već ih ima veliki broj.

Dodatak FireBug za Firefox

Ovo je glavni dodatak za web programere. Možete uređivati, ispravljati pogreške, pregledavati CSS, HTML i JavaScript. Rezultat učinjenih promjena prikazuje se odmah. Dodatak FireBug vrlo je zgodan za traženje dijela koda odgovornog za prikaz određenog bloka na stranici i odgovarajućeg CSS stila.

Dodatak ima prekrasnu funkciju Inspect, pomoću koje možete vidjeti koje oznake i svojstva određuju položaj pojedinog elementa na stranici. Osim toga, na kartici Izgled možete vidjeti koje su margine i uvlake postavljene za ovaj element.


Ovaj dodatak je dodatak FireBugu. Pomoću njega možete jednostavno postaviti slike u svoj izgled i pogledati skicu kao da je u gotovom obliku. Da biste to učinili, morate odabrati slike i postaviti ih izravno na stranicu. Slike su prozirne i lako se povlače mišem.

Preuzmite dodatak Pixel Perfect za Firefox.

HTML Validator će pojednostaviti proces stvaranja valjanog HTML označavanja u skladu s web standardima. Sada nema potrebe ići na službenu stranicu validatora.


Dodatak detaljno prikazuje greške i točnu lokaciju, a također objašnjava kako popraviti tu grešku. Radi u pozadini i ugrađen je u stranicu za prikaz izvornog koda. Štedi puno vremena.

Pozdrav, dragi čitatelji bloga. Predstavljam vam još jedan članak, koji će biti posvećen razmatranju mogućnosti dodatka za Firefox () pod nazivom Web Developer.

Ovaj dodatak za preglednik Firefox () je vrsta švicarskog vojnog noža za webmastere, koji u svom sastavu ima mnogo značajki i alata.

Web Developer ni na koji način ne umanjuje prednosti onoga o čemu smo prethodno govorili, već ih uvelike nadopunjuje. Ako još niste dobro upoznati s mogućnostima Firebuga, možete pročitati o njemu koristeći priloženu poveznicu.

Instalacija i mogućnosti WebDevelopera

Moći ćete vidjeti kako je strukturiran Html obrazac koji vas zanima, promijeniti neke njegove parametre, primjerice, omogućiti prikaz unesenih znakova u poljima za lozinku ili pretvoriti GET zahtjeve u POST i obrnuto.

Ostali alati ovog sjajnog dodatka

U području "Grafika" postoje stavke koje će vam omogućiti da onemogućite prikaz slika (ili svih slika, ili samo preuzetih s vanjskih izvora, ili samo animiranih). Također možete jednostavno potvrditi okvire pored potrebnih stavki u izborniku "Grafika" za konfiguraciju prikaza pored slika informacija o sadržaju ALT atributa (alternativni tekst), kao i informacija o težini ove fotografije, njegovu veličinu u pikselima i put do datoteke sa slikom.

Također će biti moguće konfigurirati dodatak Web Developer da prikazuje obrise slika, pronalazi oštećene slike, prikazuje sažetak informacija o svim fotografijama na otvorenoj web stranici i, na primjer, konfigurira da umjesto toga prikazuje sadržaj atributa ALT.

U području "Informacije", ovaj dodatak može pružiti veliku količinu informacija o web stranici otvorenoj u pregledniku kao cjelini. Na ovom jelovniku ima puno stavki. Na primjer, aktiviranje stavke "Prikaži veličine blokova" rezultirat će odabirom svih blokova (DIV spremnika) na web stranici i prikazom njihovih točnih veličina u pikselima pored njih.

Također možete koristiti dodatak Web Developer za pregled strukture zaglavlja određene stranice, informacija o vezama na njoj i još mnogo toga.

Područje "Razno" koncentrira one značajke koje ne nalaze mjesto u drugim grupama alata. Zanimljiv iz ove grupe je “Vladar”, kada se aktivira imate priliku mjerenje udaljenosti između elemenata web stranice ili odrediti veličinu u pikselima određenog bloka.

Nakon što aktivirate ravnalo iz dodatka, kursor miša se pretvara u križić i možete pritiskom i držanjem lijeve tipke miša odabrati željeni element stranice. Ispod alatne trake za web programere na vrhu prozora preglednika Firefox nalazi se alatna traka ravnala koja će prikazati informacije o veličini odabranog područja.

Još uvijek postoji dosta zanimljivih i korisnih mogućnosti koncentriranih u području „Razno“. Na primjer, stavka “HTML Editor” otvara dodatni prozor s HTML kodom ove stranice. Sve promjene napravljene u njemu odmah će se odraziti u pregledniku. Vrlo prikladno za brze eksperimente s dizajnom web stranice. U ovom slučaju, naravno, neće biti napravljene nikakve promjene u stvarnim datotekama mehanizma web projekta.

Ali s druge strane, možete koristiti Web Developer za simulaciju različitih opcija za izradu određene stranice u stvarnom vremenu putem Firefoxa. Ako ste zadovoljni novom verzijom koda modeliranog pomoću nje, tada ćete morati unijeti izmjene u stvarne datoteke motora web stranice, koje možete pronaći koristeći opisanu metodu.

Područje Outlines uvelike će vam pomoći pri istraživanju elemenata dizajna web stranice. Aktiviranjem jedne ili druge stavke u izborniku "Obrisi", možete odabrati pojedinačne vrste njegovih elemenata na stranici, na primjer, elemente na razini bloka (DIV spremnici), elemente Html tablice (), okvire (članak je uživo) ili poveznice na stranici koje nemaju atribut Title. To uvelike poboljšava vidljivost izgleda.

Izbornik "Veličine" sadrži nekoliko opcija za kontrolu veličine prozora preglednika. Također možete postaviti prozor na proizvoljnu veličinu da vidite kako se ova stranica ponaša kada se naprave promjene.

Grupa "Alati" sadrži opcije za provjeru valjanosti (usklađenost sa suvremenim zahtjevima za web razvoj). Možete provjeriti valjanost HTML-a, CSS-a, WAI-a i odjeljka 508. Validacija se vrši putem online validatora od .

Dodatak se može konfigurirati odabirom stavke s istim nazivom u grupi alata "Postavke". Zaključno, želim reći da korištenjem mogućnosti Web Developera možete lako razumjeti kako je strukturirana ova ili ona web stranica koja vam se sviđa, a također će biti vrlo korisna pri izradi i uklanjanju pogrešaka na web stranicama.

Sretno ti! Vidimo se uskoro na stranicama bloga

Više videa možete pogledati ako odete na
");">

Moglo bi vas zanimati

SEObar - praktičan i informativan SEO dodatak za Operu
Firebug - kako koristiti najbolji dodatak za webmastere
CSS optimizacija i kompresija u Page Speed ​​​​- kako onemogućiti vanjske datoteke stilova i spojiti ih u jednu da ubrzate učitavanje
Traka Rds i traka Promotor stranice za pomoć webmasterima
Safari - gdje preuzeti i kako prilagoditi Appleov besplatni preglednik za Windows
Proširenja i teme za Google Chrome
Dodaci i teme za Mozilla Firefox - koje dodatke i proširenja vrijedi preuzeti i instalirati

Vlad Merzhevich

Iako je proširenje dostupno za dva različita preglednika, verzija za Firefox je ažurirana i redovito se ažurira, što se ne može reći za verziju za Chrome. Osim toga, podržava ruski jezik. Stoga će ubuduće opis biti samo za Firefox.

Instalacija je prilično jednostavna, samo posjetite web stranicu autora s preglednikom Firefox i kliknite "Preuzmi", nakon čega ćete biti prebačeni na stranicu gdje trebate kliknuti "Dodaj u Firefox" (Slika 7.1).

Riža. 7.1. Dodavanje u Firefox

Također možete otići izravno na stranicu s proširenjem.

Nakon dodavanja, pojavit će se prozor upozorenja (Sl. 7.2), kliknite gumb "Instaliraj sada" i postupak instalacije je završen.

Riža. 7.2. Instaliranje Web Developera

Drugi način za instaliranje različitih proširenja je korištenje izbornika Alati > Dodaci. U prozor za pretraživanje upišite "web developer", pritisnite Enter, dodatak koji nam je potreban pojavit će se na popisu ispod (Slika 7.3).

Riža. 7.3. Prozor dodataka za Firefox

Samo proširenje izgleda kao traka izbornika iznad kartica (Sl. 7.4), a dostupno mu je i putem izbornika Alati > Web Developer. Panel možete uključiti/isključiti putem izbornika Pogled > Alatne trake ili desnim klikom na ploču proširenja.

Riža. 7.4. Web programer u pregledniku

Prođimo kroz stavke izbornika Web Developer.

Onemogući predmemoriju

Onemogućuje ugrađenu predmemoriju preglednika. Preglednik obično sprema slike i kopije pregledanih stranica na vaš lokalni disk kako bi se uštedjelo vrijeme učitavanja. Kada se stranica ponovno otvori, preglednik uspoređuje lokalnu kopiju s originalom i ako se podudaraju, učitava se lokalna kopija. U nekim se slučajevima učitava lokalna verzija stranice, čak i ako se izvorna promijenila. Na primjer, postavke preglednika mogu se postaviti tako da svaka dva sata provjeravaju je li stranica spremljena u predmemoriju ažurirana na poslužitelju. Međutim, Firefox ne dopušta fino podešavanje predmemorije kao Opera.

Također možete osvježiti stranicu zaobilazeći predmemoriju pomoću kombinacije tipki Ctrl + F5; to podržavaju svi preglednici.

Java je programski jezik koji je razvio Sun Microsystems. Mali programi na ovom jeziku (zvani apleti) koriste se za proširenje funkcionalnosti web stranica. Firefox ima ugrađenu podršku za ovaj jezik, koja se može onemogućiti putem ove stavke izbornika. Ne radi u Firefoxu 3.6.

Onemogući JavaScript

Programski jezik dizajniran za pokretanje skripti - programa integriranih s web stranicom. JavaScript se široko koristi pri izradi web stranica za proširenje njihove funkcionalnosti, na primjer, stvaranje raznih izbornika, obrazaca, efekata itd. Ako odaberete Onemogući JavaScript > Potpuno, tada će sve funkcije na stranici prestati raditi. Ova stavka izbornika može se koristiti za testiranje rada stranice bez skripti, kao i za zaobilaženje raznih ograničenja koja postavljaju autori stranice, poput onemogućavanja desne tipke miša. Web Developer kaže da nema ograničenja koja se ne mogu zaobići.

Onemogući META preusmjeravanje

Korištenje oznake Možete automatski preusmjeriti na određeni dokument nakon određenog vremenskog razdoblja. Za to se koristi oznaka i vrijednost Refresh atributa http-equiv (Primjer 7.1).

Primjer 7.1. Automatsko prosljeđivanje

Prosljeđivanje

Prosljeđivanje se može koristiti u chatovima za ažuriranje trenutnog dokumenta ili preusmjeravanje na novu adresu. Ali također se koristi sa zlonamjernim namjerama, na primjer, u svrhu čestog prikazivanja kontekstualnog oglašavanja ili bannera. Ova stavka izbornika omogućuje blokiranje takve oznake .

Onemogući minimalnu veličinu fonta

U postavkama Firefoxa možete postaviti minimalnu veličinu fonta; ona će se koristiti za tekst koji je manji od navedene veličine. To vam omogućuje da pregledavanje stranica učinite lakšim za čitanje, posebno na stranicama gdje je tekst prikazan fontom koji je premalen za udobno čitanje.

Za postavljanje minimalne veličine fonta odaberite iz izbornika Alati > Postavke..., otvorite ploču Sadržaj i kliknite gumb Napredno u grupi Fontovi i boje. Možete odabrati minimalnu veličinu fonta iz padajućeg izbornika Najmanja veličina slova.

Web Developer vam omogućuje da brzo omogućite ili onemogućite ovu značajku. Međutim, ako minimalna veličina fonta nije navedena u postavkama, ova stavka ni na koji način ne utječe na rezultat.

Onemogući boje stranice

Isključuje sve boje određene svojstvom pozadine ili boje pozadine. To također utječe na pozadinske slike koje su postavljene pomoću pozadine.

Onemogući blokator skočnih prozora

Skočni prozori obično se koriste za oglašavanje, pa su obično blokirani i nedopušteni u preglednicima. Ova stavka omogućuje brzo uključivanje i isključivanje ove opcije.

Onemogući proxy

Proxy se obično shvaća kao poslužitelj ili program koji vam omogućuje povezivanje s internetom, kao iu svrhu kreiranja zahtjeva u ime drugih klijenata. Ako u postavkama Firefoxa ( Alati > Postavke.., Napredna ploča, kartica Mreža, gumb Konfiguriraj) je "Koristi postavke proxyja sustava", tada je ova stavka neaktivna.

Onemogući preporuke

Referrer je jedno od zaglavlja HTTP protokola i omogućuje vam da dobijete adresu stranice s koje je korisnik došao na stranicu. Ako ste zabrinuti za sigurnost svojih podataka, omogućite ovu stavku.

Kolačići ili kolačići kako se u žargonu nazivaju male su tekstualne datoteke na vašem lokalnom računalu koje pohranjuju informacije korisne za web stranicu. Pomoću kolačića možete zapamtiti ime korisnika, status i druge informacije koje se koriste na stranici. Firefox postavlja postavke kolačića putem izbornika Alati > Postavke..., Ploča privatnosti. Iz sigurnosnih razloga općenito možete onemogućiti prihvaćanje kolačića sa stranica.

Sami kolačići su skup nekih parametara:

  • jedinstveno ime;
  • značenje;
  • put - slanje kolačića samo ako se put i adresa stranice podudaraju, put “/” označava bilo koju stranicu;
  • domena - za koju adresu web stranice je unos relevantan;
  • datum isteka - govori pregledniku kada se kolačići mogu izbrisati.

Onemogući kolačiće

Onemogućuje prihvaćanje kolačića s web-mjesta.

Izbriši kolačiće sesije

Kolačići se često koriste za provjeru autentifikacije korisnika. Nakon unosa vašeg imena i lozinke, generira se jedinstveni kod koji se sprema u kolačiće. Kada ponovno posjetite stranicu, ovaj kod se provjerava i ako odgovara kodu poslužitelja, tada stranica "prepoznaje" korisnika. Odabirom ove stavke brišu se sve spremljene sesije.

Brisanje kolačića za domenu

Briše sve kolačiće za stranicu koja je trenutno otvorena u pregledniku.

Uklonite kolačiće za put

Briše sve kolačiće za stranicu čija se putanja podudara s putanjom stranice otvorene u pregledniku.

Informacije o kolačićima

Otvara se dodatna stranica na kojoj su u tabelarnom obliku prikazani svi kolačići s ove stranice. Njihove postavke mogu se uređivati ​​ili se kolačići mogu u potpunosti izbrisati (Slika 7.5).

Riža. 7.5. Informacije o kolačićima s youtube.com

Dodajte kolačiće

Omogućuje vam da umjetno postavite kolačiće za trenutnu stranicu ili bilo koju drugu, kao i da postavite potrebne parametre (Sl. 7.6).

Riža. 7.6. Prozor za dodavanje

Dodavanje je obično potrebno za otklanjanje pogrešaka u radu kolačića i ponašanju stranice ako su prisutni.

CSS

Ovaj izbornik je odgovoran za stilove trenutne stranice.

Onemogući stilove

Dizajniran za onemogućavanje stilova na temelju bilo kojeg kriterija.

Svi stilovi

Onemogućuje sve stilove koji se koriste na stranici.

Zadani stil preglednika

Onemogućuje stil za sve elemente kojima ga prema zadanim postavkama dodaje preglednik. Na primjer, tekst unutra

I

Ima različite veličine.

Naslov

Nakon isključivanja stila, veličina teksta ovih elemenata bit će ista.

Ugrađeni stilovi

Onemogućuje stil unutar oznake