Journey to the Frontend👩‍💻

Ну всё, теперь landlady ✨ Скоро канал будет Приключения на Даче 🏯🤩

Привет всем 😉 Наслаждаетесь весной?💖🌷 Изучила тут вопрос, как оптимизируют сайты для нейронок, чтобы они попадали в выдачу. Для этого есть Generative Engine Optimization, или GEO-оптимизация. Лучшим фундаментом для GEO будет отличная SEO оптимизация, а дальше уже совместная работа SEO-спеца и разработчика. Важным фактором для LLM является EEAT (Experience - Expertise - Authority - Trust). Разработчик создает инфраструктуру, которая помогает редакторам создавать богатый знаниями контент для LLM и проинформировать LLM-краулер, что на сайте есть стоящая информация за небольшое количество токенов😉 ✨Чек-лист для разработчика: ❣️Видимость сайта для AI-краулеров. Проверяем HTTP-заголовок X-Robots-Tag, не должен быть no-index или none. ❣️Проверить robots.txt на директивы Disallow: / и добавить явно Allow: для конкретного AI-краулера, учитывая, что есть имена для обучения и для real-time поиска. Индексация нужных разделов, закрываем служебные (admin) ❣️На том же уровне создаем файл llms.txt и заполняем название сайта, описание и список ссылок на важные страницы в формате markdown. Это новый стандарт, уже поддерживается OpenAI, Perplexity, Anthropic ❣️Семантические теги, заголовки, даты, нумерованные и маркированные списки, это llm-ки очень хорошо парсят. ❣️Метатеги в head для llm, для улучшения показателей EEAT автоматизируем данные в метатегах, также используем Open Graph данные. ❣️Автоматизируем поля в CMS, что можно было заполнить инфо о сущностях и оборачиваем микроразметкой. ❣️Устранить базовые ошибки: битые ссылки, неправильные коды ответа, медленную загрузку. ❣️Ключевой контент должен быть доступен сразу, а не подгружаться через JS, поэтому SSR/SSG/ISR в помощь ❣️Лимит AI-краулеров на время загрузки около 3 секунд, поэтому оптимизируем показатели core web vitals ❣️Разметка SCHEMA.ORG прямо в HTML, особенно важно разметить FAQPage, Author, Article, Item, а также даты, цены и все возможные данные. ❣️Создаем JSON-LD словари, парсим сущности из мета-полей статьи. ❣️Добавляем автообертку сущностей в data-entity-* атрибуты ❣️маркетологи / сеошники проверяют цитируемость prompt win rate, помогаем и настраиваем систему мониторинга упоминаний бренда в ответах . ❣️Важно, чтобы прямой ответ на вопрос был в первых 2-3 предложениях или под заголовком h2-h3. Как итог, все это поможет контент-менеджерам и SEO-специалистам провести NER-анализ, когда в теме выделяются бренды, продукты, процессы, решения, эксперты и проблемы, и включить в граф знаний определенные сущности, а не просто ключевые слова, как в SEO-оптимизации. Начать можно с самого простого, это займёт какое-то время, чтобы разобраться, а затем уже можно прикрутить NER-сервис для обогащения старых материалов и новых публикаций, добавить сортировку по сущностям, чтобы LLM могла сразу по url-адресу найти нужный граф, и добавить логирование, чтобы разобраться какие сущности забирает LLM-краулер. Владельцы сайтов, напишите мне, я проведу аудит и дам рекомендации, что можно улучшить, чтобы ИИ выбрала ваш сайт как авторитетный источник информации 😉

Как я выиграла сертификат на 20 тысяч рублей вопреки багу 🪲😎 Я люблю развлечения, особенно бесплатные, а если еще покормят, то я в раю 😇 Мои друзья занимаются бытовой техникой. Часто бренды приглашают на различные мероприятия и, обычно, туда отправляют джунов-продажников, т.к. таймлайн часто состоит из лекции про бренд бытовой техники, всякие фишки для продаж, немного фана и перерыва на вкусную еду. И вот в очередной раз обсуждая такие ивенты, я возмутилась, почему меня до сих пор не позвали на праздник, я же тоже люблю повеселиться и поесть 😏 В итоге я попала на мероприятие от бренда Kuppersberg, наверняка вы слышали, а кто-то даже покупал себе😌 Ребят совсем не смущает, что название созвучно с премиальной бытовой техникой Kuppersbusch, где духовка стоит 300 тысяч😁 В приглашении написали, что будет кулинарный мастер-класс, конкурс и викторины с призами 😎 Сижу, слушаю вполуха лекцию вместе с тарелкой тарталетков, пирожными и запиваю это всё капучино. Подходит ведущий и спрашивает из какой я компании и какая у меня должность. Не моргнув глазом честно отвечаю, что я IT-директор в компании Арт-Хаус 😂 Лучше ничего не смогла придумать 😅 Друг пишет смс, что призы могут быть ценные и надо побороться 😮 Это нам надо, поэтому достаю блокнот, начинаю вникать и накидываю заметки 📝 И так почти три часа, так что я знаю о технике Kuppersberg почти все😅 Потом у нас был кулинарный мастер-класс, я жарила огурцы, мы все кричали «Да, Шеф!», приготовили что-то очень вкусное, я забыла название. А да, еще организаторы всем наливали вино😏 За ужином познакомилась девушками из других компаний, похихикали, а в конце ведущий объявил, что будет квиз на специальном сайте. Отвечать надо было быстро, но нюанс был в том, что сначала загружался вопрос в виде текста, а затем загружалась картинка сверху и текст вопроса с ответами уезжал вниз. То есть мы столкнулись с проблемой CLS - Cumulative Layout Shift - сдвиг контента при загрузке, который ухудшает UX. Поэтому, чтобы ответить на вопрос, надо было пролистать практически целый экран, чтобы дойти до вариантов ответа. Я смекнула сколько примерно занимает загрузка и куда приводит сдвиг контента, поэтому отвечала быстро. Пофиксить такой баг можно, указав размеры картинки через width/height, а также через свойство aspect-ratio, тем самым мы указываем браузеру сколько места займёт картинка🤓 По итогу я заняла второе место, ответив правильно на все вопросы, но мне не хватило скорости 😁 После у нас была презентации посудомойки, у которой нижняя корзина поднимается вверх, и если по ней постучать, то дверка откроется ✨ Ну и в конце церемония награждения, где мне торжественно вручили сертификат на 20000 рублей, который я благополучно потратила на микроволновку, тостер и варочную панель🤩 P.S. Если вам нужен клёвый чайник Smeg или любая бытовая техника, то пишите мне😁

Это мог бы быть рассказ о том, как я великолепно провела каникулы, сходив в Термоленд, на балет Щелкунчик, музлото и джазовый концерт, но вместо этого я приболела и лежала с температурой 🥲 Зато расскажу про обновления в мире CSS 🤩Зайду издалека, ведь история пишется прямо на нашим глазах 😅 Мне кажется, что каждый фронтендер сталкивался с masonry-раскладкой (кирпичная кладка, pinterest-раскладка, waterfall) и до сих для реализации нужно пользоваться JS, к примеру плагин или играть с отрицательными марджинами в grid-сетке. Почти 10 лет назад Rachel Andrew открыла issue на гитхабе по запросам разработчиков, а в 2020-м году опубликовали черновик спеки CSS Grid 3 Level с новыми свойствами(оригинал, перевод). Началась работа, и вот, в конце 2025 года вышла статья display: grid-lanes, с примерами и объяснением разных кейсов(перевод). Выглядит многообещающе ✨ И пока мы с вами отдыхали на каникулах, 7го января item-tolerance переименовали во flow-tolerance 😁 flow-tolerance будет отвечать за требовательность алгоритма при размещении элементов, что-то вроде плотности🤓 Поддержка пока никакая, но потрогать код уже можно в Safari Tecnology Preview 234. Когда появился grid, то поддержка внедрялась постепенно, и приходилось добавлять фоллбэки с display:flex 😌 И до сих пор некоторые мои коллеги побаиваются полноценно использовать гриды, предпочитая флексы🤔 Интересно, как быстро добавят поддержку grid-lanes в остальные браузеры ?

Ну что? У всех уже фриз на деплой ?❄️😌 Подведу итоги года🤔 Если вспомнить колесо баланса, то как-будто всё подравнялось🎡 В первую половину года я очень много работала, пощупала все проекты, отдохнула в Таиланде, потом сорвалась в КавМинВоды и ушла с full-time работы😳 Вторую половину я работала в 2-3 раза меньше обычного, немного побыла риелтором🫣, занялась здоровьем, закончила ремонт в своей и бабушкиной новой квартире, 115 раз тренировалась и часто плавала в бассейне 🧜🏼‍♀️ из профессионального: углубилась во Vue3, усиленно готовилась к собесам, училась правильно презентовать и свои достижения, изучала материалы для прохождения собеседований и много созванивалась с коллегами по фронтенду, чтобы сориентироваться в нынешнем киберцирке😅 Из грустного, из-за классной команды очень долго не хотела увольняться, нас было уже больше 15 человек, по такой поддержке и дружбе я скучаю🥰Приятно, что мы продолжаем общение и встречи 🤗 Про дофаминовый детокс - эксперимент отчасти успешный, я захожу в инстаграм редко, но теперь постоянно скроллю маркетплейсы и авито. Авито очень интересный сервис, залипаю 🤦🏼‍♀️ Про этот микробложик 😌 Он потихоньку вымирает и это ок❤️‍🩹 несмотря на множество черновиков, с казалось бы классными идеями и фишками, с таким темпом жизни я просто не успеваю дописывать свои мысли и красиво оформлять это в структурированный посты, чтобы получилась какая-то захватывающая история, а потом это становится не актуально🤔 Плюс, общаясь со многими людьми, кто стремился и стремится попасть в IT или уже работают, чувствуется разочарование и угасание интереса, т.к. порог очень сильно поднялся и теперь еще и нужно грести сильнее, чтобы остаться в этой раскачивающийся лодке, иначе окажешься за бортом галеры 🥲 Согласны ? поэтому просто оставлю это как возможность поделиться жизненным опытом, подвести итоги и возвращаться, чтобы отследить точку А и точку В🫠 Сейчас активно готовлюсь к встрече Нового Года, огромный список дел и идей для празднования 🔥 В следующем году планирую больше времени уделять себе, развиваться не только в сфере IT, но и попробовать что-то новое, помним про принцип: не держать все яйца в одной корзине 🤓 ❤️Желаю всем вам в Новом Году здоровья, спокойствия, благополучия, удачи и да пребудет с вами сила 🖤

Работаю сейчас над приложением для водителей и иногда сталкиваюсь с особенностями мобильных браузеров😁 При указании адреса, браузер автоматически добавляет подчеркивание. При долгом нажатии выпадает меню, и можно проложить маршрут до адреса, но не в Яндекс.Навигаторе🤔 text-decoration: none здесь не поможет. Для того, чтобы всё сработало, нужно добавить CSS-свойства : .no-decoration { pointer-events: none; cursor: default; color: inherit; -webkit-tap-highlight-color: transparent; -webkit-touch-callout: none; } Отключаем реакцию элемента на касание, клик, drag и т.д., уберем подсвечивание (overlay) при касании на мобильных устройствах и отключим контекстное меню при долгом нажатии. Кроме того, для отключения механизма определения адреса в браузере в мета-теги приложения добавим : <meta name="format-detection" content="address=no"> Если необходимо, еще можно отключить определение телефона и email. Итого, мы получаем пассивный элемент, который визуально обезличен и не создает обратной связи😌

У меня сегодня день рождения 😊 И повод немного порефлексировать над минувшими годами 😏 Мне очень повезло работать с поколением, когда создавали программы, записывали на дискеты 💾, шли в серверную и запускали программы, смотрели на результат, потом повторяли это по кругу вновь и вновь, и также мне повезло работать с ребятами, которые с ранних лет на острие технологий и в 20 с небольшим лет уже сеньоры в бигтехе, которые разжуют тебе системный дизайн и алгосы😌 Мне очень повезло, что у меня есть возможность получать знания, развивать инженерные привычки и передавать свой опыт другим 🤗 Повезло работать с маленькими и большими командами, с налаженными процессами, а еще с повезло строить всё с нуля 😄 Повезло работать с адекватными коллегами, продвигать, отстаивать и воплощать свои идеи 💡 Повезло, что я могу попросить совета и поделиться своими мыслями здесь и для кого-то это принесет пользу, а для других станет триггером для действий🚀 А вот если задуматься… повезло или я сама приложила множество усилий, чтобы получилось так ? 😏 В любом случае, я благодарна за то что у меня было, есть и будет 🙏🩶

Всегда пишу заметки для скрам-митов, из них видно, какие задачи были сделаны, в какой срок, с какими вызовами и проблемами я столкнулась. Затем составляю список достижений по этим заметкам. Зачем ?🤔 🔺 проще проходить ревью, когда видно все твои достижения за год. 🔺При поиске работы нужно указать их в резюме, чтобы глаз HR зацепился 🔺Помогает бороться с синдромом самозванца, так видно точку A , рост и точку В. 🔺Обновить стек 1 из разделов - это наставничество, где я не четко фиксировала свои результаты, и мне известно только о 7 девушках, которым удалось трудоустроиться Сначала сомневалась, стоит ли это указывать, но это мой вклад в сообщество и важная часть карьерного трека. Знаю, что меня читают девушки, которые проходили у меня обучение🤗 Напишите, пожалуйста, в комментах или мне в личные сообщения удалось ли вам трудоустроиться? Какие проблемы возникли при поиске? Возможно вы взяли паузу, или еще продолжаете обучение, или решили попробовать другую сферу, тоже интересно, напишите 😘