Wordpress et SEO - Campus Made in Blog 2014 MontréalMade in
Cette présentation de Benoît Descary, donnée lors du Campus Made in Blog de Montréal, offre de bonnes bases en matière de référencement. Parfait pour les utilisateurs de Wordpress qui débutent.
Exposé C2I sur la veille technologique, réalisé par Jérémie PIARD et Imane BEHRILI, en classe d'EI2 PASSMED à l'ISTIA (Angers).
Veille réalisé avec les outils suivants : Pearltrees, Zotero, Netvibes, Tagxedo, Coggle, ...
Wordpress et SEO - Campus Made in Blog 2014 MontréalMade in
Cette présentation de Benoît Descary, donnée lors du Campus Made in Blog de Montréal, offre de bonnes bases en matière de référencement. Parfait pour les utilisateurs de Wordpress qui débutent.
Exposé C2I sur la veille technologique, réalisé par Jérémie PIARD et Imane BEHRILI, en classe d'EI2 PASSMED à l'ISTIA (Angers).
Veille réalisé avec les outils suivants : Pearltrees, Zotero, Netvibes, Tagxedo, Coggle, ...
El documento presenta información sobre el congreso SG'09, incluyendo temas de interés como el desarrollo para smartphones, aplicaciones para iPhone y el mercado de aplicaciones móviles. También incluye noticias recientes sobre eventos de la industria de TI como la presentación de la versión en español de CMMI y artículos sobre temas como la adopción de tecnologías de desarrollo de software.
Startup Europe Week - launch event presentation (Igor Tasic)Igor Tasic
Startup Europe Week launch presentation by Igor Tasic (CEO) at the European Commission on 1st February 2016, with the presence of Andrus Ansip and Markku Markkula.
Full speech: https://www.youtube.com/watch?v=pjeddqguf5Q
Este documento presenta una teoría sobre el muestreo de aceptación, que es un proceso de inspección de una muestra de unidades extraídas de un lote para decidir si aceptar o rechazar todo el lote. Explica que el muestreo de aceptación es una opción intermedia entre inspeccionar el 100% de unidades o ninguna, y a veces es la opción más económica. También describe dos tipos de planes de muestreo - por variable y por atributos - y analiza las ventajas y desventajas del muestreo de aceptación
Este documento trata sobre blogs y educación en línea. Explica que un blog es un sitio web que publica artículos de forma cronológica y que sirve para compartir opiniones. También describe algunos tipos de blogs como personales, periodísticos y educativos. Además, destaca las ventajas de la educación en línea como la flexibilidad y la posibilidad de terminar estudios, pero también menciona posibles desventajas como la limitación de horarios.
The document describes three craft classes:
1) A soldering class on March 5th costing $50 to make a pendant, with decorative soldering techniques. Students must bring their own soldering iron.
2) A peyote stitch bracelet making class on March 12th using Super Duo beads, costing $20. Students need specific beads and thread.
3) A wire weaving class on March 25th costing $30 to make a Celtic-style bracelet or cuff using wire and beads. Students choose the wire gauge and can include optional focal pieces.
There are many different ways to trade and invest in the market such as physical stocks (delivery based),
physical bonds (delivery based certificates), physical commodities etc., as well as others such as options,
forwards, futures and so on. And CFD is being one of such instruments - perhaps the most flexible
instrument that can replicate all the others etc. So what is a CFD?
La Experiencia del Candidato - Hugo Hernández - Don ChambitasSoftware Guru
El documento describe las diferentes etapas de la experiencia de un candidato en el proceso de selección de una empresa. Comienza cuando encuentra la oferta de trabajo y continúa a través de la investigación de la cultura de la empresa, el primer contacto, el proceso de selección técnico, la comunicación de la decisión final, el primer día de trabajo y más allá de la contratación, cuando realmente comienza la experiencia dentro de la empresa.
In this presentation, you will learn:
- How to provoke confidence and credibility while showcasing yourself as a professional
- How to position you as a thought-leader in your industry for massive career growth
- How to position you and your brand above your competition
- How to align your business goals and target audience so you can reach your true potential
Il 6 Marzo all'Univesità Bocconi ho parlato della Digitalizzazione dei Processi legati alla Fatturazione Elettronica, partendo dalla descrizione della normativa italiana e dei Dlgs 127/2015 e Dlgs 193/2016.
Mike Kruzeniski discusses the evolution of mobile design, apps, and ecosystems. For design, he traces a shift from representing technology through physical artifacts to prioritizing information overlay. Apps have moved from isolated silos to interconnected webs. Ecosystems have expanded from singular rockstar designers to include broader communities. The presentation covers these transitions and their implications for the mobile landscape.
The document provides an overview of design thinking and its application in different contexts. It discusses using design thinking in healthcare, financial services, government and other organizations. It outlines workshops and projects to build awareness of design thinking and foster collaboration. It also discusses enabling emergence through active discovery, conversations, socialization and connecting individuals and teams.
Como projetar interfaces para Realidade Virtual? Nessa palestra para o 1º UX UAI BH abordo temas como VR, Realidade Aumentada e virtual.
Post sobre projetar VR: http://goo.gl/Grbn21
El documento habla sobre el empoderamiento y la defensa de los derechos de las personas con discapacidad. Explica que empoderarse significa aprender a defender los propios derechos basándose en la igualdad de derechos para todas las personas. También describe la Convención sobre los Derechos de las Personas con Discapacidad y cómo esta garantiza la igualdad mediante la accesibilidad, los ajustes razonables y el diseño universal. Además, ofrece pautas para identificar la discriminación y defender los propios derechos de manera asertiva
Looking under the hood of various RAN Access Deployment Technologies: 4G, LTE...Small Cell Forum
This document discusses various radio access network deployment technologies including 4G, LTE-Advanced, and 5G. It provides diagrams of the TIP 4G unbundled block diagram showing a type 1 architecture with a non-virtualized radio. It also shows the MCORD architecture with a disaggregated and virtualized RAN and EPC connected to a leaf-spine fabric. Finally, it discusses Radisys' LTE cloud-RAN solution and their involvement in open source consortiums working on xRAN, TIP and CORD as well as their roadmap for LTE-Advanced and 5G technologies.
This document provides an overview and examples of Bootstrap, an open-source front-end framework for building responsive mobile-first websites and web apps. It discusses what Bootstrap is, the pre-built HTML and CSS components it contains, how to use its grid system including different screen sizes, and provides examples of websites built with Bootstrap. The speaker is Woratana Ngarmtrakulchol, a front-end developer and founder of Designil.com who is interested in topics like WordPress, front-end development, and web design.
A empresa analisada apresentou um aumento no endividamento de curto prazo entre 2013 e 2015. Ela também teve liquidez baixa em 2015, mas permanece solvente, com baixa dependência de estoques. Sua rentabilidade sobre investimentos vem aumentando.
Ce document, accompagné d’une série d’exercices corrigés, constitue un support de formation présentielle d’une durée de 5 jours basé sur le cours officiel de Microsoft 20480B.
El documento presenta información sobre el congreso SG'09, incluyendo temas de interés como el desarrollo para smartphones, aplicaciones para iPhone y el mercado de aplicaciones móviles. También incluye noticias recientes sobre eventos de la industria de TI como la presentación de la versión en español de CMMI y artículos sobre temas como la adopción de tecnologías de desarrollo de software.
Startup Europe Week - launch event presentation (Igor Tasic)Igor Tasic
Startup Europe Week launch presentation by Igor Tasic (CEO) at the European Commission on 1st February 2016, with the presence of Andrus Ansip and Markku Markkula.
Full speech: https://www.youtube.com/watch?v=pjeddqguf5Q
Este documento presenta una teoría sobre el muestreo de aceptación, que es un proceso de inspección de una muestra de unidades extraídas de un lote para decidir si aceptar o rechazar todo el lote. Explica que el muestreo de aceptación es una opción intermedia entre inspeccionar el 100% de unidades o ninguna, y a veces es la opción más económica. También describe dos tipos de planes de muestreo - por variable y por atributos - y analiza las ventajas y desventajas del muestreo de aceptación
Este documento trata sobre blogs y educación en línea. Explica que un blog es un sitio web que publica artículos de forma cronológica y que sirve para compartir opiniones. También describe algunos tipos de blogs como personales, periodísticos y educativos. Además, destaca las ventajas de la educación en línea como la flexibilidad y la posibilidad de terminar estudios, pero también menciona posibles desventajas como la limitación de horarios.
The document describes three craft classes:
1) A soldering class on March 5th costing $50 to make a pendant, with decorative soldering techniques. Students must bring their own soldering iron.
2) A peyote stitch bracelet making class on March 12th using Super Duo beads, costing $20. Students need specific beads and thread.
3) A wire weaving class on March 25th costing $30 to make a Celtic-style bracelet or cuff using wire and beads. Students choose the wire gauge and can include optional focal pieces.
There are many different ways to trade and invest in the market such as physical stocks (delivery based),
physical bonds (delivery based certificates), physical commodities etc., as well as others such as options,
forwards, futures and so on. And CFD is being one of such instruments - perhaps the most flexible
instrument that can replicate all the others etc. So what is a CFD?
La Experiencia del Candidato - Hugo Hernández - Don ChambitasSoftware Guru
El documento describe las diferentes etapas de la experiencia de un candidato en el proceso de selección de una empresa. Comienza cuando encuentra la oferta de trabajo y continúa a través de la investigación de la cultura de la empresa, el primer contacto, el proceso de selección técnico, la comunicación de la decisión final, el primer día de trabajo y más allá de la contratación, cuando realmente comienza la experiencia dentro de la empresa.
In this presentation, you will learn:
- How to provoke confidence and credibility while showcasing yourself as a professional
- How to position you as a thought-leader in your industry for massive career growth
- How to position you and your brand above your competition
- How to align your business goals and target audience so you can reach your true potential
Il 6 Marzo all'Univesità Bocconi ho parlato della Digitalizzazione dei Processi legati alla Fatturazione Elettronica, partendo dalla descrizione della normativa italiana e dei Dlgs 127/2015 e Dlgs 193/2016.
Mike Kruzeniski discusses the evolution of mobile design, apps, and ecosystems. For design, he traces a shift from representing technology through physical artifacts to prioritizing information overlay. Apps have moved from isolated silos to interconnected webs. Ecosystems have expanded from singular rockstar designers to include broader communities. The presentation covers these transitions and their implications for the mobile landscape.
The document provides an overview of design thinking and its application in different contexts. It discusses using design thinking in healthcare, financial services, government and other organizations. It outlines workshops and projects to build awareness of design thinking and foster collaboration. It also discusses enabling emergence through active discovery, conversations, socialization and connecting individuals and teams.
Como projetar interfaces para Realidade Virtual? Nessa palestra para o 1º UX UAI BH abordo temas como VR, Realidade Aumentada e virtual.
Post sobre projetar VR: http://goo.gl/Grbn21
El documento habla sobre el empoderamiento y la defensa de los derechos de las personas con discapacidad. Explica que empoderarse significa aprender a defender los propios derechos basándose en la igualdad de derechos para todas las personas. También describe la Convención sobre los Derechos de las Personas con Discapacidad y cómo esta garantiza la igualdad mediante la accesibilidad, los ajustes razonables y el diseño universal. Además, ofrece pautas para identificar la discriminación y defender los propios derechos de manera asertiva
Looking under the hood of various RAN Access Deployment Technologies: 4G, LTE...Small Cell Forum
This document discusses various radio access network deployment technologies including 4G, LTE-Advanced, and 5G. It provides diagrams of the TIP 4G unbundled block diagram showing a type 1 architecture with a non-virtualized radio. It also shows the MCORD architecture with a disaggregated and virtualized RAN and EPC connected to a leaf-spine fabric. Finally, it discusses Radisys' LTE cloud-RAN solution and their involvement in open source consortiums working on xRAN, TIP and CORD as well as their roadmap for LTE-Advanced and 5G technologies.
This document provides an overview and examples of Bootstrap, an open-source front-end framework for building responsive mobile-first websites and web apps. It discusses what Bootstrap is, the pre-built HTML and CSS components it contains, how to use its grid system including different screen sizes, and provides examples of websites built with Bootstrap. The speaker is Woratana Ngarmtrakulchol, a front-end developer and founder of Designil.com who is interested in topics like WordPress, front-end development, and web design.
A empresa analisada apresentou um aumento no endividamento de curto prazo entre 2013 e 2015. Ela também teve liquidez baixa em 2015, mas permanece solvente, com baixa dependência de estoques. Sua rentabilidade sobre investimentos vem aumentando.
Ce document, accompagné d’une série d’exercices corrigés, constitue un support de formation présentielle d’une durée de 5 jours basé sur le cours officiel de Microsoft 20480B.
L'histoire d'html5 pour les développeurs windows phone 8davrous
Dans cette session, nous parcourons ensemble l'histoire HTML5 pour les développeurs Windows Phone 8. Nous verrons d'abord comment utiliser des morceaux d'HTML5 dans certaines applications natives, ce qui peut s'avérer dans certains cas exceptionnels être assez pratique. Ensuite, grâce aux possibilités d'IE10, nous verrons qu'il est également possible de créer de vraies applications vivant uniquement dans le navigateur. Pour finir, nous jetterons un oeil aux possibilités d'intégration dans l'OS grâce au template de projet HTML5 de Visual Studio 2012 ou grâce à des frameworks comme PhoneGap ou Sencha Touch 2.
Jouée pendant les MS Techdays 2013: http://www.microsoft.com/france/mstechdays/programmes/2013/fiche-session.aspx?ID=2d81322e-6ab2-4840-a4b1-568f1bd370f4
Introduction au développement Windows 8 ModernUI avec HTML5 et JavaScriptMicrosoft
Nous verrons durant cette heure de session comment développer une application pour le Windows Store grâce aux technologies HTML5, JS & CSS3. Nous verrons ainsi comment construire depuis 0 un petit lecteur de flux RSS. Cela sera notre excuse pour découvrir l’usage de WinJS, le framework JavaScript de Microsoft pour Windows 8, ainsi que de l’outillage Visual Studio 2012 et Blend 5. Pour finir, nous verrons à travers un petit exemple d’usage de la camera comment fonctionne l’accès à WinRT depuis JS, le nouveau jeu d’API dédiés aux applications modernes.
Introduction au développement windows 8 modern ui avec html5 et javascriptdavrous
Nous verrons durant cette heure de session comment développer une application pour le Windows Store grâce aux technologies HTML5, JS & CSS3. Nous verrons ainsi comment construire depuis 0 un petit lecteur de flux RSS. Cela sera notre excuse pour découvrir l'usage de WinJS, le framework JavaScript de Microsoft pour Windows 8, ainsi que de l'outillage Visual Studio 2012 et Blend 5. Pour finir, nous verrons à travers un petit exemple d'usage de la camera comment fonctionne l'accès à WinRT depuis JS, le nouveau jeu d'API dédiés aux applications modernes.
Session jouée lors des MS Techdays 2013: http://www.microsoft.com/france/mstechdays/programmes/2013/fiche-session.aspx?ID=60738dd2-6d50-4360-a285-ed988e49d850
Retrouvez les tutoriaux associés sur mon blog: http://blogs.msdn.com/b/davrous/archive/2012/09/05/tutorial-series-using-winjs-amp-winrt-to-build-a-fun-html5-camera-application.aspx & http://blogs.msdn.com/b/davrous/archive/2012/06/04/comment-cr-233-er-un-petit-lecteur-de-flux-rss-pour-windows-8-metro-en-html5-et-en-30-min-partie-1-2.aspx
alphorm.com - Formation HTML5, CSS 3 et JavaScript (70-480)Alphorm
Formation complète ici http://www.alphorm.com/tutoriel/formation-en-ligne-html5-css-3-et-javascript-70-480
Cette vidéo/tutorial fait partie de la Formation HTML5, CSS 3 et JavaScript (70-480). Elle est réalisée par Chamseddine OUERHANI pour http://www.alphorm.com. Vous pouvez retrouver toute la formation ici http://www.alphorm.com/formation/formation-html5-css-3-et-javascript-70-480
Voici le plan de cette vidéo/tutorial :
Vue d'ensemble de HTML et CSS
Créer et styler une page HTML5
Introduction à JavaScript
Créer des formulaires pour collecter des données et valider les entrées utilisateurs
Communiquer avec une source de données distante
Styler HTML5 en utilisant CSS3
Créer des objets et des méthodes en utilisant JavaScript
Créer des pages interactives en utilisant les API HTML5
Ajouter le support du mode hors ligne aux
applications
Implémenter une interface utilisateur
adaptative
Créer des graphiques avancés
Animer l'interface utilisateur
Implémenter la communication temps-réel
avec les Web Sockets
Créer un processus Web Worker
Bonne formation.
Dans cette session, vous découvrirez les nouveaux standards supportés par Internet Explorer 10. Coté CSS3, on verra ainsi des choses comme grid layout, animations ou transitions. Coté nouvelles APIs, nous passerons un peu de temps sur la gestion du drag-n-drop, IndexedDB, la gestion de l’Application Cache ou bien encore la gestion du tactile. Pour découvrir tout cela, nous verrons à chaque fois de petits exemples d’illustration ainsi que des sites plus « complexes » les mettant en œuvre.
Les dernières avancées html5 & css3 en action !davrous
Dans cette session, vous découvrirez les nouveaux standards supportés par Internet Explorer 10. Coté CSS3, on verra ainsi des choses comme grid layout, animations ou transitions. Coté nouvelles APIs, nous passerons un peu de temps sur la gestion du drag-n-drop, IndexedDB, la gestion de l'Application Cache ou bien encore la gestion du tactile. Pour découvrir tout cela, nous verrons à chaque fois de petits exemples d'illustration ainsi que des sites plus « complexes » les mettant en oeuvre.
Présentation jouée pendant les MS Techdays 2013: http://www.microsoft.com/france/mstechdays/programmes/2013/fiche-session.aspx?ID=4a174b26-32b7-4d4c-8523-ad3a3228ef53
Retrouvez tous les exemples de code sur mon blog ici: http://blogs.msdn.com/b/davrous/archive/2012/11/03/demos-links-amp-articles-associated-to-htm5-amp-css3-latest-features-in-action-build-3-114.aspx
Arte utilise Acquia Cloud pour héberger ses plateformes webAcquia
Pascal Thuet, Arte et Cyril Reinhard, Acquia présentent retour d'expérience sur la refonte de la plateforme ARTE Creative, sa migration d'un CMS maison vers Drupal 7 et de son hébergement dans le cloud d'Acquia.
Le déroulement du projet
L'architecture technique
La migration
Le choix de l'hébergement
Les outils d'Acquia
Retour et premier bilan après les deux premiers mois de fonctionnement
L'HÉBERGEMENT DANS LE CLOUD D'UNE PARTIE DES
PLATEFORMES WEB ARTE AVEC ACQUIA
Pascal Thuet
Chef de Projet Secteur Nouvelles
Technologie ARTE
Cyril Reinhard
Regional Director Acquia
Twitter : @cyrilCR
Nouvelle plateforme éditoriale et de débats d'ARTE
• Destinée à tous les sujets d'aujourd'hui qui feront le
monde de demain
o Environnement
o Sciences
o Société
o Economie
• 3 types majeurs de contenus :
o Vidéos
o Textes & analyses
o Infographies interactives
Introduction aux concepts de Responsive Web Design, méthodos, outils et REX sur ces méthodes (Avantages, inconvénients, coûts...) pour le BreizhCamp 2013
Construisez votre intranet avec microsoft office 365 sans code a os canadia...Samuel Lévesque
Dans le passé, de nombreuses organisations réalisaient leurs intranets et hébergeait celui-ci à l'interne.
La tendance à changé et les organisations s'orientent maintenant vers le cloud pour répondre à leurs besoins d'intranet.
Lors de cette session nous allons tenter de répondre aux questions suivantes : "Est-ce que notre intranet doit être construit avec Microsoft Office 365 ? Est-ce possible de réaliser un intranet sans développement majeur?".
Dans cette session, Samuel Lévesque abordera :
• Les avantages d'utiliser Microsoft Office 365 pour un intranet;
• Les meilleures pratiques à considérer;
• Des composantes clés en main sans code.
Seo Camp'us 2018 - SEO & FRAMEWORK JAVASCRIPT - Philippe Yonnet - Directeur G...Peak Ace
“Comment bien référencer un site fait avec un framework javascript (angularJS, ReactJS, etc.) ?”
L’occasion de faire le point sur la façon dont Google prend en compte les contenus générés en javascript, l’Ajax, et sur les différentes méthodes pour mieux référencer les pages web réalisées à partir de Frameworks Javascript comme AngularJS ou EmberJS crawlables…
Intervenant : Philippe Yonnet, Directeur Général Search Foresight
Similaire à Responsive design - Twitter Bootstrap [FR] (20)
L'IA connaît une croissance rapide et son intégration dans le domaine éducatif soulève de nombreuses questions. Aujourd'hui, nous explorerons comment les étudiants utilisent l'IA, les perceptions des enseignants à ce sujet, et les mesures possibles pour encadrer ces usages.
Constat Actuel
L'IA est de plus en plus présente dans notre quotidien, y compris dans l'éducation. Certaines universités, comme Science Po en janvier 2023, ont interdit l'utilisation de l'IA, tandis que d'autres, comme l'Université de Prague, la considèrent comme du plagiat. Cette diversité de positions souligne la nécessité urgente d'une réponse institutionnelle pour encadrer ces usages et prévenir les risques de triche et de plagiat.
Enquête Nationale
Pour mieux comprendre ces dynamiques, une enquête nationale intitulée "L'IA dans l'enseignement" a été réalisée. Les auteurs de cette enquête sont Le Sphynx (sondage) et Compilatio (fraude académique). Elle a été diffusée dans les universités de Lyon et d'Aix-Marseille entre le 21 juin et le 15 août 2023, touchant 1242 enseignants et 4443 étudiants. Les questionnaires, conçus pour étudier les usages de l'IA et les représentations de ces usages, abordaient des thèmes comme les craintes, les opportunités et l'acceptabilité.
Résultats de l'Enquête
Les résultats montrent que 55 % des étudiants utilisent l'IA de manière occasionnelle ou fréquente, contre 34 % des enseignants. Cependant, 88 % des enseignants pensent que leurs étudiants utilisent l'IA, ce qui pourrait indiquer une surestimation des usages. Les usages identifiés incluent la recherche d'informations et la rédaction de textes, bien que ces réponses ne puissent pas être cumulées dans les choix proposés.
Analyse Critique
Une analyse plus approfondie révèle que les enseignants peinent à percevoir les bénéfices de l'IA pour l'apprentissage, contrairement aux étudiants. La question de savoir si l'IA améliore les notes sans développer les compétences reste débattue. Est-ce un dopage académique ou une opportunité pour un apprentissage plus efficace ?
Acceptabilité et Éthique
L'enquête révèle que beaucoup d'étudiants jugent acceptable d'utiliser l'IA pour rédiger leurs devoirs, et même un quart des enseignants partagent cet avis. Cela pose des questions éthiques cruciales : copier-coller est-il tricher ? Utiliser l'IA sous supervision ou pour des traductions est-il acceptable ? La réponse n'est pas simple et nécessite un débat ouvert.
Propositions et Solutions
Pour encadrer ces usages, plusieurs solutions sont proposées. Plutôt que d'interdire l'IA, il est suggéré de fixer des règles pour une utilisation responsable. Des innovations pédagogiques peuvent également être explorées, comme la création de situations de concurrence professionnelle ou l'utilisation de détecteurs d'IA.
Conclusion
En conclusion, bien que l'étude présente des limites, elle souligne un besoin urgent de régulation. Une charte institutionnelle pourrait fournir un cadre pour une utilisation éthique.
Ouvrez la porte ou prenez un mur (Agile Tour Genève 2024)Laurent Speyser
(Conférence dessinée)
Vous êtes certainement à l’origine, ou impliqué, dans un changement au sein de votre organisation. Et peut être que cela ne se passe pas aussi bien qu’attendu…
Depuis plusieurs années, je fais régulièrement le constat de l’échec de l’adoption de l’Agilité, et plus globalement de grands changements, dans les organisations. Je vais tenter de vous expliquer pourquoi ils suscitent peu d'adhésion, peu d’engagement, et ils ne tiennent pas dans le temps.
Heureusement, il existe un autre chemin. Pour l'emprunter il s'agira de cultiver l'invitation, l'intelligence collective , la mécanique des jeux, les rites de passages, .... afin que l'agilité prenne racine.
Vous repartirez de cette conférence en ayant pris du recul sur le changement tel qu‘il est généralement opéré aujourd’hui, et en ayant découvert (ou redécouvert) le seul guide valable à suivre, à mon sens, pour un changement authentique, durable, et respectueux des individus! Et en bonus, 2 ou 3 trucs pratiques!
Le Comptoir OCTO - Qu’apporte l’analyse de cycle de vie lors d’un audit d’éco...OCTO Technology
Par Nicolas Bordier (Consultant numérique responsable @OCTO Technology) et Alaric Rougnon-Glasson (Sustainable Tech Consultant @OCTO Technology)
Sur un exemple très concret d’audit d’éco-conception de l’outil de bilan carbone C’Bilan développé par ICDC (Caisse des dépôts et consignations) nous allons expliquer en quoi l’ACV (analyse de cycle de vie) a été déterminante pour identifier les pistes d’actions pour réduire jusqu'à 82% de l’empreinte environnementale du service.
Vidéo Youtube : https://www.youtube.com/watch?v=7R8oL2P_DkU
Compte-rendu :
OCTO TALKS : 4 Tech Trends du Software Engineering.pdfOCTO Technology
En cette année 2024 qui s’annonce sous le signe de la complexité, avec :
- L’explosion de la Gen AI
-Un contexte socio-économique sous tensions
- De forts enjeux sur le Sustainable et la régulation IT
- Une archipélisation des lieux de travail post-Covid
Découvrez les Tech trends incontournables pour délivrer vos produits stratégiques.
Le Comptoir OCTO - Équipes infra et prod, ne ratez pas l'embarquement pour l'...OCTO Technology
par Claude Camus (Coach agile d'organisation @OCTO Technology) et Gilles Masy (Organizational Coach @OCTO Technology)
Les équipes infrastructure, sécurité, production, ou cloud, doivent consacrer du temps à la modernisation de leurs outils (automatisation, cloud, etc) et de leurs pratiques (DevOps, SRE, etc). Dans le même temps, elles doivent répondre à une avalanche croissante de demandes, tout en maintenant un niveau de qualité de service optimal.
Habitué des environnements développeurs, les transformations agiles négligent les particularités des équipes OPS. Lors de ce comptoir, nous vous partagerons notre proposition de valeur de l'agilité@OPS, qui embarquera vos équipes OPS en Classe Business (Agility), et leur fera dire : "nous ne reviendrons pas en arrière".
4. Le responsive design, c’est quoi ?
https://www.alsacreations.com/article/lire/1615-cest-quoi-le-responsive-web-design.html
Le Responsive Web design est une approche de
conception Web qui vise à l'élaboration de sites
offrant une expérience de lecture et de navigation
optimales pour l'utilisateur quelle que soit sa gamme
d'appareil (téléphones mobiles, tablettes, liseuses,
moniteurs d'ordinateur de bureau).
5. Eléments du Responsive Web Design (RWD)
• Grille fluide
• Images et médias flexibles
• CSS3 Media Queries
• Adaptations conditionnelles basées sur Javascript
ou jQuery
12. Media Queries
• Spécification CSS3 Media Queries qui définit les techniques
l'application de feuilles de styles en fonction des périphériques
consultation utilisés pour du HTML.
• On nomme également cette pratique Responsive Web
Design, pour dénoter qu'il s'agit d'adapter dynamiquement le
design à l'aide de CSS.
• Devenu un standard en Juin 2012
13. Résolution Média
Média Taille du layout
Smartphones 480px et en dessous
Tablettes en mode portrait 480px à 768px
Tablettes en mode paysage 768px à 940px
Défaut 940px et au dessus
Ecrans larges 1210px et au dessus
14. Framework
• Pré-requis :
• Système de grille fluide
• Redimensionnable
• Qui offre plus qu’une grille (styles prédéfinis pour la
typographie, les tableaux, les boutons, les barres de
navigation, les éléments de formulaire, etc.)
15. Framework
• Documentation très fournie
• Maintenu régulièrement par la communauté et les créateurs
du framework
• Open Source (gratuit)
16.
17. Twitter Bootstrap
• Framework libre et gratuit pour le design de sites ou
d’applications web
• Basé sur HTML5, CSS et Javascript
• Supporte tous les principaux navigateurs
• 1ère release sur GitHub en Août 2011
22. Twitter Bootstrap : Pourquoi ?
• Raison #4 : système de grille
• Système de grille 960 http://960.gs/
• Blue Print CSS http://www.blueprintcss.org/
• Système Golden Grid http://goldengridsystem.com/
23. Twitter Bootstrap : Pourquoi ?
• Raison #5 : Les composants
Les boutons
Les onglets
La navigation (breadcrumb)
La pagination
Les notifications
La barre de progression
26. Twitter Bootstrap : Comment ?
• Télécharger Bootstrap et un éditeur de texte (Sublime, Notepad++)
• Installer l’éditeur de texte
• Extraire les fichiers Bootstrap dans un répertoire de votre projet
• Créer un fichier exemple et intégrer le framework :
Une grille fluide, où les largeurs des éléments de structure sont débarrassées des unités de pixels
Des images, des médias et des contenus flexibles leur permettant de ne pas "déborder de leur parent" lorsque celui-ci se restreint
Une adaptation de l'affichage au Viewport du terminal
Des CSS3 Media Queries permettant d'appliquer différentes règles de styles CSS selon la taille, l'orientation ou le ratio du device
Éventuellement des adaptations conditionnelles (menu de navigation) côté client, basées sur JavaScript ou jQuery
Une philosophie "Mobile First" et "Enrichissement progressif" facilitant l'accessibilité, la compatibilité et la performance des pages produites
De plus en plus souvent de parties détectées et générées côté serveur (RESS), là aussi notamment pour accélérer l'affichage de certains composants ou ressources.
Une version 16 colonnes existe et chaque colonne fait 40px de large. Tout le reste est inchangé.
Avec CSS2 et HTML4, il était déjà possible de spécifier un média de destination pour l'application d'une ou plusieurs feuilles de style. C'est ainsi que l'on a pu associer des règles CSS complémentaires pour l'impression, modifiant la mise en page, favorisant tel élément ou faisant disparaître un autre inutile à la sortie sur papier, par exemple un menu de navigation. La balise <link> est alors dupliquée pour autant de feuilles de style que nécessaire, et comporte un attribut media précisant le contexte dans lequel les styles doivent être appliqués :
<!doctype html> <head> <meta charset="utf-8"> <title>Media Queries !</title> <link rel="stylesheet" media="screen" href="screen.css" type="text/css" /> <link rel="stylesheet" media="print" href="print.css" type="text/css" /> </head> <body> ... </body>
L'attribut media peut prendre (depuis CSS2) les valeurs suivantes :
Screen
Écrans
Handheld
Périphériques mobiles ou de petite taille
Print
Impression
aural (CSS 2.0) / speech (CSS 2.1)
Synthèses vocales
Braille
Plages braille
Embossed
Imprimantes braille
Projection
Projecteurs (ou présentations avec slides)
Tty
Terminal/police à pas fixe
Tv
Téléviseur
All
Tous les précédents
Ces directives peuvent parfaitement être intégrées au sein même d'une feuille de style grâce à une règle @media suivie directement du type.
La philosophie des Media Queries (ou requêtes de media) en CSS3 est d'offrir un panel de critères plus vaste et plus précis, à l'aide de propriétés et de valeurs numériques, ainsi que de combinaisons multiples de ces mêmes critères. Le but est de cibler plus finement les périphériques de destination en fonction de leurs capacités intrinsèques.
L'écriture de ces requêtes est relativement explicite (en anglais) : une media query est une expression dont la valeur est toujours vraie ou fausse. Il suffit d'associer les différentes déclarations possibles avec un opérateur logique pour définir l'ensemble des conditions à réunir pour l'application des styles compris dans le bloc adjacent.
Les opérateurs logiques peuvent être :
and "et",
only "uniquement"
not "non".
Exemple :
<link rel="stylesheet" media="screen and (max-width: 640px)" href="smallscreen.css" type="text/css" />
Bootstrap utilise un système de grille sur 12 colonnes
Qu’est ce qu’un système de grille ? C’est un système qui permet d’avoir des fondations solides pour construire sa web app ou son site web.
Si vous voulez une web application avec un barre de navigation à gauche vous pouvez utiliser l’exemple à la ligne 3 dans l’image ci-dessus.
Si vous ne voulez pas de barre de navigation et que vous souhaitez que votre contenu prenne toute la largeur de la page vous pouvez utiliser l’exemple à la ligne 5 dans l’image ci-dessus.
Ce système de grille a été rendu populaire par 960 grid system et Blue Print css.
Bootstrap donne vie à l’UI grâce aux plugins jQuery
Bootstrap propose un outil de personnalisation en ligne qui permet de générer un CSS basé sur vos besoins spécifiques.