Comment se passer de jQuery.spip.positionner_marge
▻https://git.spip.net/spip/spip/commit/9f50bd16bfce863b0db3393ca27c0df6de6a251a & du plugin ancres douces à la fois :
html {
scroll-padding-top: 6rem;
scroll-behavior: smooth;
}
Comment se passer de jQuery.spip.positionner_marge
▻https://git.spip.net/spip/spip/commit/9f50bd16bfce863b0db3393ca27c0df6de6a251a & du plugin ancres douces à la fois :
html {
scroll-padding-top: 6rem;
scroll-behavior: smooth;
}
Un truc sympa pour l’accessibilité : tu peux désactiver le « smooth scrolling » directement dans les CSS pour les gens qui désactivent les animations dans leurs options de smartphone (en tout cas sur iOS) :
html {
scroll-behavior: smooth;
}
@media (prefers-reduced-motion: reduce) {
html {
scroll-behavior: auto;
}
}
2 bémols :
Can I use indique un peu plus de 80% : ▻https://caniuse.com/?search=scroll-behavior
Mais le défilement se fait dans tous les cas, donc pas grave.
Ça évite d’ajouter du js mais, dans le cas de liens de retour en haut de page par exemple, on n’a pas forcément envie que l’url soit changée (avec une ancre #haut et même juste #) et je ne sais pas s’il y a une autre solution que du js. Mais là encore, c’est pas bien grave :)
#CSS: Flexible Repeating #SVG Masks
▻https://tylergaw.com/blog/css-repeating-svg-masks
▻https://tylergaw.com/blog/assets/post-image-repeating-masks-streetcred-banner.webp
This is a technique I used recently to create a flexible, repeating pattern using SVG with CSS mask.
A #flexible #header with a little squiggle at the bottom instead of a straight line.
Sur la plupart des serveurs, j’ai besoin d’allonger la durée indiquée de conservation en cache des éléments intégrés aux pages, pour faire plaisir à PageSpeed Insights.
Je me note le code ici :
ExpiresActive on
ExpiresByType text/css A31557600
ExpiresByType application/x-javascript A31557600
ExpiresByType application/javascript A31557600
ExpiresByType text/javascript A31557600
ExpiresByType image/webp A31557600
ExpiresByType image/jpeg A31557600
ExpiresByType image/png A31557600
ExpiresByType image/gif A31557600
ExpiresByType image/svg+xml A31557600
ExpiresByType application/x-shockwave-flash A31557600
AddType application/font-woff .woff
ExpiresByType application/font-woff A31557600
AddType application/font-woff2 .woff2
ExpiresByType application/font-woff2 A31557600
Par rapport à ce qu’on trouve usuellement en ligne, il y a aussi le WebP et le woff/woff2, que j’utilisent désormais systématiquement.
Cadeau, un lien déjà cité ici mais toujours utile : ▻https://technique.arscenic.org/lamp-linux-apache-mysql-php/apache-le-serveur-http/optimisations/article/expire-headers
ping @kent1
Forcing a PDF or DOC to Open in Browser Rather Than Downloading | DeveloperSide.NET
▻http://www.devside.net/wamp-server/forcing-a-pdf-or-doc-to-open-in-browser-rather-than-downloading
Sur le problème du traitement des liens vers des fichiers PDF par les navigateurs, voir aussi : ▻https://www.askapache.com/htaccess/pdf-cookies-headers-rewrites
#PDF #téléchargement #.htacces #virtual_host #apache #PDF.js #header
GitHub - april/laboratory: Because good website security shouldn’t only be available to mad scientists!
▻https://github.com/april/laboratory
Laboratory is an experimental Firefox extension that helps you generate a proper Content Security Policy (CSP) header for your website
GNU Terry Pratchett
▻http://www.gnuterrypratchett.com/index.php
In Terry Pratchett’s Discworld series, the clacks are a series of semaphore towers loosely based on the concept of the telegraph. Invented by an artificer named Robert Dearheart, the towers could send messages “at the speed of light” using standardized codes. Three of these codes are of particular import:
G: send the message on
N: do not log the message
U: turn the message around at the end of the line and send it back again
When Dearheart’s son John died due to an accident while working on a clacks tower, Dearheart inserted John’s name into the overhead of the clacks with a “GNU” in front of it as a way to memorialize his son forever (or for at least as long as the clacks are standing.)
Sécurisez votre site web avec les headers HTTP
▻https://www.vaadata.com/blog/fr/securiser-votre-site-web-avec-les-headers-http
Un résumé des #headers qui améliorent la #sécurité :
Strict-Transport-Security
CORS headers (Access-Control-Allow-Origin)
Content-Security-Policy
X-Content-Type-Options
X-XSS-Protection
Une présentation lumineuse du header CSP par Nicolas Hofmann :
▻https://www.nicolas-hoffmann.net/content-security-policy-parisweb-2015
Mise en place d’un #monitoring avec Report-URI + Report-Only
Pour le monitoring des notifications #CSP et #HPKP d’un site en production, un service en ligne gratuit :
►https://report-uri.io
Ironically, CSP is too efficient in some browsers — it creates bugs with bookmarklets. So, do not update your CSP directives to allow bookmarklets. We can’t blame any one browser in particular; all of them have issues:
Firefox
Chrome (Blink)
WebKit
Most of the time, the bugs are false positives in blocked notifications. All browser vendors are working on these issues, so we can expect fixes soon. Anyway, this should not stop you from using CSP.
▻https://www.smashingmagazine.com/2016/09/content-security-policy-your-future-best-friend
Par Nicolas Hofmann toujours, évangéliste CSP :)
Configuring servers for #ogg media - #HTTP | MDN
▻https://developer.mozilla.org/en-US/docs/Web/HTTP/Configuring_servers_for_Ogg_media
As of #Firefox 41, the X-Content-Duration #header is no longer supported. Tags: Firefox ogg #XContentDuration header HTTP #clevermarks
Midnight.js - Switch fixed headers on the fly
▻http://aerolab.github.io/midnight.js
Tags : #header #JavaScript #scroll #effet
Hide #header on #scroll down, show on scroll up
▻https://medium.com/@mariusc23/hide-header-on-scroll-down-show-on-scroll-up-67bbaae9a78c
Tags: header scroll #masquer #javascript
Hide your #header on #scroll - Headroom.js
▻http://wicky.nillia.ms/headroom.js
Tags: header scroll #masquer #javascript
Show navbar when scrolling up, hide when scrolling down
▻https://github.com/upstage/showup
“A very basic jQuery plugin to show a navbar when scrolling up, and hide when scrolling down.” Tags: #scroll #masquer #javascript #header
Hey Geeks,
une distro #linux pour faire tourner en virtualisation sous Parallels sur un MacBookPro intel, avec support clavier mac et interface graphique légère, vous me proposez quoi ?
Merci
plutôt que parallels, en ce moment c’est virtualbox qui a la cote
►http://seenthis.net/spip.php?page=recherche&recherche=virtualbox
je sais, je réponds à côté :-)
Bon, pressé comme je suis, je viens d’installer un #ubuntu 10.04 LTS et pas de mauvaises surprises pour le moment.
Maintenant, je m’attaque au #make et autres joyeusetés ...
Où est ce satané répertoire des #headers ...
PS : oui, j’ai tenté d’expliquer que avant d’acheter des licences Parallels, on pouvait peut-être essayer virtualbox, mais sans succès ...
#Webshell: A console-based, JavaScripty #HTTP client utility
by Evan Haas and Sean Coates
►https://github.com/fictivekin/webshell#readme
Includes tab completion, history, context persistence, cookies and other tasty morsels.
Webshell supports all of the HTTP verbs in a simple to use syntax. The response’s #status code (and the requested URL) are printed. #Headers are expanded to local variables, and they can be inspected. Additionally, if the response suggests a redirect to another URL, the $.follow() function can be called for easy location following.
►http://localhost# GET ►http://google.com
HTTP 301 ►http://google.com
►http://google.com# $.headers
{ location: ’http://www.google.com/'
, ’content-type’: ’text/html; charset=UTF-8’
, date: ’Sat, 06 Nov 2010 17:38:56 GMT’
, expires: ’Mon, 06 Dec 2010 17:38:56 GMT’
, ’cache-control’: ’public, max-age=2592000’
, server: ’gws’
, ’content-length’: ’219’
, ’x-xss-protection’: ’1; mode=block’
, connection: ’close’
}
►http://google.com# $_.headers.location
’http://www.google.com/'
J’ai mis en place le lien #delete. Il permet, logiquement, de supprimer un message.
Ce qu’on peut supprimer :
– les messages dont on est l’auteur,
– les messages qui répondent à un message dont on est l’auteur (principe blog : on doit pouvoir contrôler les messages répondant à ses billets, et donc ce qui apparaît sur sa page publique).
L’affichage (ou non) du bouton #delete est en #PHP dans le squelette lui-même. De cette façon, un même fichier de #microcache devrait fonctionner indifférement selon l’auteur connecté.
“Reply-To” Munging Still Considered Harmful. Really.
►http://woozle.org/~neale/papers/reply-to-still-harmful.html
People still using these two documents to debate the issue are wasting everybody’s time. The issue was definitively settled in 2001, and Chip won.
#reply-to #mail #header #RFC-822 #harmful #munge #mailing-list #débat #mailman
MetaSystema.Net: Reply-To Munging Considered Useful
►http://www.metasystema.net/essays/reply-to.mhtml
While the message is being processed, the list administrator might take advantage of the opportunity to munge some of the message headers. Many list administrators want to add a Reply-To header that points back to the list. This transformation is also one
#reply-to #mail #header #RFC-822 #harmful #munge #mailing-list #débat #useful #mailman
How To Optimize Your Site With HTTP Caching | BetterExplained
►http://betterexplained.com/articles/how-to-optimize-your-site-with-http-caching
Caching is a great example of the ubiquitous time-space tradeoff in programming. You can save time by using space to store results. Fewer downloads means a faster, happier site.
#cache #web #webdev #http #performance #last-modified #etag #expires #max-age #cache-control #headers #groupe:clever-age #browser #httpd