Une de ces bien belles histoires dont la Silicon Valley a le secret.
▻https://www.franceinter.fr/emissions/histoires-economiques/histoires-economiques-17-septembre-2020
J’espère qu’Hollywood en fera un film.
#html
-
-
Les gens qui font de l’#HTML apprécieront ces déclarations du patron de Nikola « The entire infotainment system is a HTML 5 super computer," Milton said. "That’s the standard language for computer programmers around the world, so using it let’s us build our own chips. And HTML 5 is very secure. »
▻https://www.truckinginfo.com/330475/whats-behind-the-grille-of-the-new-nikola-hydrogen-electric-truck
-
A l’été, Nikola valait près de 30 milliards d’euros : plus que Ford, que Hyundai, que Fiat Chrysler. Beaucoup plus que PSA ou Renault ! Avec une particularité : elle n’avait encore produit aucun véhicule. Seulement deux prototypes de camion à l’hydrogène. C’était juste une promesse.
-
-
Pour une page #Web qui dure 10 ans ?
▻https://framablog.org/2020/08/24/pour-une-page-web-qui-dure-10-ansDes #pages web légères et moins gourmandes en ressources, du « low-tech » c’est plus écologique probablement, mais c’est aussi une des conditions pour rendre durables des #contenus qui ont une fâcheuse tendance à se volatiliser… Jeff Huang est professeur d’informatique et … Lire la suite
#Autonomie_numérique #archivage #CSS #HTML #Images #marque-pages #pérennité #URL
-
Où je découvre GoAccess... va falloir aller tester ça... sur SeenThis par exemple ? :-)
▻https://goaccess.ioGoAccess is an open source real-time web log analyzer and interactive viewer that runs in a terminal in *nix systems or through your browser.
It provides fast and valuable HTTP statistics for system administrators that require a visual server report on the fly.
-
#plook
découvert cet été que des amis modifient toujours un site qui date de 2004 sans que ça casse (cms basic et sans bdd). Je me souviens d’une formation web au siècle dernier ou le prof sans méchanceté se disait toutefois perplexe devant la pauvreté des contenus. Et de fait, si on code pour le web, les mises à jour de sécurité, le suivi technique, la concurrence et la course à la nouveauté technologique ont contribué à épuiser la créativité politique du début du web.
Je ne parle évidemment pas des industries de clic à égo.
-
-
BigBlueBotton (▻http://docs.bigbluebutton.org)
▻https://diasp.eu/p/10726317BigBlueBotton
#BigBlueBotton is an #OpenSource web conferencing system for online #learning.
A valid alternative to ms #teams, google #hangouts, ms #skype, #zoom, ...
#BigBlueButton is an #HTML5 based #web #application
We stated above that #BigBlueButton extends many of its core features to focus on enabling the instructor to engage students. There are four main use cases for engagement: 1. #Tutoring/ virtual #office hours 1. Flipped #classroom 1. Group #collaboration 1. Full online classes
If you are an instructor, BigBlueButton helps you engage students with: 1. Multi-user #whiteboard 1. Break out #rooms 1. #Chat (public and private) 1. #Polling 1. Shared #notes 1. #Emojis
Tutorial Videos: ▻https://bigbluebutton.org/html5 Server installation: (...)
-
CUBE #CSS - Piccalilli
▻https://piccalil.li/blog/cube-cssIn this article, I’m going to tell you about how I like to write CSS, which I think could help a lot of folks—at least I hope so—because I’ve used this approach, or an earlier iteration of this approach, to power massive websites, tiny blogs, mobile apps and even intranet software! This #methodology has roots in both huge projects that service millions of people all the way down to small websites and starter kits, thanks to its flexibility. This Flexibility has also enabled CUBE CSS to work in both very old and very new codebases.
The focus of the methodology is utilising the power of CSS and the web platform as a whole, with some added controls and structures that help to keep things a bit more maintainable and predictable. The end-goal is shipping as little CSS as possible—leaning heavily into progressive enhancement and modern techniques. I hope by the end of the article, it’ll help you to re-think how maybe you write CSS in the future.
What is CUBE CSS?
CUBE stands for Composition Utility Block Exception, and CSS stands for, y’know, CSS (Cascading Style Sheets). As mentioned before, the CUBE methodology is very much an extension of good ol’ CSS, rather than a reinvention. This mantra is very seriously maintained too, as the cascade and inheritance particularity play a big role.
This isn’t a heavily documented, complex methodology. Well, not now, anyway. It’s more of a concept method of organising CSS just enough to not pull to far away from the “classic” way of writing it. Really, it’s more of a thinking structure.
I’ve been all the way down the micro-optimisation rabbit hole and been down the “let’s build a library of skeletal components for all projects” (this almost never brings any benefit). On the opposite end of the scale, I’ve done all globals with direct HTML tag styling, too. Any method is extremely valid for your context and if this is how you write your CSS, keep doing what works for you and your team. All I would recommend is keeping other team’s contexts and caveats in mind before you recommend your way as absolute.
-
#intégration #web #html #css #méthodologie
2-3 trucs que j’ai trouvé intéressant :
– séparer la notion de composition (layout quoi), cela dit il ne donne aucun exemple de code et de comment l’appliquer, et au final pour moi c’est un peu comme un « module »/block particulier, dont on ne connait pas les éléments intérieurs (BEM permet sans aucun problème d’avoir des blocks dans des blocks, donc par exemple avoir un block « card » dans un block « colonnes_3 » …)
– le fait de ranger les classes CSS dans le HTML lui-même, à la fois dans un ordre logique ET le plus important avec un séparateur, qui sera parfaitement ignoré par HTML (je trouve ça pas mal avec juste pipe | c’est léger et ça fait bien le job)
– le fait de mettre les variantes dans des data- du HTML… ce qui les rend plus facile d’accès au JS aussi… bon j’ai trouvé ça intéressant mais ça reste à voir, si vraiment utile par rapport à des classes de variante en plus…
-
-
HTML5UP Hyperspace V3 pour #spip
Adaptation pour SPIP du squelette « Hyperspace » de #html5up
-
HTML5UP Forty pour #SPIP
Adaptation pour SPIP du squelette « FORTY » de #html5up
-
-
-
@jeanmarie une fois de plus le compte a eu son flux RSS coupé au bout de 6 mois, et la personne derrière son email (je ne donnerai pas de nom) n’a pas réagi...
-
-
-
-
On se cale pour le jour de la livraison ? Je suis pas loin :)
-
-
-
-
5 VSCode Quick Tips to Boost Your HTML Writing - By Felipe Augusto Rosa
▻https://hackernoon.com/5-vscode-quick-tips-to-boost-your-html-writing-uw943yx6?source=rssQuelques optimisation/astuces de VSCodium pour faciliter l’écriture du HTML : sélection, commentaires, tag wrapping et emmet
Pour emmet voir aussi :
– la doc : ▻https://docs.emmet.io
– la cheat-sheet : ▻https://docs.emmet.io/cheat-sheetmerci @tofulm !
-
-
@jeanmarie ouep j’en ai lu quelques uns de ces articles «X super tips to boost your...» ;)
-
-
« Recreating The Arduino Pushbutton Using SVG And ‹lit-element› » by Uri Shaked, 20.01.2020
▻https://www.smashingmagazine.com/2020/01/recreating-arduino-pushbutton-svg#webComponents #svg #html #usability #accessibility #aria #article
Cet article est truffé d’astuces et il adresse richement l’utilisation de lit-html et lit-element pour créer un composant SVG, bien fichu et accessible qui plus est.
Pardonnez-moi, oui, je m’intéresse parfois à ces extremum de technicalité (si vous me passez encore ce néo-anglicisme de mon cru) et arcanes du web. J’adore les technologies du web en fait, suis accro.
-
STRONG, B, I, EM : quelle balise utiliser et pourquoi ? - Alsacreations
▻https://www.alsacreations.com/article/lire/552-strong-b-em-i-quelle-balise-utiliser-et-pourquoi.htmlMémo pour l’utilisation des balises inline : mise en évidence et/ou présentation
#sémantique #balise #html
-
Éléments HTML5 de structure - romy.tetue.net
▻http://romy.tetue.net/elements-html-5-de-structureLe mémo de romy.tetue.net pour l’organisation de la structure d’une page en HTML5
Sur les imbrications section/article voir aussi : ▻https://www.alsacreations.com/article/lire/1376-html5-section-article-nav-header-footer-aside.html
Sur la structuration implicite du plan des éléments de la page généré par ces balises, voir : ▻https://developer.mozilla.org/fr/docs/Web/HTML/Sections_and_Outlines_of_an_HTML5_document -
Responsive Images : comprendre srcset et sizes - Alsacreations
▻https://www.alsacreations.com/article/lire/1621-responsive-images-srcset.htmlImages responsives : les attributs srcset et size de la balise
<img>pour utilisation de multiples source et taille pour une image
Voir aussi : ▻https://developer.mozilla.org/fr/docs/Apprendre/HTML/Comment/Ajouter_des_images_adaptatives_%C3%A0_une_page_web#srcset #size #img #image #responsive #adaptive_image #HTML5 #CSS
-
Can I email… Support tables for #HTML and #CSS in #emails
▻https://www.caniemail.comA site that offers support info on more than 50 HTML and CSS features tested across 25 email clients.
-
The “One HTML Page Challenge”, a great example of view-source culture / Boing Boing
►https://boingboing.net/2019/08/23/the-one-html-page-challenge.htmlWhen I was interviewing developers for my latest book Coders, all the ones who grew up during the late 90s and early 00s web talked about how powerful view-source was in teaching themselves to code and make stuff online.
But web development these days has grown byzantine in its complexity; if newbie is trying to learn, view-source is liable to just cough up a slurry of incomprehensible, minified javascript. It closes off the easy onramps that existed back in the earlier days of the web.
So, projects like this one-page challenge are awesome, because the whole goal is to encourage the writing of web-site code that’s more legible and tractable.
#programmation #développement #HTML #Javascript #CSS #éducation
-
le site du challenge : ▻https://onehtmlpagechallenge.com
-
-
Paradigm Shift (#HTML5up)
Squelette « one page » adapté du thème Paradigm Shift de HTML5 UP pour #SPIP
▻https://contrib.spip.net/Paradigm-Shift-HTML5up
Attention : contrib en chantier
-
How to Section Your HTML
▻https://css-tricks.com/how-to-section-your-htmlThe sectioning elements in #HTML5 are
<nav>,<aside>,<article>, and<section>.<body>is also kind of a sectioning element since all content lying inside of it is part of the default document section. -
Solid State (HTML5up)
Squelette adapté du thème Solid State de #HTML5_UP
▻https://contrib.spip.net/Solid-State-HTML5up
#spip #spip_blog #intégration #web
-
“I charged $18,000 for a Static HTML Page ... and got away with it.” A tale of #corporate_bureaucracy.
-
C’est tellement ça. Actuellement sur une refonte qui devait durer 3 mois maximum tel que planifié dans le contrat. Le client n’a rien fait pour son site depuis 8 mois malgré indications et conseils pour le soutenir dans sa réécriture. Son mail reçu hier pour demander ce qu’il doit faire en priorité me laisse bouche bée.
#exploitation #travail_du_web
-
-
Front-end Developer Handbook 2019 - Learn the entire JavaScript, CSS and HTML development practice!
▻https://frontendmasters.com/books/front-end-handbook/2019 -
Chrome, Safari et d’autres navigateurs ne vont plus permettre de désactiver l’audit de lien, qui permet de suivre les clics sur les liens de sites
▻https://www.developpez.com/actu/255113/Chrome-Safari-et-d-autres-navigateurs-ne-vont-plus-permettre-de-desactivL’article original : ▻https://lapcatsoftware.com/articles/Safari-link-tracking.html
L’audit de lien dont il est question ici est l’attribut « ping » des balises « a » (= lien hypertexte) qui entraîne un POST tout à fait irrespectueux de la vie privée sur l’URL donnée dans la valeur de l’attribut : cf la doc de cet attribut sur MDN : ▻https://developer.mozilla.org/fr/docs/Web/HTML/Element/a#attr-ping qui précise bien :
Cet attribut est généralement utilisé pour tracer un utilisateur.
Cet attribut a été introduit par la version 5.3 de HTML5 : cf ▻https://www.w3.org/TR/html53/links.html#sec-hyperlink-auditing
A noter un début de discussion remettant en cause la pertinence technique du mécanisme utilisé qui pose clairement ses enjeux pour le W3C :Hyperlink auditing is important because advertising and referral-based user tracking are two of the primary means of generating revenue via Web sites. However, by its very nature, such tracking must be comprehensive, accurate, and unavoidable by a typical user or it simply won’t be relied upon by site owners and advertisers.
(cf le premier message de ▻https://lists.w3.org/Archives/Public/public-html/2009Dec/thread.html#msg183)
...ce qui donne un exemple typique des intérêts et de la partialité du W3C dans la fabrication des standards du web !
#navigateur #vie_privée #ping #hyperlink-auditing #html5 #w3c #standard #lobby
-
Overview of how does #css works behind the scenes?
▻https://hackernoon.com/overview-of-how-does-css-works-behind-the-scenes-498d98b0e404?source=rssFrontamentalsLet’s start by understanding what actually happens to our CSS code when we load up a web page in a browser.When a browser starts to load the initial #html file, it takes the loaded HTML code and parses it, which means that it will decode the code line by line. By this process, the browser builds the so-called DOM (Document Object Modal) which describes the entire web document in a tree with parent, children and sibling elements.HTML ParsingAs the browser parses the HTML, it also finds the stylesheets included in the HTML head and just like HTML, CSS is also parsed.But the parsing of CSS bit more complex.There are two main steps that are performed during the CSS parsing phase :1. Conflicting CSS declarations are resolved (also known a cascading)2. Process final CSS values (for (...)
-
Learn basic #html
▻https://hackernoon.com/learn-basic-html-be230361457?source=rss----3a8144eabfe3---4HTML is the language for creating Web pages and the HTML elements are actually blocks that are used to build a page. Learn the basics to become a front-end professional.(This article was initially posted on ▻https://www.developermate.com)HTML stands for HyperText Markup Language. The first web pages was released in 1990 and the pages were only used for presentation. Today the web is a very important piece in our daily lives. You may use many different web browsers to look at web-pages, like: Google Chrome, Opera, Internet Explorer and Firefox.HTML Page StructureIt is important to understand the HTML page structure.The <head> is used for the title and meta-tags. Only content inside the <body> section (the white area) is displayed by the web browser.HTML TagsHTML tags are (...)
-
HTML5 Pre-resize images before uploading - Stack Overflow
▻https://stackoverflow.com/questions/10333971/html5-pre-resize-images-before-uploadingExemple de manipulation d’image par le navigateur (redimensionnement) avant son POST vers un serveur
Le billet original sur mozilla-dev : ►https://hacks.mozilla.org/2011/01/how-to-develop-a-html5-image-uploaderLa doc de l’API File de HTML5 : ▻https://developer.mozilla.org/fr/docs/Web/API/File/Using_files_from_web_applications
-
The Box Model
▻https://hackernoon.com/the-box-model-44fc2c04a935?source=rss----3a8144eabfe3---4This article will brief you about the #css Box Model.What is The Box Model?Every element in the #html document comprised of one or more rectangular boxes. CSS box model describes how these rectangular boxes are laid out on a web page. The Box Model describes how the padding, border, and margin are added to the content to create this rectangle. In other words, we can say that every box has a content area and an optional surrounding margin, padding, and border.by republic.comThe innermost rectangle is the content box. The width and height of this depend on the element’s content (text, images, videos and any child elements ).Then we have the padding box (defined by the padding property). If there is no padding width defined, the padding edge is equal to the content edge.Next, the border box (...)
-
Mettre en page un livre avec uniquement du #logiciel_libre (non, pas LaTeX), un cas réel raconté par le maquettiste/typographe ▻https://polylogue.org/addictions-sur-ordonnance-making-of-dune-collection-liberee #HTML #CSS #JavaScript #PDF #UI
