5 užitečných vývojářských doplňků pro prohlížeče

Napsal(a) Napsáno pátek, 07 listopad 2014 Zveřejněno v Nástroje Přečteno 4293 krát
Ohodnotit tuto položku
(1 Hlasovat)

Vytváříte nebo upravujete web? Pak se vám budou hodit vývojářské doplňky pro Mozilla Firefox a Google Chrome. Tyto nástroje dokáží zrychlit práci i odhalit chyby ve zdrojovém kódu.

Chcete vědět, co tyto doplňky dokáží? Čtěte dál.



Firebug

Doplněk pro: Mozilla Firefox

Asi nejznámější vývojářský doplněk pro Firefox. Zobrazí zdrojový kód a přímo na stránce označí vybraný element (nebo opačně, po kliknutí na ikonku šipky si na stránce označíte příslušný blok a Firebug vám vypíše jeho kód). Ve standardním režimu je zobrazený HTML kód a vedle CSS styly.

firebug

Kód můžete navíc ve Firebugu přímo editovat. Libovolně si můžete přepisovat hodnotu pixelů v CSS stylech, či názvy tříd v HTML. Výsledek vidíte ihned přímo na stránce - snadno si tedy ve Firebugu změníte např. šířku bloku. Pokud jste s výsledkem spokojeni, provedete změny i ve vaší šabloně.

Kromě HTML a CSS vám Firebug přehledně vypíše i skripty, elementy DOM, či Cookies.

Web Developer

Doplněk pro: Mozilla Firefox

Dalším základním rozšířením je Web Developer. Chcete urychleně vypnout Javascript, či zakázat styly? Můžete. A získáte spoustu dalších funkcí, např:

  • Zobrazení alternativního popisku obrázku (ALT).
  • Vypnutí obrázků.
  • Zobrazení cesty obrázku.
  • Informace o velikosti obrázku.
  • Informace o všech odkazech na stránce.
  • Smazání, či zobrazení informací o Cookies.
  • Informace o formulářích
  • Nastavení velikosti okna pro různá rozlišení - předdefinovaná jsou:
    • 1024 x 768
    • rozlišení pro tablety
    • rozlišení pro mobilní telefony.

web developer

S Web Developerem si můžete vzhled vaší stránky zobrazit např. tak, jak ji vidí vyhledávací roboti, nebo handicapovaní uživatelé. Bez stylů a obrázků. Navíc přináší řadu užitečných nástrojů, např.:

  • Pixelové pravítko - chcete si na stránce ihned změřit např. rozměr hlavičky? Žádný problém.
  • Lupa.
  • Kontrola validního kódu - HTML, CSS.

Tag Assistant

Doplněk pro: Google Chrome

Skvělé rozšíření přímo od Google. S tímto pomocníkem si snadno ověříte, zda-li vám skript na stránce funguje správně (musí patřit ke službě od Google).

Tag Assistant využijete především při ověřování správné implementace pro.:

  • Google Analytics
    • vypíše vám i verzi (Google analytics či Universal Analytics)
    • pokud máte u e-shopu zavedené E-Commerce, můžete si otestovat správnou funkčnost
  • Google Tag Manager
  • Google Adwords - měření konverzí
  • Google Adwords - remarketingový kód

 tag assistant

Pokud je něco špatně, Tag Assistant vypíše chybu, případně doporučení na vyladění kódu.

V nastavení rozšíření si můžete určit např. detailnost výpisu, nebo rovnou vypsat seznam webů, které chcete ověřit.

Page Ruler

Doplněk pro: Chrome

Potřebujete si změřit velikost bloku, či obrázku přímo na stránce? Žádný problém. Page ruler je pixelové pravítko, které u zvoleného objektu měří:

  • šířku
  • výšku
  • odsazení zleva
  • odsazení zprava
  • odsazení zespoda.

Page Ruler

Na výběr máte ze dvou režimů:

  • Klasický
    • Metodou drag and drop si kdekoli na stránce označíte místo a Page Ruler ho změří.
  • Element Mode
    • Myší si volíte jednotlivé bloky na stránce a nástroj vám je měří.
    • Zároveň vypisuje příslušné třídy a identifikátory - v tomto bodě je podobný Firebugu.

Awesome Screenshot

Doplněk pro: Mozilla Firefox

Potřebujete vytvořit screeenshot celé stránky nebo její části? Zkuste Awesome Screenshot. Na vámi zvolené stránce klikněte na ikonku doplňku a zvolte jednu z možností:

  • Capture Visible Part - screenshot pouze viditelné části
  • Capture Full page - screenshot celé stránky

Funkce Discover Similar Sites vyhledává weby obsahově příbuzné vámi zvolenému. Příklad: ke Google.cz vám doplněk nabídne mj. Seznam.cz, či Centrum.cz.

V nastavení doplňku si můžete zvolit formát obrázku (PNG nebo JPG), příp. upravit klávesovou zkratku k vytvoření screenshotu.

Jakmile screenshot vytvoříte, zobrazí se vám panel nástrojů. Můžete do obrázku psát, či označovat obdélníkem nebo elipsou důležité věci -> nástroj se perfektně hodí i pro tvorbu návodů. Navíc máte k dispozici i "zamazávátko", které využijete k zakrytí např. fakturové částky, či názvu účtu.

Awesome Screenshot

Nakonec kliknete na tlačítko "Done" a obrázek si uložíte.

Doporučení

Nezapomeňte, že kódováním vše teprve začíná. Aby vaše stránky "chutnaly" vyhledávacím robotům, vyzkoušejte též SEO doplňky.

Vyzkoušeli jste tato rozšíření? Nebo používáte jiné? Podělte se o svoje zkušennosti v komentářích.



Naposledy změněno pondělí, 10 listopad 2014 09:49

Zaujal Vás tento článek? Sdílejte ho a šiřte dál...

Lukáš Kolovrat

V roce 2012 jsem absolvoval FIM na Univerzitě v Hradci Králové. Nyní pracuji ve firmě WebPrezent, kde mám na starosti PPC systémy a analytické práce. Jednou za čas si pohraji i s HTML a CSS. A taky jsem získal čestnou funkci redaktora WebZpravodaje.

 



Warning: Creating default object from empty value in /pub/jiranwa/webzpravodaj.cz/web/www/plugins/system/t3/includes/joomla25/modulehelper.php on line 177

Komentáře   

 
MonikaJuicy
0 # MonikaJuicy 2018-11-25 06:30
Hi. I see that you don't update your website too often. I know that writing
content is time consuming and boring. But did you know that there is a
tool that allows you to create new posts using existing content (from article directories or other blogs from your
niche)? And it does it very well. The new articles are high quality and pass the copyscape test.

Search in google and try: miftolo's tools
Odpovědět | Odpovědět citací | Citovat
 
 
007카지노주소
0 # 007카지노주소 2019-11-28 02:59
Hmm is anyone else having problems with the images on this blog loading?
I'm trying to find out if its a problem on my end
or if it's the blog. Any feedback would be greatly appreciated.


my homepage - 007카지노주소
Odpovědět | Odpovědět citací | Citovat
 
 
nhvwmtroum
0 # nhvwmtroum 2020-04-02 16:40
mom gives son viagra female viagra lady era pills viagra 100mg lyons drug viagra female viagra pranks are they staged

pfizer viagra generic viagra starting today viagra vs cialis reaction to viagra black market viagra prices

https://pharm-usa-official.com - viagra samples

http://www.cityup.org/bbs/space-uid-327931.html
http://web.syekhnurjati.ac.id/as/2019/12/18/jadwal-uas-ganjil-t-a-2019-2020/?unapproved=2581&moderation-hash=5a1e42310f496f09154ea2cace254568#comment-2581
http://www.aryandigitalseva.com/pmgdisha-news/how-to-update-pmgdisha-rd-service-morfho-setting/?unapproved=47018&moderation-hash=c6583ca895d4eb020845fe2552ac3dc4#comment-47018
http://www.cityofrefugefellowship.org/philippians-series-bridges-of-joy-from-contentment-to-martyrdom/?unapproved=177466&moderation-hash=3499355ce986ebae73ca1f49da70e243#comment-177466
http://barracuda.by/forum/viewtopic.php?f=7&t=229408
Odpovědět | Odpovědět citací | Citovat
 
 
giykntroum
0 # giykntroum 2020-04-03 19:08
viagra prices walmart best cheap viagra pharmacies canadian levitra vs viagra how to make viagra work better chinese natural viagra

viagra dosnt work now what online viagra [url=https://ph arm-usa-officia l.com/# #]cheap viagra mandy flores accidetal viagra/hamsterr new white viagra

https://pharm-usa-official.com - female viagra

http://forum.digilyze.info/viewtopic.php?f=2&t=228472&p=631705#p631705
http://www.icolorcn.cn/home.php?mod=space&uid=1045222
http://senclic.com/politique/presidentielle-cellou-dalein-diallo-soutient-macky-sall-conde/?unapproved=1923558&moderation-hash=bf033e53175a58ae87419fe85eed23c9#comment-1923558
https://www.7television.fr/aya-nakamura-recalee-de-danse-avec-les-stars/?unapproved=497420&moderation-hash=651732a9b31b668af57aabcf19b0e5ff#comment-497420
http://vuanh.com.vn/thiet-bi-tin-hoc/hop-muc-inmax-35a/#comment-675453
Odpovědět | Odpovědět citací | Citovat
 
 
heayttroum
0 # heayttroum 2020-04-06 03:31
how long viagra to work did pfizer raise viagra again viagra dosage teva's generic viagra viagra reddit

mother helps viagra boner cialis vs viagra dosage comparison viagra 100mg i accidentally gave my stepson viagra ekg before prescribing viagra

https://viagrnetwork.com/# - cialis vs viagra
Odpovědět | Odpovědět citací | Citovat
 
 
zvtpctroum
0 # zvtpctroum 2020-04-08 00:18
sildenafil citrate generic viagra 100mg viagra multiple cums viagra boner pfizer viagra pills for sale viagra 100mg

online viagra without a perscription true stories about viagra side effects buy viagra dick pics on viagra can i take flomax and viagra at the same time

https://viagrnetwork.com/# - viagra prices


https://zanadu.ru/showthread.php?t=445494&p=811823&posted=1#post811823
http://188.128.165.51/forum_Asdasd/viewtopic.php?f=25&t=541689&p=1245978#p1245978
https://www.rewity.com/forum/t175082-387.html#post14788646
https://selana.pl/sklep/bizuteria/bransoletki/bransoletki-srebrne/srebrne-bransoletki-sztywne/polsztywna-z-cyrkoniami-26821/?unapproved=738700&moderation-hash=741528d8cd80334e63f6c2c437a2a0cf#comment-738700
https://danielbraune.com.br/quem-perdeu-foi-voce-jo/?unapproved=11570&moderation-hash=6d282b9ee13ca47aa1555c17e6b385a0#comment-11570
Odpovědět | Odpovědět citací | Citovat
 
 
yghhrtroum
0 # yghhrtroum 2020-04-08 23:11
personal loans quick private lenders funding quick loans no collateral no up front fees no vredit checks quick loans quick payday loans wichita ks quick installment loans online

quick online loans direct lender quick loans payment center [url=http://sho p-wavin.ru/ ]quick loans quick online loans direct lender quick cash loans nm
Odpovědět | Odpovědět citací | Citovat
 
 
woegztroum
0 # woegztroum 2020-04-09 18:06
quick and loans arena quick loans under 500 quick loans get quick loans in usa quick and loans

quick cash loans huntsville al quick loans bad credit with monthly payments [url=https://pa ydailoanz.com/# ] quick loans quick and easy loans online quick loans for small business

https://paydailoanz.com/# - quick loan
Odpovědět | Odpovědět citací | Citovat
 
 
ufhqztroum
0 # ufhqztroum 2020-04-10 08:41
$1500 quick cash loans today quick same day payday loans quick loan quick online payday loans quick cash loans broken arrow

quick cash online loans quick 200 dollar loans [url=https://pa ydailoanz.com/# ] quick loans quick loans for bad credit quick online payday loans no credit check

https://paydailoanz.com/# - quick loan
Odpovědět | Odpovědět citací | Citovat
 
 
hlrlhtroum
0 # hlrlhtroum 2020-04-10 20:46
how to make money selling drugs how did jeffrey epstein make his money make money how to make easy money how to make extra money from home

quick ways to make money how to make money fast [url=https://ma ke-money-blogs. com/# ] make money how to make money as a kid how to make quick money

https://make-money-blogs.com/# - make money
Odpovědět | Odpovědět citací | Citovat
 
 
ibakytroum
0 # ibakytroum 2020-04-11 11:50
how did george soros make his money how to make money as a teen make money apps to make money make money blogging

legitimate ways make extra money how much money can you make on disability work from home how did tom steyer make his money ways to make money from home

https://make-money-blogs.com/# - make money
Odpovědět | Odpovědět citací | Citovat
 
 
cnkxztroum
0 # cnkxztroum 2020-04-12 02:35
apps to make money how much money can you make on youtube work from home how to make money on youtube videos how much money does pewdiepie make

how to make money on youtube videos how did betsy devos make her money work from home make money on the side how to make fast money

https://make-money-blogs.com/# - work from home
Odpovědět | Odpovědět citací | Citovat
 
 
jvvsptroum
0 # jvvsptroum 2020-04-12 17:27
how to make money how to make money in gta 5 work from home how to make money selling drugs how do youtubers make money

how to make money on twitch best ways to make money online work from home diy crafts that make money how to make extra money

https://make-money-blogs.com/# - make money
Odpovědět | Odpovědět citací | Citovat
 
 
hqwjmtroum
0 # hqwjmtroum 2020-04-14 12:47
how did jerry jones make his money how to make money online from home make money how to make money on amazon how did betsy devos make her money

make money on youtube make money on the side make money how to make money online for free how to make money with bitcoin

http://webprogon.ru/ - work from home
Odpovědět | Odpovědět citací | Citovat
 
 
mresbtroum
0 # mresbtroum 2020-04-15 06:34
best way to make money online how to make money without a job work from home how did betsy devos make her money ways to make money on the side

ways to make money on the side make money blogging work from home quick ways to make money apps to make money

http://www.patientmedicine.ru/ - work from home
Odpovědět | Odpovědět citací | Citovat
 
 
hhnjbtroum
0 # hhnjbtroum 2020-04-16 00:00
how do you make money on youtube how to make easy money make money make money online free ways to make money fast

make money blogging legitimate ways make extra money make money how much money can you make on youtube legitimate ways make extra money

http://hdd-remont.ru/ - make money
Odpovědět | Odpovědět citací | Citovat
 
 
ParasiteTemplate.com
0 # ParasiteTemplate.com 2020-07-16 06:02
Hello There. I found your blog using msn. This is a very well written article.
I'll make sure to bookmark it and return to read more of your useful information. Thanks for the post.
I'll definitely return.
Odpovědět | Odpovědět citací | Citovat
 
 
ParasiteTemplate.com
0 # ParasiteTemplate.com 2020-07-21 13:11
You really make it appear really easy with your
presentation however I find this matter to be actually one thing that I believe I would never understand.
It sort of feels too complicated and very wide for me. I am looking ahead for your subsequent put up, I will attempt to get the hang of it!
Odpovědět | Odpovědět citací | Citovat
 
 
ParasiteTemplate.com
0 # ParasiteTemplate.com 2020-07-24 04:04
Wonderful blog! I found it while browsing on Yahoo
News. Do you have any suggestions on how to get listed in Yahoo News?
I've been trying for a while but I never seem to get there!
Appreciate it
Odpovědět | Odpovědět citací | Citovat
 
 
ParasiteTemplate.com
0 # ParasiteTemplate.com 2020-07-25 05:44
Very good article. I definitely appreciate this site.
Stick with it!
Odpovědět | Odpovědět citací | Citovat
 
 
medium.com
0 # medium.com 2020-07-27 14:53
Hello there! I know this is kinda off topic but I
was wondering if you knew where I could find a captcha plugin for my comment form?

I'm using the same blog platform as yours and I'm having trouble
finding one? Thanks a lot!
Odpovědět | Odpovědět citací | Citovat
 
 
www.pinterest.com
0 # www.pinterest.com 2020-07-27 15:20
What's up to every body, it's my first visit of this blog; this blog carries remarkable and actually good data in favor of visitors.
Odpovědět | Odpovědět citací | Citovat
 
 
ParasiteTemplate.com
0 # ParasiteTemplate.com 2020-07-27 19:43
Hi my family member! I want to say that this post is awesome,
great written and include almost all important infos.
I would like to peer more posts like this .
Odpovědět | Odpovědět citací | Citovat
 
 
ParasiteTemplate.com
0 # ParasiteTemplate.com 2020-07-28 01:48
Excellent way of describing, and good post to take facts concerning my presentation subject matter,
which i am going to deliver in school.
Odpovědět | Odpovědět citací | Citovat
 
 
ParasiteTemplate.com
0 # ParasiteTemplate.com 2020-07-28 07:21
I always emailed this weblog post page to all my contacts,
for the reason that if like to read it then my contacts will too.
Odpovědět | Odpovědět citací | Citovat
 
 
ParasiteTemplate.com
0 # ParasiteTemplate.com 2020-07-28 15:32
Magnificent site. A lot of useful info here. I'm sending
it to a few buddies ans additionally sharing in delicious.
And of course, thanks on your effort!
Odpovědět | Odpovědět citací | Citovat
 
 
ParasiteTemplate.com
0 # ParasiteTemplate.com 2020-07-30 09:54
Hello to every body, it's my first visit of this weblog; this weblog includes awesome and genuinely
fine stuff designed for visitors.
Odpovědět | Odpovědět citací | Citovat
 
 
ParasiteTemplate.com
0 # ParasiteTemplate.com 2020-07-30 17:21
Nice post. I was checking continuously this blog and
I am impressed! Extremely helpful info specifically the last part :
) I care for such info much. I was seeking
this certain info for a long time. Thank you and best of luck.
Odpovědět | Odpovědět citací | Citovat
 
 
medium.com
0 # medium.com 2020-08-04 09:41
It's wonderful that you are getting ideas from this piece of writing as well as
from our argument made at this time.
Odpovědět | Odpovědět citací | Citovat
 
 
medium.com
0 # medium.com 2020-08-04 09:50
WOW just what I was looking for. Came here by searching for seo
Odpovědět | Odpovědět citací | Citovat
 
 
ParasiteTemplate.com
0 # ParasiteTemplate.com 2020-08-11 11:08
Hey there! I know this is kind of off-topic but I had to
ask. Does managing a well-establishe d blog like yours take a lot of work?
I'm completely new to blogging but I do write in my diary daily.
I'd like to start a blog so I will be able to share my own experience and views online.
Please let me know if you have any recommendations or tips for brand new aspiring bloggers.
Appreciate it!
Odpovědět | Odpovědět citací | Citovat
 
 
ParasiteTemplate.com
0 # ParasiteTemplate.com 2020-09-01 02:50
It's actually very complicated in this busy life to listen news on Television, therefore I just use the web for that reason, and take the
latest news.
Odpovědět | Odpovědět citací | Citovat
 
 
ParasiteTemplate.com
0 # ParasiteTemplate.com 2020-09-03 11:38
Hello there! I know this is kind of off topic but I was wondering if you knew where I could locate a
captcha plugin for my comment form? I'm using the same blog platform as
yours and I'm having problems finding one? Thanks a lot!
Odpovědět | Odpovědět citací | Citovat
 
 
ParasiteTemplate.com
0 # ParasiteTemplate.com 2020-09-10 01:37
I'm extremely impressed with your writing skills as well as with the layout on your
weblog. Is this a paid theme or did you customize it
yourself? Either way keep up the excellent quality writing,
it is rare to see a nice blog like this one nowadays.
Odpovědět | Odpovědět citací | Citovat
 
 
ParasiteTemplate.com
0 # ParasiteTemplate.com 2020-09-12 21:27
It's remarkable designed for me to have a website, which is good in support of my know-how.
thanks admin
Odpovědět | Odpovědět citací | Citovat
 
 
ParasiteTemplate.com
0 # ParasiteTemplate.com 2020-09-13 07:36
It's an amazing piece of writing designed for all the
internet viewers; they will get benefit from it I am sure.
Odpovědět | Odpovědět citací | Citovat
 
 
ParasiteTemplate.com
0 # ParasiteTemplate.com 2020-09-13 23:36
Inspiring story there. What happened after? Take care!
Odpovědět | Odpovědět citací | Citovat
 
 
ParasiteTemplate.com
0 # ParasiteTemplate.com 2020-09-17 22:57
you're in point of fact a excellent webmaster. The web site loading velocity is incredible.
It seems that you are doing any unique trick. Also, The contents are masterpiece.
you have performed a magnificent process in this subject!
Odpovědět | Odpovědět citací | Citovat
 
 
ParasiteTemplate.com
0 # ParasiteTemplate.com 2020-09-18 22:32
A motivating discussion is worth comment.
There's no doubt that that you ought to write more on this subject,
it may not be a taboo matter but generally folks don't talk about such topics.

To the next! Cheers!!
Odpovědět | Odpovědět citací | Citovat
 
 
GeorgeVulty
0 # GeorgeVulty 2020-11-10 10:15
Вы сделали там скольконибудь достойных замечаний. Я искал в Интернете
дополнительную информацию сообразно этому вопросу и обнаружил, который большинство людей
согласятся с вашим мнением для этом сайте.
Odpovědět | Odpovědět citací | Citovat
 

Přidat komentář

Bezpečnostní kód Obnovit