Om vi vill ändra den publicerade webbdesignen, både i produktion eller i en utvecklings- eller kvalitetsmiljö, måste vi börja modifiera CSS. Denna process kan vara komplicerad, eftersom det finns flera verktyg som tillåter direkt redigering av CSS, så du brukar spendera mycket tid på att göra rätt förändringar.
Vilken förlängning jag kommer att prata om idag är att påskynda denna process.
Detta är Devsync, ett tillägg för Google Chrome som, när det är aktiverat, visar CSS-redigeraren på webben som vi ser. Det är möjligt att göra ändringar av varje element intuitivt, eftersom plugin detekterar varje zon korrekt och visar variablerna i separata rutor, som om det vore Photoshop.
I sin presentation kommenterade de de aktuella problemen i denna sektor:
När jag utformar webbplatser spelar jag alltid i stil med element genom ett webbläsarverktyg. Detta gör att jag snabbt kan se hur det ser ut utan att fortsätta ändra sammanhanget, men jag måste fortfarande kopiera den här utgåvan till min redaktör, och jag tappar ofta dem i processen.
Jag vill skapa ett sätt att bevara denna utgåva och design på ett mer visuellt sätt så att min design bygger på vad som verkar rätt och inte de värden som fortsätter att ändras i min redaktör tills det ser bra ut.
Med detta verktyg, som inte är gratis (kan köpas idag för 39 euro), kan vi visuellt utforma med hjälp av en redigerare som liknar Sketch / Figma, men finns i ett webbläsarutvecklingsverktyg. När ändringarna har gjorts, applicera direkt via redaktören.
Du kan njuta av en demonstration på projektets webbplats.
