Posted: octobre 4th, 2011 | Author: rabehasy | Filed under: Mobile | No Comments »
Le projet MobileESP est une API (Application Programming Interface) à la disposition des développeurs souhaitant détecter si le navigateur de l’internaute est un mobile. J’ai déjà créé un post du même type (cf lien).
Avec cette API, on peut avoir le détail du type de navigateur (IPhone, Android, Blackberry…) Ce qui permettra vraiment de cibler l’internaute qui surfe sur le site Internet pour le proposer de télécharger l’application adéquate au smartphone.
Le script consiste en un seul fichier et est disponible dans différents langages de programmation telles PHP, Java, APS.NET (C#), Ruby et JavaScript.
En PHP, on peut détecter tout simplement comme ceci :
1
2
3
4
5
| <?php
include("mdetect.php");
$ua = new uagent_info();
if( $ua->DetectAndroidPhone() ) echo 'Le navigateur est un Android';
?> |
Pour télécharger les sources : http://blog.mobileesp.com/
Posted: septembre 29th, 2011 | Author: rabehasy | Filed under: web2 | No Comments »
J’utilise plusieurs services online et dans les extensions de mon navigateur (chrome ou firefox). Je me dis qu’il serait bien gentil pour moi 
de rendre hommage à ces outils et de vous les partager puisqu’ils m’ont bien aidé et continuent toujours de m’aider d’ailleurs.
Le JSON quand tu nous tiens
JSON (JavaScript Object Notation) est un langage qui permet de structurer du JavaScript. Json parser (http://json.parser.online.fr/) est un service en ligne qui me permet par exemple de formatter correctement un JSON afin de voir clairement ce que retourne son contenu afin de le traiter. Conjointement, JSONLINT (http://jsonlint.com/) est un validateur en JSON qui me permet de tester que ma chaîne JSON est bien écrite ou pas.
Minimiser les fichiers JS et CSS….très important
Il est recommandé de nos temps de minimiser au maximum les fichiers Javascript et CSS et si possible de ne garder qu’un seul fichier. Ceci afin d’accélérer le chargement de votre page web. En ce qui concerne CSS, je me sers de CleanCSS (http://www.cleancss.com/ ou http://www.csscompressor.com/) et de JSCOMPRESS (http://jscompress.com/) pour les fichiers javascript.
Réindenter un fichier JS
Minimiser un fichier javascript est essentiel, mais comment faire pour l’opération inverse ? Et bien, nous avons http://jsbeautifier.org/ qui nous fait ce travail magnifique.
Convertir ceci en ceci…
Quatres services seront à l’honneur ici.
> Le convertisseur dynamique d’entité HTML (http://code.cside.com/3rdpage/us/entity/converter.html) qui permet de transformer par exemple les accents en entités HTML et aussi l’opération inverse. Ce lien est aussi tout utile http://www.rishida.net/tools/conversion/
> En Javascript, on a souvent besoin de savoir quelle est la valeur d’un accent aigu. Et bien, ce service nous permet de donner facilement ces valeurs (http://unicodinator.com).
> 10 chiffres qui représentent le temps. Mais comment obtenir la date réelle qui est plus claire et compréhensible. J’utilise http://www.4webhelp.net/us/timestamp.php pour celà.
> Puisqu’il est important d’utiliser la taille des fontes relatives au lieu de pixels dans la mise en forme CSS. http://pxtoem.com/ est d’une grande aide pour cela.
Et pour les tests….
http://html-ipsum.com/ est un générateur lorem ipsum mais en HTML. Très pratique.
http://dummyimage.com/ est un générateur d’images. Vous lui donnez la taille (largeur et hauteur) et il vous générera une image avec cette taille. Il est possible uniquement de changer la couleur de fond de l’image et la couleur du texte.
Je veux faire un test d’une fonction en jQuery rapidement dans un fichier HTML http://scriptsrc.net/ permet de copier directement l’URL de tous les framework et de les coller dans le fichier HTML.
Utiles mais pas nécessaires …
Si vous avez envie d’avoir votre graphique de chargement dans une application AJAX. http://preloaders.net/ peut vous générer ces graphiques simplement.
http://favikon.com/ transforme n’importe quelle image en icône présent dans la barre d’adresse de votre navigateur. Il ne vous reste plus qu’à enregistrer le fichier dans votre serveur et l’appeler dans la balise <head>
Tester…se documenter
http://instacss.com/ pour tester et se documenter sur les CSS
Pour tester en live un JS, CSS et HTML on pourra se servir de http://jsbin.com/ et de http://jsfiddle.net/
Posted: juillet 7th, 2010 | Author: rabehasy | Filed under: logiciel, Technologie, web2 | Tags: firefox | No Comments »
Suite à l’annonce de la sortie de la version de Firefox 4.0 Beta, je me suis pressé de télécharger et de tester la bête. Je vous partage ci-dessous quelques copies d’écran :
La navigation par onglet en haut du navigateur.
Cette nouveauté se trouve dans le menu Tools > Heads Up Display.
Rien à signaler spécialement sur cette nouveauté si ce n’est qu’on a plus d’espace pour travailler correctement
Inspecteur DOM
Un nouvel onglet pour gérer les extensions, thèmes, plugins
Cette amélioration se trouve dans le menu View > Toolbar > Tabs on top .
Ainsi, il est possible dans cet onglet de désinstaller rapidement une extension, d’activer un thème, de supprimer ou d’ajouter un plugin.
Affichage de l’entête HTTP d’une page
Cette nouveauté se trouve dans le menu Tools > Heads Up Display
Posted: juin 19th, 2010 | Author: rabehasy | Filed under: ExtJS - Sencha, Mobile | 2 Comments »
Depuis le 14 Juin, le framework ExtJS très puissant change de nom et devient maintenant Sencha. De ce fait, l’URL est désormais http://www.sencha.com/ . Sencha (dérivé d’un thé vert japonais) est une combinaison de 3 puissants produits Javascript : ExtJS, jQtouch, et RaphaelJs.
De plus, Sencha crée une application pour mobile « Sencha Touch ». Il s’agit plutôt d’application qui ressemble aux applications destinées pour les iPad, iPhone et Android. Plus précisément, les smartphones tactiles.
L’application Sencha touch est construit entièrement en HTML5 et CSS3. C’est ce point qui m’impressionne. Lorsqu’on voit les captures d’écrans et les démonstrations, le travail réalisé est bluffant.
Géolocalisation, Ajax, des animations et plusieurs autres options sont au menus de cette nouvelle application qui vaut le détour. Je reviendrai vous livrer mes impressions lorsque je l’aurai testé . En attendant, pour faire un détour c’est par ici > http://www.sencha.com
Posted: février 10th, 2010 | Author: rabehasy | Filed under: web2 | Tags: background, wallpaper | No Comments »
BgRepeat, un annuaire de wallpapers et de fond d’images répétitifs (comme son nom l’indique) est un site qui fait partie de la tendance web2 à garder sous le coude.
Posted: décembre 1st, 2009 | Author: rabehasy | Filed under: Mobile, php | Tags: asp, browser, HTML, jsp, mobile, php, rails | 1 Comment »
Avec l’avènement des smartphones, et aussi des téléphones portables permettant de surfer sur Internet. Il devient important pour un développeur web de fournir un contenu selon le navigateur utilisé par l’internaute.
Nombre de classes existent, et permettent de donner cette information rapidement. La plupart de ces classes sont développés avec le langage PHP.
Detect Mobile Browser, est un site qui donne un bout de code utilisable dans les langages suivants Apache, Coldfusion, ASP, JSP, PHP, Javascript et Rails et permettent facilement de savoir si le navigateur qu’on utilise est un navigateur mobile ou pas.
