Горячее
Лучшее
Свежее
Подписки
Сообщества
Блоги
Эксперты
Войти
Забыли пароль?
или продолжите с
Создать аккаунт
Я хочу получать рассылки с лучшими постами за неделю
или
Восстановление пароля
Восстановление пароля
Получить код в Telegram
Войти с Яндекс ID Войти через VK ID
Создавая аккаунт, я соглашаюсь с правилами Пикабу и даю согласие на обработку персональных данных.
ПромокодыРаботаКурсыРекламаИгрыПополнение Steam
Пикабу Игры +1000 бесплатных онлайн игр
 Что обсуждали люди в 2024 году? Самое время вспомнить — через виммельбух Пикабу «Спрятано в 2024»! Печенька облегчит поиск предметов.

Спрятано в 2024

Поиск предметов, Казуальные

Играть

Топ прошлой недели

  • AlexKud AlexKud 38 постов
  • SergeyKorsun SergeyKorsun 12 постов
  • SupportHuaport SupportHuaport 5 постов
Посмотреть весь топ

Лучшие посты недели

Рассылка Пикабу: отправляем самые рейтинговые материалы за 7 дней 🔥

Нажимая кнопку «Подписаться на рассылку», я соглашаюсь с Правилами Пикабу и даю согласие на обработку персональных данных.

Спасибо, что подписались!
Пожалуйста, проверьте почту 😊

Помощь Кодекс Пикабу Команда Пикабу Моб. приложение
Правила соцсети О рекомендациях О компании
Промокоды Биг Гик Промокоды Lamoda Промокоды МВидео Промокоды Яндекс Директ Промокоды Отелло Промокоды Aroma Butik Промокоды Яндекс Путешествия Постила Футбол сегодня

CSS + HTML

С этим тегом используют

Программирование Верстка Javascript IT Web Frontend Сайт Все
393 поста сначала свежее
Nichteye121
Nichteye121
1 год назад

Записал ролике-эксперимент о смене стэка⁠⁠

я школьник не ругайте спер сильно

В этом ролике я провел эксперимент сменил свой стэк технологий. Поменял акцент с бэка на фронт,пересел с html`а на react,и научился базовым анимациям,также я перешел с бутстрапа на tailwindcss.

Программирование YouTube Обучение React Frontend HTML CSS Видео
2
106
Neurosonya
Neurosonya
1 год назад
Серия Полезность

Конвертация дизайна из Фигмы в рабочий код на HTML + CSS + React⁠⁠

Конвертация дизайна из Фигмы в рабочий код на HTML + CSS + React Технологии, Полезное, Искусственный интеллект, Инновации, Нейронные сети, Digital, Программирование, Программист, HTML, CSS, Дизайн, Дизайнер, Конвертация, Код, Сайт, Figma, Проект

Kombai

Достаточно сбросить дизайн в Kombai и получить готовый код ✅

Разработчики могут бесплатно использовать Kombai во время предварительных исследований

Бесплатно можно получить:

➕ Неограниченное количество загрузок дизайна

➕ Неограниченное количество загрузок кода

➕ React и HTML + CSS

➕ Tailwind CSS и MUI Base (для компонентов форм)

➖ Но обменяться файлами дизайна с третьми лицами не получится 🤷🏻‍♀️

Для доступа к расширенному функционалу, а именно, - интеграция и настройка, пользовательские переменные CSS и миксины, библиотеки пользовательских компонентов, вывод кода в соответствии с технологическим стеком и премиум поддержка, - необходимо связываться с разработчиками Kombai

Больше полезных сервисов для работы и учебы в моем телеграмм канале (ссылка в описании профиля), там я рассказываю, как можно использовать нейросети для бизнеса

Показать полностью
Технологии Полезное Искусственный интеллект Инновации Нейронные сети Digital Программирование Программист HTML CSS Дизайн Дизайнер Конвертация Код Сайт Figma Проект
2
1
pikabusamka
1 год назад

Помощь в поиске видео по web дизайну⁠⁠

Всем привет. Примерно пол года назад тут на пикабу выкладывали видео(или в комментарии кто-то выкладывал), почему сайты которые содержат только html без стилей круты, типа более удобочитаемые и быстрее грузятся. Видео на английском, но с субтитрами. Еще и задавали риторический вопрос в стиле "Что же вам еще надо?". Помогите найти видео, никак не могу найти... :(

Web Дизайн Сайт Про сайты Ищу видео Поиск Программирование HTML CSS Текст
5
1
Chuba41
1 год назад

Изучаю Frontend, нужна помощь опытных верстальщиков⁠⁠

Приветствую всех, прохожу курс по HTML/CSS на Coursera, не получается выполнить задание связанное с версткой с помощью флексбокс. Суть в том что не получается сделать так, что бы картинки масштабировались под размер контейнера. Они либо больше получаются чем надо и обрезаются, либо меньше. Можно конечно картинки подредактировать в PS, что бы они имели нужный мне размер, но одно из условий задания сделать простое добавление нового объекта. Буду рад если кто-то поможет стать на путь истинный и быть может объяснит что я делаю не так. Прошу сильно не ругать мой код, я новичок, только учусь, но готов прислушаться к вашим советам, заранее всем спасибо.

Макет задания приведен на картинке

Изучаю Frontend, нужна помощь опытных верстальщиков Frontend, HTML, CSS, IT, Программирование, Длиннопост

Ссылка на GitHab, чтобы посмотреть код

https://github.com/Chuba41/Cat.git

Показать полностью 1
[моё] Frontend HTML CSS IT Программирование Длиннопост
7
10
marilym
marilym
1 год назад
ИТ-проекты пикабушников

Cssformalize v2⁠⁠

Это продолжение этого поста: Кастомные формы Html
Не прошло и двух лет как я смог найти время для продолжения работы над проектом.


Но сейчас изменения на много глобальнее:

  1. Проект обзавелся сайтом: cssformalize.com

  2. Стили для форм можно генерировать на сайте и потом просто скопировать в свой проект.

  3. Есть поддержка тем

В общем теперь можно самому создавать дизайн форм прямо в генераторе на сайте и использовать их. Есть удобная установка через npm или CDN

P.S. Напомню что это только кастомизация нативных html форм без применения js. только css

Всегда рад критике и советам.
Пока что нет адаптивности для самого сайта. Это в планах.
CSS писал я, js ChatGPT

[моё] HTML Html 5 CSS Css3 Текст
19
SculptorAI
SculptorAI
1 год назад

А вы согласны?⁠⁠

Некоторое время назад один состоятельный знакомый предположил, что такие программы, как Figma, Adobe Photoshop и многие другие подобные продукты скоро будут никому не интересны, поскольку их заменит Chat GPT, Midjourney или еще что-то подобное.

Услышав его слова, я даже немного расстроился, поскольку он относился к той категории людей, мнение которых для меня является важным. Однако, я не хотел спорить, отстаивая свою точку зрения в надежде оказаться правым. На тот момент у меня не было по-настоящему весомых аргументов, чтобы возразить ему.

Прошло несколько месяцев, я увидел новые возможности Photoshop и был буквально поражен ими. Сомневаюсь, что Midjourney, при всех своих достоинствах, сможет сделать тоже самое.

Уверен, что если в следующий раз он захочет озвучить свою точку зрения относительно недостатков этих программ, то он однозначно должен будет подумать немного получше.

Я думаю, что профессионалы своего дела однозначно не станут так быстро сдавать свои позиции и уж точно сразу не проиграют. Да, у новых продуктов есть свои неоспоримые достоинства, однако и «матерые старички не спешат уходить», поскольку их популярность и профессионализм проверены годами, а молодые – это лишь хайп на новых технологиях. Их популярность неоспорима, но вот настоящий успех нужно доказывать годами проверенной и надежной работы.

Только представьте насколько сильны будут возможности, например, Photoshop или Figma при наличии у них возможностей Chat GPT и Midjourney?

Несомненно, развитие и прогресс в области искусственного интеллекта и генеративных моделей, таких как Chat GPT и Midjourney, вносят значительные изменения во многие сферы деятельности, включая дизайн и редактирование графики.

Однако, несмотря на все возможности и потенциал, которые предлагают эти инновационные технологии, все же важно понимать, что они не являются полной заменой для профессиональных программ и инструментов. Многие воспринимают данный ресурс лишь забавной и развивающей игрушкой.

Новые модели и алгоритмы могут быть полезными дополнениями и помощниками в процессе работы, но они не могут заменить творческий вклад и опыт, который привносит человек в процесс создания и редактирования графики.

Профессионалы в сфере дизайна и редактирования графики обладают не только навыками использования инструментов, но и эстетическим восприятием, творческим мышлением и пониманием контекста. Они способны принять решения на основе своего опыта, визуальной грамотности и специализированных знаний.

Современные технологии могут стать ценными инструментами, помогающими оптимизировать процесс работы, автоматизировать рутинные задачи и предлагать новые идеи и варианты для вдохновения. В конечном счете, эти инструменты могут дополнить и расширить возможности профессионалов, позволяя им сосредоточиться на более творческих и стратегических аспектах своей работы.

Таким образом, взаимодействие между технологиями и профессионалами становится важным аспектом современного творческого процесса. Вместо того, чтобы рассматривать эти инновации как «неминуемую погибель всего другого», лучше рассмотреть их как возможность для сотрудничества и синергии, где технологии поддерживают и расширяют возможности профессионалов, а профессионалы, в свою очередь, применяют свой опыт и креативность для достижения уникальных и качественных результатов.

https://t.me/sculptorai_sng

А вы согласны? IT, Развитие, Искусственный интеллект, Программирование, HTML, CSS, Дизайн, Верстка
Показать полностью 1
IT Развитие Искусственный интеллект Программирование HTML CSS Дизайн Верстка
13
4
SculptorAI
SculptorAI
1 год назад

Sculptor AI - новое поколение frontend разработки и не только...⁠⁠

Казалось бы, что сложного сделать сайт или приложение? В наше время существует огромное количество различных ресурсов: конструкторы сайтов, графические редакторы и многое другое. В конце концов ты можешь просто обратиться к специалисту, озвучить ему свои "хотелки", нарисовать приблизительный вариант сайта, составить техническое задание и т.д. и т.п. Если тебе нужен просто одностраничный сайт-визитка, то специалист сделает его тебе за пару дней в любом стандартном конструкторе... С таким сайтом ты будешь похож на очередного безликого персонажа из массовки, на которого никто и никогда не обратит внимания, если попадет на твою страничку. Однако, работа будет сделана быстро, хоть и бессмысленно.

Но что ты будешь делать, если тебе необходимо изготовить уникальный сайт или приложение с множеством страниц, с расчетными калькуляторами и т.п. Или же тебе нужно многостраничное и многоуровневое приложение, которое не сделать в банальном конструкторе. Тут тебе придется привлекать группу специалистов. Это будут и дизайнеры, и программисты и кого ты только не встретишь на своем пути, пока получишь готовый продукт. А сколько времени они потратят на то, чтобы его сделать? И все это ты будешь оплачивать... Поскольку время специалиста - это твои деньги.

Именно с такой проблемой я столкнулся некоторое время назад. И скажу вам честно, что меня так сильно это огорчило, что мы решили создать свой собственный сервис.

Мы назвали его Sculptor AI.

В целом получился принципиально новый сервис для разработки сайтов и приложений на основе искусственного интеллекта, построенный по принципу конвертации дизайна макета вашего будущего сайта или приложения в корректный код. Однако, это не просто сервис для верстки в HTML и CSS. С его помощью вы сможете осуществлять кросс-браузерную и кросс-платформенную разработки, мобильную разработку, делать адаптивную верстку,  редактировать дизайн вашего будущего сайта или приложения, а также осуществлять первичную SEO-оптимизацию, создавать калькуляторы для расчетов, а также размещать свои уже готовые работы на продажу в личной галерее и многое многое другое.

Используя Sculptor AI вам не потребуются знания HTML и CSS (в том числе сетки и CSS-фреймворки, спецификации W3C и WHATWG, HTML5/CSS3 Polyfills), препроцессоров CSS (Sass, Less, Stylus и т. д.), фреймворков и библиотек: jQuery, Angular.JS, React.JS, Vue.JS и т.д., инструментов дебаггинга (Chrome Dev Tools, Firebug и прочие) и многого другого, что необходимо для полноценной разработки.

Теперь каждый пользователь сервиса Sculptor AI может самостоятельно и без специальных знаний в области html и языков программирования произвести конвертацию дизайна, созданного в любом графическом редакторе (Figma, Sketch, Adobe XD и т.п.).

В настоящий момент продукт завершен на стадии прототипа и мы решили сделать небольшую презентацию, чтобы заявить о себе https://youtu.be/G7Xkt0yP7Mc

Уверен, что этот продукт будет набирать обороты, поэтому мы решили создать свое комьюнити, чтобы в дальнейшем все наши друзья и участники стали нашими пользователями.

Сервис Scuiptor AI сможет объединить дизайнеров, frontend разработчиков, SEO специалистов и многих других, кто работает с сфере создания сайтов и приложений.

Наши контакты:

https://twitter.com/SculptorAI/

https://t.me/sculptorai

https://t.me/sculptorai_sng

Показать полностью 1
[моё] IT HTML CSS Верстка Искусственный интеллект Видео YouTube
5

Попробовать мобильный офис

Перейти
Партнёрский материал Реклама
specials
specials

Мобильный офис до 100 тысяч рублей⁠⁠

Ноутбуки используют не только для работы: на них смотрят сериалы, редактируют фото, запускают игры и монтируют ролики. Поэтому теперь требования к устройству такие: быть легким для дороги, надежным для горящих дедлайнов и стильным, чтобы не прятать в переговорке. А еще — легко работать в связке с другими гаджетами.

Протестировали TECNO MEGABOOK K15S вместе со смартфоном TECNO CAMON 40 и наушниками TECNO в рабочих и бытовых сценариях от Zoom-звонков до перелета, а теперь рассказываем, как себя показала техника.

Первое впечатление от дизайна ноутбука

Первое, что заметно — это вес. При диагонали 15,6 дюйма и полностью металлическом корпусе K15S весит всего 1,7 кг. Это примерно на 15% меньше, чем аналоги. Устройство не обременяет ни в офисе, ни в такси. Ноутбук поместился в стандартный городской рюкзак, было удобно достать его в кафе за завтраком и по дороге в такси, чтобы быстро отработать клиентские правки.

1/4

Дизайн сдержанный, без ярких акцентов, с матовой поверхностью. Правда, на ней остаются следы от рук. Так что если приходится постоянно открывать ноутбук в присутствии клиентов или партнеров, лучше купить прозрачный кейс. Визуально и тактильно устройство ощущается надежно: не выскальзывает и не двигается по столу, благодаря специальным резиновым накладкам на задней части.

Шарнир работает мягко: чтобы открыть крышку даже одной рукой, не нужно придерживать корпус. Чтобы показать коллеге или клиенту презентацию, достаточно раскрыть экран на 180°. Это удобно и для работы лежа, и для подставок, которые требуют определенного угла обзора.

Также отметим 9 портов: USB-A, USB-C, HDMI, слот для карты памяти — можно забыть о переходниках.

В TECNO MEGABOOK K15S предустановлен Windows 11. Ноутбук готов к работе сразу после включения. Никаких лишних установок и обновлений. Все настроено и оптимизировано для вашей многозадачности.

Экран: яркая картинка и комфорт ночью

Экран — 15,6 дюйма, IPS-матрица с разрешением Full HD. Углы обзора отличные: изображение остается четким, даже если смотреть сбоку, цвета не искажаются. Есть антибликовое покрытие. Тестировали ноутбук при разном освещении: можно спокойно работать у окна. Когда солнце бьет прямо в экран, текст по-прежнему остается читаемым, картинки не искажаются. Это редкость в бюджетных моделях.

1/2

Неважно, работаете вы ночью или играете, выручит клавиатура с регулируемой четырехуровневой подсветкой. При среднем уровне в темноте все видно, глаза не устают. Из плюсов для тревожных людей: включали ноутбук в самолете и электричке, никто вокруг не жаловался на яркость. Все регулируется кнопками, не нужно лишний раз заходить в настройки.

Стеклокерамический крупный тачпад — 15 см. Он не залипает, не промахивается, срабатывает с первого касания. Не возникает дискомфорта, даже если несколько часов редактировать документы без мышки. После перехода с других устройств немного непривычно, что тачпад работает в двух направлениях: нижняя часть отзывается нажатием, верхняя — касанием.

В кнопку питания встроен сканер отпечатка пальцев. К нему можно быстро привыкнуть, особенно если сидишь в опенспейсе или работаешь в дороге. Один легкий тап пускает в систему даже с мокрыми руками. Безопасно, удобно и не нужно постоянно вводить пароли.

Производительность: рендерим видео, открываем вкладки

Ноутбук работает на AMD Ryzen 7 5825U (опционально можно выбрать версию техники Intel Core i5-13420H). Восьмиядерный AMD с поддержкой 16 потоков подходит для ресурсоемких операций вроде рендеринга или работы с большими массивами данных. Встроенная графика Radeon справляется с редактированием видео в Full HD или играми.

1/4

Во время монтажа 30-минутного ролика в DaVinci Resolve и параллельной работе в Photoshop с несколькими большими PSD-файлами система сохраняла стабильность. Не было ни зависаний, ни заметного падения производительности. Ноутбук уверенно держит в фоне 10 приложений одновременно. Если запущены браузер с 20 вкладками, видеозвонок в Telegram, Excel с объемной таблицей и софт для монтажа, система не тормозит и не перегревается. Переход между окнами остается плавным, ничего не «проседает», даже при одновременном скачивании файлов и редактировании видео.

Базовая комплектация включает 16 ГБ оперативной памяти в двух слотах. При необходимости можно легко увеличить этот показатель до 32 ГБ, заменив стандартные модули на более емкие. Помимо установленного SSD на 1 ТБ предусмотрен дополнительный слот, поддерживающий диски объемом до 2 ТБ.

Чтобы во время нагрузки системы охлаждения не выходили из строя, в ноутбук встроен эффективный вентилятор, способный рассеивать до 35 Вт тепла. Устройство не греется, его спокойно можно держать на коленях. Это решение дополнено тремя режимами работы, которые переключаются простой комбинацией клавиш Ctrl+Alt+T. Тихий режим идеален для работы ночью или в общественных местах, сбалансированный подходит для повседневных задач. Производительный, на котором запускали рендеринг видео и игры, практически не шумит.

Автономность: 15 часов без подзарядки

Протестили автономность MEGABOOK K15S в условиях, знакомых каждому деловому путешественнику. Утром перед вылетом зарядили ноутбук до 100% и взяли его в рейс Москва — Калининград. В зале ожидания провели созвон, потом три часа смотрели сериал и в дороге до отеля редактировали документы. К моменту приезда оставалось 40% заряда: хватило бы еще на пару часов продуктивной работы.

1/3

MEGABOOK K15S может автономно работать до 15 часов и позволяет не оглядываться на индикатор заряда. Заявленное время достигается при типичном офисном использовании: одновременная работа с документами в Word и Excel, ведение переписки, видеоконференции, веб-серфинг.

Если все же понадобится, за  час восполняется до 70% батареи. Компактный адаптер мощностью 65 Вт на базе нитрида галлия поместился даже в карман пиджака. Один блок питания заряжает и ноутбук, и смартфон, и наушники. Экономия места: не нужно никаких дополнительных проводов.

Звук, который реально слышно

В TECNO MEGABOOK K15S установлены два мощных динамика по 2.5 Вт. Звук с глубокими низами, без пластикового дребезжания, объемный. Благодаря DTS можно смотреть видео даже в шумном помещении. В тестах специально включали сцены с шагами и выстрелами: локализация настолько точная, что в наушниках нет необходимости.

Та же стабильность и в микрофоне. Благодаря AI-шумоподавлению голос передается чисто. Во время тестовых звонков из оживленного кафе собеседник не услышал ни разговоры за соседним столом, ни городской шум. И все это — на расстоянии до пяти метров.

Кстати, о созвонах. В ноутбуке встроена обновленная камера. Она отслеживает положение лица, а еще есть физическая шторка приватности. Например, можно закрыть шторку для комфортных видеоконференций.

Для тех, кто предпочитает гарнитуру, идеально подойдут беспроводные наушники TECNO FreeHear 1 из экосистемы бренда. Когда не хотелось делиться разговорами с окружающими, подключали их. Чистый звук с акцентом на средние частоты, 11-мм драйверы, которые выдают неожиданную детализацию. Музыку слушать приятно: и фоновый плейлист на телефоне, и вечерний сериал на ноутбуке. Автономно работают наушники 6 часов, с кейсом — до 30 часов. 

1/2

Bluetooth 5.4 обеспечивает стабильное соединение на расстоянии до 10 метров. Удобная C-образная форма разработана специально для длительного ношения — после восьмичасового рабочего дня в ушах не возникает дискомфорта. Наушники поддерживают одновременное подключение к ноутбуку и смартфону. Переключение между устройствами происходит быстро и без заминок.

Через фирменное приложение Welife можно выбрать один из четырех эквалайзеров и отследить местоположение гарнитуры в случае утери. А еще кастомизировать виджет для управления наушниками. Функция настройки персонализированного дизайна доступна для устройств на Android и позволяет гибко изменить внешний вид окна подключения: вплоть до установки фоновой картинки или собственного фото.

Первые пару использований может потребоваться время, чтобы привыкнуть к нестандартной форме вкладышей, но уже с третьего раза они надеваются вслепую за секунду. Что особенно приятно:  собеседники отмечают, что звук от микрофона более приятный и четкий, чем у дорогих известных моделей.

Бесшовная синхронизация со смартфоном

Благодаря функции OneLeap ноутбук синхронизируется со смартфоном TECNO. Подключение происходит за пару секунд: достаточно один раз подтвердить сопряжение. После этого открывается доступ к бесшовному переключению между устройствами — объединенному буферу обмена, дублированию экранов и передаче файлов без кабелей и пересылок в мессенджерах.

Функция выручила, когда нужно было открыть приложение, у которого нет веб-версии. Удобно работает и буфер обмена: скопировал текст на одном устройстве — вставил на другом. Например, код, полученный в сообщении на телефоне, вводится в браузере на ноутбуке. Экономит минуты, а иногда и нервы. А когда в дороге пропал Wi-Fi, ноутбук сам подключился к мобильному интернету через смартфон.

1/2

TECNO CAMON 40 и сам по себе — мощный рабочий инструмент.  Смартфон выделяется камерой высокого качества 50 Мп, ярким AMOLED-экраном 120 Гц и множеством функций, которые упрощают процесс мобильной съёмки и использование искусственного интеллекта TECNO AI.

Телефон работает на HIOS 15.0.1 на базе Android 15.В фирменную оболочку встроен искусственный интеллект:

  • Голосовой помощник Ella. Отвечает на вопросы, помогает с задачами и управлением устройством.

  • Решение задач. Наводите камеру на задачу, ИИ решает ее.

  • AI Редактор фотографий. Интеллектуальная обработка в одно касание.

  • Быстрый поиск. Находит адрес на экране и запускает навигацию, распознает объекты и события, автоматически добавляет их в календарь.

Технические характеристики

  • Процессор и память. 8 ядер, 16 потоков, Кэш L3 16 МБ, частота до 4.5 ГГц Графический процессор AMD Radeon™ graphics SSD 512 ГБ или 1 ТБ, М.2, 2280, PCle 3.0 Nvme DDR4 16 ГБ, 3200 МГц.

  • Дисплей. 15.6", TFT, Full HD (1920×1080), 16:9, 280нит, 45% NTSC, 16.7 млн цветов, 60 Гц, 141 ррі.

  • Веб-камера. 1 Мп, шторка приватности.

  • Порты. 9 портов: 1*TF Card (microSD), 1*HDMI 1.4, 1*USB-A 3.1,

    1*USB-A 3.2, 1*3.5mm аудиовход, *Ethernet RJ45 до 1 Гбит, 2*Туре-С (Full Function), 1*слот для замка Kensington.

  • Другое. Сканер отпечатка пальца в кнопке питания. Клавиатура с подсветкой (4 уровня яркости). Тачпад с поддержкой одновременно 4 касаний.

  • Батарея. 70 Вт∙ч (6150 мА∙ч), Li-Pol, 11.55 B 65 Вт Type-C GaN, 20 В, 3.25 А, кабель 1.8 м (Туре-С-Type-C).

  • Габариты. 17.3 мм (высота), 359.5 мм (ширина), 236 мм (глубина).

  • Вес. 1,7 кг.


Если хотите создать собственную экосистему, в которой технологии подстроятся под ритм дня, попробуйте технику TECNO. Мощный ноутбук, быстрый смартфон и наушники соединяются в единое пространство. Быстрое переключение между устройствами, синхронизация файлов и стабильное соединение без лишних настроек.

КУПИТЬ НОУТБУК TECNO

Реклама TECNO Mobile Limited, Юридический адрес: Flat N, 16/F., Block B, Универсальный промышленный центр, 19-25 Shan MeiStreet, Fotan, New Territories, Гонконг

Показать полностью 17
Электроника Гаджеты Ноутбук Длиннопост
1156
romakozlitin367
romakozlitin367
2 года назад
Web-технологии

35 лучших бесплатных курсов HTML/CSS верстки в 2023⁠⁠

Подготовили для вас статью с бесплатными курсами по верстке html/css. В некоторых курсах есть тренажеры: можно проходить теории и там же практиковаться.

Покликайте на курсы, выбирайте. Важно, чтобы вам был удобен курс, понятен язык изложения, и ваш уровень знаний подходил для конкретного курса.

HTML и CSS — это языки веб-программирования, использующиеся в паре для верстки сайтов. Функционал пары следующий: HTML представляет собой "каркас", основные компоненты будущей страницы, а CSS, расширяя возможности HTML, помогает разработчику уточнять дизайн сайта.

Тренажеры

  1. Бесплатный тренажер по html/css

    Тип: Тренажер состоит из блоков теории, после которого сразу идет практика с задачами прямо внутри тренажера.

    Язык: русский.

    После завершения курса, вы сможете бесплатно получить сертификат о прохождении.

  2. Learn-html.org

    Тип: обучающий онлайн-тренажер.

    Язык: английский.

  3. Grid Critters

    Тип: обучающая онлайн-игра.

    Язык: английский.

Бесплатные курсы от школ

  1. “Как стать frontend-разработчиком с нуля?” от Skillfactory

    Простое решение для начинающих программистов — карьерный гид компании Skillfactory. Краткий мануал расскажет об основных задачах работников сферы IT и возможностях обучения. Чтобы получить гид, необходимо указать лишь имя и адрес электронной почты.

  2. “Основы HTML и CSS” от Stepik

    Основы программирования на HTML и CSS от Тимура Гудиева на платформе Stepik. Чтобы ввести участников в кодинг, автору потребуется всего 10 видеоуроков, а для активной практики он подготовил 34 теста по каждой из тем.

  3. “Введение в HTML5” от Курсера

    Курс — введение в HTML5 от Колин ван Лент и Чарльз Северанс на платформе Coursera. В этой программе при поддержке Мичиганского университета длительность в 3 недели преподаватели расскажут о базовых навыках владения языком, а по окончании всех участников ждет электронный сертификат.

  4. “Создание сайта на HTML” от ItProger

    Данный курс по верстке сайта от itProger.com предлагает базовые знания сразу по четырем направлениям: HTML, CSS, JS и jQuery — с реальным продуктом по итогам обучения — собственным сайтом. Вся программа рассчитана на 11 видеоуроков и 108 практических заданий.

  5. “Верстка сайта” от ItProger

  6. "Курс HTML для начинающих" от PHP.ZONE

  7. "Веб-разработка для начинающих: HTML и CSS" от Stepik

  8. "Знакомство с HTML и CSS" от HTML академии

  9. "Курс HTML / CSS" от Beonmax

  10. "Уроки HTML5" от ItProger

  11. "Основы HTML, CSS и веб-дизайна" от Хекслет

  12. "Курс HTML и CSS - верстка сайтов для начинающих" от School PHP

  13. "Уроки CSS" от ItProger

  14. "Введение в веб-разработку" от Hexlet

  15. "Вводный курс по HTML и CSS для начинающих" от ShowSkill

35 лучших бесплатных курсов HTML/CSS верстки в 2023 Программирование, HTML, CSS, Верстка, Курсы программирования, Основы HTML, IT, Создание сайта, Длиннопост, Текст, Подборка

Курсы с Youtube

  1. Создаем сайт на основе CSS3 + HTML5

    Краткий курс по созданию сайта на HTML5 и CSS3. За 14 видео автор канала Гоша Дударь расскажет все о верстке своего сайта, а также поделится общей информацией о профессии Frontend-разработчика

  2. HTML для начинающих

    Это курс для веб-программистов, поделенный на две части. В первой части объясняет и показывает автор канала loftblog, а во второй инсайтами и важной информацией для HTML-верстальщиков поделится Анастасия Редченкова.

  3. Верстка сайта #7 Создание лендинга для свадебного фотографа

    YouTube-курс "Верстка сайта" от FrontCoder. За 17 видео автор канала объяснит и покажет, как создать свой сайт на HTML и CSS всего за несколько часов на реальном примере — сайте свадебного ведущего.

  4. Верстка сайтов || Лендинги, интернет-магазины, портфолио

    Курс по верстке сайтов на HTML и CSS от LectorWeb. Плейлист содержит 17 коротких YouTube-видео со всем необходимым для начинающих Frontend-разработчиков.

  5. Курс HTML & CSS

    Видеокурс для начинающих HTML- и CSS-верстальщиков от Андрея Андриевского. За несколько часов хронометража автор проходится по основам кодинга с помощью данных языков, а также дает полезные советы желающим попробовать себя в сфере веб-разработки.

  6. HTML для начинающих

    Видеоуроки по HTML-верстке от ВебКадеми для начинающих программистов и учащихся образовательных учреждений. Программа рассчитана на 17 коротких роликов, в рамках которых автор канала Юрий Ключевский расскажет зрителям об основных аспектах веб-разработки.

  7. Бесплатный курс по верстке сайтов (Front End). Уроки HTML CSS JS

  8. HTML 2021 - Свежий курс веб-разработки

  9. ФРОНТЕНД. Введение во Frontend | Технострим от VK Team

  10. Web разработка

  11. Учим HTML за 1 Час! #От Профессионала

  12. БЕСПЛАТНЫЙ курс по верстке сайтов (Front End). Уроки HTML CSS JS // Фрилансер по жизни

  13. Веб-разработчик 10.0

  14. Web разработка

  15. Front-End разработка. Курсы по HTML, CSS, JavaScript

  16. Фронтенд разработка (осень 2017)

  17. Web-разработка

35 лучших бесплатных курсов HTML/CSS верстки в 2023 Программирование, HTML, CSS, Верстка, Курсы программирования, Основы HTML, IT, Создание сайта, Длиннопост, Текст, Подборка

Что можно делать с помощью HTML и CSS?

Применяя HTML и CSS в верстке и веб-программировании, разработчики могут:

  • Применяя HTML и CSS в верстке и веб-программировании, разработчики могут:

  • Менять стиль и дизайн веб-проектов;

  • Отлаживать код

Сколько приносит верстка HTML и CSS в 2023 году?

По данным HH.ru, в феврале 2023 года средняя зарплата верстальщика на HTML и CSS составляет 46 000 рублей. Senior-программисты могут получать до 70 000 рублей, а вот Junior — примерно 35 000.

В то же время, рынок труда предлагает около 1 600 вакансий для позиции верстальщиков HTML и CSS каждый месяц.

Почему HTML?

Выступая практически универсальным решением в программировании, Java представляет собой:

  • Язык с понятной структурой — у Java несложный синтаксис;

  • Широкий выбор фреймворков — есть готовый набор решений для любых проектов;

  • Безопасный кодинг — JVM блокирует попытки навредить коду;

  • Обратно совместимый язык — все коды полностью функционируют вне зависимости от даты написания.

Почему HTML и CSS?

HTML и CSS — наиболее популярные языки во всех формах веб-программирования. Так, они:

  • Экономно расходуют ресурсы сервера сайта — из-за своей структуры код занимает мало места в системе;

  • Упрощают разработку сайтов — один файл стилей можно применить сразу на все страницы;

  • Ускоряют загрузку сайта — браузер кеширует стили, а далее загружает только данные;

  • Совмещают любые устройства — если они имеют доступ к редакторам HTML- и CSS-файлов.

Показать полностью 2
Программирование HTML CSS Верстка Курсы программирования Основы HTML IT Создание сайта Длиннопост Текст Подборка
115
Посты не найдены
О нас
О Пикабу Контакты Реклама Сообщить об ошибке Сообщить о нарушении законодательства Отзывы и предложения Новости Пикабу Мобильное приложение RSS
Информация
Помощь Кодекс Пикабу Команда Пикабу Конфиденциальность Правила соцсети О рекомендациях О компании
Наши проекты
Блоги Работа Промокоды Игры Курсы
Партнёры
Промокоды Биг Гик Промокоды Lamoda Промокоды Мвидео Промокоды Яндекс Директ Промокоды Отелло Промокоды Aroma Butik Промокоды Яндекс Путешествия Постила Футбол сегодня
На информационном ресурсе Pikabu.ru применяются рекомендательные технологии