keul.fr - du web et du code

Aller au contenu | Aller au menu | Aller à la recherche

This site is vachement mieux viewed in firefox.

jeudi, 16 mars 2017

La communication web

Concevoir un site web, c'est créer des pages web à afficher aux visiteurs pour leur donner des informations ou leur faire réaliser une action (poster un commentaire, dialoguer, acheter...) via une interface utilisateur.

Ces interfaces peuvent être efficaces ou mal faites (tel que celles rencontrées dans mon dernier article), être plus ou moins adaptées pour les handicapés et utilisé avec des objets connectés, mais pas dans le bon sens. Le web regorge d'articles, avec par exemple le  problème des icônes de menu et beaucoup d'autres conseils.

Sauf qu'au-delà de ces interfaces se cache aussi un autre aspect: la relation et l'image retournée.

Regardons ça de plus près.

Lire la suite...

vendredi, 2 décembre 2016

L'interface utilisateur, ce qu'il ne faut pas faire.

Suite à la sortie d'un film sacrément attendu, je suis passé sur le site d'UGC pour réserver ma place de cinéma.

Armé de ma carte bancaire, d'une carte de fidélité UGC basique (je vais 2-3 fois par an au cinéma) et d'un compte que j'avais créé sur le site à l'époque, je m'apprête à réserver ma place.Généralement, j'achète sur place, mais vu qu'il s'agit d'une avant-première de Your Name, la réservation était nécessaire.

Et là, c'est le drame.

Lire la suite...

jeudi, 27 octobre 2016

Mise en place d'un Wiki

CodePen est pratique pour partager des astuces mais il se limite à ce qui est JavaScript, CSS et HTML.

J'ai une collection de fichiers textes qui contiennent des bouts de code, astuces et autres exemples de script ainsi que de la documentation que j'utilise assez souvent.

J'ai donc installé un wiki histoire d'avoir une interface plus agréable et facile à gérer pour administrer tout ça.

C'est disponible en lecture seule ici: http://wiki.keul.fr

Bien entendu, je vais importer et trier au fur et à mesure de mon temps libre mes fichiers.

vendredi, 2 septembre 2016

Auto-complete en JavaScript

S'il existe des systèmes pour faire de l'autocomplétion en javascript, tous ont le même défaut: ils ne sont pas capable de detecter des fautes de frappe ou de proposer des résultats qui s'approchent de la recherche voulue.

Mailcheck propose un système qui s'en approche: il permet de corriger les fautes de frappe dans un nom de domaine par exemple. Il utilise une fonction venant de sift3 : Super Fast and Accurate string distance algorithm. Dans la version 4 (sift4), la version Simplest gère les rempalcement/ajout/suppression de caractère (Distance de Levenshtein) . La version common gérant les transpositions (Distance de Damerau-Levenshtein).

Cet algorythme se base sur le calcul de la plus longue distance de chaine commune. Hors il reste un problème : imaginons que notre mot à chercher dans une liste de phrase ne soit pas unique mais que l'on souhaites chercher plusieurs mots, avec d'éventuelles fautes de frappe.

J'ai donc mis en place un petit script qui calcule pour un mot chercher un score pour chaque phrase d'une liste. Ce score est d'autant plus élevé que les sous-chaines de la recherches trouvées dans les phrases sont longues et nombreuses.

Il est disponible ici: http://codepen.io/keul/pen/rrNpAA

 

 

 

vendredi, 13 mai 2016

Bouts de code javascript: on va passer par codpen

Les blogs ne sont pas très efficaces pour afficher du code et en faire des démo rapidement, j'ai donc préféré mettre quelques-uns de mes bouts de code javascript sur codepen: http://codepen.io/keul/

Bien entendu, c'est du Vanilla JS, donc pas besoin de JQuery ou autres librairies javascript et s'assurer de bonnes performances.

Un des scripts permet d'avoir des cases à cocher dans un menu déroulant (dont la version native est assez moche, n'étant aps déroulante): c'est dispo ici.

dropdown_checkbox.png
 

Un second script permet d'avoir des entêtes de tableau fixes comme dans els tableurs. disponible ici, et une variante pour les tableaux trop larges est disponible là.

fixedheader.png
 

J'ai fait une sauvegarde ici au cas où ils ne seraient plus accessibles sur codepen

- page 1 de 8