Tag

IE

Browsing

Ces derniers temps, je travaille sur le site internet du collège. Du coup, j’ai moins de temps pour le mien tiens.

Bref, j’y travaille donc et je rajoute quelques petits liens utiles comme des liens vers l’Inspection Académique, le Bulletin Officiel, le site académique… que des sites qui ne sont visités que par les personnels de l’Éducation Nationale en somme.

Vu que je fais les liens, je jette un œil au sites sus-cités. Et là, paf!, un message d’erreur que je ne peux m’empêcher de partager ici avec vous :

Alors là, bien joué les gars ! C’est bien la peine d’avoir un site XHTML 1.0 valid (bel effort, soulignons-le) si c’est pour mettre à la porte tous les visiteurs qui possèdent un navigateur autre qu’Internet Explorer 8 ou Firefox 3.

Bon, c’est une astuce un peu érodée maintenant et je suis sûr que vous êtes plusieurs ici à la connaître mais je la rajoute quand même ici pour référence.

J’ai montré cela au responsable TICE de mon collège récemment et il n’en revenait pas : il est bel et bien possible de modifier n’importe quelle page web avec n’importe quel navigateur et tout cela directement en ligne, en utilisant une ligne de javascript.

Je me suis rendu compte en rédigeant mes articles sur l’installation du serveur dédié que le code bash, lorsqu’il était un peu long, n’allait pas à la ligne mais était écrit d’une seule ligne dans son conteneur, forçant une barre de navigation horizontale bien disgracieuse… Heureusement, cela est maintenant une chose du passé.

Le code est affiché sur le site avec la balise pre, qui permet l’affichage d’un texte pré-formaté. Or la particularité de cette balise est qu’elle désactive le retour à la ligne. Voici une astuce en CSS pour contre-carrer cet effet indésirable.

/* Forcer le retour à la ligne de la balise PRE - skyminds.net */		
pre {
   white-space: pre-wrap;             /* CSS3 */
}

Et voilà, nouvelle étape pour le site : nous fêtons les 10 ans de SkyMinds.net aujourd’hui – champagne !

Historique du site

Pour la petite histoire, j’ai créé le site en 1998, un an à peu près après mon séjour aux États-Unis. Le lycée dans lequel je me trouvais possédait pléthores de salles informatiques, avec une soixantaine de PC connectés à Internet. J’y ai passé pas mal de temps à rechercher un peu de tout : la plupart des sites étaient alors textuels, sans recherche esthétique particulière comme aujourd’hui. Il y avait peu d’images et il fallait attendre un certain temps avant de voir les pages se charger. Google était inconnu et les moteurs de recherche par défaut étaient Yahoo, Altavista, WebCrawler ou Excite. On surfait alors avec des modems 14.4K…

10-years

En 1998 donc, j’ouvre la première version du site. Le site est bleu et blanc, avec des frames pour le menu qui se trouve à droite, hébergé chez Free. Je ne me souviens plus du logiciel avec lequel je l’ai créé. C’était conventionnel à l’époque et personne ne se souciait des standards ou du rendu dans d’autres navigateurs (Internet Explorer 4 ou Netscape 4).

sandglassJ’ai eu l’occasion récemment d’écrire un formulaire de contact ainsi que son traitement PHP pour une entreprise de construction canadienne qui cherche à recruter du personnel.

Je commence à écrire le code. Je connais bien les formulaires étant donné que c’est l’un de mes premiers scripts (2001 si je ne m’abuse). Je place le script sur mon serveur, commence ma batterie de tests histoire de pallier toutes les situations auxquelles un utilisateur lambda peut être confronté. Le code que je livre est en en CSS3 et XHTML 1.1 valides.

Tout s’affiche impeccablement dans tous les navigateurs. Je me dis que c’est une affaire qui roule lorsque le client m’envoie quelques emails pour me demander quelques corrections, additions, et l’intégration du script dans son site.

C’est là que le vent a commencé à tourner.

Ma nouvelle machine, The Reaper, est toute belle, toute bien montée comme il faut et je l’ai configurée aux petits oignons. Pour les plus geeks d’entre vous, voici ses caractéristiques : il s’agit d’un processeur Intel Core 2 Quad 9550 @ 2.83 Ghz (12 Mo de cache), 4 Go de RAM G-Skill DDR2 8500 @ 1066 Mhz, un disque dur Seagate de 500 GB en SATA2 (32 Mo de cache), une alimentation modulaire Corsair 620W, une carte graphique ATI Radeon HD4850. Le tout est monté sur une carte-mère Asus P5Q Pro dans un boitier Antec P182.

J’ai commandé le tout chez Matériel.net et vu qu’ils ont un point-emport à Aulnay-sous-Bois, je suis allé chercher tout cela tranquillement (je dis “tranquillement” parce que vu les conditions de circulation dans ce coin-là, les radars automatiques ne doivent engranger beaucoup !), ce qui m’a permis d’économiser les frais de port.

BugJ’ai parlé un peu trop vite il y a quelques jours lorsque je me demandais s’il existait un filtrage de la part d’Internet Explorer, étant donné qu’une page en particulier, relative aux correctifs Windows XP, ne voulait pas s’afficher avec ce navigateur. Et bien il n’en est rien. Avec la dernière mise à jour du serveur sous PHP 4.4.7, le plugin WP AJAX Edit Comments v1.1.0.6 a visiblement envoyé toute une série de cookies de session du même nom et en rafale, ce qui a eu pour effet de bloquer Internet Explorer mais pas les autres navigateurs. Une sorte de cookie buffer overflow en somme !

Censure !Incroyable mais vrai… des lecteurs attentifs viennent de m’informer qu’il est impossible d’accéder à l’article Pack de correctifs Windows XP post-SP2 et pre-SP3 en utilisant Internet Explorer. Quelques tests plus tard, il s’avère qu’IE refuse tout bonnement d’afficher la page alors qu’elle est disponible et visible avec tout autre navigateur.

Visiblement, cela ne plaît pas trop à Microsoft que l’on discute des correctifs de son système d’exploitation… Le plus drôle, c’est qu’il ne s’agit même pas de Vista mais d’XP, sorti il y a bientôt 6 ans (octobre 2001 si je ne m’abuse) et dont on attend toujours la sortie d’un hypothétique SP3.

Le message d’erreur – la fameuse “page indisponible” – fait quasiment croire que c’est le site qui est en tort alors qu’IE est seul responsable de cet état de fait. Pas très franc du collier tout cela ! Pour référence, le message d’erreur affiché est le suivant :

Je ne sais pas bien ce qui m’a pris, un accès de folie en composant la version 1.1 du pack de correctifs Windows XP post-SP2 et pre-SP3 sans doute. J’ai installé IE7. Une installation qui dure 10 minutes, on ne voit pas cela tous les jours ! Pour un peu je n’aurais pas été surpris qu’il me demande la disquette numéro 34 comme lors des installations de Windows 95… et un reboot inévitable à la fin, bien évidemment. Dis donc Microsoft, c’est pas Windows XP qui devait tout faire sans que l’on ait besoin de le rebooter ? Tss, tss.

Tiens, l’icône a subi un subtil lifting, cela fait très Whirlpool maintenant. IE démarre. Tiens cette interface me rappelle quelque chose… voyons donc : interface simple, allégée, avec des onglets… bref, ils ont tous copié sur leur concurrent direct, j’ai nommé Firefox. L’activation de la fonction ClearType par défaut n’est vraiment pas une bonne idée : tous les textes sont crémeux, similaires en qualité à un .jpg de qualité méchamment réduite. Pour retrouver la beauté du texte, désactivez ClearType : Outils > Options Internet > Avancés > Multimédia > décochez Toujours utiliser ClearType pour le HTML. Voilà, c’est déjà plus crédible. Reste qu’IE mets plus de temps à afficher la page blank.html qu’IE6, essayant visiblement d’établir une connexion furtive. Hum.IE trash

Pourquoi avoir testé cette nouvelle mouture ? Histoire de voir ce que les ingénieurs de Microsoft ont bien pu nous concocter pendant ces 5 dernières années. Hé bien on retrouve la recette Microsoft du je-copie-tout-sur-mes-concurrents-et-j’y-colle-mon-logo… tout a été pompé sur Firefox, jusqu’à la boîte de recherche en haut à gauche droite. Immobilisme patenté d’un géant moribond, IE ne mérite qu’une chose : que nous l’achevions.

Bien, j’ai finalement trouvé la solution pour faire disparaître la barre de défilement horizontale (horizontal scrollbar) sous Internet Explorer. Pas besoin de toucher aux marges ou d’ajouter des divs imbriqués, il suffit de rajouter cette ligne dans votre fichier CSS :

html { overflow-x:hidden; }

Quand je pense que j’ai quasiment réécrit tout le code CSS alors qu’une ligne de code suffit pour que tout rentre dans l’ordre… Enfin, maintenant que cela fonctionne avec tous les navigateurs, j’ai défini le thème LSD comme le style par défaut de ce blog – vu que c’est celui que j’utilise depuis déjà pas mal de temps – et puis, cela donne un petit coup de jeune à la présentation générale. ^_^

J’ai aussi modifié le filtre anti-spam : désormais, les commentaires sont ouverts sur tous les posts, même les plus vieux dans une limite de 500 jours contre 100 auparavant. Et en 2 jours, ce que j’avais prédit est finalement arrivé : j’ai maintenant plus de commentaires que de posts – yay ! ;-). Alors comme ça on aime les tutoriels hein ? Bon, je vais voir ce que je peux vous mitonner pour satisfaire votre soif de découverte…

Ayant décidé de changer le design de Guzzy, qui semble décidée à ajouter pas mal de pages sur son site en ce moment, je viens de me mettre à Photoshop et Image Ready. Je ne comprends pas toujours ce que je fais mais pour l’instant ça va… Evidemment, je ne vais pas à la vitesse d’un graphiste, j’ai déjà mis deux jours pour trouver un design potable et le code CSS et XHTML est déjà prêt. Il ne me reste plus qu’à créer les images des différentes rubriques et je pourrais le mettre en ligne.

Ah oui, j’allais oublier : petit problème d’affichage avec IE, deux divs de suite et il me laisse un écart entre les deux…

Spelling error report

The following text will be sent to our editors: