Tech is political: The people under attack in Palestine 🇵🇸, Iran 🇮🇷, and Lebanon 🇱🇧 are people like us. They’re our brothers and sisters, too. Read up on their history, scrutinize what you’re told, and demand respect and accountability. Hide

Frontend Dogma

“techniques” News Archive

Definition, related topics, and tag feed

Definition · Supertopics: programming · Subtopics: clipping, comet, hiding, image-replacement, masking, sprites (non-exhaustive) · “techniques” × ? · “techniques” RSS feed (per email)

Entry (Sources) and Additional TopicsDate#
Resize Text and Lessons on Conformance and Techniques (mni)165
accessibility, resizing, wcag, compliance, lessons
Protecting HTML Content Against Copying (jsd)164
html, css, javascript, canvas, obfuscation, comparisons
A Few Ways of Specifying Per-Theme Colours in Only CSS163
html, css, dark-mode, colors
Not All Hidden Content Is Equal: How Different Hiding Methods Impact Accessibility162
accessibility, hiding, css, html, aria, attributes, comparisons
Your Options for Preloading Images With JavaScript (mac)161
images, preloading, javascript
Using CSS Animations as State Machines to Remember Focus and Hover States With CSS Only (pat)160
css, animations, focus, hover
Sprites on the Web (jos)159
css, images, sprites
Solving Shrinkwrap: New Experimental Technique (kiz)158
css
Anchor Interpolated Morph (AIM) (arg)157
css, animations
CSS Layout: How to “Center a Div,” the Old School Way156
css, layout, floats, centering, how-tos
On Inheriting and Sharing Property Values (dxn/css)155
css, cascade
Older Tech in the Browser Stack (sma)154
xpath, css
10 Smart Performance Hacks for Faster Python Code (did/jet)153
python, performance
Essential Visually Hidden CSS Techniques for Web Accessibility (a11)152
accessibility, hiding, css
Color Shifting in CSS (jos)151
css, colors, animations
Accessible Writing Techniques for Web Content (a11)150
accessibility, writing, content
Designing With AI, Not Around It: Practical Advanced Techniques for Product Design Use Cases (sma)149
design, ai, processes, product-management
What Is Bot Detection: Tools, Techniques, and Ways to Prevent Against Bot Attacks148
bots, bot-detection, metrics, link-lists
A Short History of Web Bots and Bot Detection Techniques (ole)147
bots, bot-detection, fingerprinting, traffic, history
Revisiting Image Maps (mal/css)146
images, image-maps, html
Accessible Forms: Tips and Techniques145
accessibility, forms, labels, keyboard-navigation, errors, testing, tips-and-tricks
Overengineered Anchor Links144
links, effects
Minimal CSS-Only Blurry Image Placeholders (kal)143
images, placeholders, backgrounds, css
Accessible UX Design: 6 Advanced Techniques to Elevate Your Process (a11)142
design, user-experience, accessibility, principles, processes
Transitioning Top-Layer Entries and the Display Property in CSS (uti/sma)141
css, animations, transitions, effects
Ensuring Excellence: Proven Strategies for Quality Vue.js Development140
vuejs, best-practices
How I Write Angular Apps in 2025: Tools, Tips, Techniques (rai)139
videos, angular, tooling, tips-and-tricks
CSS: How to Indicate Container Overflow, When There Is Overflow (j9t)138
how-tos, css, overflow
11 Essential JavaScript Hooking Techniques for Reverse Engineering in 2024 (xiu)137
javascript, debugging
Advanced and Creative TypeScript Techniques for Professionals136
typescript, type-safety
How to Optimize React Performance: Best Practices and Techniques135
how-tos, performance, optimization, react, best-practices
Solved by CSS Scroll-Driven Animations: Hide a Header When Scrolling Down, Show It Again When Scrolling Up (bra)134
hiding, css, scrolling, animations
Building the Perfect Logo Strip (nil/9el)133
css, logos, images
6 Techniques I Use to Create a Great User Experience for Shell Scripts132
shells, user-experience
Sticky Headers and Full-Height Elements: A Tricky Combination (sma)131
css
Get Window Size in Pure CSS130
css
Advanced Playwright Techniques for Flawless Testing (deb)129
videos, testing, playwright
10 Python Programming Optimisation Techniques128
python, optimization
Context Is King: Long Live the King! (llo/tpg)127
accessibility, usability, aria
HTML and CSS Techniques for Inverting Colors126
css, filters, blend-modes, colors
Advanced JavaScript Performance Optimization: Techniques and Patterns125
javascript, performance, optimization, software-design-patterns
Mina Tamang on SEO Techniques That Prioritise the User Experience (nat)124
podcasts, interviews, seo, user-experience
Beyond CSS Media Queries (mon/sma)123
css, media-queries, container-queries, layout
The Modern Guide for Making CSS Shapes (css/sma)122
guides, css, shapes, effects
Quick-and-Dirty Accessibility (tpg)121
accessibility
Combining CSS “:has()” and HTML “<select>” for Greater Conditional Styling (ami/sma)120
css, selectors, html
Alternating Style Queries (kiz)119
css, style-queries
Sliding 3D Image Frames in CSS (css/sma)118
css, images, 3d
Layered Toggles: Optional CSS Mixins (kiz)117
css, mixins
Techniques for Fetching Data: Comparing Next.js (App and Pages API), Remix, and RedwoodJS (sel/red)116
data-fetching, nextjs, remix, redwoodjs, comparisons
Infinite-Scrolling Logos in Flat HTML and Pure CSS (cit/sma)115
branding, scrolling, animations, css
Modern CSS Tooltips and Speech Bubbles II (css/sma)114
tooltips, css
Modern CSS Tooltips and Speech Bubbles (css/sma)113
tooltips, css
Techniques to Break Words (aar)112
html, css, content
CSS “:is(.awesome)” (mar/cfe)111
videos, css, selectors
The Complex but Awesome CSS “border-image” Property (css/sma)110
css, borders
5 Advanced Data-Fetching Techniques in React for Enhanced User Experience109
react, data-fetching, code-splitting, components
Mastering Promises: 8 Advanced Tips and Techniques108
javascript, promises, asynchrony, tips-and-tricks
How to Center an Element in CSS Without Adding a Wrapper in HTML (moj)107
how-tos, centering, css
6 Techniques for Conditional Rendering in React, With Examples106
react
A Few Ways CSS Is Easier to Write in 2023 (geo/sma)105
css, comparisons
Weird HTML Hacks (ern)104
html, css, hacks, history
5 Formatting Techniques for Long-Form Content (nng)103
usability, content, writing, formatting
Revealing Images With CSS Mask Animations (css/sma)102
css, animations
Why Are We Not Still Using Tables-for-Layout?101
css, tables
Designing Accessible Text Over Images: Best Practices, Techniques, and Resources II (sma)100
accessibility, content, images, best-practices
Designing Accessible Text Over Images: Best Practices, Techniques, and Resources (sma)99
accessibility, content, images, best-practices
The Yellow Fade Technique With Modern CSS Using “@starting-style” (bra)98
css, transitions
5 Code Refactoring Techniques to Improve Your Code97
refactoring, maintenance
Debugging JavaScript Like a Pro: Tools and Techniques for Finding and Fixing Bugs96
javascript, debugging, tooling, bugs
JavaScript Obfuscation Techniques by Example95
javascript, obfuscation, examples
Magical SVG Techniques (sma)94
svg, images
12 Modern CSS Techniques for Older CSS Problems93
css, optimization
Drastically Improve Your UI Designs With This Technique92
design, optimization
How to Write Good Code: 10 Beginner-Friendly Techniques for Instant Results91
how-tos, quality
13 Tools and Techniques to Accelerate Frontend Development90
tooling, software-design-patterns, linting, bundling, testing, logging, frameworks, processes, ci-cd
Thinking About the Cut-Out Effect: CSS or SVG? (sha)89
css, svg, effects, comparisons
6 Useful Frontend Techniques That You May Not Know About88
html, css, javascript
The Raven Technique: One Step Closer to Container Queries (css)87
css, container-queries
Modern CSS Techniques to Improve Legibility (sma)86
css, legibility, typography
30 Seconds of Code85
websites, javascript, css
10 Git Techniques You Need to Know Before You Join a Team84
git, command-line
CSS Circles (tyl/clo)83
css
Faster Image Loading With Embedded Image Previews (sma)82
images, performance, lazy-loading, javascript
Breaking to a New Row With Flexbox81
css, flexbox, layout
Emojis as Icons (chr/css)80
emoji, icons, css
10 Tricks and Techniques to Make the Most Out of Sketch79
sketch, tips-and-tricks
CSS Techniques and Effects for Knockout Text (pre/css)78
css, effects
Three Techniques for Performant Custom Font Usage (oll/css)77
fonts, performance, flash-of-x
Animating Layouts With the FLIP Technique (dav/css)76
animations, javascript, libraries
Silverlight Techniques for WCAG 2.0 (w3c)75
accessibility, wcag, silverlight
Upgrading CSS Animation With Motion Curves (sma)74
css, animations, transitions
A History of CSS Image Replacement73
css, image-replacement, examples, history
The Image Replacement Museum (mar/css)72
image-replacement, html, css, images, overviews, link-lists
Practical Techniques on Designing Animation (sar/sma)71
design, animations
FLIP Your Animations (aer)70
animations, javascript
Approaches to Media Queries in Sass (edu/css)69
css, preprocessors, sass, media-queries
Swapping Out SVG Icons (chr/css)68
svg, images, icons, css, jquery
Animation of How CSS Triangles Work (chr/css)67
css, animations
WCAG Techniques and Understanding WCAG Updates (w3c)66
accessibility, wcag
Replace the Image in an “<img>” With CSS (css)65
css, images, image-replacement
99 Powerful New CSS and JavaScript Techniques (vit/sma)64
css, javascript, link-lists
CSS Sprites Revisited (sma)63
css, sprites, images
Introduction to URL Rewriting (sma)62
introductions, urls, redirecting, apache, servers
A Brief Introduction to Text Replacement With sIFR (jas)61
introductions, image-replacement, flash
10 Fantastic jQuery Techniques and Effects60
jquery, effects
Responsive Web Design Techniques, Tools, and Design Strategies (vit/sma)59
design, responsive-design, tooling, strategies, link-lists
6 Methods for Vertical Centering With CSS58
css, centering, examples
4 Methods for Creating Equal Height Columns in CSS57
css, layout, examples
Powerful New CSS Techniques and Tools (vit/sma)56
css, tooling, link-lists
Technical Web Typography: Guidelines and Techniques (css/sma)55
typography, css, guidelines
New and Improved WCAG 2.0 Techniques (w3c)54
accessibility, wcag, documentation
Developing Sites With AJAX: Design Challenges and Common Issues (cod/sma)53
ajax, javascript
Are You Loosing Traffic by Poor Website Performance? (cod/sma)52
performance, traffic, tooling, link-lists
Styling HTML Lists With CSS: Techniques and Resources (lou/sma)51
html, lists, css, link-lists
Perfect Full Page Background Image (chr/css)50
backgrounds, images, css, filters, jquery
Clever JPG Optimization Techniques (sma)49
images, jpeg, optimization
The Mystery of CSS Sprites: Techniques, Tools, and Tutorials (sma)48
css, sprites, tooling, link-lists
A New Image Replacement Technique: The State Scope Method47
image-replacement, css, javascript
Styling HTML5 Markup in IE Without Script (zco)46
html, internet-explorer, browsers, conditional-comments
Facelift Image Replacement: Another Look at sIFR Type Work (dal/aja)45
image-replacement, flash
Image Replacement and Backgrounds (sea)44
html, css, image-replacement, backgrounds
Image Replacement + Google (dav)43
image-replacement, flash, google
Tomorrow’s CSS Today: 8 Techniques They Don’t Want You to Know42
css, selectors, borders, progressive-enhancement
Nine Techniques for CSS Image Replacement (chr/css)41
css, image-replacement, images, logos, overviews
Great CSS Techniques and the Simple Truth Behind Them (j9t)40
css, maintainability
Powerful CSS Techniques for Effective Coding (sma)39
css, link-lists
Yet Another Image Replacement Method38
image-replacement
sIFR 2007: The Roundup (mis)37
image-replacement, flash
Seven JavaScript Techniques You Should Be Using Today (dig)36
javascript, examples
My Latest Take on Image Replacement (jch)35
image-replacement, css
2006 Redesign—CSS Techniques (mat)34
redesigning, css
My PNG Image Replacement Method (tel)33
image-replacement, images, png
Techniques for WCAG 2.0 (w3c)32
wcag, accessibility, html, css, javascript
A Forgotten Prototype Technique: Comics (jms)31
prototyping
Bookend Lists: Using CSS to Float a Masthead—Replace Tables With CSS Layout List Tutorial30
css, floats, tables, lists
Rip It Up: Worn Type Using CSS (mis)29
css, image-replacement, effects
CSS Techniques Roundup—20 CSS Tips and Tricks28
css, tips-and-tricks, link-lists
STR: SwishMAX Text Replacement27
image-replacement, flash, javascript
Definitive Solution to Image Replacement26
image-replacement
MIR: Malarkey Image Replacement (mal)25
image-replacement, css
Nifty Corners: Rounded Corners Without Images24
css, presentational-html
The Most Hated Advertising Techniques (nng)23
monetization, pop-ups
sJIR: scalable Jens Image Replacement22
image-replacement, fonts, javascript
HTML Overlays (gla)21
overlays, html, xml
Introducing sIFR: The Healthy Alternative to Browser Text (mik)20
introductions, image-replacement, flash
Dynamic Text Replacement (ali)19
image-replacement, php, javascript
Closures and Executing JavaScript on Page Load (sim)18
javascript, closures
Mountaintop Corners (sim/ali)17
css, borders, images
IE vs. Image Replacement (dav)16
browsers, internet-explorer, image-replacement
Faux Columns (sim/ali)15
css, layout, floats, backgrounds
Liquid Layouts the Easy Way (rus)14
liquid-design, css
Night of the Image Map (ali)13
css, images, image-maps
HTML Techniques for WCAG 2.0 (w3c)12
html, wcag, accessibility
JavaScript Image Replacement (cod/ali)11
javascript, image-replacement, images
Sliding Doors of CSS II (sto/ali)10
css, images
Sliding Doors of CSS (sto/ali)9
css, images
Rounding Tab Corners (mey)8
navigation, html, css
Techniques for Accessible HTML Tables7
accessibility, html, tables, section-508, wcag
Image Replacement—With “<span>”6
image-replacement
Accessible Image Replacement5
image-replacement, accessibility
Using “background-image” to Replace Text (sto)4
css, backgrounds, image-replacement
The GIR Image Replacement Technique (GIR)3
image-replacement
Real World Style2
websites, css, layout, tips-and-tricks
The Single Pixel GIF1
html, images, gif