X   Сообщение сайта
(Сообщение закроется через 3 секунды)



 

Здравствуйте, гость (

| Вход | Регистрация )

Открыть тему
Добавить ответ в эту тему
> Какой алгоритм действий при верстке?
rownong27
rownong27
Topic Starter сообщение 3.7.2024, 19:10; Ответить: rownong27
Сообщение #1


Здравствуйте.

Только начинаю. Изучил HTML, CSS, немного JS.
Хочу научится верстке сайтов. Не знаю, как подступиться. Помогите разобраться.

Какой алгоритм действий при верстке?
Например у меня есть шаблон в фигме https://www.figma.com/design/XYNCnq1v1rRwM2...N0q2huJbb2h5T-0
Дальше какие шаги?

1) Мне надо понять какие создать div контейнеры и примерно визуально поделить макет на эти контейнеры?
2) А потом создавать эти контейнеры манипулируя свойствами каждого этого блочного элемента?
3) И при этом манипулировать z-индексами контейнеров чтобы накладывать их друг на друга?
4) Дальше нужно для этих контейнеров задать как они должны себя вести при разных разрешениях (медиа-запросах)?


5) Если проверять верстку после другого верстальщика как отличить нормальную верстку от кривой?
0
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
malamut
malamut
сообщение 3.7.2024, 23:49; Ответить: malamut
Сообщение #2


Цитата(rownong27 @ 3.7.2024, 17:10) *
1) Мне надо понять какие создать div контейнеры и примерно визуально поделить макет на эти контейнеры?
2) А потом создавать эти контейнеры манипулируя свойствами каждого этого блочного элемента?
3) И при этом манипулировать z-индексами контейнеров чтобы накладывать их друг на друга?
4) Дальше нужно для этих контейнеров задать как они должны себя вести при разных разрешениях (медиа-запросах)?

Да, как-то так.
Если практики нет совсем - начните с проекта попроще, постепенно усложняя.

Цитата(rownong27 @ 3.7.2024, 17:10) *
5) Если проверять верстку после другого верстальщика как отличить нормальную верстку от кривой?

Тут почти как с сантехниками/строителями - каждый следующий, видя результаты работы предыдущего, спрашивает "Какой недотёпа это делал?")


--------------------
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
KelvinM
KelvinM
сообщение 20.7.2024, 0:34; Ответить: KelvinM
Сообщение #3


rownong27, Хорошо, что ты начинаешь изучать верстку. Вот примерный алгоритм действий:

1) Да, сначала тебе нужно проанализировать макет и разделить его на логические блоки.

2) Верно, затем создаешь эти блоки с помощью div и настраиваешь их свойства через CSS.

3) Z-index может пригодиться для наложения элементов, но используй его осторожно.

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

5) Чтобы оценить качество верстки, обрати внимание на чистоту и логичность кода, проверь отображение на разных экранах. Хорошая верстка должна быть без лишнего кода и корректно работать везде.

Практика - ключ к успеху. Пробуй верстать разные макеты, это поможет тебе лучше понять процесс. Удачи в обучении!
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Открыть тему
Добавить ответ в эту тему
Быстрый ответ
2 чел. читают эту тему (гостей: 2, скрытых пользователей: 0)
Пользователей: 0


Свернуть

> Похожие темы

  Тема Ответов Автор Просмотров Последний ответ
Открытая тема (нет новых ответов) Какой полезный бесплатный сервис накодить для криптовалют?
2 Boymaster 567 Сегодня, 2:22
автор: malamut
Открытая тема (нет новых ответов) Выполню работу по современному дизайну и качественной адаптивной верстке (HTML/CSS/JS)
0 zaiko 286 14.10.2024, 18:40
автор: zaiko
Открытая тема (нет новых ответов) По какому курсу идет конвертация при оплате картой?
5 Mixatraider 1641 27.8.2024, 21:44
автор: Liudmila
Открытая тема (нет новых ответов) Судьба денег при блокировке акка Фейсбук и Googe
6 Nekit 2165 21.8.2024, 7:16
автор: Legitsms
Открытая тема (нет новых ответов) Через какой браузер и как можно найти в кэшэ браузера видео
17 Room 6046 16.8.2024, 17:33
автор: Room


 



RSS Текстовая версия Сейчас: 16.10.2024, 7:26
Дизайн