Typen HTML-sjablonen

HTML-sjablonen voor typoefeningen

Een HTML-sjabloon voor typoefeningen wordt geleverd als een kant-en-klare front-end voor een oefensite: kant-en-klare code, opgebouwde secties en een lay-out die u in een editor kunt openen en uitbreiden met uw eigen oefeningen. U hoeft niets vanuit een leeg bestand in elkaar te zetten en de secties blijven bewerkbaar zodra het sjabloon in uw project is opgenomen. De vraag die u zich moet stellen, is hoeveel van een typinterface het sjabloon al biedt.

Wat kant-en-klare code biedt voor typprojecten

Een typinterface heeft een aantal onderdelen die lastig helemaal vanaf nul op te zetten zijn, en dit formaat levert ze kant-en-klaar. Open de live demo voordat u de wijzigingen opslaat en bekijk de onderdelen waarop het project zal steunen:

• een oefengebied waar de te typen tekst leesbaar blijft, ongeacht de lengte;

• een invoergebied naast die tekst, met een zichtbaar verschil tussen correct en fout getypte tekens;

• een timer en een resultaatgebied voor snelheid en nauwkeurigheid;

• niveau-links voor een cursus die verder gaat dan een enkele oefening.

Beginnersmateriaal heeft vaak ook een toetsenbordafbeelding of vingerbegeleiding nodig, en dat is makkelijker te zien in een demo dan achteraf toe te voegen.

Oefeningen aanpassen zonder alles opnieuw op te bouwen

De tweede vraag is hoe de sjabloon zich gedraagt als de cursus groeit. Een typeproject blijft zelden beperkt tot tien oefeningen. Er komen steeds nieuwe niveaus en nieuwe testteksten bij, dus de secties die deze bevatten, moeten gemakkelijk te kopiëren en aan te vullen zijn zonder de rest van het bestand te verstoren.

Dat is de moeite waard om direct te controleren. Kopieer een oefensectie, wijzig de tekst en kijk hoeveel de rest verschuift. Een sjabloon die dit zonder problemen doorstaat, is over een jaar nog steeds bruikbaar, wanneer de cursus veel meer modules bevat dan de demo ooit liet zien.

Test smalle schermen vroegtijdig

Typen op een telefoon voelt anders aan en de lay-out moet daar rekening mee houden. Naarmate de breedte afneemt, moeten de oefentekst, het invoergebied en de resultaten in een logische volgorde blijven, in plaats van dat de timer ver boven de getypte woorden uitsteekt. Met de responsieve weergavemodi van Nicepage kunt u een ontwerp bekijken op grote schermen, laptops en telefoons. De documentatie over responsieve weergavemodi (https://nicepage.com/doc/1125/responsive-modes) behandelt deze weergaven. Voer deze controle uit tijdens het selectieproces, want een zwakke, smalle lay-out is gemakkelijker af te wijzen dan te verbeteren.

De echte maatstaf voor een HTML-sjabloon voor typen is hoe geschikt het is voor daadwerkelijk typwerk: een duidelijke oefeninterface, resultaten die een plek hebben om te worden weergegeven en secties die u snel kunt aanpassen. Die geschiktheid is belangrijker dan de perfectie van de demotekst.