Så lägger du till anpassade rutnät till en webbplats i Chrome

Apple kanske faller isär när det gäller bådahårdvaru- och mjukvarudesign, men på sin topp lärde vi oss hur bra något ser ut om det är korrekt anpassat. Poängen är att när saker passar perfekt ser de bättre ut och detta gäller för industriell design och webbdesign. Webbplatsdesign skapas vanligtvis i Photoshop men det betyder inte att designers och utvecklare inte tänker på utseendet på en webbplats i sin webbläsare. Det är ganska lätt att tänka på; allt du behöver göra är att öppna webbutvecklingskonsolen som alla större webbläsare har och lägga till stoppning, ändra textfärg etc. En sak som alla dessa konsoler saknar är ett justeringsverktyg. Om Chrome är din föredragna webbläsare för utveckling, Baseliner är en tillägg du måste prova. Det lägger till en serie horisontella linjer på skärmen. Du har full frihet att definiera avståndet mellan dessa linjer och deras färg. Dessutom låter verktyget dig lägga till anpassad polstring högst upp på en sida innan rutnätlinjerna.

Installera Baseliner och klicka på B-knappen som den lägger till bredvid adressfältet. En meny öppnas med alternativ för att anpassa ditt rutnät.

Som standard är den övre stoppningen inställd på 0px, denavståndet mellan linjerna är inställt på 12px, och linjerna är gråfärgade med opacitet inställd på 100%. Om du vill ändra något av dessa värden klickar du in i rutan bredvid dem.

Färgrutan ger dig en vanlig färgväljareför att ändra färg på rutnätlinjerna. Avstånd, stoppning och opacitetsvärden kan ändras genom att ange ett anpassat nummer för varje parameter. Du kan alternativt använda upp / ner-pilarna för att öka eller minska värdet. När du har anpassat rutnätet klickar du på "Använd" längst ner.

Rygglinorna läggs bara till på den aktuella sidanoch inte alla sidor du har öppnat i din webbläsare. För att ta bort raderna när du är klar klickar du bara på B-knappen igen och klickar på knappen 'Ta bort' längst ner.

Baseliner fungerar felfritt. Färgkontrollen för nätet och stoppningen överst gör bara förlängningen desto mer intelligent. Vi önskar bara att det stöds även vertikala linjer.

Installera Baseliner från Chrome Web Store