Følg beste praksis for CSS: Unngå CSS Inline-stiler

click fraud protection

Cascading Style Sheets har blitt standard måte å style og layout nettsteder på. Designere bruker stilark å fortelle en nettleser hvordan et nettsted skal vises når det gjelder utseende og følelse, som dekker faktorer som farge, avstand, skrifttyper og mye mer.

CSS-stiler distribueres på to måter:

  • Inline - innenfor kodingen av selve websiden, på individuell basis for element-basis
  • I et frittstående CSS-dokument som nettstedet er lenket til
Eksempel på CSS
CSS.Jeremy Girard

Beste praksis for CSS

"Beste fremgangsmåter" er metodene for å designe og bygge nettsteder som har vist seg å være de mest effektive og gir mest mulig utbytte for det involverte arbeidet. Følg dem inn CSS innen nettdesign hjelper nettsteder å se og fungere så bra som mulig. De har utviklet seg gjennom årene sammen med andre webspråk og teknologier, og det frittstående CSS-stilarket har blitt den foretrukne bruksmetoden.

Å følge beste praksis for CSS kan forbedre nettstedet ditt på flere måter:

  • Skiller innhold fra design: Et av hovedmålene med CSS er å fjerne designelementer fra HTML og plassere dem på et annet sted for designeren å vedlikeholde. Denne praksisen tjener også til å skille designere fra utviklere, slik at hver kan fokusere på sine kompetanseområder. En designer trenger ikke å være en utvikler for å opprettholde utseendet til et nettsted.
    instagram viewer
  • Gjør vedlikehold enkelt: Et av de mest oversettede elementene i webdesign er vedlikehold. I motsetning til utskriftsmateriell er et nettsted aldri "en og ferdig." Innhold, design og funksjon kan og bør utvikle seg over tid. Å ha CSS på et sentralt sted, i stedet for å bli strødd over hele nettstedet, gjør ting mye lettere å vedlikeholde.
  • Holder nettstedet ditt tilgjengelig: Å bruke CSS-stiler hjelper søkemotorer og funksjonshemmede til å kommunisere med nettstedet ditt.
  • Holder nettstedet ditt oppdatert lenger: Ved å bruke beste praksis med CSS følger du standarder som har vist seg å være stabile, men fleksible nok til å imøtekomme endringer i webdesignmiljøet.

Inline Styles are not Best Practice

Inline-stiler, selv om de har et formål, er vanligvis ikke den beste måten å vedlikeholde nettstedet ditt. De strider mot alle de beste metodene:

  • Inline-stiler skiller ikke innhold fra design: Inline-stiler er nøyaktig de samme som innebygde skrifttyper og andre klumpete designmerker som moderne utviklere rekker mot. Stilene påvirker bare de spesifikke, individuelle elementene som de brukes på; mens denne tilnærmingen kan gi deg mer detaljert kontroll, gjør det også andre aspekter av design og utvikling - som konsistens - vanskeligere.
  • Inline-stiler forårsaker vedlikeholdshodepine: Når du jobber med stilark, kan det være vanskelig å finne ut hvor en stil blir satt. Når du har å gjøre med en blanding av innebygde, innebygde og eksterne stiler, har du mange steder å sjekke. Hvis du jobber i et webdesignteam eller må redesigne eller vedlikeholde et nettsted som er bygget av noen andre, vil du få enda flere problemer. Når du har funnet stilen og endret den, må du gjøre det på hvert element på hver side der den er plassert. Det øker tids- og arbeidsbudsjettene astronomisk.
  • Inline-stiler er ikke like tilgjengelige: Mens en moderne skjermleser eller et annet hjelpemiddel kanskje kan håndtere integrerte attributter og merker effektivt, kan ikke noen eldre enheter, noe som kan resultere i noe merkelig vist nett sider. Ekstra tegn og tekst kan påvirke hvordan siden din blir sett av en søkemotorrobot, slik at siden din ikke gjør det så bra når det gjelder søkemotoroptimalisering.
  • Integrerte stiler gjør sidene større: Hvis du vil at hvert avsnitt på nettstedet ditt skal vises på en bestemt måte, kan du gjøre det en gang med seks linjer eller så kode i et eksternt stilark. Hvis du gjør det med innebygde stiler, må du imidlertid legge til disse stilene i hvert avsnitt på nettstedet ditt. Hvis du har fem linjer med CSS, er det fem linjer multiplisert med hvert avsnitt på nettstedet ditt. Den båndbredden og belastningstiden kan legge seg raskt.

Alternativet til innebygde stiler er eksterne stilark

I stedet for å bruke innebygde stiler, bruk eksterne stilark. De gir deg alle fordelene med CSS beste praksis og er enkle å bruke. Ansatt på denne måten lever alle stilene som brukes på nettstedet ditt i et eget dokument som deretter er koblet til et nettdokument med en enkelt kodelinje. Eksterne stilark påvirker ethvert dokument de er vedlagt. Hvis du har et nettsted på 20 sider der hver side bruker samme stilark - slik er det vanligvis ferdig - du kan gjøre endringer på hver av disse sidene ved å redigere disse stilene en gang, i en plass. Endring av stiler på ett sted er mer praktisk enn å søke etter kodingen på hver side på nettstedet ditt. Denne fleksibiliteten gjør langsiktig administrering av nettsteder mye enklere.

instagram story viewer