Sara Soueidan @SaraSoueidan Twitter profile | Pikagi

Pikagi

Sara Soueidan

@SaraSoueidan

121,623

Followers

230

Following

2,049

Media

73,294

Statuses

Inclusive UI/design engineer & speaker • Indie hacker • learn to create accessible websites in my course: • eco minimalist

Lebanon – لبنان 🇱🇧

https://t.co/DeJj3Q9m7U

Joined July 2012

Don't wanna be here? Send us removal request.

Pinned Tweet

@SaraSoueidan

Sara Soueidan

26 days

🧵 (Re)introducing the Practical Accessibility course: ✨ A comprehensive, self-paced, get-right-down-to-it video course designed to demystify web accessibility and equip you with the knowledge you need to create more accessible websites & apps today ⤵️

2

65

227

Last Seen Profiles

@FrancoisArnoux

@RealRodrigoPolo

@MansourSorosoro

@Lyrayne1

@Yasushita02

@HarpendenRUFC

@JAZZFM91

@stereo70

@kirimotty_byoon

@POWERZ__

@lupemelindres

@SockfaceSimpson

@Donostialdeatur

@DirectorAbuKhan

@MursaleenBestie

@Reed1777

@IsraeMbonyi

@devilkekko96

@KabirGoel

@Fulkery1

@Vitto2012

@renato_battista

@SAHS20Athletics

@AaronRothstein

@khnrubab

@yoonseot

@ChaleChipangura

@thabrrr

@Mainz05eSports

@i_5xc

@seeff2030

@Karassawa

@spholoke

@LuciferMStarVRC

@n4uor

@WorldPentathlon

@SaraSoueidan

Sara Soueidan

8 years

Dear men, This is how you greet a veiled Muslim woman (a Hijabi). Hand on your chest, not offering to shake hers.🙋🏼

Tweet media one

Tweet media two

945

20K

22K

@SaraSoueidan

Sara Soueidan

3 years

How it started vs. How it's going :: Home office edition 2011 vs. 2021 🐾 First steps into Web dev vs. 🏆 Award-winning engineer & speaker Always remember how you started. ❤️ Looking at these, I’m feeling a little too emotional & blessed/grateful right now. 😊🙏🏻

Tweet media one

Tweet media two

130

408

5K

@SaraSoueidan

Sara Soueidan

3 years

FRIENDS!✨ I'm excited to announce I'm working on an #a11y video course!🥳 🔜 Practical Accessibility: a get-right-down-to-it course for designers & developers who want to start creating more accessible digital products today 💌 Sign Up for updates 👉

254

957

5K

@SaraSoueidan

Sara Soueidan

3 years

If someone says front-end development is easy then I will 100% assume that they don't know/do front-end development well.

110

465

4K

@SaraSoueidan

Sara Soueidan

5 years

It’s been almost 5 years since I gave my first talk (at @CSSConf 💜) in 2014. 40 conferences over 5 years. I’m eternally grateful for each and every one of them. الحمد لله 🙏🏻😊 (and yes I do collect the badges; and they’ve gotten quite heavy ☺️)

Tweet media one

Tweet media two

Tweet media three

93

139

3K

@SaraSoueidan

Sara Soueidan

5 years

“a11y” is short for “accessibility”. That is all. This is my tweet. #a11y 👇🏻 Image via @mds

Tweet media one

77

818

3K

@SaraSoueidan

Sara Soueidan

4 years

34 🎂

Tweet media one

317

11

3K

@SaraSoueidan

Sara Soueidan

4 years

CSS is beautiful. CSS is powerful. Just the way it is. Put the time and effort in and you may "get" CSS _at least enough_ to not hate on it. Sincerely, A front-of-the-front-end developer.

102

298

3K

@SaraSoueidan

Sara Soueidan

5 years

If you’re a designer who cares equally deeply about beautiful colors and accessibility, you may find this tool (w/ 955 accessible color combinations!) indispensable: via @mrmrs_ #a11y #UI

24

733

2K

@SaraSoueidan

Sara Soueidan

5 years

I made a memoji 😅

Tweet media one

59

42

2K

@SaraSoueidan

Sara Soueidan

5 years

Hey @Twitter @TwitterDev please add basic markdown support to tweets? _word_ *word* `code` ..would make for a great start and can save us a few characters in a tweet. Plus tweets would look nicer formatted like that. Thanks!

51

406

2K

@SaraSoueidan

Sara Soueidan

5 years

I literally *never* use carousels on Web sites I visit. Never. Ever. And when I’m working on a project that requires building one, I feel sorry for the amount of time I need to dedicate for it.

124

296

2K

@SaraSoueidan

Sara Soueidan

5 years

I *love* working on the #UI side of the Web. I love that it’s the perfect sweet spot between design and engineering. I love that this sweet spot keeps both parts of my brain stimulated and inspired. I love that it’s what connects my work to the real ppl who will use it. I 💜 UI.

32

301

2K

@SaraSoueidan

Sara Soueidan

4 years

I'm old-fashioned. I like my CSS seperated from my HTML; my HTML seperated from my JS; my JS separated from my CSS. I like my JS layer only added when I need it, usually progressively. CSS added progressively on top of semantic markup. I don't fight the C in CSS, I embrace it.

88

273

2K

@SaraSoueidan

Sara Soueidan

4 years

I've been working with CSS for 7 years, authored a CSS reference, wrote countless articles on CSS... ...and I just googled the CSS `box-shadow` property syntax because I forgot which comes first: blur or spread.

79

217

2K

@SaraSoueidan

Sara Soueidan

3 years

"Boring avatars is a tiny JavaScript React library that generates custom, SVG-based, round avatars from any username and color palette." — These avatars are anything but boring! 😍

Tweet media one

Tweet media two

20

299

2K

@SaraSoueidan

Sara Soueidan

5 years

So apparently I was born 33 years ago today. 🎈

353

18

2K

@SaraSoueidan

Sara Soueidan

4 years

Fun Fact: it's been almost six years since I started working on the Web and I still suck at git. I get by, but deep down I am secretly hiding the feelings of incompetence and terror I have whenever I use it. 😅 And I "secretly" hope I'm not alone! 😂

207

115

2K

@SaraSoueidan

Sara Soueidan

7 years

Flexbox is not “The old layout technique” that is now “replaced by Grid” & used only as Grid fallback. Components 👉🏻 Flexbox Pages 👉🏻 Grid

38

669

2K

@SaraSoueidan

Sara Soueidan

3 years

This incredibly talented 7.5-year-old girl created a single-div CSS-only Panda and is sharing how she did it with the rest of the world 😍 My timeline's going to get even brighter from today on 💞

@diana_ashktorab

Diana

@diana_ashktorab

3 years

Day #79 -82 #100DaysOfCode WOW...I made a Panda in CSS using #singlediv 😃😎 I had to divide the video in 2 parts cause it was too long for twitter. I upload part 2 in another tweet tnx 4👍 Pen Link👇 #CodeNewbie #codeNewbies #GirslWhoCode #KidsCanCode

265

1K

6K

30

314

2K

@SaraSoueidan

Sara Soueidan

7 years

Repeat after me: I do not need to be an expert to speak at conferences I do not need to be an expert to speak at conferences I do not nee

42

411

2K

@SaraSoueidan

Sara Soueidan

5 years

This is a whole other level of Twitter. I am literally speechless.

Tweet media one

182

132

2K

@SaraSoueidan

Sara Soueidan

1 year

@TwitterBusiness This is almost what over-engineering looks like. Or.. over-designing? Over-thinking? Over-complicating? Whatever. You get the idea.

32

13

2K

@SaraSoueidan

Sara Soueidan

5 years

Create a blog and write for youself, not for fame or popularity. Good, relevant content gets noticed and shared eventually (and btw there’s no shame in promoting ur work whenever u can), but plz don’t refrain from blogging just cz u think ur content won’t become famous overnight.

42

308

1K

@SaraSoueidan

Sara Soueidan

11 months

@pjozefak I've worked remote for years before I could even afford a good setup. That's not a pro tip that's just an unpopular personal opinion. And a privileged one, might I say.

5

20

1K

@SaraSoueidan

Sara Soueidan

4 years

Who else isn't jumping on the HEY bandwagon?

256

13

1K

@SaraSoueidan

Sara Soueidan

2 years

Use semantic HTML.

40

161

1K

@SaraSoueidan

Sara Soueidan

5 years

It’s rare to find great UX in visa application forms, but @govuk ’s forms are really nice.. My favorite pattern is the one where, instead of asking you to retype your email, they display text telling you that an email will be sent to the address you just entered to recheck it.

32

210

1K

@SaraSoueidan

Sara Soueidan

5 years

This project! 😂

24

287

1K

@SaraSoueidan

Sara Soueidan

5 years

The more I build accessible UI elements the more I witness how friggin powerful semantic HTML is. Sure, I already knew how important it is but seriously accessibility is one of those things that make it SHINE! Writing proper HTML+CSS certainly is a very powerful job of its own.

22

236

1K

@SaraSoueidan

Sara Soueidan

5 years

CSS-only interactive widgets are, most of the times, inaccessible hacks. JavaScript is *required* to build certain components accessibly. Please don’t advocate CSS-only alternatives when JS is needed for accessible state/functionality. The Web has enough inaccessible UIs as is.

17

265

1K

@SaraSoueidan

Sara Soueidan

2 years

Writing "plain #CSS " instead of using some framework is not "idealist". It's a natural & practical approach to building Web sites *that just works* for many. If *you* NEED to use a framework knock urself out but don't patronize those who can do their work without one. OkThnxBye

36

170

1K

@SaraSoueidan

Sara Soueidan

6 years

Absolutely in love with these #CSS Houdini experiments 😍 (currently require latest Chrome) by @iamvdo Just when you thought CSS can’t get any more awesome. 🤩

Tweet media one

11

304

1K

@SaraSoueidan

Sara Soueidan

4 years

Whaaat! Today I learned that the <form> method attribute can take a "dialog" value which closes a <dialog> when the submit button is clicked: <dialog open> <form method="dialog"> <button>Confirm</button> </form> </dialog> #HTML5

Tweet card media

The form element

In this article you will learn how to use the form element, what attributes are available and how to style it.

funwithforms.com

25

256

1K

@SaraSoueidan

Sara Soueidan

7 years

I hate programming I hate programming I hate programming It works! I love programming! Sticker acquired. 😁✨

Tweet media one

25

353

1K

@SaraSoueidan

Sara Soueidan

5 years

If you use viewport units alone, you take away your user’s ability to zoom text in and out. *But* combining it with a fixed unit using calc() (e.g. `font-size: calc(16px + .3vw);` ) restores that ability and works just fine. #CSS #UX #a11y

26

233

1K

@SaraSoueidan

Sara Soueidan

7 years

There’s a special place in hell for services that require log in to unsubscribe from their newsletter.

41

315

1K

@SaraSoueidan

Sara Soueidan

7 years

Idea: reality show titled "Keeping up with the JavaScripts" Featuring lots of developers having identity crisis, flipping tables, etc

32

339

1K

@SaraSoueidan

Sara Soueidan

3 years

Dear designers, Please STOP. HIJACKING. MY. SCROLL! Thank you.

39

113

1K

@SaraSoueidan

Sara Soueidan

3 years

Why Tailwind Isn’t For Me #CSS

67

202

1K

@SaraSoueidan

Sara Soueidan

6 years

If you have a blog: please provide an RSS feed if you can. If you provide an RSS feed: please provide the whole post to read (in the RSS reader) not just a short excerpt. If you write but don’t have a blog: please start one, provide an RSS feed, and keep sharing what you love!

33

283

1K

@SaraSoueidan

Sara Soueidan

4 years

💁‍♀️ Quick #CSS tip: The `outline-offset` property accepts negative values, which can be useful for when you want to show an outline & avoid it cutting off or overlapping adjacent elements, such as focusable table (or grid) cells and rows.

Tweet media one

Tweet media two

24

146

1K

@SaraSoueidan

Sara Soueidan

7 years

How many ‘experienced’ devs out there find themselves learning the absolute basics every now & then that everyone else seems to know abt? 🙋

138

186

1K

@SaraSoueidan

Sara Soueidan

3 years

🙂

Tweet media one

39

35

1K

@SaraSoueidan

Sara Soueidan

5 years

“Programmers imagine the most ridiculous ways to enter a phone number into a form“ One of the best things I’ve seen in a while 😂 some of these ideas are amazing 😂 —

Tweet card media

Programmers imagine the most ridiculous ways to enter a phone number into a form

Programmers have been trying to make phone number entry forms that are as terrible and hilariously difficult to use as possible. And, so far, they've been succeeding.

29

408

1K

@SaraSoueidan

Sara Soueidan

5 years

I’m going to actively start using @firefox a lot more in my work from now on. The devtools alone are worth it, let alone the bigger cause.

63

122

1K

@SaraSoueidan

Sara Soueidan

4 years

Grid & Flexbox are a great duo. I reach for Flexbox when I need more controlled *space distribution*. I find myself reaching for Grid for 98% of my layouts — page layouts, component layouts, two-dimensional layouts, one-dimensional layouts. No rigid rules. Use what works. 💯

29

82

1K

@SaraSoueidan

Sara Soueidan

4 years

50% of my time writing #CSS is figuring out names for my classes. I’m not exaggerating.

89

83

1K

@SaraSoueidan

Sara Soueidan

5 years

100% This. This is why I don’t charge hourly.

@davygreenberg

D A V Y

5 years

If I do a job in 30 minutes it’s because I spent 10 years learning how to do that in 30 minutes. You owe me for the years, not the minutes.

452

37K

117K

16

120

1K

@SaraSoueidan

Sara Soueidan

5 years

So, people are arguing again about whether or not writing CSS and HTML is “programming”, instead of spending this precious time actually learning how to write these two languages properly and accessibly? Right. I really don’t miss Twitter at all.

21

114

988

@SaraSoueidan

Sara Soueidan

6 years

When you have too many great design ideas and you can’t just choose one of them @lynnandtonic ‘s Web site is goals and I am both jealous and super inspired right now 😍😍 #RWD

23

247

988

@SaraSoueidan

Sara Soueidan

3 years

33

354

984

@SaraSoueidan

Sara Soueidan

5 years

This is why I never wanna have to “upgrade” to the newer Macbook model. I also get to use the HDMI port for presenting without any needed adapters. Why would Apple take this convenience away from their pro users for aesthetic reasons? #UX

Tweet media one

113

70

978

@SaraSoueidan

Sara Soueidan

5 years

Hello, world! 🙋‍♀️ Did you know that you can create amazing Photoshop-grade effects right in the browser using #SVG Filters? Why yes you can. 🔥 I’ve written a series to get you up and running w/SVG filters @codrops and the first article is now out ✨ 👉🏻

Tweet card media

SVG Filters 101 | Codrops

CSS currently provides us with a way to apply color effects to images such as saturation, lightness, and contrast, among

12

264

961

@SaraSoueidan

Sara Soueidan

5 years

Unpopular <opinion>: I prefer the JS syntax prior to ES6. Fat arrows? Not a fan. I still write `function()` and think it is way more. Minimal syntax does not automatically lead to more readable code. But hey this is just my </opinion> *ducks*

142

71

950

@SaraSoueidan

Sara Soueidan

7 years

Using #SVG as image placeholders — more image loading techniques: I LOVE this! I’ve been mentioning this kinda stuff in my talks lately but this article is taking it to the next level with all these techniques. Lovely examples, too!😍

4

277

945

@SaraSoueidan

Sara Soueidan

3 years

It's sad how we've come to a time when loads of unnecessary frameworks has become "cool" and is normal yet the mere mention of jQuery almost causes shame. I saw a video of someone apologizing for saying jQuery is nice! How did we come to this?

82

86

951

@SaraSoueidan

Sara Soueidan

4 years

I’ve been wanting to add a bird-y touch to my Website for a long time. So, my <hr> elements don’t look like your typical horizontal rules anymore 🦜 (still WIP, will go live this week)

Tweet media one

47

29

930

@SaraSoueidan

Sara Soueidan

7 years

This sticker! 😍 Does anybody know where I could get one from? 😄

Tweet media one

13

339

916

@SaraSoueidan

Sara Soueidan

3 years

A good collection of native HTML and CSS replacements to otherwise common JavaScript-implemented features/behavior:

Tweet card media

HTML and CSS techniques to reduce your JavaScript

More and more websites are relying on JavaScript for the interactions they provide. It enables pleasant experiences but also comes with undesirable effects: Longer page load times Page is unusable...

calendar.perfplanet.com

13

180

904

@SaraSoueidan

Sara Soueidan

2 years

I think designers underestimate just how good, usable, inclusive, & sometimes even refreshingly delightful "boring" design is. - Visible labels & instructions. - Link underlines! - Good text contrast. - Lists! - Links! (to separate pages vs. modal dialogs) Usable > aesthetic.

33

196

915

@SaraSoueidan

Sara Soueidan

9 months

Stop re-inventing the wheel and just use <button> to create a button. If you're worried about default button styles, use `all: unset`. This one line of #CSS will strip all default browser styles so you can apply your own.

@EmmaDawsonDev

Emma Dawson

9 months

Last night I was watching a conference talk called how to make accessible react components and the first piece of advice was to use aria roles like this <div role=button>click</div> 😭 Please don’t do this.

40

49

469

23

195

913

@SaraSoueidan

Sara Soueidan

4 years

#newProfilePic bird mom life

Tweet media one

27

6

906

@SaraSoueidan

Sara Soueidan

3 years

I just installed Fig, and I like it: It “adds VSCode-style autocomplete to your existing Terminal.” It can do a lot, and there’s more exciting stuff on the roadmap. I think it’s going to become an indispensable tool in my workflow.

Tweet media one

19

121

890

@SaraSoueidan

Sara Soueidan

5 years

- understand the box model - the cascade is your friend! - nest as little as possible - use one of the available methodologies (ITCSS, BEM, etc); ur future self will thank you - document hacks - don’t be afraid to use shiny new features as enhancement! Don't waitfor cross-browser

@ppk

ppk.css 🇪🇺

5 years

OK, let's start with a simple one. Please tell me your favourite tip or trick that you give to beginning CSS programmers.

210

79

361

19

165

882

@SaraSoueidan

Sara Soueidan

5 years

I can’t count the number of times I’ve ditched an idea for a side project because I thought it wasn’t worthy, only to see someone else do it after a few months and find out what a great idea it is/was. One of my personal goals is to stop underestimating ideas & creating more.

21

89

875

@SaraSoueidan

Sara Soueidan

7 years

Never used any frameworks, never will. Writing CSS from scratch is one of the best pleasures of building front-ends in my opinion. ✨

@smashingmag

Smashing Magazine 🇺🇦 🏳️‍🌈

7 years

Do you use any framework when writing CSS/JS today? If yes, which one? Bootstrap, Foundation, or another one?

180

49

108

89

166

885

@SaraSoueidan

Sara Soueidan

2 years

Here’s a recording of how VoiceOver on Firefox announces the credit card number field in the Paddle checkout form (audio on to listen) =)

@SaraSoueidan

Sara Soueidan

2 years

@kilianvalkhof @PaddleHQ Using placeholder without a label on the credit card field for example has the screen reader say "kisses kisses kisses kisses" (cz the placeholder is xxxx-xxxx-xxxx-xxxx) instead of "credit card number" 😅

6

65

338

36

211

876

@SaraSoueidan

Sara Soueidan

4 years

If you write technical articles, please add a publish date to the article. Too many articles contain outdated information & I see people being misinformed because of that. If you write technicla articles, PLEASE INCLUDE A PUBLISH DATE. Thank you!

32

201

877

@SaraSoueidan

Sara Soueidan

5 years

I’m in love with everything about the Inter typeface including the gorgeous minimal web site, the detailed documentation, available font styles, font file options (variable font included), and everything in between. 👏🏻👏🏻 @rsms

19

125

856

@SaraSoueidan

Sara Soueidan

3 years

The South African government actually created its own browser just so that their Flash web forms would work again, instead of converting those forms to simple web-based HTML forms. 🤯

86

271

857

@SaraSoueidan

Sara Soueidan

5 years

While `aria-label` might be the most popular way to add an accessible label to buttons, it is certainly not the only way. ✏ On the blog, I wrote about the different ways you can make your icon-only buttons accessible: ✨ Accessible Icon Buttons ✨ #a11y

Tweet card media

Accessible Icon Buttons

– The personal website of Sara Soueidan, inclusive design engineer

www.sarasoueidan.com

25

248

848

@SaraSoueidan

Sara Soueidan

5 years

#TIL that removing list bullets with `list-style: none` removes <ul/ol> semantics in VoiceOver. Adding zero-width space fixes this; so this is yet another thing to add to our base #CSS files. #a11y via @scottohara @rogerjohansson

31

257

833

@SaraSoueidan

Sara Soueidan

7 years

I don’t know what to love more: the guide itself or its beautiful minimal design 😍 #CSS #cssgrid

Tweet card media

Test, learn, and build with Firefox DevTools

Learn about CSS Grid Layout, Firefox Debugger, and more with the Firefox DevTools playground.

mozilladevelopers.github.io

10

256

820

@SaraSoueidan

Sara Soueidan

3 years

[Thread] I don't normally quote-tweet like this but I am so unbelievable sick and tired of people devaluing front-end development and treating it like it's a premature thing that anyone can do if they are "advanced". 1/n

@tobi

tobi lutke

3 years

@beaulne 100% there should be no such thing as a front end developer outside of super junior contexts. All developers need to think across all the layers that they build on to be effective.

175

30

406

31

134

812

@SaraSoueidan

Sara Soueidan

8 years

Mind blown: Using viewport units to create a #CSS -only scroll indicator! 😱 by @MikeRiethmuller This is BRILLIANT!🔥

15

319

813

@SaraSoueidan

Sara Soueidan

3 years

Monday trivia: In Arabic, you don't just say "Goodnight". 🌙 You say "تصبحون على خير" which translates to: "May you wake up to good news". 💝

12

52

790

@SaraSoueidan

Sara Soueidan

2 years

Remember jQuery? jQuery was great.

64

29

781

@SaraSoueidan

Sara Soueidan

4 years

It's been years since the last time I used jQuery. I'm currently using it to quickly prototype ideas for an MVP. Seriously, it is still easily one of the best tools ever made for the Web. I miss its convenience! 😆

58

39

780

@SaraSoueidan

Sara Soueidan

5 years

Accurate 😂

@tlakomy

Tomasz Łakomy

5 years

Developers when asked to estimate a project:

Tweet media one

43

1K

4K

11

130

771

@SaraSoueidan

Sara Soueidan

4 years

Grateful for each and every one of you who's checked in on me and my family and sent good thoughts, prayers, and well wishes. 🙏🏻 I feel lucky to be a part of this community. Thank you. 🖤

46

10

777

@SaraSoueidan

Sara Soueidan

3 years

I wrote a little post about how I styled my <hr> elements (the birds on the wire), and how we can create more creative yet properly semantic horizontal rules using inline #SVG , #CSS custom properties & a bit of ARIA: “Not Your Typical Horizontal Rules” 🐦

Tweet media one

20

112

764

@SaraSoueidan

Sara Soueidan

3 years

While we're at it: if you don't have a Web site of your own and you've been blogging and creating content on third-party platforms, now might be a good time to reconsider creating one and owning your own little corner of the internet. 🔑

16

187

750

@SaraSoueidan

Sara Soueidan

3 years

This is so accurate it almost hurts just looking at it 😅

9

111

746

@SaraSoueidan

Sara Soueidan

4 years

I’m working on a Web site that has an RTL version. This is where #CSS logical properties truly shine as they make styling both LTR & RTL possible using the same declarations. Fewer overrides & overall less code.🙌🏻 Demo: More info:

Tweet media one

21

121

743

@SaraSoueidan

Sara Soueidan

3 years

“Google Fonts resources will be redownloaded for every website, regardless it being cached on the CDN. Self-host your fonts for better performance. The old performance argument is not valid anymore.” 👍🏻 Learned this a long time ago from @zachleat ’s work

Tweet card media

Time to Say Goodbye to Google Fonts: Cache Performance

This browser caching change kills the utility of cross-site resource CDNs like Google Fonts.

13

186

750

@SaraSoueidan

Sara Soueidan

4 years

"Compared to other web development areas, front end is easy" me:

30

123

743

@SaraSoueidan

Sara Soueidan

5 years

*wishes not all tools were React-dependent* Some dude who apparently relates to React on a very personal level: NO YOU’RE WRONG STOP TRYING TO BE A VICTIM AND EMBRACE THE NEW WEB ORDER REACT IS THE ONLY GOOD THING ON THE WEB ACCEPT IT OR GO HOME.

64

56

733

@SaraSoueidan

Sara Soueidan

5 years

Did u know that some browsers make ”an educated guess“ to determine if a <table> is a data table or a layout table? That affects whether or not it is exposed to #a11y APIs. “Browsers look at the number of rows, columns & if the rows alternate in color”!!

Tweet card media

When is a table a table?

An example set of tables that the browser will decide if it's a data or layout table Based on the findings of @edds...

26

244

734

@SaraSoueidan

Sara Soueidan

4 years

That feeling when you visit a Web site and it looks just a little too similar to yours. You inspect the code and oh to your surprise you find your exact HTML (including class names) copy-pasted. I should be flattered, right? 😅

62

12

718

@SaraSoueidan

Sara Soueidan

5 years

How often do we get to describe a UI/UX as being cute?! Not often enough. 😍 Delightful 💜

@round

Maxim Leyzerovich

5 years

Incredible attention to detail & delight by the @LyftDesignTeam .

26

229

2K

7

99

716

@SaraSoueidan

Sara Soueidan

4 years

I feel this bird

14

78

706

@SaraSoueidan

Sara Soueidan

7 years

If you're asked to speak at a conference, the organizers *must* cover *at least* your travel, accommodation & transportation costs. Period.

39

143

690

@SaraSoueidan

Sara Soueidan

1 year

@TwitterSupport How about you hear us when we say we don't want our default timelime to be the "For You" timeline? We'd appreciate that much more than moving some numbers from to right.

9

28

684

@SaraSoueidan

Sara Soueidan

6 years

If you want to use #CSS `object-fit` (+ `object-position`) to crop & scale images to but need to support IE too, #SVG might just be your answer. ✏️ New blog post ✨ about the SVG snippet that can replace a CSS `object-fit` declaration:

Tweet media one

20

166

686

@SaraSoueidan

Sara Soueidan

4 years

#TIL that a horizontal rule (<hr>) is announced by screen readers (announced "horizontal splitter" in VoiceOver), so unless it is a _semantic_ thematic break between paragraphs of content (i.e. not just visual decoration), u’ll want to hide it using `aria-hidden = "true"` #a11y

12

160

686

@SaraSoueidan

Sara Soueidan

1 year

If you're overthinking, write. If you're underthinking, read.

21

112

674

@SaraSoueidan

Sara Soueidan

7 years

Me at conferences

Tweet media one

28

93

662

@SaraSoueidan

Sara Soueidan

2 years

My nephew is studying HTML and CSS in college. When he was telling me about it, there was a sparkle in his eyes when he told me that he can learn HTML by using a thing called "Inspect / View Source" in the browser. ✨ Now if only modern tools didn't ruin this for him.

18

24

666

@SaraSoueidan

Sara Soueidan

7 years

Did u know that #SVG comes with a conditional element allowing u to set a fallback for non-supporting browsers? ⬇️ from SVG workshop slides.

Tweet media one

22

260

664