Les nouveautés d’
Internet
Explorer 4

Slides en ligne
ffoodd.fr/ie4/

Back to
1997

Le web, c’était (pas) mieux avant.

Les navigateurs embarquaient des clients mails, des messageries instantanées, et on déplaçait des barres d’outils d’un coin à l’autre de l’écran…

  1. HTML et HTTP.
  2. URL et ViolaWWW.
  3. Élément <img>, et le CERN verse le web dans le domaine public.
  4. Le W3C est lancé… le même jour que la première bannière pub. Netscape et Python, aussi.
  5. FrontPage, PHP, JavaScript (et JSSS).
  6. Liquid Layout, Wayback Machine, WAI, Flash, et… CSS, le  !
  7. HTML WG et HTML 3.2. Netscape confie JavaScript à ECMA.

Jetez un œil à The History of the Web.

Oh, et le 17 décembre, c’est la Saint Gaël. Coïncidence ?

Internet
Explorer 4

Le web comme vous le voulez

  • Multi OS : Windows, Unix et Mac.
  • Microsoft Chat, Outlook Express, NetMeeting, FrontPage Express, et RealPlayer.
  • MSHTML (ultérieurement rebaptisé Trident).
  • DHTML.
  • UTF-8 et TLS 1.0.
  • @font-face, PNG et favicon !
  • L’accessibilité devient un sujet : navigation au clavier, préférences utilisateurs, affichage des alternatives…
  • Plein écran avec F11.

Mais ce n’est pas tout !

Les filtres
DirectX

STYLE="filter:
	progid:DXImageTransform.Microsoft.gradient(startColorstr=#550000FF, endColorstr=#55FFFF00)
	progid:DXImageTransform.Microsoft.Alpha(opacity=50)"

Opacité, dégradé, transition, ombre…

Dans l’attribut STYLE sur IE4, puis dans la propriété -ms-filter jusqu’à IE9 !

La doc est toujours disponible dans la section Legacy APIs de Internet Explorer for developers sur Microsoft Learn .

CSS3 et le web 2.0

Les équivalents CSS en 2009, et Responsive Web Design. 

.demo {
	background: linear-gradient(#500f, #5ff0);
	opacity: .5;
}

Le mode hors-ligne avec les
Active Channel

Internet Explorer 4 implémente CTRL+s — mais aussi la synchronisation avec la version distante grâce à un fichier CDF. 

<?xml version="1.0" encoding="UTF-8"?>
<CHANNEL HREF="http://domain/folder/pageOne.extension"
		BASE="http://domain/folder/"
		LASTMOD="1998-11-05T22:12"
		PRECACHE="YES"
		LEVEL="0">
	<TITLE>Title of Channel</TITLE>
	<ABSTRACT>Synopsis of channel's contents.</ABSTRACT>
	<SCHEDULE>
		<INTERVALTIME DAY="14"/>
	</SCHEDULE>
	<LOGO HREF="wideChannelLogo.gif" STYLE="IMAGE-WIDE"/>
	<LOGO HREF="imageChannelLogo.gif" STYLE="IMAGE"/>
	<LOGO HREF="iconChannelLogo.gif" STYLE="ICON"/>
</CHANNEL>

Les PWA

Les Service Workers en 2018, avec HTTPS et un manifest.json. 

{
	"short_name": "MDN",
	"name": "MDN Web Docs",
	"icons": [
		{
			"src": "/favicon-192x192.png",
			"sizes": "192x192",
			"type": "image/png"
		}
	],
	"start_url": ".",
	"display": "standalone",
	"theme_color": "#000000",
	"background_color": "#ffffff"
}

Les transitions
interpages

Les filtres dans l’attribut http-equiv de l’élément META ? 


<META http-equiv="Page-Enter"
	CONTENT="progid:DXImageTransform.Microsoft.Blinds(Duration=4)" />
<META http-equiv="Page-Exit"
	CONTENT="progid:DXImageTransform.Microsoft.Slide(Duration=2.500,slidestyle=’HIDE’)" />

Les View Transitions en CSS

Après 10 ans de spécification de l’API, les premières implémentations arrivent en… 2024 !

Bonus

Bramus Van Damme a réimplémenté les transitions interpages d’IE avec les View Transitions en CSS sur page-transitions.style. 

@view-transition {
	navigation: auto;
}

::view-transition-old(root) {
	animation: 2.5s ease-in both slide;
}

::view-transition-new(root) {
	animation: 4s ease-in both blinds;
}

Si ça bouge encore, c’est que
c’est pas mort !

Pour mettre la main dans le cambouis.

Windows 95 & IE4 dans votre navigateur

v86, basé sur WASM — et qui peut même faire tourner Windows 1.01 et plein d’autres vieux systèmes !

Pour consulter un site local, un peu de tunneling avec ngrok ou bore sera nécessaire. Attention : HTTP sans S.

Il existe aussi des émulateurs — le plus en vue étant 86box.

Explorer le web d’époque

Des sites de 1997 sont toujours en ligne ; certains sont archivés et consultables sur la Wayback Machine. Quelques exemples :

Générique de fin
Merci

Crédits

Laissez votre feedback

Openfeedback