L’Outil Surpuissant pour Exploser ton Chiffre d'Affaires en 2024 !
L'élément Button pour les applications Web
Un bouton bien conçu peut être une étape cruciale pour emmener vos utilisateurs sur le chemin de votre site. Apprenez la différence entre un bouton HTML de base et un bouton avec l'interface utilisateur de Kendo.
Un bouton est un élément qui représente une action. Il peut être stylé de différentes manières. Vous pourriez le voir comme une bordure autour d'un texte ou d'une image. Peu importe à quoi ça ressemble, son but est de communiquer à l'utilisateur que c'est un élément interactif qui fera quelque chose.
Que quelque chose pourrait être d'ouvrir une boîte de dialogue, soumettre un formulaire, aller à une autre page, ou tout autre action que vous programmez le bouton pour répondre. Un bouton peut sembler simple, mais il y a du travail en arrière-plan pour en créer un. Avec un bouton HTML par défaut, vous devrez ajouter les styles et le comportement pour le rendre vivant. Avec un thème la plus grande partie de cette lourde tâche sera prise en charge pour vous. Dans ce post, je vais vous montrer la différence en utilisant un bouton HTML de base et le bouton Kendo UI .
Le bouton HTML
Une façon de créer un bouton utilise le élément. Cela vous donnera un style par défaut et vous pouvez spécifier le comportement de l'élément en ajoutant un attribut de type réinitialiser soumettre ou bouton . Type réinitialiser et submit ont un comportement par défaut qui fonctionne avec les formulaires. Voici un exemple d'implémentation:
Les autres options de création d'un bouton utilisent un élément ou un élément . Un bouton de soumission pour un formulaire peut être créé en utilisant l'élément . Un bouton de lien peut être créé en utilisant l'élément . De plus, vous pouvez utiliser un élément
ou tout autre élément pour créer un bouton. Ces options n'auraient aucun style et aucun comportement.
Le bouton d'interface utilisateur de Kendo
Avec l'interface utilisateur de Kendo vous obtenez les styles et le comportement de votre bouton. Vous pouvez personnaliser l'apparence de votre bouton avec le thème par défaut pour l'interface utilisateur de Kendo, un autre thème comme Bootstrap et Material, ou créez le vôtre avec leur générateur de thème . Pour commencer à utiliser Kendo UI dans votre page Web, vous devez ajouter une feuille de style de base, une feuille de style de thème, la bibliothèque jQuery et la bibliothèque JavaScript Kendo UI. Vous pouvez personnaliser votre bouton en ajoutant des classes à l'élément comme ceci:
Le bouton peut être personnalisé en utilisant jQuery en configurant les options du bouton. Vous pouvez ajouter l'option permettant d'activer ou de désactiver le bouton, ajouter une image au bouton et ajouter un gestionnaire d'événements cliquez sur . Le code suivant désactive le bouton principal, ajoute une image en ligne et un événement cliquez sur :
Bouton Basic par rapport au bouton UI Kendo
Voici une comparaison de ce que font les différents boutons:
| Bouton de base | Bouton d'interface utilisateur Kendo | |
|---|---|---|
| Styles | Styles de thème | |
| Personnalisation des styles | Ajouter votre propre feuille de style | Modifier la feuille de style de thème |
| Actions | Tout événement de souris | Événements de clic |
| Actions de personnalisation | listeners | Ajouter un gestionnaire d'événement via les options du bouton |
L'utilisation d'un bouton HTML par défaut vous donne le strict minimum requis pour qu'un bouton fonctionne. Vous êtes responsable de l'ajout du CSS et JavaScript pour l'améliorer. Un bouton Kendo UI, d'autre part vient avec un ensemble de styles que vous pouvez utiliser et une interface pour personnaliser le comportement de votre bouton. Si vous utilisez déjà le thème de l'interface utilisateur de Kendo dans un projet, l'utilisation du bouton de Kendo UI s'intégrera bien car il aura le même aspect que vos autres composants.
Conclusion
Le bouton est un aspect important d'une application qui ne devrait pas être pris pour acquis. Les boutons peuvent emmener l'utilisateur dans un voyage à travers votre site vers des endroits qu'il pourrait ne jamais trouver par lui-même. Ils peuvent communiquer tellement avec la couleur, la forme et les images sans dire un mot. Un bouton d'image d'une flèche droite à la fin d'un message vous indique comment accéder à la page suivante. Un bouton rempli de rouge vif vous avertit que l'action suivante peut nuire, comme la suppression ou l'annulation. La manière dont vous utilisez un bouton dans vos applications est importante pour l'expérience utilisateur et doit être cohérente avec votre image de marque globale.
Vous voulez essayer l'interface utilisateur de Kendo?
Vous voulez commencer à profiter du bouton Kendo UI ou l'un des autres 70+ composants d'interface utilisateur Kendo prêts à l'emploi, comme Grid ou Scheduler ? Vous pouvez commencer un essai gratuit de Kendo UI aujourd'hui et commencer à développer vos applications plus rapidement.
Commencer mon test d'interface utilisateur de Kendo
Les commentaires sont désactivés en mode prévisualisation.
[ad_2]
Source link