Journal Les interfaces tablettes, la suite.

Posté par  . Licence CC By‑SA.
Étiquettes :
11
11
juin
2019

Et ouais. Des fois, je continue de me battre contre des moulins à vent. Ceci est la suite de mon précédent journal.

Cette fois, c’est ma complémentaire santé. Ils ont changé le site (c’est maintenant clients.henner.com), et ils ont visiblement le même chef de projet que chez Boursorama.

Même remarque, je suis passé de 2 remboursements ½ visibles à 15 ½. En abusant grave de CSS flex, parce que c’est fun.

Ah d’ailleurs, j’ai utilisé un hack un peu partout :

header.card-body__header:not(.kapoue) {
    align-items: center;
}

Pourquoi ce :not(.kapoue) ? Parce que la CSS originale utilise .card-body__header[_ngcontent-c30], mais le -c30 varie d’un chargement à l’autre. Donc, à l’aide d’une véritable documentation, j’ai trouvé que mettre le nom de l’élément plus un pseudo-sélecteur attrape-tout, ça prenait la priorité.

Le _ngcontent-cXX est probablement lié à Angular, mais hé, vous croyez que je suis allé lire la doc ?

La CSS est disponible : https://userstyles.org/styles/172659/henner-i-am-not-a-tablet

  • # "Responsive Design"?

    Posté par  (site web personnel) . Évalué à 8.

    On est en 2019, avec le CSS3, HTML5, etc. et certains développeurs (de grosses boîtes en plus) ne sont pas fichus de faire une application web avec une interface de tablette pour les tablettes, et une interface de PC pour les PCs.

    N'importe quel frèmouorque permet de faire ça en 3 lignes en plus…

    • [^] # Re: "Responsive Design"?

      Posté par  (site web personnel, Mastodon) . Évalué à 4.

      Je pense que c'est aussi une question de référencement. Faire un site spécifique en fonction des outils de consultation peut poser des problèmes de référencement.

      Cela dit, ayant une tablette assez grande, je préfère toujours utiliser dessus la version "desktop" plutôt que la version mobile qui me paraît toujours bridée et moins ergonomique et je refuse d'utiliser des applications spécifiques pour accéder aux sites.

      « Tak ne veut pas quʼon pense à lui, il veut quʼon pense », Terry Pratchett, Déraillé.

  • # .kapoue

    Posté par  (site web personnel) . Évalué à 9.

    Ça ne marche pas avec !important ?

    • [^] # Re: .kapoue

      Posté par  . Évalué à 4.

      Si.

      Mais avec !important, on se retrouve avec des trucs difficiles à défaire, puisque ça dépend de l'ordre de lecture de la CSS.

      Ma maigre expérience des styles CSS me fait éviter cette directive autant que possible, même si elle est parfois très pratique.

      • [^] # Re: .kapoue

        Posté par  . Évalué à 6.

        Je précise que !important ne fait qu'un ajout (mais un gros) de spécificité.
        Donc ça dépend pas directement de l'ordre d'ajout.
        Entre 2 règles avec un !important, c'est la spécificité qui s'applique, pas l'ordre de déclaration.
        Et si elles ont la même spécificité, alors oui, c'est l'ordre de déclaration qui s'applique.

        #article {
          color: red !important;
        }
        .title {
          color: black !important;
        }

        Dans

        <div id="article" class="title">SALU SA VA?</div>

        "SALU SA VA?" sera en rouge

        jsfiddle

        • [^] # Re: .kapoue

          Posté par  . Évalué à 3.

          Ah. Merci beaucoup pour avoir éclairé ma lanterne.

          • [^] # Re: .kapoue

            Posté par  . Évalué à 3. Dernière modification le 13 juin 2019 à 15:10.

            Avec plaisir.
            Mais dans tous les cas, tu as raison d'éviter d'utiliser !important ^

  • # Wow !

    Posté par  . Évalué à 3.

    J'ai rien compris du tout à ton journal !
    (en fait, si, mais seulement après avoir lu ton précédent journal)

    :-)

    Mais je plussoie quand même…
    parce que…

    c'est cool de se battre contre des moulins à vent!

    et c'est cool de ne pas aller dans le sens prévu par les banquiers!

    Je trouve ça… poétique
    (à défaut d'être efficace)

    • [^] # Re: Wow !

      Posté par  . Évalué à 2.

      J'ai rien compris du tout à ton journal !

      Désolé. C'est vrai que c'était pas de la grande qualité. Mais je n'ai pas eu l'envie de faire un « résumé des épisodes précédents ».

      Le problème, c'est pas forcément les banquiers, c'est surtout que l'interface met en avant des choses totalement futiles.

    • [^] # Re: Wow !

      Posté par  . Évalué à 7.

      je mettrais un petit bémol à ton commentaire.

      il y a quelques temps (années) paypal a decidé d'afficher une fenêtre pour le paiement, au lieu et place d'une magnifique page web, avec du java scripts ofcourse. cette magnifique fenêtre qui a du faire l'objet de moult réunion était dépourvu d'ascenseur et de barre d'adresse, trop moche mon frère !

      et joie un jour j'ai du répondre à un questionnaire sur cette interface top moumoute, ce que j'ai écris car limité en nombre de caractère :

      bande de gros naze, je fais comment pour vérifier le certificat de votre putain de fenêtre si je ne peux pas accéder au cadenas vert.

      depuis leur fenêtre incluse qui vient par dessus la page n'a toujours pas d'ascenseur, par contre j'ai mon petit cadenas :).

      ca a marché, \o/ j'ai fait plier paypal ! surtout que 3 semaines plus tard j'avais mon cadenas vert :).

      Tu ne peux pas gagner sans combatre

      • [^] # Re: Wow !

        Posté par  . Évalué à 3.

        ca a marché, \o/ j'ai fait plier paypal !

        Par quel moyen peux-tu savoir que c'est ton message qui a donné ce résultat ? Ou qu'il y a participé ?
        Tout c'est peut-être déroulé en interne. Des employés moins stupides que les décideurs ont peut-être fini par leur faire entendre raison.

        Vu que c'est une boîte américaine, il est possible qu'un filtre sur les mots « naze » et « putain » ait mis directement ton message à la poubelle :-)

        • [^] # Re: Wow !

          Posté par  . Évalué à 2.

          tu casse l'ambiance toi :)

          ce n'etait pas vraiment paypal ce devait etre un sous traitant genre survey machin, les fameuses note de 0 a 10, 0 partout puis la fenetre pour suggerer une amelioration, commentaire percutant. ils ont probablement traduit.

          après le designer obtu avec sa fenêtre sans bord, tu lui montre le message en réunion comme un retour utilisateur. alors on fait quoi maintenant ? beh on remet le cadenas

  • # kapoué

    Posté par  (site web personnel) . Évalué à 2. Dernière modification le 17 juin 2019 à 21:36.

    Ton fils de 6 mois et demi a vu la boîte de purée ?

    • [^] # Re: kapoué

      Posté par  . Évalué à 2.

      Je ne m'appelle pas Henri. Mais il a quand même déjà plus de 6 mois :)

      (Et ce sketch a plus de 10 ans, donc je ne suis pas tout jeune non plus)

      • [^] # Re: kapoué

        Posté par  (site web personnel) . Évalué à 3.

        (Probablement plus près de vingt ans… série Les deux minutes du peuple 1990-2016, François Pérusse, sketch Le nouveau père, doh je ne suis plus trop jeune non plus, chtipipipapa)

Suivre le flux des commentaires

Note : les commentaires appartiennent à celles et ceux qui les ont postés. Nous n’en sommes pas responsables.