Masthash

#HTML

Marcel SIneM(S)US
5 hours ago
Tim Nolte
7 hours ago

@glecharles @jasontucker my site is working @timnolte which is the same as this https://www.timnolte.com/author/timnolte/ but, crap...I thought my caching fix for #OpenLiteSpeed was working but I'm seeing #JSON instead of #HTML in my browser. 🤦

Oblomov
15 hours ago

You can _almost_ implement the #SVG `switch` element in pure #HTML + #CSS with something like:

switch > * {
display: none;
}
switch > *:lang(...) {
display: initial
}

with only one issue: there's no way to put in that :lang() pseudo-class “whatever the user asked for”. So you still need some #JavaScript or server-side assistance to bridge the gap between the user language selection and the styling.

So close …

Oblomov
17 hours ago

In fact, there was an attempt to add #SMIL support in #HTML: it was called #TIME (Timed Interactive Multimedia Extension)
https://en.wikipedia.org/wiki/HTML%2BTIME
proposed by #Microsoft and #Macromedia and, after being submitted to the #W3C, evolved into the W3C Note (not even a recommendation) for XHTML+SMIL
https://en.wikipedia.org/wiki/XHTML%2BSMIL
No other browser than #InternetExplorer ever added support for it, and honestly, I see that as a loss.

Über 6 Stunden trockene Arbeit am Blog, mit viel monotonem Copy-and-paste.

Das ist eben der Preis dafür, nur auf pures #html zu setzen.

Steve Faulkner
1 day ago

📌 Effect of hiding content on accessible name often trips people up

"Hiding Content Has No Effect on Accessible Name or Description Calculation when using aria-labelledby/aria-describedby"

#accessibility #ARIA #HTML #WebDev

https://w3c.github.io/using-aria/#hiding-content-has-no-effect-on-accessible-name-or-description-calculation

Josh Bruce
1 day ago

Writing a series about web design and development for absolute beginners.

Hit a point where I'd like to list some static site builders (a la Dreamweaver, RapidWeaver, Blocs) and am curious about what else is out there?

I don't trust search results.

#HTML #CSS #WebDev

Leanpub
2 days ago

NEW BOOK! Code to Success: Mastering Web Development from Scratch - A Comprehensive Guide to Building Stunning Websites and Web Applications https://leanpub.com/codeToSuccess by Rakesh Tembhurne #books #leanpublishing #webdevelopment #HTML #JavaScript #software #Python #pythonprogramming

Téotime Pacreau
2 days ago

#100DaysOfCode : #HTML #CSS

#Day12 : Card Hover Reveal

Online demo :
https://teotimepacreau.github.io/Card-Hover-Reveal-Day12-Of-100DaysOfCode/

Source Code : https://github.com/teotimepacreau/Card-Hover-Reveal-Day12-Of-100DaysOfCode

Project goals :
- div overlay up to 100% on hover with transition cubic-bezier
- transform: scale() in order to create the zoom effect
- z-index in order to put lettering above

#WebDev #Frontend #WebDesign #CodingChallenge #Javascript #LearnToCode #CodingDay #FrontendDevelopment #WebDevelopment #UIDesign #UITrend #CodingChallenge #LearnCode #LearningDaily

a website showcase. Four equal white cards hiding 
Paulus Moreelse paintings under. When you hover the div the undelrying painting appear with a nice transform scale() effect and a cubic bezier transition. A display serif fonts comply with the general gothic style
Web Axe
2 days ago
Chris Henrick
2 days ago

Been learning more about the #a11y concept of “accessible names” in #html. It can be quite a complex topic to grok! Luckily this excellent article by Sarah Higley breaks it down and goes into depth about it in a way that makes it easier to understand for web developers:

https://sarahmhigley.com/writing/whats-in-a-name/

Sven
2 days ago

In today's live programming session, ⌨️ we are going to work on the last details of our flat ad aggregator. 🏠🔍 https://www.twitch.tv/noyainrain 😊 #Python #HTML #OpenSource

James Dreben :mw:
2 days ago

If #HTML were a cake I want to eat then #CSS is more like fondant than icing.

Sometimes, having a look in the #HTML spec is really helpful. It saves you some writing.

TIL target="_blank" implies rel="noopener"

I remember eslint rules always complaining when rel="noopener" is omitted.

https://html.spec.whatwg.org/#following-hyperlinks

DennisL
2 days ago

File Uploads for the Web (1): Upload Files with HTML https://austingil.com/uploading-files-with-html/ A nice, succinct tutorial plus follow-up of enhancing with Javascript. #webdev #html

Inautilo
2 days ago

#Development #Tools
VS Code has a hidden built-in browser · How to enable live previews inside of the popular code editor https://ilo.im/11zkjq

_____
#VsCode #CodeEditor #Browser #LivePreview #WebDevelopment #WebDev #Backend #Frontend #Code #HTML #CSS #JavaScript

Symfony Station :symfony:
2 days ago

Explore the January 20, 2023 @symfonystation Communiqué of Symfony, Drupal, PHP, and Cybersecurity news. https://www.symfonystation.com/Symfony-Station-Communique-20-January-2023 :symfony: :drupal: :php: :sylius: :mastodon: :magento: #Symfony #PHP #Drupal #Cybersecurity #Sylius #Docker #GitHub #Mastodon #HTML #CSS #SQL #Svelte #Magento #OroCommerece #ThrowbackThursday

Illustration of a spaceship on the rocky surface of an alien planet.
ppk 🇪🇺
2 days ago

Fact of the day: if you define a pattern on an #HTML #input field with types email or URL, the field's value must obey both your pattern and the internal email/URL pattern. Even when that is mutually exclusive.

Tom Walker
2 days ago

Am I missing something huge here or is there no reasonable way to wrap text inside a polygon in SVG?

#svg #html

Valeria (SnugglyBun)
2 days ago
Inautilo
2 days ago

#Design #Development #Evolutions
2023 state of design systems and where we take them next · How far design systems have come and where they are heading https://ilo.im/11x65a

“Design systems continue to stick around and will likely stick around until there is a new buzzword for them.” — Ian Frost

_____
#DesignSystem #UiDesign #DigitalDesign #WebDesign #WebDevelopment #WebDev #AI #WebComponents #Frontend #HTML #CSS #JavaScript

Francis Rubio :verified:
2 days ago

I'm currently writing a blog post about #LadyGaga's most polarizing album ARTPOP, and found one of the uses of the #HTML <b> element.

I'm using it here to highlight two keywords that permeate throughout the entire album era. I don't want these to be strongly emphasized, hence I'm not using <strong>, but I want the reader to remember it and I want to use it to connect all of the points I'm making about the album.

Snippet from a draft of my article: "In it’s heart, ARTPOP is a subversion of expectation and creative rebellion. ARTPOP is shocking, which is exactly what Gaga does best, and rebellious in that it didn’t care about the trends at the time. It was unapologetic, raw, and unique. "

The phrases "subversion of expectation" and "creative rebellion" are both boldfaced.
wesruv
2 days ago

I think I'm pretty much at the point where I'd recommend against content authors using #HTML tables if there's literally any other option. Any more than a few columns and there's UX and accessibility issues at mobile for the majority of users; and a giant headache for a front end dev.

Getting the markup right is tricky, even for a solid front end developer.

They can't be made responsive without knowing if the content is more row or column centric, if it's column-centric it's a giant pain to make responsive.

I see tables misused more than I see them used properly, but that might be a side effect of working with the type of content I have and how far back the content's history goes.

Consider using a definition list, headings, nested unordered/ordered/definition lists; all of which can give you content hierarchy without the odd layout behavior and rigid markup structure of tables.

David Bisset
3 days ago

A new #HTML specification added a new grouping content element - <search> element.

https://www.scottohara.me/blog/2023/03/24/search-element.html

Daniel
3 days ago

Just inspected Google Docs UI out of curiosity and was met with this monstrosity: No semantic HTML, everything is a div 🤦‍♂️

You would think the company building the most popular web browser knows how to properly design a web application.

#google #docs #semantic #html #accessibility #web #development #design #fail

A screenshot showing an open empty Google Docs document on the left hand side and open Firefox Developer Tools on the right hand side with the inspector panel open.

The input for selecting the text heading style is being inspected at the moment. The inspector panel shows that not only this element, but also other interactive elements are solely being made out of generic HTML div elements.
Albert Krewinkel
3 days ago

Reasons why software is terrible, today: the <col> element
The #JATS standard: "[it] is based on and intended to be converted easily to the XHMTL col element." The standard includes many attributes for that element.
The #HTML working group: cool, but we deprecated the use of most attributes in <col> elements. Browsers ignore half of those.
😭

C:\KKJ\>:idle:
3 days ago

Added Virtual Production like panorama lighting (as option).

New example meshes and environments. Better lighting.

=> https://virtualcurator.p1x.in

#ChatGPT #HTML #AFRAME #XR #VR #WebGL #GLTF

Aral Balkan
3 days ago

:kitten: Just merged an improved slots implementation to main and you can now pass CSS class lists to components. 🎉

Read more:

Slots:
https://codeberg.org/kitten/app#slots

Layout components:
https://codeberg.org/kitten/app#layout-components

Passing CSS class lists to components:
https://codeberg.org/kitten/app#layout-components

Named slots:
https://codeberg.org/kitten/app#layout-components

Sample project:
https://codeberg.org/kitten/app/src/branch/main/examples/layout

#Kitten #SmallWeb #templating #layout #components #web #dev #html #css #js

Schrank :shopware:
3 days ago

Protip: Every form input (input, button, select) can have a form="form_id" attribute, so you can add fields into forms but attach it to another form!
#html

By running my blog with only pure #html and #css, my carbon footprint is significantly lower than with a resource hungry monster like #wordpress.

Dadurch, dass mein Blog nur mit purem #html und #css läuft, ist mein Kohlenstoff-Fußabdruck erheblich geringer, als bei einem Ressourcen hungrigen Monster wie #Wordpress.

Sal Ferrarello
3 days ago

Adding draggable=“false” to an HTML element makes it not draggable.

This was new to me so I made some notes and examples at https://salferrarello.com/prevent-dragging-html-element/

#WebDev #HTML

Dean
3 days ago

Thanks to #AutoDeploy with #GithubWorkflows I did a month ago, and after introducing the concept of #GitHub to my girlfriend, she’s able to correct my typos in our websites without any knowledge in server, #Hugo, #HTML, #CSS or even deployment. 🙂
(And she don’t need me for it!)
#IndieDev

Pranesh Sekar
3 days ago

#HTML is not a schema of #xml
but it is based on SGML (Standard Generalized Markup Language), which is a meta-language used to define markup languages like HTML.

😭 my whole life is a lie

Inautilo
4 days ago

#Development #Techniques
Fighting inter-component HTML bloat · Ways to deal with an unwanted byproduct in design systems https://ilo.im/11xzob · by @elise

_____
#DesignSystem #Webperformance #WebPerf #WebDevelopment #WebDev #Frontend #HTML #Markup #Accessibility #A11y

Andreas
4 days ago

Day 90 of #100DaysOfCode is done, and thanks to the much-appreciated help of @dwarmstrong, I was able to further improve my website and get rid of a couple of bugs. After that, I learned a lot about inputs in #HTML, and I am looking forward to seeing how the backend server handles all those GET and POST requests.

Josh Bruce
4 days ago

Automatic code syntax highlighting on the web.

What are folks using these days?

Last one I used was https://prismjs.com

Curious what else is out there.

#html #css #webdev

@T0xF01AE

Yeah.
I'm insane.

So of course I do :p

And thats why I use #opera on any platform.

#firefox removed local #html / #js / #anything loading in a latest android app update.

So byebye ff xD

J.P. Wing
4 days ago

I'm still looking for two full-stack #PHP #Javascript #HTML #SQL developers for my development team with a major telecommunications company. The position is 100% remote and the team mate would work on internal web applications. The team is spread across the country. #Azure #DevOps, #git, #Linux experience a plus. Reach out to me for more information if interested, boosts appreciated. Salary is decent.

“Vendor-specific proprietary user agent extensions to [the #HTML] specification are strongly…”

Max Bachhuber
4 days ago

I didn't expect that day to come... iOS 16.4 will support #WebPush 🥳😱

This will be one big step into fully supporting #ProgressiveWebApps on all major platforms.

And lot more features all people in #WebDevelopment have waited for: https://webkit.org/blog/13966/webkit-features-in-safari-16-4/

#PWA #WebDev #HTML #CSS #JavaScript #JS #Apple

Jeroen Mols
4 days ago

Blogged: building a privacy friendly RSVP for events

👉 https://jeroenmols.com/blog/2023/03/28/privacy-friendly-rsvp/

#privacy #html #javascript #rsvp

c't Magazin
4 days ago

heise+ | Mit Daten-URLs Bilder und andere Daten in Textdokumente integrieren

Zum schnellen Einbauen von Bildern in HTML oder Markdown gibt es Daten-URLs. Außerdem können Sie damit prima Programmabläufe verschleiern. So geht's!

https://www.heise.de/hintergrund/Mit-Daten-URLs-Bilder-und-andere-Daten-in-Textdokumente-integrieren-7619551.html?wt_mc=sm.red.ho.mastodon.mastodon.md_beitraege.md_beitraege

#HTML #Softwareentwicklung #Webentwicklung #news

Shi
4 days ago

Guten Morgen!
Ich würde mir gerne die Arbeit in einer IT-Firma im Bereich Webdev/ Python Programmierung anschauen, über ein 2 wöchiges #Praktikum oder ähnliches.

Ich habe lange hobbymäßig und auf selbstständiger Basis im #Webdev Bereich gearbeitet. Ich habe Kenntnisse in #HTML, #CSS, #JavaScript, #Python, #Git + GitHub, #WordPress #SEO für Webseiten. Mit Datenbanken habe ich mich auch schon beschäftigt. Ich lerne gerne neue Sachen.

Kennt ihr Firmen die so etwas anbieten? Bitte teilen!

Mauve 👁💜
4 days ago

My brain is kinda exhausted from first wrestling with Linux and Ansible automation, and then wrestling with JavaScript type hell in trying to get some p2p libraries to work.

Gonna decompress before bed by live-coding a lil #p2p #gemini #microblog in #agregore with some basic #JavaScript and #HTML

So if you haven't yet, try installing the latest pre-release of Agregore and follow along.

https://github.com/AgregoreWeb/agregore-browser/releases/tag/v2.0.0-12

Jen Simmons
5 days ago

Exciting HTML, JS, media in Safari 16.4!

Lazy-loading iframes
RegExp `lookbehind`
JavaScript Import Maps
Growable `SharedArrayBuffer` and resizable `ArrayBuffer`
Offscreen Canvas (2D)
unprefixed Fullscreen API
parts of Screen Orientation API
Screen Wake Lock API
User Activation API
P3 in WebGL Canvas
Compression Streams API
AVIF on macOS Monterey and Big Sur
Web Codecs API
Declarative Shadow DOM
ElementInternals
Imperative Slot API

#JavaScript #HTML #WebAPI #AVIF

https://webkit.org/blog/13966/webkit-features-in-safari-16-4/

@T0xF01AE

Had to.

I'd have to create another loop otherwise which gives me a 500 error.

Luckily the 13 digit identifier is conveniently located.

And I use an #html file via #buffer read as swap file

Jen Simmons
5 days ago
Jérémy Renard
5 days ago

Constaté par hasard : avoir un smooth scroll sur un formulaire un peu long fait disparaître les tooltips d'aide à la validation (champs requis, patterns non respectés, etc.)
Pas d'autre solution que d'enlever le smooth scroll ?
#HTML

Hobson Lane
5 days ago

@aburka @BennettTomlin carbonyl is a #FOSS #browser in your terminal (including over ssh) that complies with all web standards. Under the hood html2svg at 60 fps. Launches in seconds.
https://github.com/fathyb/carbonyl

#carbonyl #chrome #chromium #firefox #librewolf #html #svg #javascript

C:\KKJ\>:idle:
6 days ago

So many materials 😍 🌈

#ChatGPT #HTML #AFRAME #XR

Steve Faulkner
6 days ago

🥚 A simple custom

For whatever reason some people don’t like the standard HTML checkbox and radio button, they seek to jazz ’em up and in the process the often jizz up the usability/accessibility of these controls.

There are some good efforts out there to win over developers/designers to using native controls, or minimally customized controls. Here I provide my simple variation:

https://html5accessibility.com/stuff/2021/01/24/a-simple-custom/

#HTML #ARIA #CSS #accessibility #WebDev

C:\KKJ\>:idle:
6 days ago

Added material selector. Those presets were also made by ChatGPT ;)

Additionally the reflections are now updated after changing the HDRI.

#ChatGPT #HTML #AFRAME #XR

C:\KKJ\>:idle:
6 days ago

Vignette effect. Based on current FOV.

#ChatGPT #HTML #AFRAME

C:\KKJ\>:idle:
6 days ago

VirtualCurator has its name and production place :)

=> https://virtualcurator.p1x.in/

#ChatGPT #HTML #AFRAME #VR #XR #StableDiffusion

C:\KKJ\>:idle:
6 days ago

I've added FOV to the camera (and sharing).

#ChatGPT #AFRAME #VR #HTML

Francis Rubio :verified:
6 days ago

@webdev_discussions because <b> still has use. For example, it can be used to mark up the first instance of a technical term in a body of text. Then enclose it in an <a> tag to link to a paragraph with the definition of that term and wrapped in a <dfn>.

#html

Terence Eden
6 days ago

Using #HTML you want to place a link on a superscript element - like a footnote.

Which of these do you use and why?

<a href="…"><sup>fn1</sup></a>

<sup><a href="…">fn2</a></sup>

Do you think it makes a difference?

Elena.
6 days ago

I updated my website. :ablobspin:
It is super simple and not much is there to see. BUT I have written it all by myself. Guys, I know how to use HTML and CSS! :blobcatsunglasses:
I still have A LOT to learn, I am only at the very beginning. But I'm excited for it.

https://theresmiling.neocities.org/

#neocities #PersonalWebsite #HTML #CSS

DennisL
1 week ago

I find that web developers need to implement inputmode more often (to customize virtual keyboard for phone, email, etc). Hey Safari, why don't you support it?! https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode #safari #browsers #html #forms #usability

@j9t but if you customize built-in elements you sometimes lose their accessibility features?

For example a form with a custom input cannot wrap that input in a <label> (which helps screenreaders read the form input outloud) because <label's for= attr can't link into the component's shadowDom.

#dom #html

📝 HTML Concepts: Customized Built-In Elements:

#HTML allows to define custom elements, elements which enable authors to “build their own fully-featured #DOM elements.” One special type of custom element is the customized built-in element—a custom element built on an existing HTML element.

https://meiert.com/en/blog/html-customized-built-in-elements/

Inautilo
1 week ago

#Development #Introductions
The search element · What to expect from HTML’s new grouping content element https://ilo.im/11wb00

“This is not the most important element that’s ever been added to the HTML specification. It is however a nice little accessibility win.” — Scott O'Hara

_____
#HtmlSpecification #SearchElement #WebDevelopment #WebDev #Frontend #HTML #ARIA #Accessibility #A11y

Danny Blue
1 week ago

Is the browsers HTML parser depth for or breadth first? I think breadth? #html