Navigacija
Lista poslednjih: 16, 32, 64, 128 poruka.

Korisni alati u izradi web sajtova

[es] :: Web dizajn i CSS :: Korisni alati u izradi web sajtova
(TOP topic, by Aleksandar Ružičić)

[ Pregleda: 14947 | Odgovora: 10 ] > FB > Twit

Postavi temu Odgovori

Autor

Pretraga teme: Traži
Markiranje Štampanje RSS

Aleksandar Ružičić
Software Architect, Appricot d.o.o.
Beograd

Član broj: 26939
Poruke: 2881

Jabber: krckoorascic@gmail.com
Sajt: krcko.net


+44 Profil

icon Korisni alati u izradi web sajtova26.01.2009. u 23:48 - pre 184 meseci
FireBug extenzija za Firefox:

Definitivno broj 1 alat koji svaki ozbiljan web developer mora da koristi. Ova ekstenzija ce vam visestruko olaksati rad i vrlo brzo ce postati vas neizostavan alat u izradi web sajtova (ako vec nije :D). Necu mnogo opisivati firebug jer ima malo ljudi koji nisu culi za isti, a za one koji ga nisu do sada koristili postoji detaljno objasnjenje na sajtu firebug-a.

Neke od (po meni) najvaznijih opcija koje firebug pruza su:

- odlicna konzola (moze da prikaze javascript/css greske/upozorenja, rezultate xmlhttprequest upita, dostupna je iz javascripta a i iz server side jezika, pomocu ekstenzije)
- mocan html inspector (prikazuje renderovan DOM, live update, lociranje elemanata u dom-u je vrlo jednostavno - desni klik -> inspect element, ili klik na inspect dugme -> klik na zeljeni element)
- detaljan prikaz css-a (ima mogucnost prikazivanja computed stila), uz dinamicko editovanje istog (vrlo korisno)
- vrlo dobar javascript debugger + js profiler
- DOM inspector u kombinaciji sa html inspectorom i konzolom predstavlja zaista mocan debugging alat
- Net panel - odlican pregled svih upita koje browser pravi prilikom ucitavanja vaseg sajta, request/response headeri su takodje dostupni

(izgleda da nabrojah 90% onoga sto fb pruza out-of-the-box :D)

i naravno sve to nije uvek dovoljno pa zato za FireBug postoji i dosta ekstenzija (po mojoj slobodnoj proceni to je ekstenzija sa najvise ekstenzija :D), evo nekih od njih:


YSlow

Odlicna ekstenzija koja ce vam pomoci da optimizujete web sajt za brze ucitavanje (samo postujte nekoliko pravila koja YSlow preporucuje i vrlo lako mozete da napravite sajt koji se vrlo brzo ucitava)


FirePHP

Ukoliko se bavite i server-side developmentom (u php-u) ova ekstenzija ce vam biti od velike koristi, pomocu nje (i male php biblioteke) mozete da logujete debug podatke u firebug konzolu, izmedju ostalog moguce je logovanje objekata/nizova, trejsovanje poziva funkcija, output tabela...


Firecookie

Takodje veoma korisna ekstenzija za server-side developere, pomaze u pracenju kukija...


Rainbow For Firebug

Ova ekstenzija dodaje syntax-highlighting u script tab firebug-a (korisno ako debagujete javascript)


Postoji jos mnogo extenzija za firefox u kategoriji "web development" ali ja osim firebug-a ne koristim nista vise (mozda je jos jedino web developer ekstenzija vredna pomena)


Sto se tice drugih browsera, tu je ponuda slicnih resenja daleko manja (ili nikakva), ovde cu navesti neke koje povremeno koristim (nazalost firebug ne moze da resi sve probleme)


Opera Dragonfly

Dragonfly nisam koristio mnogo, ali za ono kratko vreme za koje sam ga testirao ovo je proizvod odmah iza firebuga, nudi skoro sve sto i firebug i nezamenljiv je alat za razvoj na operi. (ali kako taj browser ne koristim, i relativno retko testiram sajtove u njemu i nemam neku veliko potrebu za debugging alatom za taj browser)


Internet Explorer Developer Toolbar

Jos jedan pandan firebug-u, ovaj put za IE i od majkrosofta. Nazalost moram da kazem da je ovo vrlo traljavo odradjen plugin ali je najbolji za ie 6/7 i moze da pomogne u otkrivanju razloga zbog kojih se lejaut raspada u internet exploreru (naravno predhodno morate da se naviknete da veoma los ui samog plugina)


Internet Explorer 8 Developer Tools

Ovo je najavljeno za IE8 (bice deo browsera, ne plugin) a iz onoga sto se moze videti na msdn-u (nikako da nadjem vremena da isprobam ovo, ali cu morati) moram da priznam da ovo obecava, interfejs je veoma nalik na firebug-ov (sto je svaka pohvala za majkrosoft), a i odlican javascript debugger se ocekuje (btw javascript debugger u visual studio web developer okruzenju je po meni najbolji i najsveobuhvatniji javascript debugger koji trenutno postoji - js debugger je jedina stvar koja je firebugu slabija tacka)


Za Safari i Chrome postoji tzv "Develop menu" koji pruza neke od opcija koje su dostupne u navedenim pluginovima, daleko od toga da su development alati unutar ova dva browsera (zapravo unutar webkita, zajednickog rendering engine-a) nekorisni, ali su jos uvek daleko od konkurencije (mada google najavljuje state-of-the-art development alat u chrome-u ali on jos uvek nije video svetlo dana, bar ne neka stabilna i korisna verzija)



Ukoliko mislite da je neki alat vredan pomena ne ustrucavajte se da to podelite sa nama u ovoj temi.
 
Odgovor na temu

snake_master
Čačak

Član broj: 18087
Poruke: 402
82.208.198.*

Sajt: Trenutno nemam:)


+2 Profil

icon Re: Korisni alati u izradi web sajtova26.01.2009. u 23:53 - pre 184 meseci

Bravo za temu!!! Odlično napisano.
 
Odgovor na temu

kazil
Robert Bašić
Full time PHP dev :)
Bačka Topola - Novi Sad

Član broj: 120044
Poruke: 686
*.dynamic.stcable.net.

Jabber: robertbasic@elitesecurity.org
ICQ: 446475288
Sajt: robertbasic.com


+2 Profil

icon Re: Korisni alati u izradi web sajtova27.01.2009. u 00:16 - pre 184 meseci
Kad smo vec kod plug-inova za browsere:

Svi za FF:

Colorzilla: https://addons.mozilla.org/en-US/firefox/addon/271
Eyedropper za odabir boja sa bilo kog elementa sa stranice.

MeasureIt: https://addons.mozilla.org/en-US/firefox/addon/539
Lenjir.

Live HTTP Headers: https://addons.mozilla.org/en-US/firefox/addon/3829
Za pracenje HTTP header-a.

FireShot: https://addons.mozilla.org/en-US/firefox/addon/5648
Za pravljenje screenshot-ova stranica.

Edit: Izbrisao FireCookie, nisam video da je Aleksandar vec postavio.
 
Odgovor na temu

Nemke_BG

Član broj: 163822
Poruke: 341
91.148.82.*

Jabber: Nemke_BG@elitesecurity.org
Sajt: https://www.nmdesign.rs


+45 Profil

icon Re: Korisni alati u izradi web sajtova27.01.2009. u 19:24 - pre 184 meseci
evo i nekoliko od mene...cini mi se da ih niko nije vec spomenuo......

Za FF:

Web Developer

IE Tab

Za IE:

ieHTTPHeaders
...
 
Odgovor na temu

Nemke_BG

Član broj: 163822
Poruke: 341
*.bg.krstarica.net.

Jabber: Nemke_BG@elitesecurity.org
Sajt: https://www.nmdesign.rs


+45 Profil

icon Re: Korisni alati u izradi web sajtova10.09.2009. u 08:19 - pre 177 meseci
Razvoji alati za cross - browser testiranja, obavezno instalirati oba iz razloga sto umeju da zabaguju kad prikazuju stranice, takodje obavezno proveriti izgled iz pravog IE posle zavrsetka izrade stranice cisto iz sigurnosti ali u 99% slucajeva sve ce biti ok.

IE Tester

Omogućava pregled web stranica iz više verzija Internet Explorer - a i to IE 5.5, IE 6, IE 7 i IE 8.0

http://www.my-debugbar.com/wiki/IETester/HomePage

Internet Explorer Collection

Omogućava pregled web stranica iz više verzija Internet Explorer - a i to IE 1.0, IE 1.5, IE 2.01, IE 3.0, IE 4.01, IE 5.01, IE 5.5, IE 6.00.28, IE 6.00.29, IE 7.0 i IE 8.0

http://finalbuilds.edskes.net/iecollection.htm
...
 
Odgovor na temu

Stefan Jocic
System Administrator

Član broj: 177868
Poruke: 1299
93.86.54.*

ICQ: 409508405


+27 Profil

icon Re: Korisni alati u izradi web sajtova10.09.2009. u 14:03 - pre 177 meseci
Pregled web stranica u više browsera online: http://browsershots.org/
 
Odgovor na temu

yandex
Beograd

Član broj: 244639
Poruke: 18
*.adsl-a-1.sezampro.yu.



+2 Profil

icon Re: Korisni alati u izradi web sajtova19.08.2010. u 03:08 - pre 165 meseci
FireBug Lite za google chrome je izasao skoro!
 
Odgovor na temu

temuchin
Beograd

Član broj: 180842
Poruke: 35
*.adacta.rs.



+3 Profil

icon Re: Korisni alati u izradi web sajtova24.08.2010. u 12:07 - pre 165 meseci
Ja cu se samo nadovezati na prvi post.

Lep pregled firebug ekstenzija : http://getfirebug.com/wiki/index.php/Firebug_Extensions
 
Odgovor na temu

Stefan Jocic
System Administrator

Član broj: 177868
Poruke: 1299
*.dynamic.isp.telekom.rs.

ICQ: 409508405


+27 Profil

icon Re: Korisni alati u izradi web sajtova30.09.2011. u 23:13 - pre 152 meseci
GradientApp je mala, ali veoma korisna aplikacija za vizuelno generisanje gradient-a i generacije odgovarajućeg CSS3 koda. Štedi vreme definitivno.

Prikačeni fajlovi
 
Odgovor na temu

srdjann92
Srdjan Novakovic
Ucenik
Budva, Crna Gora

Član broj: 285213
Poruke: 11
*.crnagora.net.

Sajt: www.sstudio.me


+1 Profil

icon Re: Korisni alati u izradi web sajtova14.02.2012. u 03:09 - pre 147 meseci
Veoma korisni alati, hvala puno...
Web dizajn studio S, Crna Gora www.sstudio.me www.preduzeca.me
www.soglasi.net
 
Odgovor na temu

Nemke_BG

Član broj: 163822
Poruke: 341
*.dynamic.sbb.rs.

Jabber: Nemke_BG@elitesecurity.org
Sajt: https://www.nmdesign.rs


+45 Profil

icon Re: Korisni alati u izradi web sajtova16.09.2012. u 13:24 - pre 140 meseci
http://www.colorzilla.com/gradient-editor/

Online generisanje gradijenta sa podrskom za IE. U slucaju da su kompleksni gradijentu u pitanju (radijalni, sa vise tacaka...), za IE generise fallback jednostavne gradijente.

Firecookie - vise nije potreban, sad je integrisan u firebug (KONACNO!)
...
 
Odgovor na temu

[es] :: Web dizajn i CSS :: Korisni alati u izradi web sajtova
(TOP topic, by Aleksandar Ružičić)

[ Pregleda: 14947 | Odgovora: 10 ] > FB > Twit

Postavi temu Odgovori

Navigacija
Lista poslednjih: 16, 32, 64, 128 poruka.