# modern web design

Published articles for modern web design.

This is one page of public article previews, not the complete archive. Follow Next page to continue. Summaries are not the original full articles.

## Figma is the New Dreamweaver: How Modern Prototyping Tools are Trapping Us in 2018

DevFeed: [Figma is the New Dreamweaver: How Modern Prototyping Tools are Trapping Us in 2018](<https://devfeed.tech/articles/figma-is-the-new-dreamweaver-how-modern-prototyping-tools-are-trapping-us-in-2018-9268.md>)

Original publisher: [Read original article](<https://webdesignerdepot.com/figma-is-the-new-dreamweaver-how-modern-prototyping-tools-are-trapping-us-in-2018/>)

Author: Noah Davis

Published: 2026-08-17T12:04:00Z

Content type: opinion

Language: en

Sources: [Web Designer Depot](<https://devfeed.tech/sources/web-designer-depot.md>)

Topics: [Figma](<https://devfeed.tech/topics/figma.md>), [Code](<https://devfeed.tech/topics/code.md>), [CSS](<https://devfeed.tech/topics/css.md>), [HTML](<https://devfeed.tech/topics/html.md>), [Web](<https://devfeed.tech/topics/web.md>), [Web Development](<https://devfeed.tech/topics/web-development.md>), [systems](<https://devfeed.tech/topics/systems.md>)

Tags: [accessibility](<https://devfeed.tech/tags/accessibility.md>), [css](<https://devfeed.tech/tags/css.md>), [design](<https://devfeed.tech/tags/design.md>), [design-systems](<https://devfeed.tech/tags/design-systems.md>), [design-tools](<https://devfeed.tech/tags/design-tools.md>), [dreamweaver](<https://devfeed.tech/tags/dreamweaver.md>), [figma](<https://devfeed.tech/tags/figma.md>), [figma-alternatives](<https://devfeed.tech/tags/figma-alternatives.md>), [frontend-development](<https://devfeed.tech/tags/frontend-development.md>), [html](<https://devfeed.tech/tags/html.md>), [interface-design](<https://devfeed.tech/tags/interface-design.md>), [modern-web-design](<https://devfeed.tech/tags/modern-web-design.md>), [product-design](<https://devfeed.tech/tags/product-design.md>), [prototyping](<https://devfeed.tech/tags/prototyping.md>), [responsive-design](<https://devfeed.tech/tags/responsive-design.md>), [systems](<https://devfeed.tech/tags/systems.md>), [ui-design](<https://devfeed.tech/tags/ui-design.md>), [user-experience](<https://devfeed.tech/tags/user-experience.md>), [ux-design](<https://devfeed.tech/tags/ux-design.md>), [web](<https://devfeed.tech/tags/web.md>), [web-design](<https://devfeed.tech/tags/web-design.md>), [web-designers](<https://devfeed.tech/tags/web-designers.md>), [web-development](<https://devfeed.tech/tags/web-development.md>), [writing-code](<https://devfeed.tech/tags/writing-code.md>)

### AI overview

Figma's polished, pixel-based canvas and prototyping features can obscure the fluidity, document flow, layout behavior, and unpredictable content of the web. The article argues that designers who rely on fixed artboards and simulated code risk repeating Dreamweaver's history of separating visual design from HTML, CSS, responsive behavior, performance, and systems thinking.

### Source excerpt

Just like Dreamweaver convinced a generation they could ignore HTML and CSS, Figma's perfect canvas may be hiding the messy realities of how the web actually works. The future belongs to designers who understand systems, behavior, performance, and code--not just pixels.

## Why Developers Should Avoid Reimplementing Browser Features in Website Design

DevFeed: [Why Developers Should Avoid Reimplementing Browser Features in Website Design](<https://devfeed.tech/articles/don-t-roll-your-own-37666.md>)

Original publisher: [Read original article](<https://susam.net/do-not-roll-your-own.html>)

Published: 2026-05-23T00:00:00Z

Content type: opinion

Language: en

Sources: [Susam Pal](<https://devfeed.tech/sources/susam-pal.md>)

Topics: [web design](<https://devfeed.tech/topics/web-design.md>), [Website](<https://devfeed.tech/topics/website.md>), [browsers](<https://devfeed.tech/topics/browsers.md>), [User Experience](<https://devfeed.tech/topics/user-experience.md>), [Development](<https://devfeed.tech/topics/development.md>)

Tags: [browsers](<https://devfeed.tech/tags/browsers.md>), [developers](<https://devfeed.tech/tags/developers.md>), [modern-web-design](<https://devfeed.tech/tags/modern-web-design.md>), [web-design](<https://devfeed.tech/tags/web-design.md>), [website](<https://devfeed.tech/tags/website.md>)

### AI overview

This opinion article argues that web developers should avoid reimplementing browser-provided behaviors such as scrolling, link navigation, text selection, context menus, copy and paste, password fields, and date pickers when users depend on the native behavior. It compares this practice with the cryptographic principle of avoiding private, unreviewed implementations.

### Source excerpt

This is going to be a rant about modern web design practices. But before I get to that, let me begin with a familiar principle from the world of cryptography. Among software developers, and especially among those who work on security-sensitive systems, there is a well-known maxim: Don't roll your own crypto. This does not mean that nobody is allowed to write cryptographic code. Someone has to. It means that, for ordinary production software that protects sensitive data of users, we should not rely on a private, unreviewed implementation that has not been vetted by the wider software development community. We should use established, vetted software packages or tools wherever possible. Fortunately, it is now standard industry practice to avoid rolling your own crypto and instead use cryptographic algorithms and packages that have been peer reviewed and stood the test of time. It wasn't so some twenty years ago. I have seen several flawed home-grown RC4 implementations early in my career, with issues like improper initialisation vectors, predictable keystreams and partial leakage of plaintext into ciphertext, putting sensitive data of users at risk. But today, major e-commerce websites or banks typically do not use home-grown cryptography for its web services. In fact, in regulated domains such as payments, healthcare and personal data processing, doing so could violate requirements for strong cryptography, possibly leading to hefty financial penalties. Website design is obviously not cryptography. A broken scroll bar is not the same kind of failure as a broken encryption scheme. But I wish there were a similar maxim for website design as well. There are many aspects of websites where, I think, developers should not be rolling their own X, especially when X is something browsers already do well and something users depend on every day. Here I present a list of such X. Don't roll your own page scrolling. Don't roll your own link navigation. Don't roll your own text selec

## Svelte launches a unified website for Svelte, SvelteKit, and related resources

DevFeed: [Svelte launches a unified website for Svelte, SvelteKit, and related resources](<https://devfeed.tech/articles/the-omnisite-3051.md>)

Original publisher: [Read original article](<https://svelte.dev/blog/the-omnisite>)

Author: Rich Harris

Published: 2024-10-21T00:00:00Z

Content type: release

Language: en

Sources: [Svelte blog](<https://devfeed.tech/sources/svelte-blog.md>)

Topics: [Website](<https://devfeed.tech/topics/website.md>), [Svelte](<https://devfeed.tech/topics/svelte.md>), [Red](<https://devfeed.tech/topics/red.md>), [User interface design](<https://devfeed.tech/topics/ui-design.md>), [web design](<https://devfeed.tech/topics/web-design.md>), [navigation](<https://devfeed.tech/topics/navigation.md>)

Tags: [dark-mode](<https://devfeed.tech/tags/dark-mode.md>), [links](<https://devfeed.tech/tags/links.md>), [modern-web-design](<https://devfeed.tech/tags/modern-web-design.md>), [navigation](<https://devfeed.tech/tags/navigation.md>), [svelte](<https://devfeed.tech/tags/svelte.md>), [sveltekit](<https://devfeed.tech/tags/sveltekit.md>), [ui](<https://devfeed.tech/tags/ui.md>), [ui-design](<https://devfeed.tech/tags/ui-design.md>), [web-design](<https://devfeed.tech/tags/web-design.md>)

### AI overview

Svelte launched a unified website that brings its main site, SvelteKit, documentation, and tutorial resources under the svelte.dev domain. The consolidation addresses cross-site search, navigation, link validation, shared preferences, and page reload issues.

### Source excerpt

Launching Svelte 5 and the brand new sv CLI wasn't enough: we've also released a brand new website. You're looking at it. Up until now, we've maintained multiple different sites under the svelte.dev domain -- the main site, for Svelte itself, along with kit.svelte.dev and learn.svelte.dev. This had some minor benefits, but was mostly a nuisance: inability to search across sites subtly different navigation potential for broken links (at build time, SvelteKit automatically validates that every internal link is correct, but links to other sites are a different matter) preferences such as dark mode are not shared between sites navigating between (for example) documentation and the tutorial involves a full page reload From an implementation perspective, keeping multiple sites in sync proved to be a headache. Having everything under a single roof means you'll have an easier time finding the information you need. Right now, the site includes documentation for Svelte and SvelteKit; soon, it will also cover the CLI and additional packages like vite-plugin-svelte. New look We've also given the site a facelift. Our logo and hero artwork ('the machine'), designed by the brilliant Achim Vedam, are unchanged -- these, and the Svelte orangey-red colour, are still the cornerstones of our visual identity. But many other aspects of the site have been cleaned up, starting with the five Bs -- boxes, backgrounds, borders, box-shadows, bold text -- which are tempting to overuse when organising information on a page. By getting rid of most of these and simplifying our colour palette, the site is calmer, more cohesive and less cramped. We've also updated our button styles so that they actually look like buttons (a radical concept in modern UI design, unfortunately). What the font? Of course, the most salient difference is the typography. Previously, we used Overpass for everything except code -- logo, headers, UI elements and body copy. It's surprisingly versatile given its origins as an adapta