2020. április 8., szerda

Böngészőprogramok beépített fejlesztő eszközei

Nézzük meg a legismertebb és legelterjedtebb böngészőnek a  Google Chromenak a webfejlesztő eszközeit. Sokan talán nem ismerik az egyes böngészők (pl. a Chrome és a Firefox) azon tulajdonságát, hogy nem csak a weboldalak tartalmát képesek megjeleníteni, de – óriási segítséget nyújtva egy-egy weboldal elkészítéséhez, analizálásához – webfejlesztő eszközzel is el vannak látva. Ez rendkívül hasznos segítség, ha pl. keresünk valamit egy bonyolultabb CMS rendszerben és nem tudjuk, hogy egy-egy átírandó betűtípus, kép, vagy szöveg kódja hol is található, vagy csak valami hibát keresünk a weboldalunkon.

Egyéb kiegészítők

Google Chrome fejlesztői eszközök

Chromeban a fejlesztői eszközöket a villáskulcs ikonra kattintva, majd az Eszközök->Fejlesztői eszközök menüpontban lehet elérni, vagy sokkal egyszerűbben a vizsgálandó oldalon a ctrl+shift+i gombok megnyomásával tudjuk aktiválni. Fejlesztéshez pedig egy igen hasznos kellék: át lehet írni az elemeket, ki- és bekapcsolni egyes css elemeket, hogy megnézzük, hogyan módosul az oldalunk.
Nézzünk meg néhány olyan kiegészítő elemet, amit utólag telepíthetünk a böngészőnkre.
A kiegészítők hozzáadása;
További eszközök
Bővítmények
Fejlesztőmód bekapcsolása
Bővitmények keresése
Bővitmények becsomagolása
Bővitmények kicsomagolása
Frissités

Kiegészítők:

Google Levélfigyelő 4.4.0

META SEO inspector 2.0.9

Notifycon 0.8.1

Open SEO Stats(Formerly: PageRank Status) 8.9.0.1

PageSpeed Insights (by Google) 2.0.4.3

Right Now Counter 0.4

Sticky Notes 1.9.2

Tag Assistant (by Google) 1.1.18

Weboldal Screenshot készítő - WP Screenshot 14.5

YSlow 3.1.2

Akit bővebben érdekel járjon utána!
Na jó , itt van néhány link a segítséghez;

http://people.ektf.hu/kvcsilla/sites/default/files/01_a_weblapfejlesztes_eszkozei.pdf
https://blog.tarhelypark.hu/webfejleszto-chrome/
https://ithub.hu/blog/post/15_kihagyhatatlan_webes_eszkoz_fejlesztoknek/
https://chrome.google.com/webstore/category/ext/11-web-development?hl=hu&_feature=free
https://nixlog.info/questions/187666/google-chrome-fejlesztoi-eszkozok-testreszabasa-tema-szinsem

Nincsenek megjegyzések:

Megjegyzés küldése