Joined August 2015
- Tweets 2,840
- Following 3
- Followers 4,561
- Likes 49
1,645 Photos and videos
18 Oct 2024
👋🏻 This account has moved! You can find us on Mastodon at hachyderm.io/@fridayfrontend or Bluesky at bsky.app/profile/fridayfront…
1
2
438
18 Oct 2024
Plain Vanilla: "An explainer for doing web development using only vanilla techniques. No tools, no frameworks — just #HTML, #CSS, and #JavaScript." plainvanillaweb.com/index.ht…
443
18 Oct 2024
Today's lunch video is "Please, don’t use viewport units for font sizes" - "When people find out about #CSS viewport units, one of the first things they often do with them is create fluid type, but there are some problems that can cause." youtube.com/watch?v=G1buM51f…
487
17 Oct 2024
Recipes For Detecting Support For #CSS At-Rules: "The CSSWG decided in 2022 to add the prior at-rule() wrapper function. Two years later we don’t have a lot of updates on when it will be added to browsers. So, how can we check for support in the meantime?" css-tricks.com/recipes-for-d…
240
16 Oct 2024
#CSS Fan Out with Grid and @property: "A "fan out" animation involves sequentially revealing items from a stack with a bouncy effect. By using CSS grid, we save quite a bit of fiddly positioning work." frontendmasters.com/blog/css…
2
224
15 Oct 2024
A Local-First Case Study: "How I built a local-first #JavaScript app for planning trips, and what I learned about the current state of the local-first ecosystem along the way." jakelazaroff.com/words/a-loc…
206
14 Oct 2024
The Golden Ratio in #CSS: "In this tutorial, we'll re-create the Golden Ratio Diagram in CSS, using a few grid-declarations and some additional tricks." dev.to/madsstoumann/the-gold…
1
2
242
11 Oct 2024
I wasted a day on #CSS selector performance to make a website load 2ms faster: "I felt like Indiana Jones staring at the holy grail. And yet, the phrase 'CSS selector efficiency is not something to worry about in 2024' kept ringing through my head." trysmudford.com/blog/i-spent…
1
164
11 Oct 2024
Today's lunch video is "My process building websites from a design with #HTML & #CSS" - "It's a sped-up overview of my whole process, from setting up the project, interpreting the Figma design into code, and of course trouble shooting and problem solving." youtube.com/watch?v=Pj7wPjFR…
1
186
10 Oct 2024
Building the Perfect Logo Strip: "We can adjust the height of each logo based on its aspect ratio. If a logo is wider than it is tall, we'll reduce its height. The wider the logo, the smaller its height. This way, all logos maintain a visual balance." #CSS 9elements.com/blog/building-…
1
200
9 Oct 2024
Choosing a Masonry Syntax in #CSS: "Back in 2020, Firefox released a prototype for doing ‘masonry’ layout in CSS. Now all the browsers are eager to ship something, but there’s a hot debate about the best syntax to use." oddbird.net/2024/10/01/grid-…
3
172
8 Oct 2024
#WebComponents are not Framework Components — and That’s Okay: "The bottom line is, web components reduce the number of use cases where we need to reach for a framework, but complex large applications will likely still benefit from one." lea.verou.me/blog/2024/wcs-v…
1
176
7 Oct 2024
#CSS Split Effects with no Content Duplication: "But we can do something like this with no text duplication whatsoever… The trick here is to put the text fill, the text stroke and the progress area each on one RGB channel." frontendmasters.com/blog/spl…
199
4 Oct 2024
Redesign Case Study: "A few days ago, I published a new design for my website. In this article, I will discuss why I redesigned it, the process, and a few highlights from the design in general." #CSS ishadeed.com/article/redesig…
167
4 Oct 2024
Today's lunch video is about #CSS Masonry Layouts: "I hope I did justice to a complex topic people have *very strong* feelings about. I certainly tried to share both takes clearly and fairly." youtube.com/watch?v=3h6BCTgQ…
152
3 Oct 2024
Introducing TODS – "A new open source web typography project. The idea is to have a default #CSS file to set sensible typographic defaults for use on prose text, making particular use of the font features provided by OpenType." clagnut.com/blog/2433/
1
184
2 Oct 2024
New Values and Functions in #CSS: "The CSS Working Group released the first Public Working Draft for the CSS Values and Units Module Level 5. It describes the values and units and the syntax used for them, and it comes with some interesting new features." alvaromontoro.com/blog/68062…
163
1 Oct 2024
Solved by #CSS Scroll-Driven Animations: hide a header when scrolling down, show it again when scrolling up: "By adding a long transition-delay to a CSS property under certain conditions (which you can do using a Style Query), you can persist its value." bram.us/2024/09/29/solved-by…
2
195
30 Sep 2024
Orange You Accessible? A Mini Case Study on Color Ratio: "Join me as I qualitatively deconstruct why the white text on an orange button is more legible than the black text, despite what quantitative results such as contrast ratios would suggest." #a11y bounteous.com/insights/2019/…
1
164
27 Sep 2024
#SVG Coding Examples: Useful Recipes For Writing Vectors By Hand: "You’ll learn about asking the right questions to solve common positioning problems and how to leverage JavaScript so that, by the end, you can add 'SVG coding' to your toolbox." smashingmagazine.com/2024/09…
163