Maak en wijzig 2D- en 3D-knoppen, onzichtbare knoppen en design-knoppen met de knopmaker. Design-knoppen kunnen uit ontelbare combinaties van stijlen en afmetingen bestaan, mét en zonder grafische effecten als schaduw en transparantie, pictogrammen en zelfs kleurstroken. Knopkleuren worden automatisch aangepast aan het kleurenpalet van het project.
Selecteer eerst het type knop dat u wilt maken. De specifieke eigenschappen van elk type worden onder het gekozen type weergegeven. Alle knoppen (behalve onzichtbare knoppen) hebben dezelfde tekstopties.
Gebruik het voorbeeld om de weergave van de knop die u maakt te controleren in de drie mogelijke posities:. verhoogd, aangeklikt en rollover.
Tekst:
Typ de tekst voor de knop in het veld.
Klik op het tekstpictogram als u de tekstopties wilt wijzigen (grootte, kleur, lettertype enzovoort).
Klik op het pictogram Bewerken om de geavanceerde tekstopties weer te geven: wijzig de tekstweergave in de positie Verhoogd, Aangeklikt en Rollover. Schakel het desbetreffende selectievakje uit als u de opties voor de posities 'aangeklikt' en 'rollover' wilt weergeven.
U kunt ook een ander letterbeeld gebruiken door de grootte of kleur te wijzigen, of een verschuiving of effect toepassen (gegraveerd of reliëf) om een feedback-effect voor de knoppen te bieden. Zorg ervoor dat u niet teveel opties tegelijk gebruikt. Hierdoor ontstaat een te bont effect dat tijdens de navigatie alleen maar gaat vervelen.
Waarschuwing:
de knoppen worden naar afbeeldingen geconverteerd wanneer ze via internet worden verspreid. De toepassing van compressiealgoritmen op afbeeldingen die tekst bevatten, kan een merkbare visuele afname van typografische tekens tot gevolg hebben. Controleer het resultaat door het in een browser te bekijken. Het voordeel is dat elk lettertype kan worden gebruikt aangezien de letters worden geconverteerd naar afbeeldingen op de knoppen.
2D:
Als u een 2D-knop wilt maken, selecteert u een kleur en een transparantieniveau, en een dikte en kleur voor de rand. Voer de waarde '0' in voor de dikte als u een knop zonder rand wilt.
Voor een betere ergonomie kunt u andere instellingen voor de posities 'Verhoogd', 'Aangeklikt' en 'Rollover' kiezen om aan de gebruiker kenbaar te maken dat er iets zal gebeuren wanneer hij/zij klikt.
Ontwerp
Selecteer eigenschappen in de vervolgkeuzemenu's als u met slechts enkele klikken knoppen met geavanceerde grafische eigenschappen wilt maken.
Type: Standaard
Standaardknoppen hebben geometrische vormen met schaduw en 3D-diepte-effect. Kies een vorm en grootte en voeg een reliëfeffect toe om een knop te maken.
De hoogte van de knop geeft aan hoe de knop wordt weergegeven: plat of verhoogd (met reliëf of schaduw). Selecteer één kleur, of twee kleuren als u een gekleurde strook aan de knop wilt toevoegen. Verander deze instellingen volgens de positie ('Verhoogd', 'Aangeklikt', 'Rollover') om de knop zo dynamisch mogelijk weer te geven.
Type: Pictogram
De pictogramknop gebruikt een afbeelding om een veelvoorkomende actie (Accepteren, Annuleren enzovoort) of een bestemming (Startpagina, Terug enzovoort) weer te geven. Deze knoppen zijn uiterst nuttig omdat ze zijn gebaseerd op visuele afspraken die de navigatie door uw website vereenvoudigen.
Het pictogram komt overeen met het pictogram dat u in de vervolgkeuzelijst in de desbetreffende sectie selecteert. Kies de vorm, de structuur en de hoogte van de pictogramknop in het bovenste gedeelte.
U kunt reliëf aan de knop toevoegen door een effect (verhoogd reliëf of schaduw) toe te voegen.
Kies twee kleuren: een voor de achtergrond van de knop en een voor het pictogram. Verander deze instellingen volgens de positie ('Verhoogd', 'Aangeklikt', 'Rollover') om de knop dynamischer weer te geven door het selectievakje 'Verhoogd pictogram gebruiken' uit te schakelen.
Opmerking:
Omdat pictogramknoppen vrij klein zijn, is het toevoegen van tekst boven een pictogram niet doeltreffend. De beste manier om een pictogramknop te beschrijven, is door scherminfo toe te voegen via het tabblad Acties. U kunt gewoon de bestemming van de knop noemen of korte instructies geven (bijvoorbeeld "Neem contact met mij op voor meer details" op een knop E-mail).
Type: 3D
Schakelknop:
deze knop geeft de indruk 'omhoog' te staan in rusttoestand, en 'ingedrukt' te zijn als erop is geklikt. Hierdoor kunnen twee toestanden aan de knop worden gekoppeld: niet ingedrukt en wel ingedrukt – te vergelijken met de Pauze-knop op een bandrecorder. Als u één keer op de knop drukt, wordt deze ingedrukt.
Drukt u er een tweede keer op, dan krijgt de knop de beginpositie terug. Net als de knop op een taperecorder. Wanneer u er eenmaal op drukt, blijft deze ingedrukt. Als u er nog eens op drukt, springt de knop terug naar de oorspronkelijke positie.
Type: Afbeeldingsknop:
Als u een afbeeldingsknop wilt maken, hebt u drie afbeeldingen nodig om de posities 'Verhoogd', 'Aangeklikt' en 'Rollover' weer te geven.
Verhoogd: Afbeelding van de knop op de pagina
Ingedrukt: Afbeelding wanneer de knop is aangeklikt
Rollover: Afbeelding wanneer de muis over de knop wordt bewogen
Alleen de verhoogde positie is verplicht. De andere afbeeldingen zijn bedoeld om visuele feedback te geven wanneer de knop is ingedrukt of wanneer de muis over de knop wordt bewogen.
Type: Onzichtbare knoppen
Deze knoppen zijn zeer handig om hotzones in te stellen op afbeeldingen of technische illustraties. U kunt deze knoppen combineren met knopinfo om de onderliggende afbeelding te kunnen verkennen.
U kunt de grootte van een onzichtbare knop aanpassen aan de grootte van de afbeelding op een pagina.