Bouw responsieve websites sneller met semantische gebruikersinterface
Frontend-frameworks zoals Bootstrap zijn nog steeds een rage. Er zijn tientallen geweldige keuzes om uit te kiezen, maar een die onlangs mijn aandacht trok is Semantische gebruikersinterface.
Toegegeven, deze bibliotheek bestaat al een tijdje en dateert al een paar jaar. De nieuwste versie van versie 2.2 wordt geleverd met een aantal extra functies en bewijst dat Semantic op lange termijn in de buurt zal zijn.
Met tientallen CSS-variabelen, eenvoudige responsieve klassen, en eenvoudig in te stellen lay-outs, je zult er geen moeite mee hebben om zelfstandig met Semantic UI te werken.
De eenvoudige klassenamen en rasterstructuren geven echt betekenis aan dit geroepen raamwerk “semantisch”. De lessen zijn erg verstandig en dit maakt uw HTML op afstand gemakkelijk leesbaar.
Het komt zelfs met jQuery-ondersteuning voor dynamische pagina-elementen zoals carrousels en vervolgkeuzemenu's.
Elk HTML-element onder de zon is dat op maat en volledig functioneel met semantische gebruikersinterface. Dit omvat HTML5-elementen plus extra functionaliteit zoals classificaties en aangepaste tabbladen.
Maar misschien is het beste deel van Semantic de thema-opstelling. Niet alleen krijg je massa's vooraf ontworpen stijlen en dynamische elementen, maar je kunt het ook restyle deze zelf bouwen bovenop de code van Semantic.
De totale totalen van de bibliotheek 3.000+ themavariabelen je kunt dit aanpassen in Sass of door je eigen stylesheet uit te breiden. Bovendien wordt Semantic UI meegeleverd met negen standaardthema's:
- Semantische standaard
- Mollig
- verheven
- Klassiek
- Google Materiaal
- Amazone
- bootstrap
- GitHub
- tjilpen
Dit zijn slechts het topje van de ijsberg en ze lijken meer op uitgangspunten om je eigen thema te ontwerpen.
Als u vanaf het begin een nieuwe bestemmingspagina of aangepaste website maakt, overweeg dan serieus om met Semantic UI te werken. Het is volledig gratis en open source met geweldige documentatie online.
Je kunt er door bladeren lay-outstijlen, samen met handleidingen voor alle hoofdelementen en aangepaste thema's.
En u kunt een downloaden kopie van de broncode rechtstreeks van GitHub, waar ook een gids voor beginners.