Это услуга по предоставлению места на сервере и выделению, определённой заранее мощности ,этого сервера, с тем условием что этот сервер имеет постоянный доступ в интернет.

TailwindCSS фреймворк

Это CSS-фреймворк с открытым исходным кодом, созданный Адамом Уэтеном и поддерживаемый Tailwind Labs. Особенность этой библиотеки в том, что, она не предопределяет CSS-классы отдельных элементов. Вместо этого она предоставляет служебные классы, которые можно объединять для стилизации каждого элемента

Это процесс создания визуального оформления и пользовательского интерфейса веб-сайтов и веб-приложений. Он включает в себя несколько ключевых аспектов таких как: Эстетика, Функциональность, Юзабилити, Адаптивность, Интерактивность, Оптимизация.

CSS (Таблица каскадных стилей)

Это язык стилизации, который используется для описания внешнего вида и форматирования документов, написанных на HTML и XML (включая такие языки разметки, как SVG и XHTML). CSS позволяет веб-разработчикам и дизайнерам разделять содержание веб-страниц и их визуальное представление, что упрощает создание и поддержку сайтов.

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

Как отключить переходы глобально?

Material UI использует тот же помощник темы для создания всех своих переходов. Поэтому вы можете отключить все переходы, переопределив помощника в своей теме.

Когда следует использовать встроенный стиль, а когда CSS?

Используйте встроенные стили для динамических свойств стилей. Альтернатива CSS обеспечивает больше преимуществ, таких как автоматическое добавление префиксов, улучшенная отладка, медиа-запросы, ключевые кадры.

Переосмысление дизайна сайта. Попытка сделать его лучше

21.12.2023

15.04.2025

1 минуту

142

Под "переосмыслил" я имел ввиду полностью переделал. Не знаю на сколько тривиальная это задача для верстальщиков, но для меня, по факту, это сравни написанию нового сайта. Пришлось перелопатить больше 50 файлов стилей, проверить и изменить больше 200 изображений, переписать 10 файлов скриптов ( ладно тут цифра не настолько впечатляющая, но всё же).

Список изменений

Итак, что же всё таки изменилось с сайтом?

Изображения стали динамически подгружаться, только при прямой видимости.
Изменилась раскладка и структура сайта.
Были добавлены 2 других шрифта, для акцентирования и для заголовков.
Была выбрана и встроена строгая цветовая палитра сайта.
Решины проблемы с размером текста.
Все изображения теперь в формате webp или svg
Для боевого сервера все JS и СSS фалы минифицированы
Изменено отображение списка статей и их превьюшки

И ещё много много чего ещё, но там по мелочи. По типу изменить анимацию нажатия кнопок или исправить перевод.

Что изменилось, с изображениями

Боковое меню

Вот такое боковое меню было до, оно было справо и было не интерактивным.

И таким оно стало. Теперь оно интерактивное и слева

Футер

Футер до

Футер стал чуть более вменяемым, как стало.

Список статей

Список статей/постов ещё будет улучшаться. Я как минимум собираюсь поменять бесконечный скроллинг на пагинацию. Ибо по моему мнению, она больше понятна для человека (как минимум ты видишь сколько тебе осталось до конца) Да и для SEO и внутренней перелинковки, она предпочтительней.

Как было

Как стало

Заключение

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

Поэтому десять раз подумайте прежде чем встраивать ту или иную фичу на сайт.

Новый проект: SearchResultParser | Тим Вебмастер

Следующая статья

Новый улучшеный дизайн сайта

Предыдущая статья

Внешние ссылки

Другое

Использованные термины

Хостинг ⟶ Это услуга по предоставлению места на сервере и выделению, определённой заранее мощности ,этого сервера, с тем условием что этот сервер имеет постоянный доступ в интернет.
TailwindCSS фреймворк ⟶ Это CSS-фреймворк с открытым исходным кодом, созданный Адамом Уэтеном и поддерживаемый Tailwind Labs. Особенность этой библиотеки в том, что, она не предопределяет CSS-классы отдельных элементов. Вместо этого она предоставляет служебные классы, которые можно объединять для стилизации каждого элемента
Веб дизайн ⟶ Это процесс создания визуального оформления и пользовательского интерфейса веб-сайтов и веб-приложений. Он включает в себя несколько ключевых аспектов таких как: Эстетика, Функциональность, Юзабилити, Адаптивность, Интерактивность, Оптимизация.
CSS (Таблица каскадных стилей) ⟶ Это язык стилизации, который используется для описания внешнего вида и форматирования документов, написанных на HTML и XML (включая такие языки разметки, как SVG и XHTML). CSS позволяет веб-разработчикам и дизайнерам разделять содержание веб-страниц и их визуальное представление, что упрощает создание и поддержку сайтов.
Вебсайт ⟶ Это совокупность связанных между собой веб-страниц, доступных через интернет и имеющих одно общее доменное имя. Каждый веб-сайт может содержать текстовую информацию, изображения, видео и другие мультимедийные элементы. Веб-сайты могут выполнять различные функции, включая предоставление информации, общение, онлайн-торговлю и множество других взаимодействий.

Релевантные вопросы

Как отключить переходы глобально? Material UI использует тот же помощник темы для создания всех своих переходов. Поэтому вы можете отключить все переходы, переопределив помощника в своей теме.
Когда следует использовать встроенный стиль, а когда CSS? Используйте встроенные стили для динамических свойств стилей. Альтернатива CSS обеспечивает больше преимуществ, таких как автоматическое добавление префиксов, улучшенная отладка, медиа-запросы, ключевые кадры.