Impression et en-tête de page : casse-tête

Il y a quelques semaines, je travaillais sur un template de bilan comptable, destiné a être imprimé via notre application IBAKUS®COMPTA, dans lequel l’en-tête de page devait se répéter sur chaque pages du document.

L’en-tête de page était constitué de plusieurs éléments permettant d’identifier le déposant (le nom de la société, son adresse, son numéro RC et TVA, etc.), la date d’impression, le titre du document, etc. Quelque chose dans ce style là : Continuer la lecture de Impression et en-tête de page : casse-tête

Flexbox Patterns – éléments d’interfaces avec flexbox

Utiliser les Flexbox CSS pour le design d’interfaces utilisateurs est devenu de plus en plus courant , d’une part parce que réaliser des mises en pages complexes est beaucoup moins casse-tête en utilisant les Flexbox CSS qu’en utilisant la vieille technique des boîtes flottantes (float: left, float: right) et bénéficie d’un meilleur support des navigateurs Web actuels. Pourquoi s’en privé !

Flexbox Patterns

Flexbox Patterns de CJ Cenizal présente à travers différents exemples d’interfaces utilisateurs, les nouvelles propriétés CSS liées à Flexbox et comment les utiliser .

Nettoyer une chaîne de caractères avec PHP

Quoi de plus simple que de nettoyer une chaîne de caractères pour l’utiliser comme URL vers une page, un article ou tout autre contenu publié sur Internet en général ? Et pourtant…

Bien que très simple à mettre en place dans les faits, quand vient l’heure de nettoyer une chaîne de caractères pleine d’accents, de signes de ponctuation et autres caractères spéciaux, c’est la galère. Continuer la lecture de Nettoyer une chaîne de caractères avec PHP

List.js

List.js est une petite libraire Javascript qui permet d’ajouter très rapidement et simplement des fonctionnalités de tri, de filtrage et de recherche à une liste HTML existante, sans en altérer le code.

Voilà comment la librairie fonctionne :

<div id="users">
  <input class="search" placeholder="Search" />
  <button class="sort" data-sort="name">
    Sort by name
  </button>

  <ul class="list">
    <li>
      <h3 class="name">Jonny Stromberg</h3>
      <p class="born">1986</p>
    </li>
    <li>
      <h3 class="name">Jonas Arnklint</h3>
      <p class="born">1985</p>
    </li>
    <li>
      <h3 class="name">Martina Elm</h3>
      <p class="born">1986</p>
    </li>
    <li>
      <h3 class="name">Gustaf Lindqvist</h3>
      <p class="born">1983</p>
    </li>
  </ul>

</div>
<script src="http://listjs.com/no-cdn/list.js"></script>

Ensuite un simple appel à la fonction List() et le tour est joué

var options = {
  valueNames: [ 'name', 'born' ]
};

var userList = new List('users', options);

See the Pen zpuKF by Jonny Strömberg (@javve) on CodePen.

Créer un pixel de suivi

Ces dernières semaines, j’ai essentiellement travaillé sur la conception d’un cookie/pixel de suivi et le traitement des informations récupérées, pour en faire des tableaux statistiques et autres graphiques de fréquentation par la suite. Je vous parlerai peut-être de mon expérience avec la librairie JavaScript C3.js dans un prochain article.

L’intérêt d’un tel dispositif est de pouvoir « tracker » ce qu’un visiteur fait lorsqu’il parcours votre site Web, ou encore de savoir si une campagne emailing a bien été ouverte. Continuer la lecture de Créer un pixel de suivi

Une navigation 3D en CSS et jQuery

Les éléments  de navigation sont essentiels lorsqu’on conçoit un site Internet, que ce soit pour la navigation entre les différentes pages d’un site, ou simplement se déplacer vers différentes sections d’une même page.

navigation 3D responsive en CSS

Claudia Romano propose un concept de navigation responsive simple mais avec beaucoup de caractère. Idéal pour la navigation d’un site type portfolio.

Astuce Sass : imbrication de propriétés composites

Cette semaine je lisais Sass pour les Web designers, de Dan Cederholm et j’ai découvert une petite astuce que je ne connaissait pas : l’imbrication de propriétés composites. Continuer la lecture de Astuce Sass : imbrication de propriétés composites

Créer son framework PHP Objet

Pour faire suite à un article que j’avais écrit il y a un peu plus de quatre ans maintenant sur la création d’un framework PHP, je vous propose de créer un framework PHP Objet en utilisant les principes MVC. Continuer la lecture de Créer son framework PHP Objet

Une présentation vidéo en HTML, CSS et JS

Il y a déjà quelques mois, j’ai eu la tâche de trouver un moyen de présenter différent aspects d’une application que mes collègues et moi développons chez Ibakus Europe.

L’idée était de faire une sorte de présentation vidéo expliquant les différents menus de l’application et que l’on puisse « naviguer » dans celle-ci, un peu comme une sorte de PowerPoint vidéo. Continuer la lecture de Une présentation vidéo en HTML, CSS et JS

Définir une grille de mise en page avec Sass

Dans mon précédent article, je parlais de mon expérience des pré-procésseurs CSS, et l’une des choses bêtes que Sass/Compass m’a permis de faire facilement et en quelques lignes a été de définir ma grille de mise en page.

Ma grille de mise en page consistait en six colonnes et des gouttières de 20 pixels entre chaque et un conteneur de 1000 pixels de large. Afin de toujours me laisser le choix de partir sur un nombre de colonne différent, la largeur de colonne est calculée en fonction des autres variables. Voici ce que ça donne : Continuer la lecture de Définir une grille de mise en page avec Sass