WireFrame à toutes les sauces… Publié le 05 sept 2007 par leGizz dans Web Design Vous connaissez sans doute tous les wireframes, il s’agit du design d’une page web de manière schématique, on y place uniquement les principaux blocs d’informations et éléments d’interactions. Les wireframes permettent de structurer une page web avant même d’avoir attaqué le design. Pour vous faire une idée, voici à quoi cela peut ressembler . En général les wireframes sont utilisés au sein de l’équipe projet pour identifier les interactions entre les pages, la disposition des éléments etc. Les wireframes sont très pratique lorsque l’on passe à la conception du site. . Je lui ai naturellement expliqué que le design se fera dans une étape secondaire… Résultat : le client à tout de suite mordu De cette manière j’ai fait d’une pierre deux coups, présentation de mes idées au client et préparation du travail pour le développement du site… J’avais procédé quasiment de la même manière il y a de cela quelques mois pour un autre client.
Ergonomie 101 : les éléments d’une bonne scénarisation Pourquoi scénariser le web? La scénarisation est un terme surtout utilisé dans l’industrie du cinéma. En contexte web, elle désigne l’étape de création de maquettes dites « fonctionnelles », aussi appelées les maquettes fil de fer ou wireframes. Un peu comme l’architecte dessine les plans d’une maison, l’ergonome organise l’espace sur les pages web. les objectifs du siteles personas (ou clientèle cible)les données d’utilisation du site (merci Google Analytics!) Tout ça dans un but ultime : créer la meilleure expérience pour l’utilisateur. Le travail de scénarisation permet de communiquer facilement les orientations du projet au client et valider les enjeux du site. Un complément à l’arborescence L’arborescence illustre bien les différentes sections du site et chacune des pages qui s’y retrouvent. Les maquettes fonctionnelles illustrent clairement comment la navigation, l’interactivité et les fonctionnalités prennent forme sur le site. Le contenu d’abord Le piège du design Exemple Programmeur
Les indicateurs clés de performance pour le SEO Puisque le référencement naturel (SEO pour les intimes) est devenu un véritable investissement pour les entreprises (en temps aussi bien qu’en argent), il devient évident de pouvoir créer des rapports de données efficaces pour comprendre l’impact des actions mises en place. Aussi une partie du travail consiste-t-elle à créer des « tableaux de bord » (« dashboards ») qui rassemblent les Indicateurs Clés de Performance (ICP) correspondant à l’identité, aux objectifs et aux cibles de votre business… Métriques et outils pour mesurer votre travail Il est certain que les ICP peuvent varier grandement d’un site web à un autre, ne serait-ce que par sa catégorie : site vitrine, plateforme informative, site de e-commerce… Ici je vous présenterai les 3 ICP universels et applicables dans la plupart des cas : le trafic d’un site, son classement (« ranking ») dans les pages des résultats de recherche des moteurs, et son net-linking (ses liens entrants). Quoi et pourquoi ? Outils : Google Analytics.
Design d’interface et critère ergonomique 8: Adaptabilité Ma liste de critères ergonomiques pour la conception d’interface contient 11 critères. C’est une liste personnelle, établie au départ sur la base des normes & standards existants (ISO 9241, AFNOR Z67 133, Bastien & Scapin, Heuristiques US …), que je m’efforce de partager au quotidien avec les équipes de développement tout en sensibilisant le métier sur la question. Critère n°1 : Incitation Critère n°2 : Lisibilité Critère n°3 :Groupement-Distinction entre items Critère n°4 : Feedback Direct Critère n°5: Contrôle Utilisateur Critère n°6 : ConcisionCritère n°7 : Gestion des erreursCritère n°8: AdaptabilitéCritère n°9: CohérenceCritère n°10: SignifianceCritère n°11: Compatibilité Adaptabilité : en quoi ça consiste ? C’est S’ADAPTER aux caractéristiques des utilisateurs (vues, perspectives, raccourcis…) Portail personnalisé Ce critère concerne la capacité du système à réagir selon le contexte, mais aussi selon les besoins, préférences et niveaux d’expertise des utilisateurs. Bonne pratique :
Fevad Pattern Un article de Wikipédia, l'encyclopédie libre. Cette page d’homonymie répertorie les différents sujets et articles partageant un même nom. Sur les autres projets Wikimedia : pattern, sur le Wiktionnaire Le mot anglais « pattern » est souvent utilisé pour désigner un modèle, une structure, un motif, un type, etc. Un pattern constitue donc une solution générique à un type de problème fréquemment rencontré, en décrivant et formalisant les concepts sous-jacents à cette solution. Informatique[modifier | modifier le code] Il est employé en informatique[1] dans les cas suivants : les Patterns d'analyse facilitent et guident les étapes de la phase d'analyse ;Architectural pattern : patron d'architecture (ex. : le Modèle-Vue-Contrôleur) ;Les Design patterns ou patrons de conception sont des façons de programmer éprouvées et réputées pour apporter des propriétés comme la cohérence, la robustesse, la réutilisabilité, etc. Arts[modifier | modifier le code] Sauvetage[modifier | modifier le code]
A quoi sert la pagination sur le web La lecture de la semaine provient de la rubrique “technologies” du site d’information américain Slate (@slate), on la doit à Farhad Manjoo (@fmanjoo), qui tient cette rubrique, le texte s’intitule : “arrêtez tout de suite la pagination”. “La pagination”, écrit Farahad Manjoo, “est, en termes de design et d’usage, le pire péché sur le Web. Elle est la preuve d’un mépris constant et silencieux pour ceux qui devraient être la cible privilégiée des sites d’informations : à savoir les gens qui veulent les articles jusqu’au bout. Or c’est faux, rappelle Manjoo. Image : le tourneur de page d’Andy Brandon. “Chaque jour, comme des dizaines de millions d’autres lecteurs innocents, je clique sur des articles qui se révèlent être des morceaux d’articles. Certains avancent qu’ils aiment que les articles soient divisés en plusieurs pages. Je ne suis pas en complet désaccord avec l’idée que ce sont là des bénéfices de la pagination. “J’y crois”, dit Farhad Majoo. Xavier de la Porte
10 règles basiques de SEO « Beaucoup d’appelés mais peu d’élus » – Nous parlons bien des premières positions dans les SERP Google (search engine results page ou page de résultat de recherche). Le SEO (Search Engine Optimization) ou référencement naturel consiste en un ensemble de techniques visant à positionner un site Internet dans les premiers résultat de recherche des moteurs de recherche sur des requêtes bien définies. La particularité de la discipline réside dans le fait que personne ne connait vraiment le fonctionnement de l’algorithme qui régit les positions des sites indéxés. Ce fameux algorithme évolue par ailleurs au rythme des fréquentes mises à jour (Google Panda ou Google Pingouin pour les dernières) qui sèment parfois la désolation sur leur passage (cf. En somme, le S.E.O. reste un far west digital !
LaudableApps - Home Évaluation d'entreprise / Focus bases documentaires / Accueil - Ordre des Experts-Comptables L'expert-comptable, en tant que professionnel du chiffre et de l'évaluation financière, peut être amené à intervenir dans un cadre d'évaluation financière, dans l'ensemble des cas suivants (non exhaustifs) : Expertise indépendante Impairment test (norme IAS 36) Purchase Price Allocation (normes IFRS/IAS 38) Expertise judiciaire Dans le cadre du patrimoine privé de l'EIRL Commissariat aux apports Expertise immobilière Évaluation d'options Évaluations extra-financières
Wireframe (design) Un article de Wikipédia, l'encyclopédie libre. Exemple de Wireframe Pour Jakob Nielsen, le maquettage wireframe correspond à du prototypage horizontal[1], c'est-à-dire au développement de la partie graphique de l'interface homme-machine. La confirmation de la satisfaction des exigences de l'interface utilisateur et des possibilités du site webLa simulation du fonctionnement a priori du site web selon les objectifs de départUne première estimation du temps et du coût de développement Pour un site web, une première forme de maquette statique consiste à définir le « zoning » des écrans, c’est-à-dire le découpage des pages du site. Le zoning sert de base au travail du graphiste. Bien que le passage par le maquettage papier soit encore une technique courante, il devient de plus en plus fréquent d'utiliser des logiciels dédiés ou détournés de leur fonction d'origine : Portail d’Internet
Ergonomie et référencement : les meilleures pratiques pour 2013 Vous avez été plus de 300 à nous suivre lors de la conférence du salon e-Commerce Paris 2012. C’est avec un grand plaisir que nous vous livrons ici les Best Practices 2013 en matière d’optimisation du référencement et de l’ergonomie. Tout d’abord, un bref rappel des conventions et règles ergonomiques déjà en vigueur… 1. Conventions et règles en ergonomie Les conventions et règles à respecter dans une démarche ergonomique pour le haut de page (header) Vous remarquerez que beaucoup de ces éléments relèvent désormais du bon sens. Ci-dessous, les éléments pour le footer : Les conventions et règles à respecter dans une démarche ergonomique pour le bas de page (footer) Les conventions en Ergonomie : des règles de bon sens qui doivent être adoptées et appliquées par tous en 2013. Les conventions et règles à respecter dans une démarche ergonomique 18 critères répartis en 8 groupes : Voici les autres règles que nous vous proposons : 2. La Méthode du tri de cartes (“Card Sorting”) 3. 4. 5. 6. 7. 8. 9. 10.
SEO: Quatre actions qui amélioreront la découverte de votre blogue Sans être spécialiste du SEO, vous pouvez facilement améliorer la découverte de votre site Web ou blogue. Il existe quelques techniques relativement simples à mettre en place qui vous aideront à propulser votre espace Web. Dans un premier temps, je vous rappelle qu’il n’y a pas de formule magique. Sur le Web, pour être découvert, vous devez créer du contenu original à valeur ajoutée. Il ne s’agit pas ici de mettre en place votre site et de créer du contenu pour une période de quelques mois. Ce processus de création de contenu doit s’inscrire dans le temps. Au-delà des ces quatre suggestions, vous devez adhérer à des services comme Google outils pour webmasters ainsi que Big Webmaster tools (Microsoft). Voici les quatre actions que je vous suggère de mettre en oeuvre pour améliorer la découverte de vos contenus sur le Web: Créez et authentifiez votre page d’entreprise sur Google+ Google+ c’est le réseau social de Google. Ces actions ne remplacent pas une stratégie SEO.
20 Mobile Apps Inspiration and Design Patterns As a mobile apps designer I’m sure you are often looking for inspiration to ensure that you can deliver constant innovation and high quality to your clients. A really efficient way to get serious inspiration for specific parts of your mobile apps project is looking for web sites showcasing the best apps created be other creative designers. With hundred thousands of mobile apps flooding the market it can be challenging to stand out and I recommend you seek inspiration and look for good elements and combine the top findings into new unique creations. If you are not a mobile apps designer and developer yet I can tell you that there is a great chance you will be one soon. It is all about mobile right now and it is not going to change very soon! As the mobile Internet surfing is constantly increasing there’s a huge trend right now leaving website administrators with an important job to do. Advertisement 1. Mobile Awesomeness is a gallery for mobile websites. 2. 3. jQuery Mobile 4. 5. 6. 7. 8.