Les sources du "Curieux Guide des Navigateurs et du Web" disponibles

Idelways · 06/06/2011, 15h35

HTML 5 : Google libère le code de son livre interactif
"Le Curieux Guide des Navigateurs et du Web" pour que les développeurs puissent l'adapter à leurs besoins

Google poursuit le développement de son livre de vulgarisation interactive du Web écrit en HTML5 : « 20 trucs que j'ai appris sur les navigateurs et le Web », lancé l'année passée.

Cette semaine, le géant américain des services en ligne publie le code source de cet outil, qui peut être utilisé librement désormais pour éditer d'autres livres interactifs.

Écrit en pur HTML5, JavaScript et CSS, ce livre reproduit l'apparence et l'interaction des livres papiers classiques, tout en intégrant des options avancées, comme la disponibilité hors connexion, la recherche facilitée ou la possibilité de marquer des pages.

Ce livre utilise l'élément Canvas du HTML5 pour animer les illustrations du livre et pour réaliser la transition entre les pages. L'animation de rotation des pages et les ombres sont dessinées en Canvas et générées en JavaScript.

L'API Application Cache permet l'accessibilité du livre hors connexion après une première consultation.

L'API Local Storage permet quant à elle de reprendre la lecture là ou l'utilisateur l'avait laissée. History API est utilisée pour améliorer la navigation et le référencement en forçant le changement d’URL à la barre d’adresse, sans rechargement complet de la page.

Du côté de CSS, ce « Curieux guide des navigateurs et du Web » utilise des fichiers de polices chargées en CSS, animations, dégradés et ombres pour améliorer l'esthétique de l'application.

Destiné à promouvoir l'utilisation du Web ouvert à travers la démonstration de ses capacités, ce guide a été récompensé durant la 15e cérémonie des Webby Awards (sorte d'Oscars de l'Internet), dans les catégories Éducation, meilleure conception visuelle et meilleures pratiques.

Pour les développeurs Web, il s'agit là d'un cas d'école et d’un bon point de départ pour réaliser des livres interactifs en HTML5.

Le code source du livre interactif est disponible en téléchargement sur Google Code

Le Guide est disponible sur celle-ci

Et vous ?

Que pensez-vous de ce livre interractif ?

matpush · 06/06/2011, 16h29

J'en suis au troisième chapitre et je trouve ce "livre" très intéressant et très clair dans ses explications.

Je vais peut être même m'en servir pour faire comprendre le fonctionnement d'internet à ma famille !

danielhagnoul · 06/06/2011, 21h26

Bonsoir

Hélas, il m'a été impossible de télécharger le code du livre, car cette possibilité n'existe pas sur la page ouverte par http://code.google.com/p/20thingsilearned/.

jmini · 06/06/2011, 23h12

Citation:

Envoyé par danielhagnoul

Hélas, il m'a été impossible de télécharger le code du livre, car cette possibilité n'existe pas sur la page ouverte par http://code.google.com/p/20thingsilearned/.

Il y a quoi dans le repository SVN du projet (navigateur de fichiers : /trunk) ???
ant, src, war...
ça sonne plutôt bien comme nom de dossiers. Il me semble que le dossier war contient ce qu'il faut...

Pour le télécharger depuis le répertoire SVN (on parle plutôt d'un Checkout), il doit exister sur developpez.com un tutoriel expliquant SVN...

danielhagnoul · 06/06/2011, 23h24

Bonsoir

Merci pour le lien.

jmnicolas · 07/06/2011, 11h57

Et hop encore un moyen supplémentaire de traquer les utilisateurs sous couvert de don open source ...

Parce que le JavaScript Google il ne fait pas que tourner la page : rien n'est gratuit avec eux.

Camille_B · 07/06/2011, 16h04

Parce que le JavaScript Google il ne fait pas que tourner la page : rien n'est gratuit avec eux.

1) Une preuve ou c'est juste du fud ?

2) le code étant open-source (et puis javascript pour le coup c'est pas difficile à désassembler

), qu'est-ce qui empêche des versions non "fliquées" (à supposer qu'il y ait quelque chose à craindre ).

Sinon, personnellement, je trouve l'initiative sympathique.

jmnicolas · 07/06/2011, 16h22

Rien de mystérieux, Google ne s'en cache pas : cf Google Analytics sur Wikipedia :

Citation:

GA can track visitors from all referrers, including search engines, display advertising, pay-per-click networks, e-mail marketing and digital collateral such as links within PDF documents.

Citation:

Due to its ubiquity, Google Analytics raises many privacy concerns. Whenever someone visits a website that uses Google Analytics, Google tracks that visit via the user's IP address.

Ce que toi tu vois pour ton site, eux le voient pour quasiment le web entier.
Chacun voit midi à sa porte, mais c'est bien trop orwellien pour moi en tout cas ...

benwit · 07/06/2011, 17h00

Ils utilisent Quercus.

A moins qu'ils ne l'aient déjà écrit en PHP avant de la porter sous AppEngine, je ne vois pas pourquoi ils l'ont pas écrit directement en Java.

camus3 · 07/06/2011, 19h01

bien gentil, mais ultra lent sous firefox ou opera dernière version( pc 2 coeurs 2.6ghz, 3 gig de ram )

Camille_B · 07/06/2011, 19h24

Citation:

Rien de mystérieux, Google ne s'en cache pas : cf Google Analytics sur Wikipedia :

Quel rapport avec ce livre numérique ?

tagalog75 · 07/06/2011, 23h48

dans ces sous-dossiers de la source http://code.google.com/p/20thingsile...ce/browse/#svn , je vois en thrunk de l'appel en php/xml, de l'applet java avec classes, des js et css (normal), du pdf dont je voulais me débarrasser lors des futurs catalogues en ligne... ??

ben quel langage peut être utilisé pour ce livre : tous ? on développe le HTML5 avec ce qu'on veut ou on peut encore le faire avec un éditeur classique et le modifier avec le bloc-notes ?

benwit · 08/06/2011, 08h28

@tagalog75,

Si tu récupères leur projet, tu liras :

Citation:

Back-end -- the application runs on Google App Engine (GAE) and stores article
data in the App Engine Datastore. Most of the server side code is written in
PHP, but Since GAE only supports Java and Python natively, the app uses Quercus,
a Java implementation of the PHP language
(http://www.caucho.com/resin-3.0/quercus/). Some native Java is also used for
datastore interactions.

Front-end -- the application takes advantage of many of the latest HTML5
technologies, for which Google Chrome has very good support. These features
include: Canvas element animations (for page flip and animated illustrations),
HTML5 history API, CSS3 transitions, and offline mode. Much of the JavaScript
code uses native methods, but jQuery is also used for cross-browser
compatibility.

tagalog75 · 08/06/2011, 20h38

Citation:

Envoyé par benwit

@tagalog75,

Si tu récupères leur projet, tu liras :

Merci de cet éclairage

Louhike · 09/06/2011, 13h15

L'initiative est louable mais je trouve l'utilisation de "faux livre" de ce type pour exposer du contenu sur internet peu ergonomique.
C'est joli, mais le fait de tourner les pages est une perte de temps et je trouve ça pénible au bout d'un moment.

06/06/2011, 15h35	#1
Idelways Coordinateur publications Développeur Ruby on Rails / iOS et journaliste Inscription : juin 2010 Messages : 1 101 Détails du profil Informations professionnelles : Activité : Développeur Ruby on Rails / iOS et journaliste Informations forums : Inscription : juin 2010 Messages : 1 101 Points : 24 230 Points : 24 230	Les sources du "Curieux Guide des Navigateurs et du Web" disponibles HTML 5 : Google libère le code de son livre interactif "Le Curieux Guide des Navigateurs et du Web" pour que les développeurs puissent l'adapter à leurs besoins Google poursuit le développement de son livre de vulgarisation interactive du Web écrit en HTML5 : « 20 trucs que j'ai appris sur les navigateurs et le Web », lancé l'année passée. Cette semaine, le géant américain des services en ligne publie le code source de cet outil, qui peut être utilisé librement désormais pour éditer d'autres livres interactifs. Écrit en pur HTML5, JavaScript et CSS, ce livre reproduit l'apparence et l'interaction des livres papiers classiques, tout en intégrant des options avancées, comme la disponibilité hors connexion, la recherche facilitée ou la possibilité de marquer des pages. Ce livre utilise l'élément Canvas du HTML5 pour animer les illustrations du livre et pour réaliser la transition entre les pages. L'animation de rotation des pages et les ombres sont dessinées en Canvas et générées en JavaScript. L'API Application Cache permet l'accessibilité du livre hors connexion après une première consultation. L'API Local Storage permet quant à elle de reprendre la lecture là ou l'utilisateur l'avait laissée. History API est utilisée pour améliorer la navigation et le référencement en forçant le changement d’URL à la barre d’adresse, sans rechargement complet de la page. Du côté de CSS, ce « Curieux guide des navigateurs et du Web » utilise des fichiers de polices chargées en CSS, animations, dégradés et ombres pour améliorer l'esthétique de l'application. Destiné à promouvoir l'utilisation du Web ouvert à travers la démonstration de ses capacités, ce guide a été récompensé durant la 15e cérémonie des Webby Awards (sorte d'Oscars de l'Internet), dans les catégories Éducation, meilleure conception visuelle et meilleures pratiques. Pour les développeurs Web, il s'agit là d'un cas d'école et d’un bon point de départ pour réaliser des livres interactifs en HTML5. Le code source du livre interactif est disponible en téléchargement sur Google Code Le Guide est disponible sur celle-ci Et vous ? Que pensez-vous de ce livre interractif ?
	61

06/06/2011, 21h26	#3
danielhagnoul Rédacteur Daniel Hagnoul Étudiant perpétuel Inscription : février 2009 Messages : 3 221 Détails du profil Informations personnelles : Nom : Daniel Hagnoul Âge : 61 Localisation : Belgique Informations professionnelles : Activité : Étudiant perpétuel Secteur : Enseignement Informations forums : Inscription : février 2009 Messages : 3 221 Points : 6 767 Points : 6 767	Bonsoir Hélas, il m'a été impossible de télécharger le code du livre, car cette possibilité n'existe pas sur la page ouverte par http://code.google.com/p/20thingsilearned/. __________________ FAQ jQuery Mon cahier d’exercices sur jQuery & Co Si un message vous a aidé ou vous semble pertinent, votez pour lui !
	00

06/06/2011, 23h24	#5
danielhagnoul Rédacteur Daniel Hagnoul Étudiant perpétuel Inscription : février 2009 Messages : 3 221 Détails du profil Informations personnelles : Nom : Daniel Hagnoul Âge : 61 Localisation : Belgique Informations professionnelles : Activité : Étudiant perpétuel Secteur : Enseignement Informations forums : Inscription : février 2009 Messages : 3 221 Points : 6 767 Points : 6 767	Bonsoir Merci pour le lien. __________________ FAQ jQuery Mon cahier d’exercices sur jQuery & Co Si un message vous a aidé ou vous semble pertinent, votez pour lui !
	00

07/06/2011, 11h57	#6
jmnicolas Membre expérimenté Développeur informatique Inscription : juin 2007 Messages : 298 Détails du profil Informations personnelles : Sexe : Âge : 34 Localisation : France Informations professionnelles : Activité : Développeur informatique Secteur : Transports Informations forums : Inscription : juin 2007 Messages : 298 Points : 522 Points : 522	Et hop encore un moyen supplémentaire de traquer les utilisateurs sous couvert de don open source ... Parce que le JavaScript Google il ne fait pas que tourner la page : rien n'est gratuit avec eux. __________________ The greatest shortcoming of the human race is our inability to understand the exponential function. Albert A. Bartlett La plus grande lacune de la race humaine c'est notre incapacité à comprendre la fonction exponentielle.
	02

07/06/2011, 17h00	#9
benwit Rédacteur/Modérateur Inscription : septembre 2004 Messages : 1 557 Détails du profil Informations forums : Inscription : septembre 2004 Messages : 1 557 Points : 5 738 Points : 5 738	Ils utilisent Quercus. A moins qu'ils ne l'aient déjà écrit en PHP avant de la porter sous AppEngine, je ne vois pas pourquoi ils l'ont pas écrit directement en Java. __________________ Tout le monde savait que c'était impossible. Il est venu un imbécile qui ne le savait pas et qui l'a fait. Marcel PAGNOL On ne savait pas que c'était impossible, alors on l'a fait. John Fitzgerald KENNEDY. L'inexpérience est ce qui permet à la jeunesse d'accomplir ce que la vieillesse sait impossible. Paul (Tristant) BERNARD La meilleure façon de prédire l'avenir, c'est de l'inventer.
	00

06/06/2011, 16h29	#2
matpush Membre actif Mathieu Inscription : avril 2008 Messages : 125 Détails du profil Informations personnelles : Nom : Mathieu Âge : 24 Localisation : France Informations forums : Inscription : avril 2008 Messages : 125 Points : 157 Points : 157	J'en suis au troisième chapitre et je trouve ce "livre" très intéressant et très clair dans ses explications. Je vais peut être même m'en servir pour faire comprendre le fonctionnement d'internet à ma famille !
	00

07/06/2011, 16h04	#7
Camille_B Membre expérimenté Jean-Baptiste Bourgoin Webmaster Inscription : septembre 2006 Messages : 200 Détails du profil Informations personnelles : Nom : Jean-Baptiste Bourgoin Localisation : France Informations professionnelles : Activité : Webmaster Secteur : Associations - ONG Informations forums : Inscription : septembre 2006 Messages : 200 Points : 540 Points : 540	Parce que le JavaScript Google il ne fait pas que tourner la page : rien n'est gratuit avec eux. 1) Une preuve ou c'est juste du fud ? 2) le code étant open-source (et puis javascript pour le coup c'est pas difficile à désassembler ), qu'est-ce qui empêche des versions non "fliquées" (à supposer qu'il y ait quelque chose à craindre ). Sinon, personnellement, je trouve l'initiative sympathique.
	20

07/06/2011, 19h01	#10
camus3 Membre expérimenté Inscription : juillet 2010 Messages : 394 Détails du profil Informations forums : Inscription : juillet 2010 Messages : 394 Points : 540 Points : 540	bien gentil, mais ultra lent sous firefox ou opera dernière version( pc 2 coeurs 2.6ghz, 3 gig de ram )
	00

07/06/2011, 23h48	#12
tagalog75 Invité de passage Roger Conseil - Consultant en systèmes d'information Inscription : juin 2011 Messages : 2 Détails du profil Informations personnelles : Nom : Roger Localisation : France Informations professionnelles : Activité : Conseil - Consultant en systèmes d'information Secteur : High Tech - Multimédia et Internet Informations forums : Inscription : juin 2011 Messages : 2 Points : 3 Points : 3	ce SVN est développé pour tout ? dans ces sous-dossiers de la source http://code.google.com/p/20thingsile...ce/browse/#svn , je vois en thrunk de l'appel en php/xml, de l'applet java avec classes, des js et css (normal), du pdf dont je voulais me débarrasser lors des futurs catalogues en ligne... ?? ben quel langage peut être utilisé pour ce livre : tous ? on développe le HTML5 avec ce qu'on veut ou on peut encore le faire avec un éditeur classique et le modifier avec le bloc-notes ?
	00

09/06/2011, 13h15	#15
Louhike Membre actif Étudiant Inscription : janvier 2009 Messages : 74 Détails du profil Informations personnelles : Sexe : Localisation : France Informations professionnelles : Activité : Étudiant Informations forums : Inscription : janvier 2009 Messages : 74 Points : 159 Points : 159	L'initiative est louable mais je trouve l'utilisation de "faux livre" de ce type pour exposer du contenu sur internet peu ergonomique. C'est joli, mais le fait de tourner les pages est une perte de temps et je trouve ça pénible au bout d'un moment.
	10

Outils de la discussion
Afficher une version imprimable Envoyer un lien vers cette page par email