Hur man skapar falska webbsidor med Firebug

När du tänker på faktade eller redigerade skärmdumpar, dyker program som Photoshop förmodligen in i ditt sinne. Jag har aldrig varit väldigt kreativ när det gäller design och grafiskt arbete, så det är nästan inte fråga för mig. Om du försöker byta ansikten i en bild måste du lära dig hur du använder sådana program. Om du försöker göra något som ändrar texten i ett Facebook-konversation, behöver du inte. Allt du behöver är Firebug och en PrtScrn-nyckel.

Firebug är tillgänglig för alla större webbläsare. Så här installerar du Firebug på IE, Safari, Chrome och Opera. Så här installerar du Firebug på IE, Safari, Chrome och Opera. Läs mer: IE6 +, Firefox, Opera, Safari och Chrome. I det här exemplet kör jag dig genom en handledning om hur du använder den för sin ursprungliga webbläsare, Firefox. Vad är Firebug dock? Firebug är en webbläsaretillägg som låter dig redigera, felsöka och övervaka CSS. Nästa steg på vägen för att bli en CSS Jedi-mästare Nästa steg på vägen för att bli en CSS Jedi-mästare CSS är absolut en av de viktigaste teknologier runt på Internet idag, och medan de flesta erkänner att de vet lite HTML, är vi allmänt känsliga för CSS. Förra gången jag introducerade dig ... Läs mer, HTML och JavaScript. För att manipulera webbsidor som jag ska visa dig idag behöver du inte veta något av dessa språk.

Installera Firebug

Installation är otroligt enkelt. Gå vidare till den officiella hemsidan för att ladda ner tillägget [Ej längre tillgängligt]. Därifrån, välj din webbläsare (Firefox föredras, så att följa efter är lättare). Installera tillägget och starta om webbläsaren om det behövs.

Använda Firebug

När du installerar Firebug, ska ikonen som standard visas i din tilläggsfält, Verktyg-menyn och eventuellt snabbmenyn. Klicka på ikonen i tilläggsfältet och du får se en ny flik uppe längst ner på skärmen.

Det du ser här är en HTML-vy av elementen på webbsidan du är på. I det här exemplet är det Firebug-hämtningssidan på Firefox-tillägg. Om du är intresserad av att använda Firebug för de mer vanliga ändamålen, gärna kasta runt flikarna och få en känsla för dess funktioner.

Den knapp som jag har markerat i den skärmdumpen är inspektionsverktyget. Det här är verktyget vi ska använda. Klicka på den knappen och sedan kommer du märka att varje textområde som du sveper markören över kommer att markeras i webbsidan och markeras sedan i Firebugs HTML-vy.

Ändra text

Klicka på det textblock du vill manipulera. Du ser att texten har valts i Firebugs HTML-vy. Därifrån dubbelklickar du på HTML-raden som innehåller texten du vill ändra. Du kan börja skriva in vad du vill.

När du skriver skriver du att förhandsgranskningsuppdateringarna bor på webbsidan.

Cool, eller hur? Det är särskilt enkelt på grund av det sätt som Firebug tillåter dig att isolera rå text från förpackad HTML. På så sätt bevaras alla HTML-element, CSS-format och andra viktiga bilder så att det ser ut som den verkliga kopian.

När du blir mer bekväm med Firebug, eller om du redan känner till HTML, hittar du lika lätt att ändra andra element på sidan, som bilder. Möjligheterna är ganska oändliga och jag är säker på att du redan kommer på sätt som du kan använda och missbruka det här lilla tricket.

Låt mig veta vad du tycker om det här lilla tipset, och dela med dig av dina kreativa sätt att använda den i kommentarerna!

Utforska mer om: HTML, Mozilla Firefox, Screen Capture, WYSIWYG Redaktörer.