Wat is CSS

uit de cursus Webdesign & Layout met css (2019)

Geef een reactie of stel een vraag

Geef een reactie

Registreer als je wilt reageren.

Deze website gebruikt Akismet om spam te verminderen. Bekijk hoe je reactie-gegevens worden verwerkt.

Webdesign & Layout met css (2019)

perm_identity Belinda | video_library 58 video's | query_builder 03:28:15

n deze online basiscursus  leer je de grondbeginselen van css (Cascading Style Sheets). Met css bepaal je de layout en de vormgeving van een webpagina. CSS schrijf je in een apart bestand dat je koppelt aan de html-pagina’s. Hiermee koppel je de inhoud los van de vormgeving en dat biedt heel veel voordelen. Dankzij externe css-stijlbladen zorg je voor een consistente vormgeving en opmaak voor de gehele website. Leer op welke manier je CSS kan verbinden aan webpagina’s en gebruik te maken van de juiste css-selectors.

Responsive design en -layout met css

CSS biedt met grid en flexbox een waanzinnig snelle, efficiënte en makkelijke manier om snel een responsive design te maken die zich automatisch op elk formaat beeldscherm perfect aanpast. In deze cursus leer je direct hoe je jouw website responsive maakt met mediaqueries. Klinkt misschien ingewikkeld maar je zult merken dat dit reuze meevalt. En daarnaast is het vaardig worden van responsive design een ‘must’ voor webdesigners.

Tekst en afbeeldingen vormgeven met css

CSS biedt een groot aantal css-stijlopdrachten waarmee je onder andere teksten en afbeeldingen perfect kunt vormgeven. CSS is continu in beweging omdat hier elke dag aan ontwikkeld wordt. Het is dus een taak om altijd op de hoogte te blijven van de nieuwe mogelijkheden en de veranderingen. Maar de basis is de basis, en die leer je in deze cursus. Vanuit dit startpunt kun je jezelf blijven ontwikkelen in deze krachtige manier van het consistent vormgeven van je HTML-pagina’s.

In deze video leg ik uit waarom websites vormgegeven worden met css-stijlen.

CSS staat voor Cascading Style Sheet.

Allereerst wil ik een overzicht geven welke gangbare technieken gebruikt worden bij het vervaardigen van websites.

De meeste websites worden opgebouwd met verschillende technieken. Allereerst de HTML.

Met html geven we de content van de webpagina betekenis en structuur.

En dit doen we met behulp van de html-elementen.

Zoals de h-één tot en met h-zes voor de koppen.

Lijsten maken we op met het ol of ul element en de listitems , met de li's.

Vervolgens de CSS. Met css-stijlen wordt de vormgeving gescheiden van de content.

En hiermee bepaal je vervolgens het uiterlijk van de website.

Met JavaScript of javascript bibliotheken zoals bijvoorbeeld jQuery

kun je bepaalde interactiviteit laten uitvoeren door de browser van de bezoeker.

Met PHP kun je weer specifieke functies laten uitvoeren die niet afhankelijk zijn door de mogelijkheden van de browser van de bezoeker.

Maar worden uitgevoerd door de server waarop je de website host.

En als je bijvoorbeeld gebruik wilt maken van content die uit een database gegenereerd moet worden. Dan maak je gebruik van mySQL.

Ook als je bijvoorbeeld de eigenaar van een website de mogelijkheid wil bieden, dat deze zelfstandig zijn eigen content kan beheren.

Dan zul je gebruik gaan maken van een soort Content Management Systeem. En deze maken altijd gebruik van php en mySQL.

Nou is het niet zo dat altijd elke website gebruik maakt van alle technieken.

Een statische website maakt bijvoorbeeld alleen gebruik van HTML en CSS.

En indien men gebruik wil maken van leuke functies ook van JavaScript.

Een Content Management Systeem, een dynamische website, maakt wel gebruik van alle technieken.

Kortom, met css-stijlen bepaal je de vormgeving van de elementen op een html pagina.

Cascading betekent het overerven van opmaakeigenschappen. Denk aan een waterval.

De browser van de bezoeker is de eerste die een webpagina interpreteert en toont.

De browser doet dat met zijn eigen stijlblad. Daarna als er een extern stijlblad gekoppeld is aan de html pagina,

dan overschrijft het externe stijlblad de browser gestuurde vormgeving.

Is er ook een intern stijlblad aanwezig op de pagina? Dan zal deze het externe stijlblad overschrijven en de browser.

En als laatste kun je ook nog in de html broncode een inline stijl verwerken.

Deze zal als laatste ingelezen worden en alle voorgaande stijlen overschrijven.

Uiteindelijk zal de laatst ingelezen stijl bepalen wat het uiterlijk wordt.

In de praktijk maak je meestal gebruik van externe stijlbladen.

De browsergestuurde css wordt dan direct overschreven door jouw stijlblad.

Deze koppel je natuurlijk aan elke pagina van de website.

Wijzig de vormgeving in het stijlblad en deze wordt voor de gehele website aangepast. Zo zorg je voor consistente vormgeving.

Browsers kunnen dankzij css-stijlbladen pagina's ook sneller voorvertonen.

Een css-stijlblad is overzichtelijk. En werkt zeer efficiënt.

Vooral als je ook moet samenwerken met meerdere personen aan één website.

Anders dan voor html bestaat css uit meer dan één specificatie.

Vanaf css-drie bestaat deze uit meerdere aparte modules.

Dat kun je mooi zien op deze website Evolution of the web.

Elke css-module heeft een eigen naam. Hier zie je css- drie, twee D transformaties.

Drie D transformaties, animatie, verlopen, overgangen etcetera.

Elke css-module wordt apart verder ontwikkeld en komt niet meer gelijktijdig met vernieuwingen uit.

Een website waar je alles over css en de toepassingen ervan kunt vinden is wschools.com

Hier vind je een volledig overzicht van alle mogelijke css-stijlen en hoe je deze moet en kunt toepassen.

Een onmisbare bron van informatie voor webdesigners.