Masthash

#html

Inautilo
1 hour 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

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
6 hours 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
13 hours 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
13 hours 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
16 hours 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:
18 hours 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
18 hours 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:
18 hours 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
19 hours 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
1 day 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
1 day 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

crazyrems
1 day ago

I made a tiny tool for playing with html canvas.
You can play it directly inside your browser on https://rtauziac.github.io/free-canvas/
It’s very crude right now but it’ll be updated regularly when I want to add features.
#html #canvas #toybox

A screen capture of a website, there’s a text editor on the left with instructions to draw a cube in the html canvas on the right.
Inautilo
1 day 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
1 day 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
1 day 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
1 day 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
2 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
2 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
2 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
2 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 👁💜
2 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

trójkąt ▼
2 days ago

Dobrze wiedzieć, że są jeszcze osoby, które podobnie jak ja uważają, że obecny proces tworzenia stron internetowych został absurdalnie skomplikowany i zagmatwany przez JavaScript i aplikacje typu Single-Page App oparte na różnych modnych frameworkach.

Dobry post na ten temat: https://edofic.com/posts/2022-01-28-low-js/

Osoby pamiętające jeszcze generowanie HTML-a na backendzie z łezką w oku wspominają stare dobre czasy, kiedy wszystko było proste a budowanie stron przyjemne i do ogarnięcia przez jedną osobę. Każdy używał tego co najbardziej lubił (PHP, Python, Ruby) i stamtąd generował wszystko czego dusza zapragnęła. Dlatego nic mnie tak ostatnio nie ucieszyło jak odkrycie bibliotek https://htmx.org/ czy https://unpoly.com/

Co ciekawe czas generowania treści na backendzie jest zazwyczaj krótszy niż prędkość z jaką ludzie najeżdżają i klikają na linki więc przy użyciu inteligentnego ładowania można pobrać treść do pamięci przeglądarki zanim jeszcze ktoś kliknie i wtedy strona wydaje się super responsywna.
#html #webdev

Jen Simmons
2 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
2 days ago

#CodeAlcea #php

Read current page ( / pages #current #output) to #html via #buffer

<?php
ob_start();

//Code

}
?>

<?php
echo '1';
file_put_contents('yourpage.html', ob_get_contents());
?>

( source: https://stackoverflow.com/questions/3775281/save-current-page-as-html-to-server )

ryedai
3 days ago

#CodeRyedai #php

Read current page ( / pages #current #output) to #html via #buffer

<?php
ob_start();

//Code

}
?>

<?php
echo '1';
file_put_contents('yourpage.html', ob_get_contents());
?>

Jérémy Renard
3 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

h2g2bob
3 days ago

How did I not know about Text Fragment linking before? It's amazing! (Although it is not on Firefox yet.) https://shkspr.mobi/blog/2023/02/page-numbers-arent-the-answer/#:~:text=That%27s%20OK%21 #webdev #html

Jobs for Developers
3 days ago

DoorDash is hiring System Engineer Lead

🔧 #csharp #python #dotnet #dotnetcore #html #kafka #mysql #sql #techlead
🌎 Atlanta, United States; Austin, United States; New York City, United States; Phoenix, United States; San Francisco, United States
⏰ Full-time
💰 $90k - $210k (Estimate)
🏢 DoorDash

Job details https://jobsfordevelopers.com/jobs/system-engineer-lead-at-doordash-nov-22-2022-1bc54c?utm_source=mastodon.world&ref=mastodon.world
#jobalert #jobsearch #hiring

Ivan Rodriguez
3 days ago

😌 I finally was able to get one section of the SHTML (a language inspired by #HTML and #Markdown) #specification done. For those who are interested, here's what the spec looks like so far: https://github.com/simplr-html/spec/tree/create-spec

#programming

Sid O'Knee
3 days ago

If you are into #javascript or #css or #html , JavaScript , CSS , HTML.Then Please have a look at my page & donate if you can 😀 🤓
https://twooter.co.uk/

Hobson Lane
3 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

corentin.js
3 days ago

A new tool is out : an Html wysiwyg editor ! 🥳

Online HTML editor with feature-rich WYSIWYG editor, get the source code of the content immediately.

https://it-tools.tech/html-wysiwyg-editor

#ittools #javascript #typescript #vue #json #developers #tool #free #opensource #online #github #wysiwyg #html

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

So many materials 😍 🌈

#ChatGPT #HTML #AFRAME #XR

Steve Faulkner
4 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:
4 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:
4 days ago

Vignette effect. Based on current FOV.

#ChatGPT #HTML #AFRAME

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

VirtualCurator has its name and production place :)

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

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

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

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

#ChatGPT #AFRAME #VR #HTML

Francis Rubio :verified:
4 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
4 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?

Jobs for Developers
4 days ago

Camelot is hiring Front End Engineer

🔧 #html #javascript #nuxtjs #react #vue #cypress #css
🌎 Remote; Chalandri, Greece
⏰ Full-time
💰 $95k - $210k (Estimate)
🏢 Camelot

Job details https://jobsfordevelopers.com/jobs/front-end-engineer-at-camelotls-com-nov-17-2022-aa3ce4?utm_source=mastodon.world&ref=mastodon.world
#jobalert #jobsearch #hiring

Elena.
4 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

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

Easier way to choose between available skys.

#StableDiffusion #ChatGPT #AFRAME #VR #HTML

Jobs for Developers
5 days ago
SideBand 🤪 :donor:
5 days ago

Anyone got a #suggestion on a #WYSIWYG #HTML editor for #Linux?

DennisL
5 days 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/

Sinclair-Speccy
5 days ago

Who doesn't love adding web buttons, blinkies and web badges to your site?

#Web #WebsiteDesign #WebBuilding #HTML #CSS

A screenshot of extra content added to the cork board on my site. It has web buttons, web badges, blinkies and "Cool People" as four different sections
Inautilo
5 days 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
5 days ago

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

For the number of elements in living #HTML, this means that there currently are 112 elements

(This count does not include SVG, MathML, or custom elements)

https://meiert.com/en/indices/html-elements/

#HTML: The “search” element has landed

“The ‘search’ element represents a part of a document or application that contains a set of form controls or other content related to performing a search or filtering operation. This could be a search of the web site or application; a way of searching or filtering search results on the current web page; or a global or Internet-wide search function.”

https://html.spec.whatwg.org/multipage/grouping-content.html#the-search-element

Steve Faulkner
6 days ago

👀 🆕 in #HTML

<search> = #ARIA role=search

“The search element represents a part of a document or application that contains a set of form controls or other content related to performing a search or filtering operation. This could be a search of the web site or application; a way of searching or filtering search results on the current web page; or a global or Internet-wide search function.”

#WebStandards #a11y

<search>
https://html.spec.whatwg.org/multipage/grouping-content.html#the-search-element

role=search
https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/search_role

Reverse engineering one of my very old CSS files into proper SCSS, found this tool with a variety of code converters:

https://codebeautify.org #code #html #css