Blog(Page 1 of 16)

  1. A tablet has two hands hovering it with a measuring tape.

    Responsive video - How can we reduce the size of video content served?

    How can we reduce the size of video content served? How do you load the best fit video for a device - not too big, not too small?

  2. The Logrocket brand rocket icon sits in the center with an external link arrow beside itPublished on LogRocket

    Dynamic CSS animations with the linear() easing function

    Implement more dynamic CSS animations with the linear() easing functions, and explore the role that other easing functions play in animations.

  3. Three obliquely overlapping sheets of paper lie on a peach background. Each sheet has a pastel color. The top sheet features a rss logo and some yellow sparkles. It looks joyful.

    My RSS feed has been upgraded ✨

    I did some integration work to include posts written for other publications in my RSS feed. Apologies if you see some duplicated items! 📪

  4. A redesign of the Adobe Creative Cloud app using glassmorphism. The window is semi-transparent and shows the background underneath in blurred fashion. It has a side panel with the categories: apps, categories, fonts, and resource links. The central area shows all the apps installed. The design is very eye catching.

    The backdrop-filter CSS property has been unprefixed

    The backdrop-filter CSS property required a prefix in Safari since forever. Not anymore! 🙌

  5. A file with the label 'CSV' and an excel-like table as its content is in the center of the frame. It is cast againt a soft purple background with the eleventy possum floating beside it on a balloon.

    Eleventy - Add CSV data file support

    It would be cool to be able to drop a CSV file into a project and use it in a page. My motivation was to show bookshelves from my library database

  6. A question mark sits above a background with a gradient that goes from the top left corner to the bottom right corner. The gradient goes from dark to light colors, and features the orangeish hues of the CSS Tricks branding in the lighter half.

    Is CSS Tricks back?

    There are signs that CSS Tricks is being revived after being dormant for over a year.

  7. A section of a machine is exposed with a series of cogs showing. At the bottom is a RSS icon and at the top is a symbol for an array. It is cast againt a soft purple background with the eleventy possum floating beside it on a balloon.

    Eleventy - Convert a RSS Feed to a collection

    I want to create an archive of all my writing. One source is the author RSS feeds of blogs I wrote for. How about I turn it into an eleventy collection?

  8. A mobile phone with google's homepage is in the center of the frame. A bar chart is overlaid with 4 descending red bars. An arrow with a downward trajectory is above it. Everything is tinged in red.

    Is Google’s search algorithm hurting smaller websites?

    I noticed an abrupt, large drop in traffic to my website from Google towards the end of 2023. I was wondering why. Am I the only one?

  9. The Logrocket brand rocket icon sits in the center with an external link arrow beside itPublished on LogRocket

    CSS breakpoints for responsive design

    We discuss the role of CSS breakpoints in responsive design, reviewing different methods of choosing breakpoints and some best practices.

  10. Two different coloured strands of a mesh are twisting together in the center of frame. This is cast againt a soft purple background with the eleventy possum floating beside it on a balloon.

    Eleventy - Merge data with an existing collection

    I wanted to make an archive of my writing, merging content I wrote for other websites with my exising ‘posts’ collection. Here is how I did it.