Tips til at arbejde med dine CSS3-stilark

Når vi har defineret strukturen på vores hjemmeside og har udviklet DOM På en præcis måde er det vigtigt at definere stilarterne, det er også det mest kreative område, og hvor du kan tilpasse med den højeste grad af præcision til det sidste hjørne af dit websted. Kaskaderende stilark er den mest egnede løsning, men for alle dem, der gør deres første strejf i verden af ​​webudvikling, er der nogle tip, der skal tages i betragtning for at opnå de bedste resultater.

For at opnå et professionelt resultat, der er typisk for en indviet frontend, er det nødvendigt at tage højde for visse aspekter såsom orden, læsbarhed og korrektion af de mest almindelige fejl inden for denne type praksis. Jeg deler nedenfor fem tip meget grundlæggende, men samtidig meget vigtigt for behandlingen og den optimale konfiguration af vores CSS-stilark.

Sørg for at etablere en effektiv rækkefølge og struktur i dine CSS3-stilark

Jeg deler altid mine stilark i en hierarkisk rækkefølge. For det første anvender jeg normalt generelle vælgere og fortsætter derefter med at tilføje erklæringerne fra html-vælgerne og til sidst fortsætter med at arbejde inde i ID'erne til containerne og mindre elementer. Dybest set jorden følg DOM's logik og starter fra forældrene til slutningen med børnene. Vi kan dog også følge en anden formel eller rækkefølge, for eksempel kan vi gruppere vores vælgere og erklæringer under hensyntagen til deres funktion. Alt afhænger af, hvad vores præferencer er, og hvordan vi har det mere behageligt at arbejde.

Vælg klare og koncise navne til hver af dine vælgere

Der er noget meget vigtigt, du skal huske på, og det er, at CSS3 adskiller sig i brugen af ​​store og små bogstaver, så at skrive et ord med store bogstaver kan betyde noget andet og kan forårsage fejl. Det nemmeste er altid at bruge små bogstaver for at undgå denne type problemer. Prøv også vælg navne til dine klasser og dine id'er, der er tydeligt genkendelige og at de ikke udleder os til tvivl eller fejl.

Glem ikke at tilføje afklarende kommentarer

Du skal helt sikkert dele dine filer med andre mennesker, måske din klient eller kolleger i dit arbejdsteam, såsom layoutdesignere, andre designere eller udviklere. Af denne grund er det meget vigtigt at være opmærksom på strukturen og sikre en ren og pæn finish. De afklarende kommentarer vil hjælpe alle, der får adgang til vores stilark, med hurtigt at finde vej rundt. Enhver form for observation, der skal tages i betragtning det skal vises som indhold. Husk at du kan medtage indhold både i din Html-fil og i din CSS-fil, og at de i begge tilfælde er kommentarer, der ikke logisk afspejles i det endelige resultat og kun vil være synlige, når kildekoden til den samme er tilgængelig, så de kan være meget nyttigt.

Anvend altid en nulstilling i dine stilark

Hver browser har sit standardformatark, så det er meget nyttigt og anbefales at undgå fejl eller ændringer afhængigt af den browser, hvor vores side vises. nulstil dine stilark. Der er flere alternativer. Eric Meyers nulstillede stilark kan være en meget god mulighed.

Vælg det mest effektive værktøj

Der er mange værktøjer, som du kan bruge til at være så effektive som muligt, når du arbejder på dit webstedsdesign. Fra oprettelsen af ​​Wireframes til at udvikle strukturen på dit websted, som alle slags applikationer inklusive Adobe Photoshop, Illustrator eller Fireworks. Du har også mange professionelle redaktører, der er en af ​​de mest anbefalede (i det mindste den jeg bruger) Sublim tekst eller i modsat fald Adobe Dreamweaver da de giver meget enkle grænseflader med høje grader af personlighed samt muligheden for at arbejde med vores koder gennem et genvejssystem og med et autofuldførelsessystem, der hjælper os med at spare mere end 70% af den tid, vi bruger med en editor af traditionel almindelig tekst.