Bij het bouwen van een website, heb je een paar manieren om het te doen.
U kunt beginnen met het maken van de meest geavanceerde versie van de site met alle scripts, stijlen, enzovoort, en deze vervolgens in bevallige degradatie in oudere browsers laten weergeven, u kunt ervoor kiezen om oudere browsers te negeren, of u kunt beginnen met een basispagina en voeg scripts en stijlen toe zodat het functioneel wordt via progressieve verbetering.
In deze serie gaan we naar de laatste kijken.
Eerst gaan we kijken naar de theorie achter progressieve verbetering. Maar wees niet geïntimideerd - het is geen rocket science. De regels die u moet volgen, zijn eenvoudig.
U kunt zich afvragen: waarom zou ik me met oudere browsers bezighouden? Op dit moment worden de meeste grote browsers automatisch bijgewerkt.
Eerst en vooral, tenzij u een zeer interactieve webapp maakt, moet u rekening houden met gehandicapte gebruikers. Ze kunnen schermlezers gebruiken om toegang te krijgen tot uw site en deze programma's lezen geen stijlen of ingewikkelde interfaces simpelweg omdat het te moeilijk zou zijn voor de gebruiker om te begrijpen wat er op de pagina staat.
Ten tweede zijn er nog steeds mensen die JavaScript en / of CSS uitschakelen. Er zijn vele redenen voor dit - bandbreedte caps, trage verbindingen en persoonlijke voorkeuren. Sommige mensen gebruiken ook op tekst gebaseerde browsers, die een beperkte hoeveelheid CSS kunnen ontleden, maar JavaScript negeren.
Vervolgens wordt uw code beter onderhouden. Je hebt waarschijnlijk meer semantische HTML. U kunt dit in de toekomst opnieuw bekijken en eenvoudig begrijpen wat er gebeurt met de markup, de stijlen en de scripts.
Ten slotte is het belangrijk om te onthouden dat er omgevingen zijn waar gebruikers geen software kunnen installeren of upgraden, inclusief de webbrowser (dit is populair bij grote bedrijven).
En als u er nog steeds niet van overtuigd bent, hebben sommige landen zelfs passende wetgeving vastgelegd, waardoor webontwikkelaars worden gedwongen hun sites toegankelijk te maken voor gehandicapte gebruikers (bijvoorbeeld het VK).
Laten we nu eens kijken naar de basisregels voor het maken van websites met behulp van progressieve verbetering.
Dit lijkt vrij eenvoudig als je de context begrijpt waarin het woord "inhoud" wordt gebruikt.
Hier is 'inhoud' de informatie die de gebruiker in zijn meest elementaire vorm wil ontvangen - tekst. Headers, annotaties, links, alinea's en dergelijke zijn prima, maar afbeeldingen, muziek en animaties zijn niet de inhoud waar we het hier over hebben (en ze moeten goed worden beschreven met behulp van alt
en titel
attributen).
Nu een woord over het "toegankelijke" aspect: niet alleen zouden alle webbrowsers in staat moeten zijn om uw inhoud weer te geven, maar ze zouden het moeten weergeven in een leesbaar formaat. Het is daarom een slecht idee om alle tekst in één alinea te dumpen zonder opmaak.
Dit betekent dat als er een anker of een knop op uw pagina is, de gebruiker nog steeds door de inhoud moet kunnen navigeren. Dit maakt niet uit of hij / zij de nieuwste versie van Chrome of een oudere versie van Internet Explorer gebruikt.
Dit punt vereist meer planning, vooral als het gaat om het maken van uitgebreide ontwerpen. Het dwingt je om je inhoud in eenvoudige HTML-tags te plaatsen met zo weinig mogelijk. Dit betekent dat we er niet een tiental kunnen nesten Als u deze regel volgt, wordt uw HTML schoner en gemakkelijker te begrijpen. Het vuurwerk bevindt zich in CSS. Allereerst, vergeet het De Dit is vergelijkbaar met het bovenstaande punt - geen gebeurtenishandlers in HTML, nee Verbeterde lay-out wordt geboden door extern gekoppelde CSS
stijl
kenmerk in HTML-tags. U moet klassen, ID's en andere kenmerken gebruiken en hun uiterlijk in uw stylesheet definiëren. tag is ook geen optie - de stylesheets moeten worden geladen met behulp van de
tags, dus als een browser geen CSS ondersteunt of is uitgeschakeld, worden de bestanden niet gedownload.
Verbeterd gedrag wordt geboden door onopdringerig, extern gelinkt JavaScript
>