Web-suunnittelija (ja Internet-teknologiayritys) ei ole mitään tekosyytä, ettet käytä Firefoxia ensisijaisena verkkoselaimeksi. Jos et vielä käytä Firefoxia, sinun täytyy mennä ladata se juuri nyt. Firefox ei tarjoa huippuluokan Internet-selailukokemusta, mutta se tarjoaa myös loputtoman määrän toimintoja, joita et löydä missään muussa Internet-selaimessa.

Koska kolmannet osapuolet voivat kehittää lisäosia Firefoxille, lataamalla parhaimmat käytettävissä olevat lisäosat, voit muuntaa Firefoxn työkaluksi, joka tuo huomattavasti tuottavuutta ja säästää lukemattomia määriä aikaa. Koska ladattavissa on niin paljon erilaisia ​​lisäosia, voi olla hieman ylivoimaista selvittää, mitkä niistä kannattaa käyttää.

Siksi päätin tehdä kaiken työkalun sinulle ja laatia luettelo kuudesta parhaasta Firefox-lisäosasta web-suunnittelijoille.

Web-kehittäjä

Web Developer Screen Shot Vaikka sitä kutsutaan Web-kehittäjä , tämä Firefox-lisäosa on ehdottoman arvokas web-suunnittelijoille. Jos aiot vain ladata ja asentaa yhden Firefox-lisäosan, suosittelen sitä. Syynä on se, että tämä lisäosa tarjoaa erilaisia ​​hyödyllisiä ominaisuuksia, ja se voidaan luokitella Sveitsin armeijan Firefoxin lisäosien veitseksi .

Tämän lisäosan ensimmäinen piirre, jonka suunnittelijat pitävät hyödyllisenä, on CSS-valikko . Tämän valikon ominaisuuksiin kuuluu kyky poistaa tyylejä, näyttää CSS-mediatyypin, katsella CSS: ää, tarkastella tyylitietoja, lisätä mukautetun käyttäjän tyyliarkin tai muokata CSS suoraan .

Seuraava kiinnostuksen kohteena oleva muotoilija on Image-valikko . Sen lisäksi, että voit näyttää ALT-attribuutteja, kuvamittareita, kuvatiedostoja ja kuvan polkuja, voit poistaa kuvia, löytää rikki kuvia, hahmotella kuvia, vaihtaa kuvia ALT-määritteillä ja useita muita toimintoja.

Vaikka voisin kohdistaa useita sivuja kaikkiin ominaisuuksiin, joita tämä lisäosa tarjoaa, haluan vain käsitellä muutamia muita toimintoja, jotka web-suunnittelijat löytävät erityisen hyödyllisiltä. Näihin kuuluu kyky hahmotella eri elementtejä (aina kehyksistä lohkotason elementteihin), muokata HTML: ää ja näyttää piilotettuja elementtejä .

pyromaani

Vaikka Web Developer on ensimmäinen lisäosa, suosittelisin jokaiselle suunnittelijalle, pyromaani on lähellä toisiaan suunnittelijoiden hyödyllisyyden kannalta.

Firebugilla saat välittömästi mahdollisuuden muokata, debugata tai seurata verkkosivuja . Firebug antaa sinulle kaiken valitun sivun CSS, HTML ja JavaScriptin täydellisen hallinnan. Parasta on, että jokainen tekemäsi muutos suoritetaan heti ja heti , joten voit nopeasti kokeilla erilaisia ​​muutoksia ja nähdä muutosten tulokset välittömästi.

Kuten useimmat Firefoxin parhaat lisäosat, Firebug ylittää sen perusominaisuudet ja tarjoaa runsaasti vaihtoehtoja, jotka tekevät käyttäjistä helppoa mukauttaa täydellisesti tämän lisäosan käyttöä. Jotkut Firebugin lisäominaisuuksista ja -vaihtoehdoista sisältävät näppäinoikoteitä, kykyä hallita miten ja missä Firebug-muokkausalue näkyy, visuaalisia oppaita CSS-muokkausta varten, verkkoaktiviteetin analyysiä ja JavaScript-muokattavissa olevia kirjauksia .

ColorZilla

Web-suunnittelija, et koskaan tiedä, milloin inspiraatio tulee iskeytyä sinut surffailla ympäri Internetiä. Voit esimerkiksi tarkastella verkkosivustoa ja löytää sellaisen värin, jota todella pidät.

Jos haluat nopean ja tehokkaan tavan saada selville HSV- ja RGB-arvon tarkat tiedot kyseiselle työkalulle, asenna ColorZilla lisäosalla.

ColorZilla-lisäominaisuudella on online-pipetti , jonka ansiosta yksittäisen värin tarkka arvo on helppo saada. Verkkokerroksen lisäksi ColorZilla tarjoaa useita lisäominaisuuksia, joita useimmat web-suunnittelijat löytävät hyödyllisiltä, ​​kuten DOM-värianalysaattorilta ja online-palettien katselijalta . DOM-värianalysaattorin avulla voit etsiä tietyn värin mukaisia ​​elementtejä ja selvittää CSS-säännöt, jotka määrittävät tietyn värin, kun taas online-palettien katseluohjelmalla voit kirjanmerkin ja jakaa halutut väripaletit.

FireShot

FireShot Screenshot

Vaikka käyttöjärjestelmäsi epäilemättä on sisäänrakennettu näytön kaappaustoiminto, tämä ei tarkoita sitä, että oletusnäytön kaappauksessa on kaikki tarvittavat ominaisuudet.

Esimerkiksi OS: n oletusnäkymä voi kaapata osia verkkosivusta, joka ei ole selainikkunan ulkopuolella?

Useimmissa tapauksissa vastaus tähän kysymykseen ei ole. Onneksi on Firefox-lisäosa, joka tarjoaa tämän ominaisuuden sekä monia muita hyödyllisiä toimintoja.

FireShot on kehittynyt näyttöruudun lisäosa Firefoxille . Sen lisäksi, että voit tallentaa koko verkkosivun (vaikka Web-sivuosi on osia, jotka eivät näy selainikkunan rajoitusten vuoksi), voit myös lisätä merkintöjä suoraan näyttö kaappaa.

FireShot antaa sinulle useita vaihtoehtoja näytön kaappaamiseen. Ei vain niitä voi tallentaa useisiin tiedostomuotoihin, mutta ne voidaan myös tallentaa tietokoneellesi, lähettää sähköpostitse muille tai tallentaa ilmaiseksi FireShot-palvelimelle. Monipuolisten ominaisuuksiensa ansiosta tämä lisäosa on herättänyt yli 150 000 aktiivista käyttäjää ja on osoittautunut korvaamattomaksi web-suunnittelijoille ja muille Internet-ammattilaisille.

CSS Validator / HTML Validator

Suunnittelijana haluat varmistaa, että kaikki kova työsi pääsee helposti vierailijoille ja näytetään heille oikein. Yksi helpoimmista tavoista varmistaa, että molemmat tehtävät toteutetaan, on vahvistamalla kaikki koodisi .

Vaikka ne ovat kahta erillistä lisäosaa, sekä CSS Validator että HTML Validator pitäisi asentaa minkä tahansa web-suunnittimen selaimeen. Kun lisäosat on asennettu, CSS Validator pääsee Työkalut-valikosta, kun taas HTML Validator -ohjelmaa voi käyttää Firefoxin tilariviltä.

Jokainen lisäosa vahvistaa koodin asianmukaisia ​​W3C-standardeja vastaan . Vaikka CSS Validator yksinkertaisesti koodaa standardin validoinnin, HTML Validator tarjoaa lisätoimintoja.

Kun käytät HTML Validatoria, voit valittaa suoraan selaimessa (jossa virheet näkyvät tilapalkin kuvakkeina), näytä lähde virheiden selvittämisen jälkeen validoinnin tai validoinnin kanssa ehdotetuilla ratkaisuilla virheisiin.

Selainikkunan resizer

Kuten joku, joka luo malleja Internetille, yksi turhauttavimmista asioista, joita epäilemättä kohtaat, yrittää luoda malleja, jotka toimivat eri näytön koon mukaan.

Koska et tiedä, onko kävijä katsomassa työtäsi 640 × 480, 800 × 600, 1024 × 768, 1280 × 1024 tai 1600 × 1200, on sinun vastuullasi luoda malleja, jotka toimivat kaikissa näissä päätöslauselmissa .

Vaikka työsi voi nähdä erilaisia ​​ratkaisuja eri tavoin, olen löytänyt selainnäytön Ikkuna Resizer lisäosa on tehokkain tapa toteuttaa tämä tehtävä. Kun olet ladannut ja asentanut tämän lisäosan, voit nopeasti uudelleen koota selainikkunasi mille tahansa yllä mainituista vakiotarkkuuksista.

Näin voit nähdä, aikooko suunnittelusi näyttää hyvältä kävijöille, jotka eivät käytä samaa resoluutiota kuin sinä. Paras asia tästä lisäosasta on, että jos käytät sitä yhdessä muiden luettelossa olevien lisäosien (erityisesti Firebug) kanssa, kun huomaat, että jotain ei näytä oikein, voit tehdä muutoksia koodisi hetkessä ja tarkista, korjaako ongelma, jättäenkö pois nykyisen selainikkunasi.

Tietääkö muita hyviä laajennuksia suunnittelijoille? Voit vapaasti kommentoida ja jättää meille palautetta.