Seenthis
•
 
Identifiants personnels
  • [mot de passe oublié ?]

  • https://www.smashingmagazine.com

/2018

  • ►/12
    • ►/gutenberg-accessibility-situation
  • ►/06
    • ►/placeholder-attribute
  • ►/05
    • ►/using-the-web-with-javascript-turned-off
    • ►/print-stylesheets-in-2018
  • ►/02
    • ►/sse-websockets-data-flow-http2
    • ►/media-queries-responsive-design-2018
  • ►/01
    • ►/deferring-lazy-loading-intersection-observer-api
  • @b_b
    b_b @b_b PUBLIC DOMAIN 5/03/2019

    What Can Be Learned From The Gutenberg Accessibility Situation ? — Smashing Magazine
    ▻https://www.smashingmagazine.com/2018/12/gutenberg-accessibility-situation

    The accessibility lead, Rian Rietveld, resigned in October, citing political and codebase issues.

    The second thing is that Automattic set a hard deadline for WordPress 5’s release, regardless of whether accessibility issues were fixed or not.

    You’ll probably find it shocking that a crowd funding campaign has been put together to get an accessibility audit done on Gutenberg.

    The Gutenberg editor, which is a product of Automattic’s influence on WordPress who (as a company) were valued at over $1 Billion in 2014 are not paying for a much-needed accessibility audit. They are instead sitting back and waiting for everyone else to pay for it.Perhaps if accessibility was considered at the very start of the project, the process of creating, editing and moving blocks would be a lot simpler and thus, not a cognitive overload. The problem now is that accessibility is a fix rather than a core feature.

    L’histoire d’une mauvaise gestion de « transition » (pour ne pas dire projet) qui montre bien qu’on peut se « planter » même si on a une grande communauté et plein de pognon...

    • #Automattic
    b_b @b_b PUBLIC DOMAIN
    • @rastapopoulos
      RastaPopoulos @rastapopoulos CC BY-NC 5/03/2019

      #wordpress #accessibilité #gutenberg #automattic

      RastaPopoulos @rastapopoulos CC BY-NC
    Écrire un commentaire
  • @nhoizey
    Nicolas Hoizey @nhoizey CC BY-NC-SA 21/06/2018
    1
    @b_b
    1

    Don’t Use The Placeholder Attribute
    ▻https://www.smashingmagazine.com/2018/06/placeholder-attribute

    “The placeholder attribute contains a surprising amount of issues that prevent it from delivering on what it promises. Let’s clarify why you need to stop using it.”

    #placeholder_form_HTML_attribute_a11y_clevermarks

    Nicolas Hoizey @nhoizey CC BY-NC-SA
    • @b_b
      b_b @b_b PUBLIC DOMAIN 6/08/2018

      The p element placed between the label and input elements acts as a replacement for a placeholder attribute.

      Cool, c’est ce que propose #SPIP dans sa nomenclature depuis longtemps...

      By using aria-describedby to programmatically associate the input with the p element, we are creating a priority of information for screen readers that has parity with what a person browsing without a screen reader would experience. aria-describedby ensures that the p content will be described last, after the label’s content and the kind of input it is associated with.

      On pourrait suivre ce conseil pour améliorer la chose dans le plugin saisies.

      b_b @b_b PUBLIC DOMAIN
    Écrire un commentaire
  • @nhoizey
    Nicolas Hoizey @nhoizey CC BY-NC-SA 20/05/2018
    3
    @rastapopoulos
    @mukt
    @suske
    3

    I Used The Web For A Day With JavaScript Turned Off
    ▻https://www.smashingmagazine.com/2018/05/using-the-web-with-javascript-turned-off

    “The web is a hostile, unpredictable environment, which is why many developers follow the principle of progressive enhancement to build their sites up from a core experience of semantic HTML, layering CSS and unobtrusive JavaScript on top of that.”

    #nojs_JavaScript_progressiveEnhancement_clevermarks

    • #JavaScript
    Nicolas Hoizey @nhoizey CC BY-NC-SA
    • @rastapopoulos
      RastaPopoulos @rastapopoulos CC BY-NC 29/05/2018

      #intégration #web #amélioration_progressive #javascript

      RastaPopoulos @rastapopoulos CC BY-NC
    Écrire un commentaire
  • @b_b
    b_b @b_b PUBLIC DOMAIN 2/05/2018
    2
    @rastapopoulos
    @cy_altern
    2

    A Guide To The State Of Print Stylesheets In 2018
    ▻https://www.smashingmagazine.com/2018/05/print-stylesheets-in-2018

    Testing print stylesheets can be something of a bore, typically requiring using print preview or printing to a PDF repeatedly. However, browser DevTools have made this a little easier for us. Both Chrome and Firefox have a way to view the print styles only.

    #Firefox : Open the Developer Toolbar then type media emulate print at the prompt.

    #css #print

    b_b @b_b PUBLIC DOMAIN
    • @rastapopoulos
      RastaPopoulos @rastapopoulos CC BY-NC 2/05/2018

      #intégration #web #impression #HTML

      RastaPopoulos @rastapopoulos CC BY-NC
    Écrire un commentaire
  • @nhoizey
    Nicolas Hoizey @nhoizey CC BY-NC-SA 8/03/2018

    Using SSE Instead Of WebSockets For Unidirectional Data Flow Over HTTP/2
    ▻https://www.smashingmagazine.com/2018/02/sse-websockets-data-flow-http2

    “When it comes to data delivery from the server to the client, we are limited to two general approaches: client pull or server push. As a simple example with any web application, the client is the web browser. When the website in your browser is asking the server for data, this is called client pull. The reverse, when the server is proactively pushing updates to your website, it is called server push.”

    #ServerSentEvents_push_server_client_communication_HTTP2_WebSocket_clevermarks

    Nicolas Hoizey @nhoizey CC BY-NC-SA
    Écrire un commentaire
  • @arno
    ARNO* @arno ART LIBRE 8/02/2018
    5
    @rastapopoulos
    @mukt
    @b_b
    @gastlag
    @mist_
    5

    Des media queries pour savoir si l’usager en est réduit à viser grossièrement avec ses gros doigts boudinés, ou s’il peut piquer précisément comme une abeille :

    Using Media Queries For Responsive Design In 2018 — Smashing Magazine
    ▻https://www.smashingmagazine.com/2018/02/media-queries-responsive-design-2018

    @media (pointer:coarse) {
       .which-pointer::after {
           content: "You have a coarse pointer, are you on a touchscreen device?";    
       }
    }

    @media (pointer:fine) {
       .which-pointer::after {
           content: "You have a fine pointer, are you using a mouse or trackpad?";    
       }
    }
    ARNO* @arno ART LIBRE
    • @arno
      ARNO* @arno ART LIBRE 8/02/2018

      Et déterminer si l’utilisateur a le survol de la souris (hover) ou non (écran tactile) :

      @media (hover) {
         .can-i-hover::after {
             content: "You look like you can hover.";    
         }
      }

      @media  (hover:none) {
         .can-i-hover::after {
             content: "I don't think you can hover.";    
         }
      }
      ARNO* @arno ART LIBRE
    • @mukt
      mukt @mukt CC BY 8/02/2018

      #intégration #web #HTML #CSS #responsive

      mukt @mukt CC BY
    Écrire un commentaire
  • @nhoizey
    Nicolas Hoizey @nhoizey CC BY-NC-SA 22/01/2018

    Now You See Me: How To Defer, Lazy-Load And Act With IntersectionObserver
    ▻https://www.smashingmagazine.com/2018/01/deferring-lazy-loading-intersection-observer-api

    “In this article, we are going to go out of the scroll darkness and talk about the modern way of lazy-loading resources. Not just lazy-loading images, but loading any asset for that matter. More so, the technique we are going to talk about today is capable of much more than just lazy-loading assets: We will be able to provide any type of deferred functionality based on the elements’ visibility to users.”

    #IntersectionObserver_lazyload_clevermarks_JavaScript

    Nicolas Hoizey @nhoizey CC BY-NC-SA
    Écrire un commentaire