iamdtms, to webdev
@iamdtms@mas.to avatar
Edent, to webdev
@Edent@mastodon.social avatar

Is it possible for a website to detect it is being viewed in incognito/private mode?

Is it possible for a hyperlink to force loading in a private context? (Like _target="blank" does for a new window.)

davidbisset, to webdev
@davidbisset@phpc.social avatar

"Here’s What We Learned From the First State of Survey"

https://frontendmasters.com/blog/state-of-html-2023-results-2

"...when asked how they allocated their time between writing HTML/ and JavaScript/TypeScript code, 59% said they spent more than half their time writing – even though the survey was clearly aimed at people interested in HTML."

SteveFaulkner, (edited ) to webdev
@SteveFaulkner@mastodon.social avatar

👉🏽 Doing my heading in

"Earlier in 2024 I was approached by @Wilto to answer some questions on HTML headings. At the time I was only vaguely aware that the interview would become part of a printed Zine (pleasant surprise face), published by Mat with profits going to support Trans Lifeline."

#HTML #webStandards #a11y

https://html5accessibility.com/stuff/2024/06/05/doing-my-heading-in/

j9t, (edited ) to webdev
@j9t@mas.to avatar

#HTML: There are several valid syntaxes for tags, like “<em/.../”, “<>”, or empty start tags.

davidbisset, to webdev
@davidbisset@phpc.social avatar

"In Praise Of The Basics"

https://www.smashingmagazine.com/2024/05/in-praise-of-the-basics/

"Long live the basics! Long live the “a-ha!” moments that help us all fall in love with the World Wide Web."

bitsgalore, to webdev
@bitsgalore@digipres.club avatar

Latest version of standard includes a warning that advises against using the syntax (formerly known as ), stating that it's "essentially unmaintained"🧐 :

https://html.spec.whatwg.org/multipage/xhtml.html

Looks like a recent change, as there's no mention of this in the April 3 version of the spec:

https://web.archive.org/web/20240403210532/https://html.spec.whatwg.org/multipage/xhtml.html

Unless I'm misreading it, this seems like a big deal? E.g. XML syntax is mandatory in 3 documents:

https://www.w3.org/TR/epub-33/#dfn-xhtml-content-document

Time to 📯?

css, to CSS
@css@front-end.social avatar

Using modern CSS features to create a custom range slider with a tooltip. There is no JS to update the values, it's pure CSS with minimal HTML 😎

Powered by Scroll Driven animation, Anchor positioning, @​property and more! 🤩

Demo: https://codepen.io/t_afif/full/JjqNEbZ via :codepen: @codepen

Online Version: https://css-tip.com/range-slider-tooltip/

It's Chrome only for the tooltip but the range slider works fine in all the browsers.

#CSS #HTML

Showing two range slider with a tooltip containing the selected values. From the linked demo.

css,
@css@front-end.social avatar

The previous range slider was good but not good enough to me. Let's upgrade it with some motion!

Now the tooltip will follow your movement to get a more realistic effect. Still 100% CSS magic. No JS! 😎

Demo: https://codepen.io/t_afif/full/MWdmZPL via :codepen: @codepen

Showing two range sliders with tooltip. Overview from the linked demo

johann, to webdev French
@johann@masto.bike avatar

Je n'arrive pas a imprimer une page HTML qui contient une (longue) table dans un document Google Sheet "read only" (sans menu)

Dans Firefox, File > Print as PDF, ça n'imprime que la partie qui est visible dans le navigateur.

Quelqu'un-e a une solution ?

scoonch, to photoshop French
@scoonch@mamot.fr avatar

Dev Web fullstack, après un enchaînement de CDD, je suis libre à partir d'aujourd'hui.

CDI distanciel de préférence sinon je m'adapte, je suis à Paris.

Compétences en +:
Maquettiste #Photoshop #Illustrator,
Monteur vidéo #Premiere #Avid,
Habillage/Animation #AfterEffect
Régie/Vidging/Mapping: #Obs #Resolume #Millumin

CV en mp.

#HTML
#CSS
#PHP
#JS
#jQuery
#Scss
#Symfony
#React
#NextJs
#ViteJs
#Bootstrap
#Tailwind
#Stripe
#dataTables
#Wordpress
#Prestashop
#Sylius
#MongoDb
#Mariadb

antaresphdev, to webdev Tagalog
@antaresphdev@mas.to avatar

Nagbibigay ang Web Platform Baseline ng malinaw na info tungkol sa mga bagong web platform features na puwede nang magamit sa mga production sites.

Tingnan ang details nito sa website ng Antares Programming: https://antaresph.dev/resources/baseline/ #webdevelopment #html #css #javascript

kerfuffle, to webdev
@kerfuffle@mastodon.online avatar

I'm only just finding my way in the land of , but it feels like "trigger a request from any element" is a trap. I want progressive enhancement, which still requires a functional non-Javascript page before adding the nice things htmx offers. I didn't realise how rusty I am with regard to designing a presentation layer for all this in the backend.

antaresphdev, to queer Tagalog
@antaresphdev@mas.to avatar

Sa unang araw ng #Pride, balikan natin kung paano gagawing mas inclusive ang mga forms sa mga website natin.

#webdevelopment #html (1/n)

sysop408, (edited ) to random
@sysop408@sfba.social avatar

I just published my first #Wix site today. I have limited experience with similar site builder services like Square Space and Weebly.

Is Wix typical of these kind of tools? I found it to be extremely difficult to use. On the plus side it almost gave me every ability I could produce as an actual developer... almost.

Less would have been more in the case of Wix. Just because you can stuff every possible feature into a Web based WYSIWYG builder doesn't mean you should.

It made it really hard to produce a simple and elegant site that is really what's needed by most people using such a service. If you truly have a need for the advanced features, trying to do those through multiple layers of nested menus is the worst way to do it. You might as well as hire a developer and do it the right way.

This site coulda been an email. Instead it was an insane toothpick tower that kept exploding on me b/c nothing played nicely with anything.

#WebDev

dedsyn4ps3,
@dedsyn4ps3@fosstodon.org avatar

@sysop408 a few years back when I launched my first page on Wix, I felt that the overall experience was fairly straightforward and to the point...plus some of the analytics and plug-ins available were nice, too.

That being said, after a years subscription of the Pro version ended, I chose to leave the platform and self-host my own page.

My advice, find a nice #React template and build your own...or #HTML if it's just static.

Much more flexibility of component design! 😎💯 :html5: :react:

tommi, to CSS
@tommi@pan.rent avatar

Hey @piccalilli!

I found https://buildexcellentwebsit.es extremely insightful and inspiring! It pushed me to finally completely restructure my personal website’s #CSS, after many years of mess.

I used the awesome https://utopia.fyi to generate the vars, (actually, I am using the SCSS library).

Unfortunately, though, I find the massive use of all those calc() and clamp() functions to be quite heavy in terms of performance… #Lighthouse gave the website a very bad performance score (see screenshot). It even seems that while scrolling the page it lags (😳) even if it’s super simple and built with pure #HTML and CSS!

Do you have any ideas or suggestions? 🤔

Thank you so much for all the interesting things you share! ❤️🚀

(The current unstable development version of my website is at https://dev.tommi.space/, I am using the homepage as reference)

Cc: @j98 + @trys

#WebDesign #WebDev #browser #BuildExcellentWebsites #PersonalWebsite #CSSGrid #PageSpeed

youronlyone, to Philippines
@youronlyone@c.im avatar

Is there a color “Cable No.” conversion table or online tool available?

I've been checking sites and search engines but I cannot any. Maybe someone have a bookmark or something.

I need to convert the following:

  • Cable No. 80173
  • Cable No. 80108
  • Cable No. 80068

The confusing thing is that Wikipedia and various flag websites provide different RGB Hex codes:

  • 0038A8 vs 0032A0
  • CE1126 vs BF0D3E
  • FCD116 vs FED141

Which is more accurate, Wikipedia or the flag websites?

O_O


Legal code: https://thecorpusjuris.com/legislative/republic-acts/ra-no-8491.php

Wikipedia: https://en.wikipedia.org/wiki/Flag_of_the_Philippines

Sample flag website: https://www.flagcolorcodes.com/philippines


Tags:

@pilipinas @philippines @pinoy

mayank, to webdev
@mayank@front-end.social avatar

i created a tiny (~10LOC) custom element to demonstrate how easy it can be to avoid repetition of shadow dom templates.

why can't we have something like this built into #HTML? seems fairly safe and uncontroversial

https://www.mayank.co/notes/use-html

serapath, to web
@serapath@mastodon.gamedev.place avatar

Why don't iframe nest more than 2-3 times?
Is that because browsers or because web spec?

https://codepen.io/serapath/pen/jOoyRKJ?editors=0010

#web #dom #html #javascript

css, to CSS
@css@front-end.social avatar

🛑 STOP Scrolling!

It's time to learn something new in CSS. You are one click away from getting a cool demo. What are you waiting for?

👉 https://random.css-tip.com 👈

#CSS #HTML

mobileatom, to webdev
@mobileatom@flipboard.com avatar
kerfuffle, to Kotlin
@kerfuffle@mastodon.online avatar

In 45 minutes I made a #kotlin #javalin application from scratch, which uses #webjars to include #htmx from a #maven pom file. It uses static #HTML files for the first load, and then renders HTML from #jte templates for #SSR of the parts of the pages that need that kind of interaction. There's no #springboot (or any #spring at all) and no #SPA like #angular or #react.

Now because simply setting up a project says close to nothing about its real world viability, next step is an actual usecase ( :

SteveFaulkner, to webdev
@SteveFaulkner@mastodon.social avatar

As a companion to my ALT LEFT article I created a bookmarklet to annotate decorative images and make them available in the accessibility tree

#ARIA #HTML #accessibility

https://codepen.io/stevef/pen/BaeQzex

stvfrnzl, to Astro
@stvfrnzl@mastodon.online avatar

In case you're using it: I've updated my @astro starter template to the latest #astro version.

https://astro-naut-template.vercel.app/

Also the external link component got a small, but important update. 🤗

#WebDev #Frontend #HTML #CSS #JavaScript

isellsoap, to webdev
@isellsoap@mastodon.social avatar

Do you know of any spec efforts to make responsive image for video poster possible?

🔗 https://isellsoap.net/notes/2024-05-30-07-44-24/

  • All
  • Subscribed
  • Moderated
  • Favorites
  • megavids
  • kavyap
  • DreamBathrooms
  • khanakhh
  • GTA5RPClips
  • osvaldo12
  • magazineikmin
  • mdbf
  • InstantRegret
  • rosin
  • Youngstown
  • slotface
  • everett
  • Durango
  • JUstTest
  • ngwrru68w68
  • modclub
  • tester
  • tacticalgear
  • cubers
  • thenastyranch
  • cisconetworking
  • ethstaker
  • Leos
  • provamag3
  • normalnudes
  • anitta
  • lostlight
  • All magazines