Cascading Style Sheets is de standaard manier geworden om websites op te maken en op te maken. Ontwerpers gebruiken stylesheets om een browser te vertellen hoe een website moet worden weergegeven in termen van uiterlijk en gevoel, waaronder factoren als kleur, spatiëring, lettertypen en nog veel meer.
CSS-stijlen worden op twee manieren geïmplementeerd:
- Inline — binnen de codering van de webpagina zelf, op een individuele, element-voor-element basis
- In een op zichzelf staand CSS-document, waaraan de website is gekoppeld
Praktische tips voor CSS
"Best practices" zijn de methoden voor het ontwerpen en bouwen van websites die het meest effectief zijn gebleken en het meeste rendement opleveren voor het werk dat ermee gemoeid is. Ze volgen in CSS in webdesign helpt websites er zo goed mogelijk uit te zien en te functioneren. Ze zijn in de loop der jaren geëvolueerd, samen met andere webtalen en -technologieën, en de zelfstandige CSS-stylesheet is de voorkeursmethode voor gebruik geworden.
Door best practices voor CSS te volgen, kunt u uw site op verschillende manieren verbeteren:
- Scheidt inhoud van ontwerp: Een van de belangrijkste doelen van CSS is om ontwerpelementen uit HTML te verwijderen en ze op een andere locatie te plaatsen zodat de ontwerper ze kan onderhouden. Deze praktijk dient ook om ontwerpers van ontwikkelaars te scheiden, zodat elk zich kan concentreren op hun expertisegebied. Een ontwerper hoeft geen ontwikkelaar te zijn om het uiterlijk van een website te behouden.
- Maakt onderhoud eenvoudig: Een van de meest over het hoofd geziene elementen van webdesign is onderhoud. In tegenstelling tot gedrukte materialen is een website nooit 'one and done'. Inhoud, ontwerp en functie kunnen en moeten in de loop van de tijd evolueren. Door de CSS op een centrale plaats te hebben, in plaats van verspreid over de website, is het veel gemakkelijker te onderhouden.
- Houdt uw site toegankelijk: Het gebruik van CSS-stijlen helpt zoekmachines en personen met een handicap om met uw site om te gaan.
- Houdt uw site langer actueel: Door best practices met CSS te gebruiken, houdt u zich aan standaarden waarvan bewezen is dat ze stabiel zijn, maar flexibel genoeg om veranderingen in de webontwerpomgeving op te vangen.
Inline-stijlen zijn geen best practice
Inline-stijlen, hoewel ze een doel hebben, zijn over het algemeen niet de beste manier om uw website te onderhouden. Ze gaan in tegen elk van de best practices:
- Inline-stijlen scheiden inhoud niet van ontwerp: Inline-stijlen zijn precies hetzelfde als ingesloten lettertypen en andere onhandige ontwerptags waar moderne ontwikkelaars zich tegen verzetten. De stijlen zijn alleen van invloed op de specifieke, individuele elementen waarop ze zijn toegepast; hoewel die aanpak je misschien meer gedetailleerde controle geeft, maakt het ook andere aspecten van ontwerp en ontwikkeling, zoals consistentie, moeilijker.
- Inline-stijlen veroorzaken onderhoudshoofdpijn: Wanneer u met stylesheets werkt, kan het moeilijk zijn om uit te zoeken waar een stijl wordt ingesteld. Wanneer je te maken hebt met een mengsel van inline, embedded en externe stijlen, je hebt veel locaties om te controleren. Als u in een webdesignteam werkt of een site die door iemand anders is gebouwd, opnieuw moet ontwerpen of onderhouden, krijgt u nog meer problemen. Zodra je de stijl hebt gevonden en deze hebt gewijzigd, moet je dit doen op elk element op elke pagina waar deze is geplaatst. Dat verhoogt de tijd- en werkbudgetten astronomisch.
- Inline stijlen zijn niet zo toegankelijk: Hoewel een moderne schermlezer of een ander hulpmiddel inline attributen kan verwerken en tags effectief, sommige oudere apparaten kunnen dat niet, wat kan resulteren in een vreemd weergegeven web Pagina's. Extra tekens en tekst kunnen ook van invloed zijn op hoe uw pagina wordt bekeken door een zoekmachinerobot, dus uw pagina doet het minder goed op het gebied van zoekmachineoptimalisatie.
- Inline stijlen maken uw pagina's groter: Als u wilt dat elke alinea op uw site op een bepaalde manier wordt weergegeven, kunt u dit één keer doen met zes regels code in een externe stylesheet. Als u het echter met inline-stijlen doet, moet u die stijlen aan elke alinea van uw site toevoegen. Als je vijf regels CSS hebt, zijn dat vijf regels vermenigvuldigd met elke alinea op je site. Die bandbreedte en laadtijd kunnen snel oplopen.
Het alternatief voor inline stijlen zijn externe stylesheets
Gebruik externe stylesheets in plaats van inline stijlen. Ze bieden u alle voordelen van best practices voor CSS en zijn gebruiksvriendelijk. Op deze manier gebruikt, leven alle stijlen die op uw site worden gebruikt in een apart document dat vervolgens wordt gekoppeld aan een webdocument met een enkele regel code. Externe stylesheets van invloed zijn op elk document waaraan ze zijn gekoppeld. Als je een website van 20 pagina's hebt waarin elke pagina dezelfde stylesheet gebruikt, wat meestal zo is klaar - u kunt een wijziging aanbrengen in elk van die pagina's door deze stijlen eenvoudig in één keer te bewerken plaats. Het is handiger om op één plek van stijl te veranderen dan op elke pagina van uw website naar die codering te zoeken. Deze flexibiliteit maakt sitebeheer op lange termijn veel gemakkelijker.