Tech does not just watch: Take action against Russia’s war on Ukraine 🇺🇦, and take action against Israel’s genocide on the Palestinian people and the destruction of Palestine 🇵🇸 Hide

Frontend Dogma

“images” News Archive (2)

Entry (Sources) and Other Related TopicsDate#
Why Your Website Should Not Use Dithered Images354
, ,
We Analyzed 425,909 Favicons353
Beginner’s Guide to Responsive Images: How to Get Them Right (lou)352
, ,
Using Modern Image Formats: AVIF and WebP (add/sma)351
, , , , , ,
Optimizing Images on the Web (clo)350
,
Blowing Up HTML Size With Responsive Images (deb)349
, ,
Fractional SVG Stars With CSS348
,
5 Steps for Writing Alt Text for Accessibility347
, ,
One Favicon to Rule Them All (j9t)346
,
Decoding AVIF: Deep Dive With Cats and imgproxy (evi)345
,
Exploring the CSS Paint API: Image Fragmentation Effect (css/css)344
, ,
Pixelart and the “image-rendering” Paradox343
,
Writing Great Alt Text: Emotion Matters (jaf)342
, , ,
What to Know About AVIF on Cloudinary (sia)341
,
Image Descriptions: A Human Technique That Robots Can’t Grasp (uxd)340
,
The Anatomy of a Web Page: 14 Basic Elements339
, , , , , ,
Beyond Basic Alt Text—Charts, Maps, and Diagrams338
, ,
A Framework for Building Open Graph Images (git)337
Your Image Is Probably Not Decorative (eri/sma)336
, ,
OMG, SVG Favicons FTW!335
, ,
Serving Sharp Images to High Density Screens (jaf)334
Half the Size of Images by Optimising for High Density Displays (jaf)333
,
Adding Shadows to SVG Icons With CSS and SVG Filters (css)332
, , , , ,
Using AVIF to Compress Images on Your Site (dev)331
, ,
How to Build an Image Comparison Slider330
, ,
Accessible SVGs: Perfect Patterns for Screen Reader Users (car/sma)329
, ,
JPEG XL328
,
Content-Aware Image Resizing in JavaScript327
,
Web Developer’s Guide to AVIF Images326
,
How to Use SVG Image Sprites (cra)325
, ,
Create Responsive Image Effects With CSS Gradients and “aspect-ratio” (5t3/sma)324
, , , ,
Seven Myths About Alt Text323
, ,
Front-End Performance 2021: Assets Optimizations (vit/sma)322
, , ,
Optimizing Image Depth (mey/css)321
, ,
Google Is Already Experimenting With WebP2 As Successor To WebP Image Format320
,
GIFs and “prefers-reduced-motion” (chr/css)319
, ,
How to Design a Set of Icons318
,
Creating a Custom Cursor Using CSS?317
, ,
AVIF Has Landed (jaf)316
, , , , , , ,
Optimize Images With a GitHub Action (chr/css)315
,
Pausing a GIF With “details”/“summary” (chr/css)314
, , ,
Writing Alt Text for Data Visualization313
, , , ,
Lazy Loading Images in Svelte (css)312
, ,
Webwaste (ger/ali)311
,
How to Design a Brand Logo (With Ease) (sma)310
, , ,
SVG, Favicons, and All the Fun Things We Can Do With Them (eri/css)309
, ,
How to Use an Emoji as a Favicon Easily (chr/css)308
, , ,
Different Favicon for Development (chr/css)307
,
Tools for Optimizing SVG (chr/css)306
, , ,
Accessible SVGs: Inclusiveness Beyond Patterns (car/sma)305
, ,
Setting Height and Width on Images Is Important Again (tun/sma)304
, ,
Optimize CSS Background Images With Media Queries (dev)303
, , ,
Do This to Improve Image Loading on Your Website (fon/css)302
,
AVIF for Next-Generation Image Coding301
,
Progressive JPEGs: An Introduction300
, , ,
Dark Mode Favicons (chr/css)299
,
Speed Up Your Website With WebP (sma)298
, ,
A Guide to Optimizing Images for Mobile (sma)297
, , ,
Workflow Considerations for Using an Image Management Service (chr/css)296
, ,
How to Change Your Favicon in Wordpress: A Step-by-Step Guide (yoa)295
, ,
Faster Image Loading With Embedded Image Previews (sma)294
, , ,
The Making of an Animated Favicon (pre/css)293
, ,
When to Use “img,” “img@ srcset,” and “picture” and “source” (j9t)292
Image Optimization in WordPress (sma)291
, ,
Understanding Image Compression: Tooling and Context (j9t)290
, ,
A Crime Called Favicon (j9t)289
,
A Practical Guide to SVG and Design Tools (sma)288
, , , , , ,
SVG Circle Decomposition to Paths (sma)287
,
Stacked “Borders” (mey/css)286
, , , ,
Did You Know That CSS Custom Properties Can Handle Images Too? (fon/css)285
,
Using Artificial Intelligence to Generate Alt Text on Images (css)284
, ,
Improve Animated GIF Performance With HTML5 Video (sma)283
, ,
Apply a Filter to a Background Image (chr/css)282
, ,
Responsive Images (wil/ali)281
, ,
Icon Fonts vs. SVGs—Which One Should You Use in 2018?280
, ,
Converting Images to WebP (mal/sma)279
, , , , ,
Image Alt Text vs. Title Text vs. File Names: What’s the Difference? (bri/sea)278
, , , , ,
Improving Performance Perception: On-Demand Image Resizing277
, , ,
What Is SVG Good For? (chr/css)276
,
The Four Big Ways Jetpack Helps With Image Performance (css)275
, ,
Designing for Accessibility and Inclusion (sma)274
, , , , , , , , ,
Some Things About “alt” Text (chr/css)273
, ,
Bad Icons: How to Identify and Improve Them (nng)272
, , ,
The Front-End Checklist (the)271
, , , , , , ,
Tips for Icon Usability270
, , ,
A Pretty Good SVG Icon System (chr/css)269
,
When Large Isn’t Large Enough: Designing With Hero Images (sma)268
Masking vs. Clipping: When to Use Each (sar/css)267
, , ,
GIF, PNG, JPG, or SVG: Which One to Use?266
, , , , ,
Let the Content Delivery Network Optimize Your Images (jon/sma)265
, ,
What Is the Right Image Format for Your Website?264
, , , , ,
Guetzli, Google’s New JPEG Encoder (tel)263
, , ,
Measuring Image Widths in JavaScript (Carefully) (chr/css)262
Align SVG Icons to Text and Say Goodbye to Font Icons261
, , , , , ,
A Compendium of SVG Information (chr/css)260
, ,
Develop Locally, Use Images From Production (chr/css)259
, , ,
The Joy of Optimizing (una/btc)258
, ,
Responsive Images in CSS (chr/css)257
, ,
SVG and Media Queries (jaf)256
, , , , ,
The SVG “path” Syntax: An Illustrated Guide (chr/css)255
,
WordPress SVG Support: How to Enable SVGs in WordPress254
, ,
Accessible SVGs in High Contrast Mode (eri/css)253
, , ,
Are Icons Content? (chr/css)252
, ,
Accessible SVGs (css)251
, ,
Using WebP Images (mal/css)250
,
Get the Original Image From a Data URL (chr/css)249
Practical SVG (chr/ali)248
High Performance SVGs (sar/css)247
, , ,
Working With Images in Stylesheets With PostCSS (css)246
, , ,
RespImageLint—Linter for Responsive Images245
, , ,
How PNG Works244
,
Why npm Scripts? (css)243
, , , , , , ,
Usability Testing of Icons (nng)242
, ,
Lazy-Loading Images: How Not to Really Annoy Your Users241
, ,
Blending Modes Demystified (ali)240
, , ,
A Guide for SVG Support in Email (geo/css)239
, , ,
SMIL Is Dead! Long Live SMIL! A Guide to Alternatives to SMIL Features (sar/css)238
, , ,
Decorating the Web With CSS Border Images237
, ,
The Image Replacement Museum (mar/css)236
, , , , ,
Background Image Shapes (css)235
, , , , ,
Ensure High Contrast for Text Over Images (nng)234
, , ,
How to Make Charts With SVG (fon/css)233
, , , ,
Factors Affecting Website Performance232
, , , , ,
Creating Cel Animations With SVG (hey/sma)231
, , ,
Preloading Images in Parallel With Promises (kit)230
, , ,
The Anatomy of Responsive Images (jaf)229
, , ,
SVG Lessons I Learned the Hard Way (sar/btc)228
, ,
SVG Is for Everybody (chr/btc)227
,
Mastering Image Optimization in WordPress226
, ,
Performance Tools (fon/css)225
, , , , , , , ,
The Art of SVG Filters and Why It Is Awesome (sma)224
, ,
SVG Fallbacks Guide (ame/css)223
, ,
image-dimensions (sin)222
,
HTML5 Image Description Extension (“longdesc”) (cpt/w3c)221
,
Responsive Hero Images (gri/clo)220
CSS Sprites With Sass and Compass219
, , ,
Why Responsive Images Matter (wil/ali)218
Responsive Images in Practice (ali)217
, ,
Styling and Animating SVGs With CSS (sar/sma)216
, ,
How SVG Fragment Identifiers Work (chr/css)215
,
Probably Don’t Base64 SVG (chr/css)214
,
A Guide to SVG Animations (SMIL) (sar/css)213
, , ,
Image Optimization Services (gri/clo)212
, ,
Don’t Use “<picture>” (Most of the Time) (gri/clo)211
,
How a New HTML Element Will Make the Web Faster (ars)210
, ,
Making SVGs Responsive With CSS (sar/cod)209
, ,
Favicons, Touch Icons, Tile Icons, Etc.—Which Do You Need? (css)208
,
Swapping Out SVG Icons (chr/css)207
, , , ,
How to “Resize” Images With CSS206
, ,
Testing Responsive Images (wil/ali)205
,
Picturefill 2.0: Responsive Images and the Perfect Polyfill (sma)204
, ,
Tips for Creating Accessible SVG (tin)203
, ,
Dealing With Content Images in Email (chr/css)202
, , ,
“srcset” and “sizes” (eee)201
,
A Q&A on the Picture Element (yoa+/ali)200
, , ,
Shadow DOM199
, , , , ,
Rethinking Responsive SVG (sma)198
, ,
One Solution to Responsive Images (sma)197
, ,
Animating Vectors With SVG (bri/24w)196
, ,
Why Responsive Images Is So Hard (chr/css)195
, ,
Webpage Performance (geo)194
, , , ,
Image Compression for Web Developers (dev)193
, ,
WebKit Has Implemented “srcset”, and It’s a Good Thing (wil/sma)192
, ,
Using Remote Image Files When You Develop Locally (lul)191
, , ,
SVG Fallbacks (chr/css)190
, , ,
SVG Filters on Text (css)189
, ,
Images Slowing Down Your Site? Try This One Weird Trick! (aer)188
,
The Web Designer’s Guide to Image Copyrights187
, ,
Simple Responsive Images With CSS Background Images (sma)186
, , ,
Why We Need Responsive Images (tka)185
, ,
Replace the Image in an “<img>” With CSS (css)184
, ,
Media Queries Within SVG (tka)183
, , , ,
Media Queries in SVG Images (gri/clo)182
, ,
Using SVG (chr/css)181
, , , , , , ,
Favicon: A Changing Role180
,
Web Technology: 5 Things to Watch in 2013 (sts/cne)179
, ,
CSS Masks—How to Use Masking in CSS Now (sch)178
, , ,
Perfecting Your Website’s Favicon177
,
Compressive Images (sco)176
,
Better SVG Sprites With Fragment Identifiers (sto)175
,
Responsive Image Format (yoa)174
, ,
CSS Sprites Revisited (sma)173
, ,
On Responsive Images (chr/css)172
,
The Need for a Responsive Web Image Format (tel)171
, ,
Resolution Independence With SVG (dbu/sma)170
, ,
pngquant (kor)169
, , , ,
Responsive Images and Transparent Content Negotiation in HTTP (kar)168
, ,
Lightbox2167
, , ,
Responsive [Images] (gri/clo)166
A Farewell to CSS3 Gradients (mis)165
, , ,
How to Optimize Images With HTML5 Canvas (sma)164
, , ,
Infinite All-CSS Scrolling Slideshow (chr/css)163
, ,
More Logo Markup Tips (css)162
, , ,
Fluid Images (bee/ali)161
, ,
Better Image Management With WordPress (sma)160
, ,
HTML, “@ width,” and “@ height” (j9t)159
, ,
Using the CSS “border-image” Property (tab)158
,
Understanding “border-image” (css)157
,
The Death of the Pixel as We Know It—the New DPI Web (dal/aja)156
Transparency in Web Design (chr/css)155
, , ,
SVG Wow154
, ,
Fast by Default and Web Performances (aja)153
, , ,
“toDataURL,” Canvas, and SVG (bra/aja)152
, , ,
Vital Tips for Effective Logo Design (sma)151
, ,
Perfect Full Page Background Image (chr/css)150
, , , ,
Lightbox 2: Simple JavaScript Image Gallery149
, ,
Why IE9 Will Support SVG (fyr)148
, , , ,
How to Optimize PNG (sma)147
, ,
Clever JPG Optimization Techniques (sma)146
, ,
IE Fix: Bicubic Scaling for Images (chr/css)145
, , , ,
WebFormElements.com (tel)144
, ,
The Tiniest GIF Ever143
,
APNG Class: Get APNG Going on All Browsers (dal/aja)142
, ,
88 Outstanding Favicons and 6 Resources to Help You Create Your Own141
, ,
SVG Is the Future of Application Development140
, ,
SVG Test Page (fyr)139
,
“border-image”: No More Cutting Up Hell (dal/aja)138
, , , , , ,
SVG Filter Performance Improvements in Gecko 1.9.1137
, , , ,
SVG Paint Servers for HTML136
, , ,
Evil GIFs: Hiding Java in Your Image (dal/aja)135
, ,
Infinite Web 2.0 Image With GWT (dal/aja)134
, ,
Rendering Performance in Canvas Compared to SVG and VML (dal/aja)133
, , , ,
Preloading Images With jQuery (oct/aja)132
, ,
Google Changes Favicon, Challenges You to Do Better131
,
A Validator Is Not an Accessibility Evaluation Tool? (w3c)130
, , , , ,
Using CSS for Image Borders (css)129
,
Making “IE6-Friendly” PNG8 Images (mis)128
, , ,
APNG—the Animated PNG127
,
RDFa and HTML Imagemap (kar/w3c)126
, ,
Misconceptions About PNG (chr/css)125
CSS Sprites: What They Are, Why They’re Cool, and How to Use Them (chr/css)124
, ,
PNG Transparency for Internet Explorer (IE6 and Beyond) (tel)123
, , , , , ,
Color Sampling and SVG Gradients (bur)122
, ,
Getting Started With Photoshop: Saving for the Web121
, , , , ,
The “longdesc” Lottery (div)120
, ,
Reviving Anorexic Web Writing (ali)119
, ,
Icon Design: Sizing (dav)118
,
Animated GIF Not Animating? (pau)117
, ,
W3C Sets Standard for Technical Illustrations on the Web116
,
Which Image Format Is Best (jus)115
, ,
My PNG Image Replacement Method (tel)114
, ,
Semantic Image Use (jch)113
, , ,
Accessible Alternate Content (lac)112
,
Lightbox JS111
, , ,
Ten Steps to a More User Friendly Website110
, , , , , , , , , ,
JPG Quality (dav)109
, ,
Alt Attribute (Alt Tag, Alt Tooltip) (ann)108
, , ,
From an Alt Point of View (the)107
, , ,
New Site Technology for Visually Impaired Surfers (zdn)106
, ,
GIF Hacking (dav)105
, , ,