Pour changer le fuseau horaire sur Ubuntu Serveur (donc en console), passer en su et taper :

dpkg-reconfigure tzdata

Puis choisir Europe, puis Paris. C’est tout ^^

Illustration par Leoplus

wget est, bien souvent, intégré en standard dans les distributions Linux, mais malheureusement pas sous OS X…
Voici comment pallier à ce manque :

Tout d’abord, téléchargez wget pour OS X.
Décompressez l’archive en double-cliquant dessus.
Ouvrez un Terminal
Rendez-vous dans le dossier décompressé :

cd Desktop (si c'est sur le bureau)

cd Downloads (si c'est dans votre dossier Téléchargements)

Passez en su (super-utilisateur) :

sudo su

Il est possible que les dossiers /usr/local/bin et /usr/local/etc n’existent pas (c’était mon cas) , dans ce cas il faudra les créer :

mkdir /usr/local/bin
mkdir /usr/local/etc

Maintenant, vous allez déplacer l’application dans le dossier bin :

mv wget /usr/local/bin

Créez les dossiers pour la documentation (man) :

mkdir /usr/local/man
mkdir /usr/local/man/man1

Puis, copiez-y le fichier de documentation :

mv wget.1 /usr/local/man/man1

Maintenant, copiez le lanceur :

mv wgetrc dans /usr/local/etc

Il ne vous reste plus qu’à supprimer les fichiers téléchargés :

cd ..

rm wget -R

Fermez le terminal, puis ouvrez-le à nouveau pour pouvoir profiter de l’utilitaire wget.

Un grand merci à Jonas pour les explications et le fichier zip ^^

Pour rappel, une feuille de style est un document qui permet d’habiller tous les éléments HTML de votre page pour la rendre plus élégante et attrayante aux yeux des visiteurs.

Cet habillage se fait par une syntaxe claire, mais, dans les grosses pages, les éléments HTML et leurs classes peuvent être nombreux, et par conséquent, la feuille de style devient vite un vrai bordel ? bazard ? oui, un vrai bordel.

Ainsi, il devient vite indispensable, lorsqu’on attaque un gros projet, de se montrer organisé et méthodique avec tous ce genre de scripts.

Voici donc les étapes que j’applique (en théorie) sur de “gros” projets. (par gros, comprenez que les éléments HTML à habiller sont assez nombreux …)

1/ Organiser ses balises

L’organisation des balises est un vaste débat, il y a les partisans du rangement alphabétique (ou plutôt alphanumérique), et ceux qui bossent sur la hiérarchisation, suivant ainsi l’organisation du document HTML à habiller.

Des deux méthodes (qui ont chacune leurs avantages et leurs inconvénients), ma préférence va à la seconde.
La raison de mon choix est toute simple : j’aime que mes feuilles de styles suivent (à peu près) l’ordre de mon document HTML. En principe, je pars de l’élément le plus gros, grand, englobant, bref de toute façon c’est souvent la balise html elle-même. Pour finir par mon élément le plus petit, enfant, le dernier de la hierarchie (c’est souvent un em ou un td).

html{/*la première balise*/}

body{/*sa descendante/fille*/}

div#header{/*mon premier cadre*/}

div#logo{/*le logo se trouvera dans mon header*/}

div.corpsdelapage{/**/}

etc…

Ainsi, je retrouve (normalement) mes balises.

1bis/ Ranger les propriétés

Tout comme l’ordre des balises, l’ordre des propriétés définies à l’intérieur de celles-ci n’a aucune importance pour les navigateurs, en revanche, il peut revêtir une importance capital pour vous ou les développeurs qui passent derrière vous.

Dans une logique toute logique bête simple, je classe donc mes propriétés par ordre alphabétique.

div.monJouliDiv{
background : #112211;
border : 1px solid #ccc;
height : 20px; //etc …
}

2/ Reset pour tous

Je ne vous invite pas à redémarrer votre ordinateur, ni à fermer cette page (surtout pas ^^), mais je vous propose d’instaurer des valeurs par défaut cohérentes à vos balises.
Quand on attaque un habillage en partant de zéro et/ou lorsqu’on souhaite réaliser une page compatible avec tous les navigateurs, on se heurte souvent à des décalages, des cadres qui “sautent”, se chevauchent, etc ….

La raison en est simple : les navigateurs imposent un style par défaut pour chaque balise HTML. Le reset est donc un manière de pallier à ce genre de problèmes. Voici comment je (et de nombreux développeurs, intégrateurs et designeurs) procède :

html, body, div, h1, h2, h3,  ul, ol,  li, p,  form, fieldset, table, th, td { margin: 0; padding: 0; } // Placez les balises selon votre document HTML

3/Soignez votre “présentation”

Je sais que les scripts ne sont pas la partie visible de votre site mais il est important (à mes yeux) d’en soigner l’écriture.
Il existe de nombreuses manières de mettre en page ses balises et leurs propriétés.

Personnellement, je laisse mes propriétés en ligne lorsqu’elles sont moins de 4 par balises, au delà, je mets des retours à la ligne pour chacune (en prenant soin d’indenter mes lignes d’une tabulation).

body{margin:0;padding:0}

h1{
border : 1px dashed #000;
font-size : 50pt; //ça devrait être lisible …
letter-spacing : 30px;
text-decoration:none; //surtout pas de blink, avec une police aussi grosse ^^
//etc…
}

4/ Commentez !!!

Les commentaires constituent le point de repère principal pour vous y retrouver dans toutes ces balises, mots en anglais et autres #.* etc … De plus, je fais parti des petits fouineurs, des types qui pour une raison ou une autre vont jeter un coup d’œil au code source d’un site, à ses javascripts ainsi qu’à ces feuilles de styles, donc merci de commenter ça me facilitera la tâche

Tout comme en PHP et Javascript (ainsi qu’en C/C++, et bien d’autres langages), les commentaires sont soit :

• précédés d’un double slash  : //mon commentaire se terminera en fin de ligne
• ou alors entourés par /* et */ : /* ce commentaire se finira après ce symbole */

Évidemment, certains de ces conseils vous sembleront logiques et simples, mais je pense qu’ils sont loin d’être inutiles pour quiconque souhaite attaquer sainement avec les CSS.

Et vous (oui, vous qui avez eu le courage de tout lire jusqu’au bout ^^), avez-vous d’autres astuces à partager ?

Cet article est inspiré de celui-ci

Malheureusement, j’ai eu droit à un

Briefly unavailable for scheduled maintenance. Check back in a minute.

Et ce, même dans la partie wp-admin … Bref, c’est la merde pas top ^^

Le problème est que l’auto-upgrade n’a pas supprimé le dossier “.maintenance” de mon dossier WordPress…

Pour débloquer la situation, il suffit d’accéder à son FTP et de supprimer ce fichier…

Ce site était au départ un mémo perso pour le développeur. Il a décidé de l’agrémenter avant de le partager avec le reste des utilisateurs francophones de la librairie javascript.

C’est du bon, du très bon. Je pense que je vais en faire un usage assez intensif et m’excuse par avance auprès de Jarod pour les surcoûts en bande passante ^^

Ceci étant dit, le prochain OS de Microsoft s’annonce plus que prometteur, en effet, Windows 7 apparait comme plus rapide au boot et moins gourmand en ressources que Vista.

Vendredi 9 Janvier, Microsoft a mis la première version beta de 7 à disposition de 2.5 millions  d’internautes pour un premier test.  Après un démarrage plutôt laborieux des téléchargements, de nombreux guide sont apparus sur le net pour installer cette beta, voici ma sélection :

• Commençons par un guide d’installation “normale” de Windows 7 proposé sur Ordinatique. Sachez qu’il est tout de même plus prudent d’installer cette beta sur une machine virtuelle (genre VirtualBox …).
• Pour ceux qui ne souhaiteraient partager leur machine pour comparer 7 avec ces prédécesseurs, LifeHacker publie un guide pour installer Windows 7 en dual boot avec XP ou Vista.
• Les Mac-Users ne sont pas oubliés, avec un guide d’installation de Window 7 pour Macbook Pro proposé par OurCoffeStops. Ce tuto montre les étapes d’installations de la version 64 bits.

Pour ceux qui souhaiteraient télécharger Windows 7, sachez que Microsoft ouvrira plus de slots de téléchargements à partir du 24 Janvier. Le téléchargement se fera depuis la page officielle de Windows 7. Notez toutefois que cette version est limitée dans le temps et cessera de fonctionner début Août.
Pour ma part, je ne l’ai pas encore installée, faute de pouvoir la télécharger lorsqu’elle a été mis à disposition… J’attends donc patiemment le 24 ^^

Et vous ? avez-vous installé Windows 7 ? Qu’en pensez-vous ?

Je vous invite à en découvrir plus dans la suite…

1/ Les forces en présence :

Les feuilles de styles sont un moyen efficace d’habiller toutes ces pages web de manière homogène, de créer facilement des thèmes et d’alléger le code HTML.
Gros avantage de ces feuilles de style : Vous définissez une seule fois les propriétés (style) d’une balise HTML pour les voir s’appliquer sur toutes les occurrences de cette même balise.

Par exemple, sans CSS, pour afficher tout les liens hypertexte en couleur rouge, on écrit :
<a href=”index.html” style=”color: #ff0000″>Home</a>
et ce, pour chaque lien présent sur la page.

Avec du CSS, on écrit toujours la syntaxe classique du lien hypertexte soit :
<a href=”index.html”>Home</a>
dans le fichier HTML. Puis, on écrit dans le fichier CSS :
a{ color:#FF0000 }
Ainsi, on écrit le style une seule fois.

“C’est bien joli, je vois le principe, mais concrètement, ça ne me dérange pas de faire des copier-coller pour écrire mes liens…”
L’intérêt se trouve dans la non-répétition du style. Imaginons maintenant que votre site présente une vingtaine de liens, vous écrivez ceux-ci en utilisant la syntaxe habituelle : <a href=”"></a> et tous vos liens arboreront une belle couleur rouge.

2/ Mise en place :
La feuille de style (CSS) est un fichier portant l’extension .css (on l’aurait deviné …)
Elle doit être désignée par la page HTML via un “link” placé entre les balises <head> et </head> dont voici la syntaxe :
<link rel=”stylesheet” type=”text/css” href=monStyle.css” media=”all” />
rel=”stylesheet” nous indique que l’on charge une feuille de style.
type=”text/css” signifie qu’il s’agit d’un contenu en texte, et que c’est du css
href=”monStyle.css” est l’url du fichier
media=”all” indique que cette feuille de style sera utilisé pour tout type d’affichage (écran, imprimante, projecteur, etc …)

Maintenant, vous allez pouvoir créer votre page HTML ainsi que le fichier de style.

3/ Impose ton style !
Nous allons maintenant passer à du concret. Dans un premier temps, créons 2 fichiers :
Le premier sera notre fichier HTML, appelons-le index.html
Le second sera donc la feuille de style, appelons-la style.css

Ouvrons le fichier HTML, et écrivons une base classique :
<html>
<head>
<title>Ma page avec du CSS dedans</title>
<link rel=”stylesheet” type=”text/css” href=”style.css” media=”all” />
</head>
<body>
<h1>Je suis un titre de type H1</h1>
<ul>
<li>Les listes en gras, c’est très sympa !</li>
<li>surtout avec un texte aussi inspiré</li>
</ul>
<a href=”./”>Cliquez-moi dessus !!!</a>
<br />
<a href=”./”>Non, cliquez sur moi !</a>
</body>
</html>
Je pense que ce sera suffisant pour l’exemple.

Maintenant, passons au fichier CSS :
h1{color:#00FF00}
li{
font-weight:bold;
background-color:#00FF00;
color:#FF0000;
}
a­{text-decoration:blink}
Voilà, pour le style.
Maintenant, afficher votre page dans le navigateur et admirez le résultat.

Je vous laisse donc sur cet exemple, et vous promet de revenir très rapidement pour la suite.

Ce blog, lancé il y a tout juste un an, donne des astuces dans divers domaines informatiques (OS, navigateurs, web 2.0, etc …), dans l’esprit de HowToForge . Des tests, des coups de pouce, des tutos pour découvrir les nouvelles applications qui font l’informatique, et l’Internet de demain. Parmi les nouveautés présentées récemment, ils nous proposent un découverte de gOS (le système d’exploitation incluant de nombreux services Google) ainsi que des astuces pour Leopard (le nouveau système MacOS). Simple Help est donc un site s’adressant aux bidouilleurs, aux accros du net qui souhaitent agrandir leurs connaissances des technologies Web 2.0 Perso, leur flux rss est en stock et n’attend que les nouveaux articles…