Alena Nikolaeva
@alenanik11
Followers
8,054
Following
713
Media
1,516
Statuses
8,600
product designer at @github Copilot • studying Computer Science • giving a 🦆 about accessibility • former SWE @typeform @xata @trivago
Valencia, Spain
Joined January 2019
Don't wanna be here?
Send us removal request.
Explore trending content on Musk Viewer
無課金おじさん
• 326003 Tweets
Be Mine
• 219754 Tweets
バニーの日
• 115448 Tweets
日経平均
• 43932 Tweets
Shanik
• 43875 Tweets
ユアネクスト
• 40404 Tweets
ヒロアカ
• 37420 Tweets
僕のヒーローアカデミア
• 36708 Tweets
赤の救助隊
• 34850 Tweets
NISA
• 28532 Tweets
ダンジョンの中のひと
• 24042 Tweets
パンツの日
• 23443 Tweets
#يوم_الجمعه
• 18251 Tweets
八村離脱
• 17389 Tweets
長岡花火
• 16885 Tweets
雇用統計
• 15357 Tweets
Hayırlı Cumalar
• 15270 Tweets
ポケダン
• 14785 Tweets
PRABOWOtahu YangTERBAIK
• 13248 Tweets
YESkeren BANGETkerjanya
• 12685 Tweets
#viento
• 11576 Tweets
ダイエットボイス
• 11573 Tweets
Pinned Tweet
Espectacular acogida, los regalitos, la cena, la comida y un privilegio ser potente en
#bilbostack24
hablando de accesibilidad.
(Y la mejor foto que me han hecho durante la charla)
❤️
3
4
80
Thanks,
@lifeofablindgrl
for inspiring me to write my first article on accessibility.
I decided to put together what I have learned so far about modals and small changes that help others ☺️
#a11y
10
46
258
I had no idea that it's possible to quickly check the focus order of the page without tabbing through everything
Firefox -> Accessibility -> Show tabbing order
🤘
2
80
256
Me preparo un tweet de a11y y tiene 3 likes, pero una foto de hoodie 1500 😳 Algo está mal
23
3
223
#Vuejs
is the best thing that I’ve used to far. Ao great to see that such a giants are using it in production
6
26
139
- hola, no subas que bajo yo
- hola eres rusa?
- si, por?
- se ve se ve
… (yo agobiada)
- usted está muy linda
….
- malos tiempos para ser rusa
- … (yo pensando en mi sándwich)
- hasta luego
@UberEats
no salgo de casa, pero podemos pedir comida sin acoso? 😣
14
14
122
Alternative techniques for emphasis in the text 👇
All major screen readers ignore both the <b> and the <strong> elements, at least in their default configuration
Here is another way to create emphasis:
- add an "important" or alternative word
- don't emphasize
#a11y
4
29
115
Comprehensive colour palette generator + accessibility for free 🙌😍
1
30
106
I will be starting at
@typeform
next week and I still can’t believe that this is really happening 🙈🙌🏻
Getting ready for the ride 🤟🏻
30
0
109
From time to time I'm adding style guides and handbooks for devs to my collection, just to see some good coding practices and create documentation 💁🏼♀️
This is a yearly recap ✨
Markup HTML:
Google HTML/CSS Style Guide
HTML Gitlab
8
24
98
Honestly, I just wanted to give Chakra UI a quick try but ended up rebuilding my blog in a couple of hours
(I'm still using
@nuxt_js
content)
Check out
@chakraui_vue
they are doing an awesome job on accessibility💪
2
14
92
I was going over the specs for links purpose and common failures, so here are some good practices for making links accessible 👇🏻
Many examples in a thread ✌🏻
2
27
89
Unpopular opinion: language names should always be in their own language
14
8
90
Wearing curly { } braces earring gives you super powers while coding ✨🌟
#GirlsWhoCode
#WomenWhoCode
6
10
84
✨check keyboard interaction and focusability✨
- use Tab 👉 to move from one focusable item to the next (links, buttons, form controls, text edit, etc.)
- add Shift to reverse the direction 👈
- use Enter to activate a link or a button
- Space to toggle element state (checkbox)
4
13
88
Unpopular opinion: pressing Enter key gives me a lot of anxiety when writing a message. Sometimes it would send the message, other times it allows you a new line. Can we all agree?
15
10
82
I finished “Hocus :focus”, a keyboard accessibility horror game, in 01:28:69.
1
12
81
Accessible markup patterns and components 🧱 🔗
aria-modal-dialog documentation is just lovely! Saving it for learning
2
17
70
Do we have any purple framework coming soon? So ready for it
🔮👩🎤🌸
#GirlsWhoCode
#purplehairdontcare
7
1
66
I have a flight tomorrow, so It's probably a great time to write a new article on
@ThePracticalDev
🤪
Now that so many new people are starting their accessibility journey and I thought it would be helpful to put together a non-technical introduction 💁🏼♀️
1
23
67
I was following the
@sarah_edo
advice to paint all of the scenes on paper, then draw an SVG and then code a timeline.
Here is little "painting" of a bee that shakes lavender 🐝🌿
Third weekend with
#greensock
. Can't wait to draw SVG plugin
#VueJS
2
7
67
✨I’m on the dev advent calendar today giving away some a11y presents 🎁✨
📢 Bienvenid
@s
al "calendario de aDEViento" 2021!
🗓 Día 15: Alena Nikolaeva es desarrolladora frontend y accessibility advocate.
🎁 Nos regala los libros "Accessible Vue" y "The bootcampers guide to web accessibility"
🎟 Participa haciendo RT 🔁y siguiéndola ✅
@alenanik11
6
230
163
6
11
64
The effect of CSS on screen readers
(tested 🤓 and there are a couple of interesting takeaways here)
2
15
64
I could have said that 2021 was full of cool experiences: many projects, podcasts, conferences, working at Trivago, meeting incredible people ✨
But another side is, my grandfather has died, I got divorced after 8 years of marriage, and I haven't seen my family for 2 years 💔
18
0
64
Friendly reminder that accessibility starts in design phase and this guide is just lovely.
Screen reader UX and how to document this for your component step by step ✨
0
12
62
Something happened 😎
thanks to
@midudev
I’ve got my little interview published by
@TalentHackersES
Accessibility, bootcamps and things (spanish 🇪🇸)
I’m mentioning talented women
@conchaasensio
@dianait_
and
@_martattack
to be interviewed next 🙋🏼♀️
3
6
62
Feeling incredibly lucky during these first weeks at Typeform as a developer!
Design deliveries that contain roles, aria-labels, keyboard navigation sequence, reflow, landmarks, and color contrast specs 🙌
Everyone in a team is aware of a11y and truly cares ❤️
5
0
61
It’s been a year at
@github
The time flies, but there is always a moment to appreciate all of the good things ❤️✨
6
0
60
Here is what happened ☺️ I have written another article on
@ThePracticalDev
talking about headings, screen readers and specs
Check it out 👇
#a11y
1
13
57
"inert" HTML attribute that allows blocking or restoring the keyboard interactions, just like aria-hidden and tabindex would do when combined
A polyfill 👉
More on inert and focus management 👉
#a11y
2
15
55
Si me preguntáis que hago despierta a las 8 y en el tren, pues me voy al
@T3chFest
. Llevo pegatinas de GitHub, aviso ⚠️
6
1
55
Así me he despertado, estoy en tercero 🤯
Pero si empece la carrera "ayer" 🤯
8
0
57
If you ever came across x for close button in tutorials (or real projects 🤨) 👇
x is a multiplication sign, so it will be announced as "times" and give no information about close action.
If you need to do something fast, just use "close" instead of x
💁🏼♀️ common sense
#a11y
tip
3
15
56
Twitter is not Instagram but the place I worked from today is gorgeous 😍
4
1
54
✨ ::before ::after and accessibility ✨
Assistive technologies may not be able to access the information that is inserted using CSS.
Pseudo-elements should only be used for decorative styling and not to insert text content that adds meaning to a webpage ✅
#a11y
☕️
1
12
56
I’ve made a tiny CSS counter and it’s my birthday 🥳
Happy Sunday! 👻
27
2
52
341.5 months
1512.1 weeks
10585 days
29.0 years on Earth 🥳🎈
21
0
52
✨Use aria-label to give a "dummy" link meaning✨
aria-label gains preference even over the "native" link text, it replaces it with whatever you put inside aria-label
"The aria-label text is not extra information.
It is the ONLY information"👆
so... write a clear copy✅
#a11y
2
16
52
@kike_moris
En la entrevista no le constaste sus funciones, no le quieres enseñar y te ríes de una persona que se sacó una ingeniería o un ciclo por twitter 😨 muy triste esto
1
0
51
If you need to emphasize the word or break the text, VoiceOver on iOS and macOS will read every "chunk" of it 🤨
To fix:
1) convince your designer and don't break the copy
2) add an aria attribute with the role="text" (but not the parent itself) to remove semantics ✅
💁🏼♀️
#a11y
2
21
50
In a couple of weeks, I'm starting my master's degree in UX/UI design and it'll be a new chapter! ✨ Can't wait to see what's on the other side of Figma 🚀
3
0
48
It seems like I'm going to be talking about accessibility and CSS at CSS Conf Colombia
@cssconfco
in April, so make sure to grab your ticket 💛✨🌈
#a11y
💁🏼♀️
7
3
49
Day 38
#100DaysofCode
Officially started my very first web developer office job! Couldn’t be more happy, but I can’t share as much here about my coding journey. Hope to finish redux saga tutorial on the afternoon🙃
#developer
#girlswhocode
#frontend
6
5
46
An example of <TitleAnnouncer /> component to handle page title accessibility in single-page applications ✨
- listens for page changes
- stores the page title renders it in a visually hidden paragraph which gets focused
#a11y
☕️
3
8
45
I got my first PR merged yesterday, to GitHub GitHub 😭
Taking a little break from Figma and remembering good old days.
P.S. designers should code, and polishing is not just UI, it’s quick a11y fixes when you can and polish semantics.
3
1
46
Queda poquito hasta la charla, curando nervios con los caramelos que reparte
@baumannzone
en la planta 1
#t3chfest2023
4
2
46
Just 20 line of JavaScript and you get this adorable sticky cursor, how cool is that? ✨
Made this one after browsing through gsap forums
Greensock 💜
#VueJS
#svganimations
#gsap
2
7
46
I talked a lot about astigmatism, dev tools and
#a11y
together before. Still many of the tools I try and immediately quit are the ones that don't allow me to adjust colors to help my vision and let me spend some hours working with those tools.
It's a crucial selling point 👩💻
2
10
46
Tips for making your README accessible and building good habits for .md files
1
12
44
Slides 💥
Didn't find a more accessible way to share them but you can download them in PDF. Lots of love to
@T3chFest
and all of the people behind the screens ❤️
3
9
44
✨ accessibility and background images ✨
☝️The background image does not add any information to the page, so it does not need to have alt text.
However, if there is a case when you need to provide the context, you can do:
✅ aria-label
✅ visually-hidden magic tip
#a11y
4
9
44
🎉 I'm coming to
@T3chFest
in March!
Thrilled, excited, and grateful to have space to talk about accessibility, startups, desdev, and all of the good stuff this year 🍭
(Dejo de comer dulces ya, dicen que la camara engorda)
8
0
44
it's the second time I've been asked this week why my GitHub timeline is so empty these days
full and green contributions graph on GitHub does not represents you as a professional 💁🏼♀️
3
8
42
I like SCSS better than styled components, throw tomatoes at me
5
0
40
Good news today: my problem-based study about buying airline tickets with screen reader will be included in a compendium of case studies to be published on the IAAP Nordic website 🥳
5
3
42
Duplicating your own Figma file feels like:
(I’m the one with ponytail)
4
1
41
What Tailwind has to do with accessibility? 👇
"HTML isn’t for saying what things look like, because HTML is for EVERYONE including the non-sighted"
3
6
39
Beautiful project ✨
A collection of innovations by women in the fields of computer science and technology.
1
24
40
Just watched
@DavidKPiano
's workshop on State Machines and I'm actually exited about the learning curve that statecharts have 😎
This is the workshop and it's not scary ✨ ✨
1
2
40
Not tech content: yoga retreat in Alicante is a must-do once in a lifetime 🍊🧘🏼♀️
2
0
40
Roses are red, violets are blue,
Module parse failed: \sass\index.scss Unexpected character '@' at line 2
2
6
36
Y si todos actualizamos nuestras webs personales describiendo el propósito de un enlace? 🙏
<a href="link">Apúntate aquí</a>
<a href="link" aria-label="Suscríbete a mi newsletter de contenidos y recibe información actualizada">Apúntate aquí</a>
Cosas de
#a11y
que veo y sufro
3
2
37
Me han hecho manspaining en la PR 15 veces, con risitas además. Vuestra mañana que tal? 😮💨
12
0
38
Day 4 Of
#100DaysOfCode
on Weekends
Got back to writing tests (Enzyme and Jest) and did a few tutorials on Next. Very interesting concept, server-side rendering, same jsx, redux and it's faster. I guess, it makes sense to try to build something cool with it😈
#js
#react
#frontend
0
5
36
Santa brought a book earlier this year 😍
Against Technoableism by Ashley Shew
7
3
38
Career: Typeform -> Xata -> GitHub
Trips: Alicante, Praga, Praga, Madrid, Barcelona, Zaragoza, Madrid, Greece, Praga, Morocco
Studies: University -> Master’s
Sport: yoga, surfing, climbing 😱
Tattoos: +2
Books: 1,5 written
Cried: many times
Been happy: even more
#2022
4
0
38
So the internet connection has been lost 2 times, but at least I didn't get any parcel during the talk 😂
✨Thank you
@cssconfco
for having me talking about accessibility at CSS conference! You are awesome! 🥰
And I couldn't have better friends in a chat (and my mom) 😄
3
4
37
🌈 Funkify is an extension for Chrome that helps you experience the web and interfaces through the eyes of extreme users with different abilities and disabilities.
Simulate sunshine on the screen, blurry vision, and dyslexia 🙌🏻
@Funkifyplugin
#a11y
☕️
3
19
36
Years ago I wanted to be in tech community for JavaScript tips and stickers. Today I’m here for friends, supporting juniors and to exchange a11y and inclusivity learnings. ❤️
2
0
37
... the design system can provide an architecture for building user interfaces at a product level, but doesn’t necessarily provide literally every solution for every single component or interface problem a product team may encounter 👆
✎ Design systems are for user interfaces:
In this post, I talk about how I've recently refined my definition of "design system" to reflect some hard-earned lessons.
5
71
320
2
6
36
One of the tools that I use the most for accessibility debugging ❤️
Drag this thing to the bookmarks bar and it'll log out the element that you are currently on if the focus outline is not visible 💁🏼♀️
#a11y
🛠
👉
1
3
36
Esto me hace MUCHÍSIMA ILUSIÓN 🥹❤️ es el segundo año que doy una charla en el día de accesibilidad y me emociono de pensarlo, y la suerte que tengo de estar rodeada de gente que organiza eventos tan importantes.
📣🕸️Día de la Accesibilidad Digital en la
@UA_Universidad
💡 Con
@visanju
y
@alenanik11
🗓️ Jueves 16 de mayo a las 10h
🖥️ Presencial y en línea
💁🏻♀️¡Inscríbete ahora!
2
13
28
2
7
37
There is nothing more satisfying than defining bases for a new fresh design system. I would do design systems for free, crazy in love with building the foundation and thinking about things 🧱
3
0
36
I’ve been wanting a wooden desk and a little bit more light for the working area for some time now 😌
#setupUpdate
3
0
36
Day 43
#100DaysofCode
Started to learn how React and Firebase work together👩🏼💻 Also I’ve met two amazing developers. Only half an hour talk and we learn so much from each other! I’ve never seen any other community so supportive and kind 👯♂️👯♀️
#developer
#CodeNewbie
#GirlsWhoCode
1
2
33
Accessible vanilla.js ARIA tab switcher by
@marcysutton
👉
Such a great illustration of progressive enhancement concept from her FEM course 👏🏻
#a11y
☕️
2
5
36
Surviving guide for burned out folks:
- Talk to people who won’t judge you and have been at the same spot as you (there are no superheroes).
- Stay away from computer after work
- I mean it, don’t open a single mail or YouTube
- Go outside even if you don’t feel like it🌳
1
11
36
A birdie left has brought something for me today and now I’m a humble
@tinybirdco
fan wearing cute sweatshirt 🐦😭❤️
Speed wins and their CSV import too. Check it out!
5
2
35
Acabo de leer la frase “Yo antes era bastante nazi con el tema de la accesibilidad”. Y no es la primera vez que lo escucho, incluidas desde el escenario de las conferencias tech. Ese término no debe existir en 2024.
4
3
35