Skip to content

Piero Bosio Social Web Site Personale Logo Fediverso

Social Forum federato con il resto del mondo. Non contano le istanze, contano le persone
  • 0 Votes
    3 Posts
    10 Views
    @syntaxseed @Crell Seems like he thought AI was good enough to lazily generate stories for his kids โ€œbetter than what was writtenโ€ so now it lazily destroys his business. ๐Ÿคทโ€โ™‚๏ธ
  • 0 Votes
    1 Posts
    4 Views
    Great update Bash Static Site GeneratorStefano coded an important update #Programming #OpenSource #HTML #site #generator #BSD #freeBSD #Linux #ghostBSD https://blog.bssg.dragas.net/2025/12/28/announcing-bssd-0-33-0-full-content-homepage/
  • 0 Votes
    1 Posts
    0 Views
    The Three Semantics of HTML, by @matuzo:https://www.htmhell.dev/adventcalendar/2025/24/#html #semantics
  • 0 Votes
    1 Posts
    8 Views
    do you have art? do you want to put it on a website, that *you* own, for cheap-as-free?im writing a program for that! you just drag and drop your art into a folder, and run "galleryify", and it generates html for each image, and adds everything to a thumbnail gallery. you can group with tags and style everything however you want, too.it outputs static html, so you can upload it to neocities or nekoweb or basically any free web host. the tradeoff for being cheap-as-free is that there's no server-side interactions (e.g. no comment section).i need testers! if this sounds good then please comment and let me know your level of comfort with art and with html.https://nycki93.github.io/eleventy-image-gallery/if you just wanna know "the stack", this is made with NodeJS and Eleventy. if that doesn't mean anything to you, dont worry about it.EDIT: wow, a lot of you said you'd be interested in testing! Okay, I've just put some usage instructions up on this page, please try it out and let me know how it goes!https://github.com/nycki93/eleventy-image-gallery/#website #art #code #programming #html #heycohost #eleventy
  • 0 Votes
    4 Posts
    7 Views
    @oblomov When using `checked` or `hidden` I do like not to add any value.```<input type="checkbox" checked />```Here's an interesting take with link to the HTML spec:https://mastodon.social/@shinspiegel/115530101220632082
  • Drunk CSS

    Uncategorized css drunk html webdev
    1
    1
    0 Votes
    1 Posts
    0 Views
    Drunk CSS https://shkspr.mobi/blog/2025/09/drunk-css/ A decade ago, I was writing about how you should test your user interface on drunk people. It was a semi-serious idea. Some of your users will be drunk when using your app or website. If it is easy for them to use, then it should be easy for sober people to use.Of course, necking a few shots every time you update your website isn't great for your health - so is there another way?Click the "๐Ÿฅด Drunk" button at the top of the page and see what happens!These are a relatively simple set of CSS rules which you can apply to any site in order to simulate inebriation.(I may have changed these since writing the post. Check the source for the latest version.)First, monkey around with the fonts. This sets all the lower-case vowels to be rendered in a different font - as discussed in "targetting specific characters with CSS rules": CSS/* Drunk */ @font-face { font-family: "Drunk"; src: url("/blog/wp-content/themes/edent-wordpress-theme/assets/fonts/CommitMonoV143-Edent.woff2") format("woff2"); /* Lower-Case Vowels */ unicode-range: U+61, U+65, U+69, U+6F, U+75 ; size-adjust: 105%; } The rest of the characters will be rendered in the system's default Cursive font. Characters will also be slanted. The first character of every paragraph will be shrunk: CSS:root:has(input#drunk:checked) * { font-family: "Drunk", cursive; font-style: oblique -12deg; text-align: end; } :root:has(input#drunk:checked) p::first-letter { font-size: .5em; } Next, use the child selectors to rotate and skew various elements. While we wait for CSS randomness to come to all browsers this is a simple way to select various elements: CSS:root:has(input#drunk:checked) *:nth-child(3n) { transform: rotate(2deg); } :root:has(input#drunk:checked) *:nth-child(5n) { transform: skew(5deg, 5deg); } :root:has(input#drunk:checked) *:nth-child(7n) { transform: rotate(-3deg); } Make the entire page blurred and saturate the colours: CSS:root:has(input#drunk:checked) body { filter: blur(1px) saturate(2.5); } Make any hyperlink harder to click by having it gently bounce up and down: CSS:root:has(input#drunk:checked) a { animation-name: bounce; animation-duration: 4s; animation-direction: alternate; animation-timing-function: ease-in-out; animation-iteration-count: infinite; } @keyframes bounce { 0% { margin-top: 0px; } 25% { margin-top:-10px; } 50% { margin-top: 0px; } 75% { margin-top: 10px; } 100% { margin-top: 0px; } } Does this really simulate drunkenness? No. It is a pale simulacrum. What it is, however, is deliberately inaccessible to the majority of people.How does it make you feel using the site in Drunk-Mode? Does it frustrate you? Do your eyes hurt due to the garish colour scheme? Do you keep missing the thing that you try and click on? Are the words so hard to read that it takes you extra time to do anything useful? Will you recommend this experience to your friends and family?I've written before about cosplaying as being disabled. Strapping on a pair of Glaucoma Goggles will give you an idea of what a visual impairment is like. But it won't give you the experience of living that way for months or years.You should test your stuff with people who have cognitive impairments or physical disabilities. Find out how usable your site is for someone lacking fine motor control or for those with learning disabilities. Pay disable people to take part in usability studies. Integrate their feedback.Faffing around with CSS will only get you so far. #css #drunk #HTML #ui #ux #webdev
  • 0 Votes
    5 Posts
    11 Views
    @archiloque I'm glad the dialog HTML tag fits your need

Gli ultimi otto messaggi ricevuti dalla Federazione
Post suggeriti