Tutoriels Webmaster

Intégrer Facebook sur un site web

Le réseau social facebook propose des services pour les webmasters. Certains de ces services peuvent être implémentés sur une page ou un site sans pour autant avoir un compte facebook.

Sécurité :

Ce site risque d'endommager votre ordinateur

Lors d'une recherche sur le web via Google, une page d'information s'affiche en lieu et place de la page du site. Qu'est ce que cela signifie.

Qualité :

Livre d'Or sans Spam

Comment faire pour conserver un livre d'Or sans spam

Logiciels :

Les cercles de Facebook

Chaque internaute qui suit un peu l'actualité des réseaux sociaux a entendu parler des cercles de google +. Or dans Facebook, il y a également des cercles, l'internaute les voir moins, mais ils sont essentiels.

Outils :

Les statistiques web avec Google Analytics

Google Analytics est un outil de statistique permettant de suivre au jour le jour la fréquentation de ses sites web. Voyons comment l'implémenter sur un site web.

Outils :

Vie du site web via les réseaux sociaux

Depuis leur apparition sur le web, les réseaux sociaux prennent de plus de place dans l'espace web, à un point tel que les webmasters ne peuvent ignorer ces médias.

Référencement :

Référencement du site internet et de son suivi

Voyons des éléments essentiels dans le référencement du site et de son suivi. Cet article va ainsi compléter notre rubrique sur le référencement web.

Hébergement :

Etapes de la mise en ligne d'un site internet

Quelles sont les étapes dans la mise en ligne d'un site web lorsque l'on a simplement crée son site web et que l'on ne dispose pas d'un Nom de domaine ou d'un hébergement.

Pages webmaster

Passer au web version mobile

Navigation: Pages Webmaster > Programmation

Les smartphones, ainsi que les téléphones mobile, dans leur version moderne, permettent d'afficher le contenu d'un site web.
Pour autant le site web n'est pas directement affichable en l'état, les pages sont trop lourdes et prennent trop de temps à télécharger, la résolution d'écran est différente.
Il convient donc d'écrire une version mobile de son site, sans pour cela refaire un site complet.

Partons du principe que le site web à passer en version mobile est un site dynamique (langage serveur, base de donnée), la version statique est également faisable et nous indiquerons les différence, et faisons des choix avec des solutions. La réflexion n'étant pas terminée dans ce monde en constante évolution, il vous appartient de valider ces choix ou de faire différemment selon votre idée sur les évolutions à venir.
Pour passer du web au mobile, nous allons appliquer un template, évolutif, et permettre de conserver la même url pour la version web sur PC et pour la version web sur mobile.

Le template web mobile

Nous allons décrire des pages modèles permettant de re-écrire son site en version mobile.
Ce template provient de mobiforge.com lequel fournit un template web, d'une part en anglais, d'autre part pour site statique.
Voici une version commentée pour site dynamique et en français, et enrichie de l'expérience à la mise en place de ce template

Le template que nous vous proposons dispose de d'une page index, une page nouvelle, une page article, ainsi qu'une feuille de style pour la mise en forme.
A cela ajoutons une page entête (header) et une page pied de page (footer).

Voyons l'entête : entete
Le doc type pour page mobile, le titre du site, l'appel à la feuille de style (version optimisée avec des composants compressés)

La page index, c'est de manière classique le menu général avec des liens vers les autres rubriques.
Voyons l'index : index
Les éléments dynamiques d'include de l'entête ou du pied de page n'ont pas été indiqués ici, ni même ceux liés à la connexion à la base de donnée. Pour un site statique cette page index fonctionne en ayant au préalable recopié entête et pied de page à leur emplacements respectifs (à l'identique des pages d'un site web statique).

La page nouvelle et ou article (la structure est identique)
Voyons la page nouvelles : news
La page article peut être construite de la même manière, ainsi que toute autre page faisant appel à la base SQL pour le contenu, seul ici le mode d'affichage particulier pour du web mobile est indiqué. De manière générale la section SQL de votre page classique peut-être insérée ici, puis mise en page de la manière indiquée dans le code proposé et mise en forme avec la feuille de style.

Sur cette construction de base, toute page dynamique web peut-être ainsi passée en version mobile.

Si vos articles contiennent des images ou des photos, il peut être très intéressant de redimensionner les images pour le web mobile (script en ligne)

Il reste encore à voir quelle structure pour web mobile utiliser et comment rediriger les internautes mobiles vers ce bon répertoire. )

Article écrit par Janol le 09/02/2009
(Hits 5649 - Catégorie : Programmation)

Faites passer - Imprimer

Partagez cette page

Commentaires

Cet article n'a pas encore été commenté.
Vous pouvez vous exprimer en remplissant le formulaire ci-dessous.

Autres publications Programmation

Url en bit.ly sous ajax
(Ecrit le 15/03/2010 - 2.445 lectures)
Autre manière de calculer une url courte de type bit.ly et de profiter des traitements asynchrones possibles avec ajax

Optimiser l'API bit.ly pour un affichage plus rapide des pages
(Ecrit le 08/03/2010 - 2.355 lectures)
Bit.ly est le site permettant de raccourcir une url, et dont l'API permet de raccourcir à la volée. Hélas cette api peut ralentir l'affichage des pages, voyons comment intégrer l'API et afficher ses pages aussi vite qu'avant.

Intégrer l'API bit.ly pour twitter
(Ecrit le 06/03/2010 - 3.499 lectures)
Twitter, le réseau social, peut être alimenté par des articles de site web et efficacement lorsque les url ont été raccourcies. Voyons alors comment générer à la volée des url avec bit.ly et ce grâce à l'API proposée.

Dessiner dans une image avec PHP
(Ecrit le 23/02/2010 - 1.808 lectures)
Après avoir vu comment écrire dans une image, voyons comment dessiner dans une image puis écrire avec d'une part des polices de caractère et des couleurs, mais également des paramètres passés en variable.

Ecrire dans une image à la volée
(Ecrit le 22/02/2010 - 2.093 lectures)
Le langage PHP permet d'écrire dans une image à la volée afin par exemple d'y ajouter un texte en superposition. Cette fonction permet également de masquer l'url de l'image puisque crée par le serveur.

Redimensionner photo pour le web mobile
(Ecrit le 15/02/2009 - 3.711 lectures)
Le web mobile ne peut permettre de charger des images de grande résolution. Il convient de les redimensionner. Pour ce faire utilisons PHP avec la bibliothèque GD, script en ligne.

Passer au web version mobile
(Ecrit le 09/02/2009 - 5.649 lectures)
Comment procéder pour écrire son site en version mobile pour smartphone, pda ou téléphone mobile avec wap. Voyons comment appliquer un template dédié pour le web sur mobile.

Structure pour web mobile
(Ecrit le 09/02/2009 - 4.450 lectures)
Les pages web pour téléphone mobile ou pour smartphone ne se construisent pas de la même manière que pour un site web avec navigateur classique. Quelques limitations sont à prendre en compte, voyons ces points.

Faut il externaliser ses scripts
(Ecrit le 09/12/2008 - 3.046 lectures)
Pour obtenir des temps de réponses corrects et si possible optimum, tout webmaster doit se poser la question de savoir si il faut externaliser les scripts d'un site web.

Reseau Social Friend connect
(Ecrit le 05/12/2008 - 2.779 lectures)
Google ouvre son réseau social Friend Connect aux autres plateforme et permet d'installer cet outil très facilement sur un site web.

Feuilles de styles statiques
(Ecrit le 09/11/2008 - 2.073 lectures)
Les feuilles de style dynamiques ne sont pas une bonne solution du coté de l'optimisation des pages web

Optimiser ses scripts
(Ecrit le 05/10/2008 - 2.033 lectures)
YSLOW propose de positionner ses scripts correctement dans ses pages web pour améliorer la vitesse de chargement.

Optimiser la lecture des feuilles de style
(Ecrit le 01/10/2008 - 1.658 lectures)
Cinquième règle YSLOW pour optimiser son site web : positionner les feuilles de styles correctement dans la page web.

YSLOW : composant compressé
(Ecrit le 20/09/2008 - 2.318 lectures)
Règle quatre pour optimiser les temps de réponse du serveur : compresser les composants de la page coté serveur.

Yslow : les pages dynamiques ou statiques sont persitantes
(Ecrit le 12/09/2008 - 2.010 lectures)
Règle numéro trois pour optimiser les temps de réponse du serveur : rendre persistantes ses pages web, qu'elles soient statiques ou dynamiques.

YSLOW : Réduire le nombre de requêtes
(Ecrit le 31/08/2008 - 2.637 lectures)
Règle numéro un pour optimiser les temps de réponse du serveur : minimiser le nombre de requêtes.

Améliorer la vitesse d'un site coté serveur
(Ecrit le 30/08/2008 - 2.907 lectures)
Après avoir optimisé le code des pages coté client, il reste à voir ce que l'on peut faire coté serveur, Yslow nous aide en ce sens

GoogleEarth kml et flux rss
(Ecrit le 20/06/2008 - 2.919 lectures)
Les flux rss permettant de lire de diffuser le contenu d'une page web sur un site, peuvent être utilisés pour lire un fichier Google Earth dont le contenu évolue.

Annuaire thématique cartographié
(Ecrit le 05/12/2007 - 8.339 lectures)
Carte des sites web de l'annuaire thématique avec géolocalisation et plan des villes.

Adapter son site à la résolution d'écran
(Ecrit le 23/11/2007 - 13.555 lectures)
Comment rendre son site lisible en 800 x 600 comme dans les grandes résolutions avec utilisation des balises div

L'API Google Maps Xml et Ajax sont sur un site web
(Ecrit le 19/11/2007 - 9.597 lectures)
Utiliser un flux xml pour afficher des données sur une carte Googlemaps

Intégrer l'API Google Maps
(Ecrit le 18/01/2006 - 73.462 lectures)
Présentation des éléments permettant de réaliser une intégration de l'API GoogleMaps sur un site web.

Software 2.0 - Programmation en Java
(Ecrit le 04/04/2005 - 6.702 lectures)
Le sujet principal de Software 2.0 4/2005 (6) : Programmation en Java