background preloader

Outils pour site web

Facebook Twitter

Boîte à outils. Centre National de Ressources Textuelles et Lexicales. Inventaire des contenus : modèle et méthode. Ce billet a été lu 12516 fois. À votre tour? Le plan de contenu répertorie tous les contenus produits dans un projet de stratégie éditoriale. Il désigne le document (généralement dans le format d’un tableur Excel) qui inventorie tous ces contenus. Dans ce billet, je propose une définition, une méthode et un modèle à télécharger. Le plan de contenu – ou inventaire des contenus – est un outil précieux, performant et très rentable, qui devrait être mis en place dès le départ de tout projet de gestion de contenus en ligne… Dans la gamme des outils éditoriaux (dont j’ai déjà évoqué certains : les personæ, la charte lexicale, l’arborescence, la check-list rédactionnelle, etc.), l’inventaire des contenus est l’un des plus simples à créer et à utiliser, et pourtant l’un des plus négligés voire ignorés des projets Web…

Modernizr: the feature detection library for HTML5/CSS3. PageSpeed Insights. Fontello - icon fonts generator. Initializr - Start an HTML5 Boilerplate project in 15 seconds! Jetstrap - The Bootstrap Interface Builder. Scaffolding. Need reasons to love Bootstrap?

Scaffolding

Look no further. By nerds, for nerds. Built at Twitter by @mdo and @fat, Bootstrap utilizes LESS CSS, is compiled via Node, and is managed through GitHub to help nerds do awesome stuff on the web. Made for everyone. Bootstrap was made to not only look and behave great in the latest desktop browsers (as well as IE7!)

6 free mobile device emulators for testing your site. The percentage of all web usage that comes from smartphones and other mobile devices is growing, and it won’t be long before mobile internet users overtake desktop and laptop users in terms of web traffic.

6 free mobile device emulators for testing your site

So it’s a cardinal sin to ignore mobile users when you’re developing a website. One of the most important things you can do to make a website mobile-friendly is to test it on multiple smartphone and tablet platforms. Luckily, mobile emulators make it easy to do this. A mobile phone emulator lets you check the responsiveness and functionality of the website across different mobile platforms, such as iPhone, iPad, Android and BlackBerry, without actually having the devices in hand. Mobile emulators can help you pinpoint problems and issues with the website and allow you to take corrective measures to make the website visually appealing and functional on mobile devices. iPad Peek iPhone Tester As the name suggests, iPhone Tester is one of the most popular mobile emulators for iPhones. Nombre d'or, suite de Fibonacci et autres grilles de mise en page pour le design web.

Golden Grid System. GGS was my next step after Less Framework.

Golden Grid System

Instead of a fixed-width grid, it used a fully fluid-width one, without even a maximum width. The resources it was published with are still available on GitHub. The idea was to take a 18-column grid, use the outermost columns as margins, and use the remaining 16 to lay elements out. On smaller screens the 16 columns could be folded into 8, 4 and 2. This behaviour was inspired by Massimo Vignelli's Unigrid system. While the grid's columns were fluid — proportional to the screen's width — the gutters (spaces between the columns) were proportional to the font-size being used. GGS also contained a set of typographic presets, strictly to a baseline grid.

Correctly setting all of these measurements is difficult, of course. When published, GGS gained a lot of attention, as the web design community was searching ways to work with fluid-width grids, which have always been troublesome, running counter to many graphic design principles. Mobile Design Pattern Gallery. RIA Screen Layouts. Tutoriel » wdfriday. Les recommandations de l'IAB. Yazo.net - Accueil. Subway Map Visualization jQuery Plugin.

I have always been fascinated by the visual clarity of the London Underground map.

Subway Map Visualization jQuery Plugin

Given the number of cities that have adopted this mapping approach for their own subway systems, clearly this is a popular opinion. At a conference some years back, I saw a poster for the Yahoo! Developer Services. They had taken the concept of a subway map and applied it to create a YDN Metro Map. Once again, I was in awe of the visual clarity of this map in helping one understand the various Yahoo!

University departments, offices, student groupsGovernmentOpen Source projectsInternet startups by category More examples on this blog: Ten Examples of the Subway Map Metaphor. Fast-forward to now. With these goals in mind, I started creating my jQuery plugin. jQuery Parallax Plugin Demo. jQuery TOOLS - The missing UI library for the Web. jQuery API Documentation.

MockFlow - Online Wireframe Tool. Can I use... Support tables for HTML5, CSS3, etc. About "Can I use" provides up-to-date browser support tables for support of front-end web technologies on desktop and mobile web browsers.

Can I use... Support tables for HTML5, CSS3, etc

The site was built and is maintained by Alexis Deveria, with occasional updates provided by the web development community. The design used as of 2014 was largely created by Lennart Schoors. May I use your data in my presentation/article/site, etc? Yes, the support data on this site is free to use under the CC BY 4.0 license. Is there a way to see the support data in colors other than red/green? Yes, you can enable accessible colors from this link or from the option under Settings. Do you have the data available in a raw format? Yes, the raw support data is available on GitHub and is updated regularly. Could you add feature X to the site? Adding features takes quite some time and there are many requests for additions. If you've done the research yourself already, you can also submit a feature on GitHub. HTML5 Readiness.

Gestures + Reveal.JS" by William Wu. Créez des schémas en ligne et collaborez en temps réel. Www.dontclick.it. HTML5 Boilerplate: The web's most popular front-end template.