11 parasta verkkokehityslaajennusta Chromelle

Kun kehität verkkosivustoa, sinun on tehtävä tarkistuslista monista monimutkaisista vaatimuksista. Olipa kyseessä väri- tai fonttimallit, CSS-asetteluongelmat tai verkkosivuston reagointikyky eri laitteissa, on tärkeää pysyä ajan tasalla kaikista esiin tulevista ongelmista. Seuraavassa on joitain Google Chromen (ja muiden Chromium-pohjaisten selaimien) parhaista verkkokehityslaajennuksista.

1. Color Pick Eyedropper

Pidätkö satunnaisen verkkosivun värimaailmasta ja haluat hyödyntää sitä omassa projektissasi? Chrome-laajennus nimeltä Värivalinta ”pipetti” voit poimia värejä tarkalla tarkkuudella ja säädettävän zoomausominaisuuden avulla.

Tällaiset laajennukset vaativat luvan kaikilta verkkosivustoilta värinpoiston suorittamiseen. Jos haluat hieman kehittyneempiä ominaisuuksia, on samanlainen työkalu nimeltä ColorZilla jonka mukana tulee Gradient-generaattori, palettikatseluohjelma ja värihistoria.

2. Koko sivun kuvakaappaus yhdellä napsautuksella

Koko sivun verkkokuvakaappauksen ottaminen on jokapäiväisen työn välttämättömyys. Joskus paras tapa viestiä suunnittelumuutoksista on tallentaa koko verkkosivusto sellaisenaan. Laajennuksella nimeltä ”Yhden napsautuksen koko sivun kuvakaappaus”, voit saavuttaa sen tarkasti.

Kun kuvakaappaus on käynnissä, valmis vierivä kuva avautuu uuteen ikkunaan, kun se on valmis.

Koko verkkosivun näyttö on nyt ladattavissa PNG-muodossa. Voit myös käyttää kuvaruutuun useita tehosteita, kuten suodattimia, piirtämistä verkkosivun päälle, tekstin lisäämistä ja paljon muuta.

3. EditThisCookie

Verkkokehittäjät tarvitsevat pääsyn evästehallintaan lisätäkseen, poistaakseen, muokatakseen, suojatakseen ja estääkseen evästeitä. EditThisCookie on hyödyllinen laajennus, jonka avulla voit käsitellä evästeitä haluamallasi tavalla ja viedä tai tuoda niitä JSON-muodossa. Tämä auttaa sinua pitämään verkkosivuston terveenä poistamalla vanhat evästeet ja rajoittamalla evästeiden enimmäispoimintapäivää.

4. ModHeader

ModHeader on yksi suosituimmista Chrome-laajennuksista verkkosivujen HTTP-otsikoiden muokkaamiseen. Yhdellä tai kahdella napsautuksella voit ottaa käyttöön otsikon muokkauksen URL-osoitteen tai resurssityypin perusteella. Parasta on, että voit luoda useita profiileja ja lisätä eri arvoja muokattuihin otsikoihin. Kaikki muutokset voidaan rajoittaa vain yhteen välilehteen tai koko sivustoon.

5. UX-tarkistus

Me kaikki tarvitsemme ajoittain heuristisen arvioinnin käynnissä olevasta verkkosivustosta. Tämä on tehty helpoksi UX-tarkistus, laajennus, joka näyttää kaiken käyttökokemukseen liittyvän palautteen sivuruudussa. Kun napsautat elementtiä, joka ei vastaa arvioimaasi heuristiikkaa, voit lisätä muistiinpanoja ja ottaa kuvakaappauksia. Lopuksi kaikki muutokset voidaan viedä .docx-muodossa.

6. Ikkunan koon muuttaja

Verkkokehittäjien on emuloitava verkkosivujaan eri näyttömitoilla. Kanssa Ikkunan koon muuttaja, voit tehdä nämä arvioinnit helposti kannettaville tietokoneille, tableteille, älypuhelimille ja mille tahansa valitsemillesi näytön mitoille.

Työkalussa on hienoja ominaisuuksia, kuten ”Kierrä” ja ”Live Measurement”, sekä joukko visuaalisia mukautustoimintoja. Jos haluat rakentaa todella responsiivisen verkkosivuston, varmista, että olet ristiintarkistanut sen ulkoasun kaikkien näytön kokojen osalta.

7. Lorem Ipsum -generaattori

Tarvitset oletustekstiä, jotta voit nopeasti viimeistellä työn verkkosivulla. Alaliittymä soi Lorem Ipsum -generaattori tarjoaa useita oletustekstivaihtoehtoja, joissa on erilaisia ​​kappaleita ja lauseita kappaletta kohti. Voit valita tekstin katkelmia tai koko tekstiä käyttämällä ”Automaattinen valinta” -vaihtoehtoa. Lopullinen malli antaa tyylikkään ilmeen tekstin vaihtelumahdollisuuksien vuoksi.

8. BuiltWith Technology Profiler

BuiltWith on a klassinen laajennus oppiaksesi kaikista verkkosivustoa tukevista taustatekniikoista. Yhdellä napsautuksella se luo profiilin, joka auttaa sinua oppimaan uusimmista lisäosista ja välineistä, jotka tekevät sivustosta erottuvan paremmin. Tämä auttaa sinua kopioimaan sen toimintoja omaan käyttöösi.

9. WhatFont

WhatFont on yksi nopeimmista ja helpoimmista tavoista tunnistaa erilaisia ​​kirjasintyyppejä verkkosivulla. Sinun tarvitsee vain viedä hiiri tekstin lähelle saadaksesi sen täydelliset tiedot. Se tukee kehittyneitä malleja, kuten TypeKit ja Google FontAPI.

10. CheckMyLinks

Joskus tarvitsemme objektiivisen yhteenvedon kaikista verkkosivuston linkeistä. Tarkista MyLinks on suosittu laajennus kelvollisten, virheellisten ja rikkinäisten linkkien yhteenvetoon. Kaikkien käynnissä olevien verkkosivustojen linkkitulokset näkyvät välittömästi sivuruudussa. Tämä työkalu on erittäin kätevä viime hetken pistokokeisiin ennen verkkosivustosi tai julkaistujen muutosten julkaisemista.

11. Torjunta-aine

Odotatko CSS-asetteluongelmia verkkosivustollasi? Torjunta-aine mahdollistaa näiden ongelmien virheenkorjauksen tarjoamalla ääriviivat jokaiselle sivun elementille. Pitämällä Ctrl -näppäintä, voit nähdä elementin tiedot ja analysoida elementin sijoittelua sivulla.

On monia muita suosittuja verkkolaajennuksia, jotka hallitsevat verkkosivustosovellusten tärkeitä yksityiskohtia. Esimerkiksi, JSON-katseluohjelma auttaa niitä, jotka työskentelevät JSON-tiedostojen kanssa. Siellä on HTML Tree Generator joka antaa puun kaikista verkkosivuston elementeistä.

Yllä olevien lisäksi on myös paljon Chrome-laajennuksia, jotka parantavat selausnopeuttasi. Katso ne!