Un template vide mais avec tout ce qu’il faut

Marre de devoir réécrire a chaque fois la structure de base, appels script et css, reset de vos page html?

Il existe beaucoup de solutions pour vous épargnez ces taches.

Utilisez Initializr et commencez à coder du contenu en 15 secondes

initializr logo

http://www.initializr.com/

L’excellent site Alsacréations nous a également distillé une savoureuse solution digne des meilleurs produits de cette belle région.

logo schnapsit
https://schnaps.it/

Z-index et absolute

Le concept du z-index parait simple, plus la valeur est haute, plus l’élément sera en haut de pile, mais dans le pratique, si on utilise un positionnement en absolute ça pourrait ne pas se passer comme vous l’entendez et vous pourriez y perdre quelques cheveux.


Voici un article qui vous aidera à mieux comprendre ce qui se passe:
https://philipwalton.com/articles/what-no-one-told-you-about-z-index/

To close or not to close

Comme tout le monde le sait, on doit toujours refermer ses balises en HTML

<html> </html>

mais quelques unes NE DOIVENT pas être fermées, on les appelle des balises auto-fermantes. Dans les versions précédentes d’HTML il était nécessaire de mettre un slash avant la fermeture de la balise ouvrante />, maintenant ce n’est plus obligatoire, vous pouvez donc toujours utiliser les deux syntaxes :

<meta charset="UTF-8">
ou 
 <meta charset="UTF-8" />


Liste des balises auto-fermantes (self closing tags) qui en doivent PAS être fermées:

    <area />
    <base />
    <br />
    <col />
    <embed />
    <hr />
    <img />
    <input />
    <link />
    <meta />
    <param />
    <source />
    <track />
    <wbr />

Media Queries Breakpoints

Une liste des valeurs de rupture (breakpoint) à mettre dans vos media queries, mais veillez en priorité a respecter les valeurs de la feuille de style mère.
La page est assez bien fournie et regroupe les principaux framework css du marché.
Tout cela reste des suggestions et ça ne couvrira pas forcément tous les spécificités des appareils du marché.


https://media-queries.aliasdmc.fr/media-queries-live.php

Sticky Footer

Un footer qui se retrouve en milieu de page, ça ne se fait pas!

Un pied de page (footer) doit toujours être en bas de page, même si le contenu ne remplis pas la page. Malheureusement, bon nombre de templates négligent ce fait.
sticky footer

Dans le lien ci-dessous vous découvrirez 5 techniques vous permettant de le faire, à vous de choisir la meilleure technique suivant l’architecture de votre site.
(en ce qui me concerne, la méthode avec calc() me parait la plus commode, pour autant que vous n’ayez pas trop de contraintes concernant la rétrocompatibilité)