background preloader

Créer les maquettes de son site web

Créer les maquettes de son site web
La réalisation des maquettes est une étape déterminante dans la création d’un site internet. Pour que votre site web soit agréable, il faut naturellement soigner le design de l’interface graphique, mais surtout, pour que votre site internet soit efficace, il faut construire une mise en page intelligente et adaptée à vos objectifs et vos contenus. La réalisation des maquettes doit passer par plusieurs étapes, du design fonctionnel en noir et blanc, au design graphique intégrant votre identité et vos couleurs. Dans cet article, nous allons vous donner toutes les clés pour réussir cette étape fondamentale dans tout projet de création de site web. La réalisation des maquettes, une étape clé dans la création de votre site internet Maquette, wireframe, ergolayout, mockup ou interface graphique : de quoi parle-t-on exactement ? Les professionnels du web sont généralement créatifs en matière de sémantique. La maquette fonctionnelle (wireframe) La maquette graphique (photoshop) Related:  Infographie, conception ressources

Étude : les contenus qui génèrent des backlinks et des partages sur les réseaux sociaux Moz et BuzzSumo présentent les résultats d’une étude conjointe sur les partages et les backlinks. 1 million d’articles ont été analysés. Objectif : comptabiliser les partages sur les réseaux sociaux et les liens obtenus sur d’autres sites (backlinks), mesurer la corrélation entre le nombre de partages et les backlinks, et mettre en évidence les éléments qui permettent d’obtenir des partages et des backlinks. La distribution des partages et des backlinks Premier enseignement : la plupart des contenus publiés sont très peu partagés sur les réseaux sociaux. 50% des articles obtiennent 2 partages Facebook ou moins (en agrégeant les likes, les commentaires et les partages), 2 partages Twitter ou moins, 1 partage Google+ ou moins et aucun partage LinkedIn. Les réseaux sociaux sur lesquels les contenus sont partagés BuzzSumo a également isolé les 757 317 posts issus de sa propre base de données. La corrélation entre les partages et les backlinks Les caractéristiques des contenus populaires

Les logiciels indispensables pour le développement Cet article a pour objectif de répondre à cette question : Quels sont les outils logiciels que vous trouvez indispensables dans un cycle de développement ? Initialement cette question a fait l'objet d'un post qui est ici (merci à Straahd !!!) Cet article reprend les logiciels qui sont ressortis le plus souvent dans cet article et d'autres qui à mon avis n'ont pas été nommés. Etant donné que je suis plutôt adepte de l'OS Windows, merci à ceux qui apporteront des précisions sur les univers Linux et MAC. De plus les logiciels évoluant tout le temps cette liste est susceptible d'être modifiée au cours du temps, donc merci de me faire part de vos avis, précisions, etc. sur ce sujet. Vous noterez également que dans plusieurs catégories, on trouve de multiples outils. Merci également pour votre indulgence car je ne connais pas, ou n'utilise pas tous les outils présentés (ce qui pourrais expliquer quelques erreurs) - Avez vous essayé le logiciel cité en référence ? Merci d'avance pour votre aide !!!

Scénariser et produire un module de formation en PowerPoint Wireframe and Mockup Tool | PowerMockup Méthodologies pour le développement de cours e-learning - Un guide pour concevoir et élaborer des cours d’apprentissage numérique Les appellations employées dans ce produit d’information et la présentation des données qui y figurent n’impliquent de la part de l’Organisation des Nations Unies pour l’alimentation et l’agriculture (FAO) aucune prise de position quant au statut juridique ou au stade de développement des pays, territoires, villes ou zones ou de leurs autorités, ni quant au tracé de leurs frontières ou limites. La mention de sociétés déterminées ou de produits de fabricants, qu’ils soient ou non brevetés, n’entraîne, de la part de la FAO, aucune approbation ou recommandation desdits produits de préférence à d’autres de nature analogue qui ne sont pas cités. Les opinions exprimées dans ce produit d’information sont celles du/des auteur(s) et ne reflètent pas nécessairement celles de la FAO.

Les bons outils pour commencer à intégrer votre site web Introduction Pour débuter dans la création de pages web, vous aurez besoin de mettre en oeuvre deux langages : HTML et CSS, qui seront rédigés à l'aide d'un logiciel nommé éditeur de code source et sauvegardés sous forme de fichiers possédant les extensions .html et .css. Ceux-ci seront envoyés via un logiciel FTP qui permet de publier les fichiers depuis votre ordinateur vers le serveur web où ils seront stockés et mis à disposition des visiteurs. Les langages HTML et CSS Ces deux langages se complètent, l'un pose le squelette du site alors que l'autre le met en forme. HyperText Markup Language (ou Langage de balisage hypertexte) HTML, né en 1994, est le langage du Web par excellence. Les médias (images, sons, vidéos, fichiers téléchargeables) ne sont pas intégrés directement au sein de la page HTML, mais sont "appelés" par celle-ci. Cascading Style Sheets (ou Feuilles de styles en cascades) Le langage CSS (né en 1996) met en forme le HTML mais ne structure pas la page web. Chrome Safari

Choisir la bonne typo avec Typement Pour la moindre présentation ou projet web destiné à être lu, le choix des typos se pose. S’il existe des outils pour harmoniser les couleurs, et ne pas faire de fautes de goût, on se sent souvent seul au monde et perdu au moment de choisir une typo. Surtout quand on du mal à se souvenir du nom de telle ou telle typo. Pour nous aider à faire les bons choix, un outil va très vite devenir votre indispensable : Typement. Vous entrez un texte et choisissez typo sans-serif, serif ou écrite à la main. Une grille d'analyse de la qualité des cours en ligne Produire de beaux cours est une obsession légitime de tout établissement de formation. Qu'il soit présentiel ou en ligne, tous désirent offrir les meilleurs parcours, les plus pertinents et qui répondent aux besoins des apprenants. Le problème est qu'il est difficile parfois de s'évaluer. Aux États-Unis, les établissements offrant des cours en ligne peuvent compter sur une organisation à but non lucratif qui a été formé dans le Maryland pour proposer une grille d'analyse qui est de plus en plus adoptée dans les écoles et lieux de formation en Amérique du Nord. La qualité de cours compte Quality Matters (QM) est un consortium de collèges et d'universités du Maryland qui promeut depuis le milieu de la décennie 2000 la qualité de la formation en ligne. Présentation de cours et introductionObjectifs d'apprentissageTravaux et évaluationMatériel d'enseignementActivités du cours et interactions de l'apprenantTechnologies du coursSupport de l'étudiantAccessibilité Et du coup, les effets? Références

Inspirations et outils pour créer sa charte graphique On ne répétera jamais assez l'importance d'avoir une image de marque solide pour réussir à se faire connaître à une époque où les sollicitations sont plus que jamais nombreuses. Si l'on peut rapidement comprendre les clés pour créer une expérience de marque réussie, reste à déterminer précisément ce qui nous définit. Bien entendu, lorsque vient le moment de créer son image, il ne faut surtout pas oublier que des professionnels dont c'est le métier sont là pour nous aider. Et que sauf cas très particulier, il n'y a que très peu de chance que tu parviennes à faire mieux en bricolant avec les moyens du bord. Soyons clairs. Cependant, pour de petits projets non professionnels, avec peu ou carrément pas de budget, il peut nous arriver de devoir nous débrouiller : pour un blog personnel, un side-project, les travaux d'une association de bénévoles... Ce n'est pas pour autant que l'on doit faire un travail bâclé. Des outils de création rapide de charte graphique Frontify Tu peux ainsi : Une démo ici.

Créer son identité de marque et une charte graphique simple Voici comme promis la suite de mon article sur les outils et inspirations pour créer soi-même une charte graphique simple. Comme je l'évoquais alors, construire une charte graphique est un vrai travail de professionnel, qui ne s'improvise pas si l'on souhaite avoir un résultat de qualité. Ces articles répondent donc à des besoins précis, par exemple pour des projets personnels ou associatifs, pour lesquels le budget est parfois proche de zéro. Ils peuvent aussi pourquoi pas être une bonne base pour pouvoir discuter avec des pros, en appréhendant un peu mieux le travail qu'ils ont à fournir. Mon but aujourd'hui est de faire le tour des éléments minimum à prendre en compte, pour s'assurer de ne rien oublier. Je me suis aidé pour cela de mon propre exemple (c'était l'occasion), à l'aide de l'outil gratuit Frontify que j'ai présenté la dernière fois. Quelques éléments importants avant de commencer Définir son identité Quelles sont ses missions ? Quelles sont les valeurs qu'elle défend ? Logo Couleurs

Free data, statistics, analysis, visualization & sharing - knoema.com techniques d’inventaire des contenus | architecture de l'information avec IAFACTORY Résumé : partageons ensemble quelques moments de réflexions sur la problématique, ô combien complexe, de l’inventaire des contenus. Vous savez les contenus, cette chose qu’on appelle parfois le « wording », « l’editing » et qui fait toute la différence quand le spider vient faire la moisson… Vous avez certainement déjà été amené(e) à travailler sur la refonte d’un support digital, n’est-ce pas ? Oh, je ne parle pas bien sûr d’un inventaire de quelques pages… En dessous de 100 pages c’est presque trop facile, pas de défis, pas de challenge, presque inintéressant. Ce type de problématique, relativement fréquente aujourd’hui, notamment pour les grands groupes amenés à traiter une multitude de sujets et à être présent sur tous les fronts, implique des techniques d’inventaire sur lesquelles il me semblerait intéressant de faire un zoom. Faisons ce zoom ensemble. En bref, une des premières étapes du travail d’architecture de l’information revient à inventorier tous les contenus.

Related: