Best of HTML — April 2025

  1. 1
    Article
    Avatar of ishadeedAhmad Shadeed·1y

    First Look at The Modern attr()

    This post explores the modern usage of the attr() function in CSS, highlighting its ability to handle various data types beyond text, such as color, length, and time. It demonstrates practical use cases including assigning column numbers in CSS grids, setting animation delays, adjusting textarea rows, and defining background images. Modern attr() offers flexibility and improves separation of concerns and reduces CSS conflicts, making CSS more modular and maintainable. Currently supported only in Chrome.

  2. 2
    Article
    Avatar of css_tricksCSS-Tricks·1y

    Revisiting Image Maps

    The post explores the use of image maps, an older web design tool, and discusses their advantages, challenges, and alternatives. It highlights a project for Mike Worth that required blending expressive '90s design with modern techniques. While discovering image maps weren't the right fit, the effort led to finding modern solutions by leveraging SVG and anchoring paths for clickable areas, emphasizing accessibility and responsiveness.

  3. 3
    Article
    Avatar of chromeChrome Developers·1y

    Chrome for Developers

    Chrome 135 introduces several new features including CSS carousels, the command and commandfor attributes for improving button functionality, and the CSS shape() function for defining shapes in clip-path and offset-path properties. Other updates include support for the Web Speech API, Float16Array, and the Observable API.

  4. 4
    Article
    Avatar of mdnblogMDN Blog·1y

    Default styles for h1 elements are changing

    Changes are being rolled out in browsers that remove default user agent styles for h1 elements within nested sections. Developers should ensure their websites do not rely on these default styles to avoid issues flagged by tools like Lighthouse. Explicitly defining font sizes and margins for heading elements is recommended. Specific instructions are provided for different browsers and tips on updating CSS to conform to these changes.

  5. 5
    Article
    Avatar of lobstersLobsters·1y

    Hiding elements that require JavaScript without JavaScript

    Learn how to hide elements that require JavaScript without using JavaScript. The post covers several methods, including using the <noscript> tag, adding a js-enabled class via JavaScript, and combining <noscript> with CSS overrides for specific elements. The final recommendation involves using a d-js-required class to simplify the process and reduce maintenance.

  6. 6
    Article
    Avatar of css_tricksCSS-Tricks·1y

    The Lost CSS Tricks of Cohost.org

    Cohost.org, a niche social media site that went public in June 2022 and shut down in September 2024, had a devoted user base of creatives who leveraged its permissive HTML sanitizer to perform unique CSS tricks. Notable techniques included 'width-hacking' using the <details> and <summary> tags, and creative use of SVG animations. Despite its short lifespan, Cohost delivered a unique posting experience free from advertisements and follower counts.

  7. 7
    Article
    Avatar of c_communityC/C++ Community·1y

    Lightweight web server with hot reload and dynamic html templating.

    Blink is a lightweight web server designed as a hobby project, featuring dynamic HTML templating, hot reloading for auto browser refresh, WebSocket for real-time communication, and various command-line options for configuration. Check out its default server page and source code on GitHub.

  8. 8
    Article
    Avatar of gamedeveloperGame Developer·1y

    The huge, hidden web game market no one talks about (and how to get in)

    The post discusses the often-overlooked market for web games and offers insights into distribution, monetization, and the production of HTML5 games. It highlights the advantages of hosting games on popular platforms like Poki, Crazy Games, and Newgrounds, while also addressing the challenges of competition, costs, and the importance of diversifying game distribution. Various strategies for self-publishing and utilizing publishers or game distribution platforms are explored to maximize reach and profitability.

  9. 9
    Article
    Avatar of christianheilmannChristian Heilmann·1y

    Keeping it on the < dl > – another HTML gem you never use

    Description lists (<dl>) in HTML are underutilized elements that help structure content by pairing terms and definitions. Unlike unordered and ordered lists, <dl> uses <dt> for terms and <dd> for descriptions, supporting multiple definitions per term. They offer built-in accessibility benefits. Consider using them for metadata descriptions and improving web page structure.

  10. 10
    Article
    Avatar of lobstersLobsters·1y

    Rewriting my site in vanilla web

    The author discusses their experience rewriting their website using vanilla HTML, CSS, and JavaScript, moving away from frameworks and libraries to achieve greater simplicity and control. They explain their rationale, the principles they followed, and the methodologies they used, such as semantic HTML, TAC CSS, and Web Components with Light DOM. The post also touches on the advantages and challenges of this approach, tips for efficient conversion, and the pragmatic adjustments necessary for the project's success.

  11. 11
    Article
    Avatar of logrocketLogRocket·1y

    Creating server-driven web apps with htmx

    htmx is a JavaScript library designed to simplify the creation of server-driven web apps by allowing direct interaction with server responses through HTML attributes. This tutorial demonstrates building a to-do app with htmx, highlighting its ability to manage AJAX requests, trigger CSS transitions, and integrate with backend solutions like Supabase. Featuring practical examples, the content covers installation, setup, and using htmx attributes to manage CRUD operations effectively, emphasizing its minimalist approach for quick development.

  12. 12
    Article
    Avatar of lnLaravel News·1y

    Eloquent Cast for HTML Strings in Laravel

    Laravel v12.4 introduces the AsHtmlString cast, allowing Eloquent attributes to be automatically cast to HTML strings. This simplifies the process by integrating the existing HtmlString class with Eloquent attributes. While useful for rendering dynamic content from databases, developers should be cautious about potential security risks, as HTML strings are not escaped in Blade templates.

See all HTML archives