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

 
  • #p
  • #pla
  • #place
RSS: #placeholder

#placeholder

  • #placeholders
  • #placeholder_form_html_attribute_a11y_clevermarks
  • @b_b
    b_b @b_b PUBLIC DOMAIN 17/06/2024
    2
    @monolecte
    @jeanmarie
    2

    Let’s make a #floating #button sign up form pattern - Piccalilli
    ▻https://piccalil.li/blog/lets-make-a-floating-button-sign-up-form-pattern

    https://piccalilli.imgix.net/images/blog/floating-signup-form-pattern.jpg?auto=format&q=60&w=1500

    #placeholder #css

    b_b @b_b PUBLIC DOMAIN
    Écrire un commentaire
  • @b_b
    b_b @b_b PUBLIC DOMAIN 11/03/2024
    1
    @spip
    1

    SRWieZ/thumbhash : Thumbhash implementation in #PHP
    ▻https://github.com/SRWieZ/thumbhash
    ▻https://evanw.github.io/thumbhash

    Thumbhash PHP is a PHP library for generating unique, human-readable identifiers from #image files. It is inspired by Evan Wallace’s Thumbhash algorithm and provides a PHP implementation of the algorithm.

    Thumbhash is a very compact representation of a #placeholder for an image. Store it inline with your data and show it while the real image is loading for a smoother #loading experience. It’s similar to #BlurHash but with some advantages

    b_b @b_b PUBLIC DOMAIN
    • @klaus
      klaus++ @klaus 11/03/2024

      Merci ! C’est cool pour protéger ses images qu’on ne veut partager qu’avec les visiteurs connectés et pour plein d’autres utilisations.
      Est-ce qu’on aura un filtre (facile) ou plugin #SPIP ?!?

      klaus++ @klaus
    • @b_b
      b_b @b_b PUBLIC DOMAIN 11/03/2024

      Est-ce qu’on aura un filtre (facile) ou plugin #SPIP ?!?

      huhu, ça se pourrait si quelqu’un le faisait, perso c’est pas dans ma todo :)

      b_b @b_b PUBLIC DOMAIN
    Écrire un commentaire
  • @b_b
    b_b @b_b PUBLIC DOMAIN 1/05/2019
    2
    @tofulm
    @jeanmarie
    2

    Lorem Picsum
    ▻https://picsum.photos

    Lorem Ipsum... but for #photos
    Get a grayscale image by appending ?grayscale to the end of the url.
    Get a blurred image by appending ?blur to the end of the url.
    Images from Unsplash

    #placeholders

    b_b @b_b PUBLIC DOMAIN
    É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
  • @mist_
    Mist. GraphX @mist_ 8/02/2018
    4
    @sandburg
    @rastapopoulos
    @mukt
    @nicod_
    4

    Quand je fait un proto, rapide j’utilise une petite lib js, qui me génère les placeholder, on colle une class sur le container et ça rempli, avec des contenus.

    Mais pas pour les backgrounds ^^, une petite mixin en scss pour ce genre de cas.

    Donc ça pioche dans des photos de chez unsplash classées par theme dans une map. On peut quand on bosse sur un projet choisir au moins des visuels en rapport.

    l’avantage c’est que le random est appelé a chaque appel de la mixin, donc si on a plusieurs images sur la page ce ne sont pas les mêmes (e qui n’est pas le cas avec les autres placeholders en js…).

    ▻https://www.sassmeister.com/gist/0344deebfb7fb9493af410ed8c0ce1c7

    #css#sass

    Mist. GraphX @mist_
    • @rastapopoulos
      RastaPopoulos @rastapopoulos CC BY-NC 8/02/2018

      #mixin #maquette #prototype #placeholder #intégration #web

      RastaPopoulos @rastapopoulos CC BY-NC
    Écrire un commentaire
  • @0gust1
    0gust1 @0gust1 CC BY-NC 17/11/2017
    11
    @cy_altern
    @sandburg
    @fil
    @lluc
    @touti
    @7h36
    @ari
    @fredlm
    @yohooo
    @rastapopoulos
    @tofulm
    11

    ▻https://jmperezperez.com/svg-placeholders

    Un inventaire des techniques utilisant #SVG pour rendre le chargement différé d’images plus satisfaisant perceptuellement.

    Avec liens vers divers outils pour pré-traiter les images.

    Très sympa !

    https://res.cloudinary.com/jmperez/image/upload/w_auto,f_auto,c_scale/v1509278557/jmperez-composition-primitive_j8zyfn.jpg

    ▻https://res.cloudinary.com/jmperez/video/upload/dpr_auto,f_auto,q_auto,c_scale/v1509278615/silhouette-lazy-loading_evq9xq.mp4

    0gust1 @0gust1 CC BY-NC
    • @cy_altern
      cy_altern @cy_altern CC BY-SA 18/11/2017

      #placeholder #chargement #potrace

      cy_altern @cy_altern CC BY-SA
    • @fil
      Fil @fil 19/11/2017

      idée pour #SPIP ? (il y a un #potrace en #PHP)

      Fil @fil
    • @sandburg
      Sandburg @sandburg CC BY-SA 19/11/2017
      @tetue

      @tetue Par quoi remplacer une image durant son chargement.

      Sandburg @sandburg CC BY-SA
    • @tetue
      tetue @tetue CC BY 19/11/2017

      Question bête : quel est l’intérêt ?

      tetue @tetue CC BY
    • @0gust1
      0gust1 @0gust1 CC BY-NC 19/11/2017

      Augmenter la pertinence du parcours visuel rapide par l’internaute d’une page web en cours de chargement ?

      Et sur le plan esthétique, ça peut parfois être assez réussi, je trouve.

      0gust1 @0gust1 CC BY-NC
    • @rastapopoulos
      RastaPopoulos @rastapopoulos CC BY-NC 21/11/2017

      Potrace en PHP :
      ▻https://github.com/nystudio107/craft3-imageoptimize/blob/master/src/lib/Potracio.php

      (et je découvre Craft CMS du coup qui a pas l’air mal du tout)

      RastaPopoulos @rastapopoulos CC BY-NC
    • @rastapopoulos
      RastaPopoulos @rastapopoulos CC BY-NC 24/11/2017

      En fait le dépôt avec la lib à jour pour PHP, pas dans craft :
      ►https://github.com/Otamay/potracio

      RastaPopoulos @rastapopoulos CC BY-NC
    Écrire un commentaire
  • @baroug
    baroug @baroug 14/05/2014
    1
    1

    #Placeholders in Form Fields Are Harmful
    ▻http://www.nngroup.com/articles/form-design-placeholders

    Placeholder text within a form field makes it difficult for people to remember what information belongs in a field, and to check for and fix errors. It also poses additional burdens for users with visual and cognitive impairments.

    #web_design

    baroug @baroug
    Écrire un commentaire
  • @nhoizey
    Nicolas Hoizey @nhoizey CC BY-NC-SA 25/10/2013

    Un #placeholder ne remplace pas un #label – HTeuMeuLeu
    ▻http://www.hteumeuleu.fr/un-placeholder-ne-remplace-pas-un-label

    « Un placeholder ne remplace pas un label. Voilà. C’est tout. Je n’ai rien d’autre à ajouter. C’est une déclaration évidente. » Tags : placeholder label accessibilité #UX #ergonomie

    #accessibilité

    Nicolas Hoizey @nhoizey CC BY-NC-SA
    Écrire un commentaire
  • @nhoizey
    Nicolas Hoizey @nhoizey CC BY-NC-SA 12/04/2011

    #Placeholder #images from #flickr - flickholdr.com
    ►http://flickholdr.com

    Get placeholders related to the site you are developing, by pulling images from flickr based on #tags

    Nicolas Hoizey @nhoizey CC BY-NC-SA
    • @fil
      Fil @fil 13/04/2011
      @arno

      tu devrais suivre @arno ►http://seenthis.net/messages/15797

      Fil @fil
    • @seenthis
      Seenthis @seenthis CC BY-SA 13/04/2011

      Sur ce coup, je crois me souvenir que Nicolas avait déjà référencé, sur TW je crois, la découpe automatique de petits chats.

      Seenthis @seenthis CC BY-SA
    • @nhoizey
      Nicolas Hoizey @nhoizey CC BY-NC-SA 13/04/2011
      @fil @arno @seenthis

      @fil oui, oui, je suis déjà @arno, c’est son seen qui m’a conduit à celui-ci, j’aurais dû l’indiquer en via (tiens, comment on met des italiques dans nos seens ?

      @seenthis effectivement, j’avais dû retweeter sur les p’tits #chats, je préfère largement l’option #Flickr, même si les résultats sont parfois étranges avec les #tags...

      Nicolas Hoizey @nhoizey CC BY-NC-SA
    • @nhoizey
      Nicolas Hoizey @nhoizey CC BY-NC-SA 13/04/2011
      @fil @seenthis

      Tiens, @Fil et @Seenthis ne sont pas cliquables sur mon commentaire précédent...

      Nicolas Hoizey @nhoizey CC BY-NC-SA
    • @flip-zone
      Orient Palms @flip-zone 13/04/2011
      @fil @seenthis

      Minuscules : @fil @seenthis. C’est le code qui apparaît en base de message qui sert de « @ ».

      Orient Palms @flip-zone
    • @nhoizey
      Nicolas Hoizey @nhoizey CC BY-NC-SA 13/04/2011
      @seenthis @nhoizey

      @seenthis OK, j’ai modifié mon message...

      J’étais parti sur l’idée que c’était le nom devant vos commentaires qu’il fallait utiliser.

      Ce serait pas mal de simplifier en mettant systématiquement en avant l’identifiant de l’utilisateur, puis éventuellement son nom ensuite, non ?

      Je réitère d’ailleurs une question posée il y a quelque temps, pourquoi suis-je identifié par « @nhoizey » mais mon URL contient « nicolas-hoizey » ?

      Nicolas Hoizey @nhoizey CC BY-NC-SA
    • @fil
      Fil @fil 13/04/2011
      @japonica

      le problème est encore plus aigu pour @japonica qui a un login, un nom et une URL tous différents ; je me demande s’il va y survivre

      Fil @fil
    • @baroug
      baroug @baroug 13/04/2011

      Le connaissant (ou plutôt les en vérité) il changera une demi-douzaine de fois d’ici demain.

      baroug @baroug
    Écrire un commentaire
  • @nhoizey
    Nicolas Hoizey @nhoizey CC BY-NC-SA 1/03/2011
    1
    @ben
    1

    ►http://placekitten.com

    A quick and simple service for getting pictures of #kittens for use as placeholders in your designs or code. Just put your image size (width & height) after our URL and you’ll get a #placeholder.

    #loremipsum

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

Thèmes liés

  • #spip
  • #flickr
  • #tags
  • #css
  • #php
  • #images
  • url: flickholdr.com
  • #loremipsum
  • #kittens
  • #potrace