Π Π°Π·Π½ΠΎΠ΅

ΠœΠ°ΠΊΠ΅Ρ‚Ρ‹ для вСрстки: БСсплатныС ΡˆΠ°Π±Π»ΠΎΠ½Ρ‹ PSD HTML CSS

04.04.1970

Π‘ΠΎΠ΄Π΅Ρ€ΠΆΠ°Π½ΠΈΠ΅

БСсплатныС ΠΌΠ°ΠΊΠ΅Ρ‚Ρ‹ Figma для вСрстки сайта

ПолСзноС 1 min

ΠŸΡ€ΠΈΠ²Π΅Ρ‚! Figma ΡƒΠΆΠ΅ Π΄Π°Π²Π½ΠΎ ΠΏΡ€ΠΎΡ‡Π½ΠΎ Π²Π½Π΅Π΄Ρ€ΠΈΠ»Π°ΡΡŒ Π² Тизнь Π²Π΅Π±-Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚Ρ‡ΠΈΠΊΠΎΠ², это довольно удобная ΠΏΡ€ΠΎΠ³Ρ€Π°ΠΌΠΌΠ° ΠΊΠ°ΠΊ для создания Π΄ΠΈΠ·Π°ΠΉΠ½Π°, Ρ‚Π°ΠΊ ΠΈ для Π΅Π³ΠΎ использования. Π‘ΠΎΠ±Ρ€Π°Π» нСсколько бСсплатных ΠΌΠ°ΠΊΠ΅Ρ‚ΠΎΠ² для вСрстки сайта для вас!

Portfolio landing page

ΠœΠ°ΠΊΠ΅Ρ‚ ΠΏΠΎΡ€Ρ‚Ρ„ΠΎΠ»ΠΈΠΎ. Π‘Π»ΠΎΠΆΠ½ΠΎΡΡ‚ΡŒ низкая

Бсылка Π½Π° ΠΌΠ°ΠΊΠ΅Ρ‚

ΠšΠ»Π°ΡΡΠ½Ρ‹ΠΉ сайт для ΠΏΠΎΡ€Ρ‚Ρ„ΠΎΠ»ΠΈΠΎ, Π»ΠΈΡ‡Π½ΠΎ ΠΌΠ½Π΅ нравится простой ΠΈ чистый Π΄ΠΈΠ·Π°ΠΉΠ½.

Π‘Π»ΠΎΠΆΠ½ΠΎΡΡ‚ΡŒ: низкая

Clean simple landing page

ΠœΠ°ΠΊΠ΅Ρ‚ productivity. Π‘Π»ΠΎΠΆΠ½ΠΎΡΡ‚ΡŒ срСдняя

Бсылка Π½Π° ΠΌΠ°ΠΊΠ΅Ρ‚

Π”ΠΎΠ²ΠΎΠ»ΡŒΠ½ΠΎ простой ΠΏΠΎ Π΄ΠΈΠ·Π°ΠΉΠ½Ρƒ, Π½ΠΎ Π½Π΅ самый простой Π² ΠΏΠ»Π°Π½Π΅ вСрстки сайт. Π•ΡΡ‚ΡŒ Ρ‡Ρ‚ΠΎ ΠΎΡ‚Ρ€Π°Π±ΠΎΡ‚Π°Ρ‚ΡŒ (Π΄Π΅ΠΊΠΎΡ€Π°Ρ‚ΠΈΠ²Π½Ρ‹Π΅ элСмСнты, слайдСры ΠΈ Ρ‚.Π΄.)

Π‘Π»ΠΎΠΆΠ½ΠΎΡΡ‚ΡŒ: срСдняя

Client chat

ΠœΠ°ΠΊΠ΅Ρ‚ client chat. Π‘Π»ΠΎΠΆΠ½ΠΎΡΡ‚ΡŒ срСдняя

Бсылка Π½Π° ΠΌΠ°ΠΊΠ΅Ρ‚

ΠžΠΎΠΎΡ‡Π΅Π½ΡŒ ΠΏΠΎΡ…ΠΎΠΆΠ΅ Π½Π° мСссСндТСр Slack πŸ™‚ Но Ρ‚Π΅ΠΌ Π½Π΅ ΠΌΠ΅Π½Π΅Π΅, интСрСсно Ρ‚Π°ΠΊΠΎΠ΅ ΡΠ²Π΅Ρ€ΡΡ‚Π°Ρ‚ΡŒ, особСнно Π² ΠΏΠ»Π°Π½Π΅ сСмантики.

Π‘Π»ΠΎΠΆΠ½ΠΎΡΡ‚ΡŒ: срСдняя

Restaurant template

ΠœΠ°ΠΊΠ΅Ρ‚ рСсторана. Π‘Π»ΠΎΠΆΠ½ΠΎΡΡ‚ΡŒ срСдняя

Бсылка Π½Π° ΠΌΠ°ΠΊΠ΅Ρ‚

НСплохой одностраничник Π½Π° Ρ‚Π΅ΠΌΡƒ рСсторана. Π’Π°ΠΊ ΠΆΠ΅ Π΅ΡΡ‚ΡŒ Π½Π΅ΠΌΠ°Π»ΠΎ ΠΌΠ΅Π»ΠΎΡ‡Π΅ΠΉ, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ ΠΌΠΎΠΆΠ½ΠΎ ΠΎΡ‚Ρ€Π°Π±ΠΎΡ‚Π°Ρ‚ΡŒ.

Π‘Π»ΠΎΠΆΠ½ΠΎΡΡ‚ΡŒ: срСдняя

Valorant concept

ΠœΠ°ΠΊΠ΅Ρ‚ valorant. Π‘Π»ΠΎΠΆΠ½ΠΎΡΡ‚ΡŒ высокая

Бсылка Π½Π° ΠΌΠ°ΠΊΠ΅Ρ‚

ΠšΠΎΠ½Ρ†Π΅ΠΏΡ‚ ΠΏΠΎ Π½Π΅Π΄Π°Π²Π½ΠΎ Π²Ρ‹ΡˆΠ΅Π΄ΡˆΠ΅ΠΉ ΠΈΠ³Ρ€Π΅ Valorant. Π’ Ρ†Π΅Π»ΠΎΠΌ, это Π½Π΅ совсСм ΠΌΠ°ΠΊΠ΅Ρ‚ сайта, Π½ΠΎ ΠΌΠ½Π΅ Π΄ΠΈΠ·Π°ΠΉΠ½ нравится, ΠΈ Π² ΠΏΡ€ΠΈΠ½Ρ†ΠΈΠΏΠ΅, ΠΌΠΎΠΆΠ½ΠΎ ΠΏΠΎΠ΄ сСбя ΠΏΠ΅Ρ€Π΅Π΄Π΅Π»Π°Ρ‚ΡŒ. Для ΠΏΡ€Π°ΠΊΡ‚ΠΈΠΊΠΈ β€” самоС Ρ‚ΠΎ)

Π‘Π»ΠΎΠΆΠ½ΠΎΡΡ‚ΡŒ: высокая (Ρ‚ΠΎΠ»ΡŒΠΊΠΎ ΠΈΠ·-Π·Π° нСстандартного ΠΌΠ°ΠΊΠ΅Ρ‚Π°)

Thrivetalk landing page

ΠœΠ°ΠΊΠ΅Ρ‚ Thrivetalk. Π‘Π»ΠΎΠΆΠ½ΠΎΡΡ‚ΡŒ низкая

Бсылка Π½Π° ΠΌΠ°ΠΊΠ΅Ρ‚

ΠŸΡ€ΠΎΡΡ‚ΠΎΠΉ Π»Π΅Π½Π΄ΠΈΠ½Π³, для ΠΎΡ‚Ρ€Π°Π±ΠΎΡ‚ΠΊΠΈ сСток (flexbox) самоС Ρ‚ΠΎ)

Π‘Π»ΠΎΠΆΠ½ΠΎΡΡ‚ΡŒ: низкая

Пока это всС, Π½Π° самом Π΄Π΅Π»Π΅ Π½Π°ΠΉΡ‚ΠΈ Π°Π΄Π΅ΠΊΠ²Π°Ρ‚Π½Ρ‹Π΅ ΠΌΠ°ΠΊΠ΅Ρ‚Ρ‹ для figma Π½Π΅ Ρ‚Π°ΠΊ ΡƒΠΆ ΠΈ просто, Π½ΠΎ Π±ΡƒΠ΄Π΅ΠΌ ΡΡ‚Π°Ρ€Π°Ρ‚ΡŒΡΡ) Если ΠΆΠ΅ Π²Ρ‹ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ Π΅Ρ‰Π΅, ΠΈΠ»ΠΈ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ сборник psd-ΠΌΠ°ΠΊΠ΅Ρ‚ΠΎΠ² ΠΎΡ‚ мСня β€” ΠΏΠΈΡˆΠΈΡ‚Π΅ Π² ΠΊΠΎΠΌΠΌΠ΅Π½Ρ‚Π°Ρ€ΠΈΠΈ, ΠΈ всС Π±ΡƒΠ΄Π΅Ρ‚!

ВсСм Π΄ΠΎΠ±Ρ€Π°, ΡƒΠ΄Π°Ρ‡ΠΈ Π² вСрсткС ΠΌΠ°ΠΊΠ΅Ρ‚ΠΎΠ²)

Об Π°Π²Ρ‚ΠΎΡ€Π΅ Π±Π»ΠΎΠ³Π°

MaxGraph

Автор. Π’Π΅Π±-Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚Ρ‡ΠΈΠΊ. ЀрилансСр. ΠŸΡ€Π΅ΠΏΠΎΠ΄Π°Π²Π°Ρ‚Π΅Π»ΡŒ Π² ΠΎΠ½Π»Π°ΠΉΠ½-унивСрситСтС.

ΠŸΠΎΡ€Ρ‚Ρ„ΠΎΠ»ΠΈΠΎ: https://maxgraph.ru/
Π”ΠΎΠ±Π°Π²Π»ΡΠΉΡ‚Π΅ΡΡŒ Π² Π΄Ρ€ΡƒΠ·ΡŒΡ VK! ΠšΠ°ΠΆΠ΄ΠΎΠΌΡƒ Π΄ΠΎΠ±Π°Π²ΠΈΠ²ΡˆΠ΅ΠΌΡƒΡΡ ΠΈ Π½Π°ΠΏΠΈΡΠ°Π²ΡˆΠ΅ΠΌΡƒ Π² Π»ΠΈΡ‡ΠΊΡƒ Β«Ρ…ΠΎΡ‡Ρƒ ΠΏΠΎΠ»Π΅Π·Π½ΠΎΡΡ‚ΡŒΒ» β€” ΠΏΠΎΠ΄Π°Ρ€ΡŽ Π½Π°Π±ΠΎΡ€ ΠΊΡ€ΡƒΡ‚Ρ‹Ρ… ссылок для Π²Π΅Ρ€ΡΡ‚Π°Π»ΡŒΡ‰ΠΈΠΊΠ°.

Как ΠΌΡ‹ собираСм ΠΌΠ°ΠΊΠ΅Ρ‚Ρ‹ ΠΏΠΎ Π°Π»Π³ΠΎΡ€ΠΈΡ‚ΠΌΡƒ вСрстки | by Igor Shtang

РасскаТу ΠΎΠ± ΠΎΠ΄Π½ΠΎΠΌ Π·Π°Π΄Π°Π½ΠΈΠΈ с мастСр-класса Β«Π‘ΠΎΠ»ΡŒΡˆΠ°Ρ пСрСвСрстка» β€” ΠΊΠ°ΠΊ ΠΌΡ‹ собираСм ΠΌΠ°ΠΊΠ΅Ρ‚Ρ‹ ΠΏΠΎ Π°Π»Π³ΠΎΡ€ΠΈΡ‚ΠΌΡƒ вСрстки. Π­Ρ‚ΠΎ ΠΌΠ΅Ρ‚ΠΎΠ΄, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ я описал Π² ΠΎΠ΄Π½ΠΎΠΈΠΌΠ΅Π½Π½ΠΎΠΉ ΡΡ‚Π°Ρ‚ΡŒΠ΅. Если ΠΊΠΎΡ€ΠΎΡ‚ΠΊΠΎ, порядок дСйствий Ρ‚Π°ΠΊΠΎΠΉ: содСрТаниС β†’ структура β†’ конструкция β†’ ΡΡ‚ΠΈΠ»ΡŒ.

НиТС Π΄Π²Π° ΠΏΡ€ΠΈΠΌΠ΅Ρ€Π° с МК Π² НовосибирскС.

Π‘ΠΎΠ΄Π΅Ρ€ΠΆΠ°Π½ΠΈΠ΅
На Π²Ρ…ΠΎΠ΄Π΅ Ρƒ всСх участников ΠΎΠ΄ΠΈΠ½ ΠΈ Ρ‚ΠΎΡ‚ ΠΆΠ΅ тСкст, Π² Π΄Π°Π½Π½ΠΎΠΌ случаС ΠΎ бонусной ΠΏΡ€ΠΎΠ³Ρ€Π°ΠΌΠΌΠ΅ ΠΈΠ½Ρ‚Π΅Ρ€Π½Π΅Ρ‚-ΠΌΠ°Π³Π°Π·ΠΈΠ½Π°. На Π²Ρ‹Ρ…ΠΎΠ΄Π΅ ΠΈΠ· Π½Π΅Π³ΠΎ Π΄ΠΎΠ»ΠΆΠ΅Π½ ΠΏΠΎΠ»ΡƒΡ‡ΠΈΡ‚ΡŒΡΡ слайд элСктронной ΠΏΡ€Π΅Π·Π΅Π½Ρ‚Π°Ρ†ΠΈΠΈ. Π—Π°Π΄Π°Ρ‡Π° Π½Π° ΠΏΠ΅Ρ€Π²ΠΎΠΌ этапС β€” Ρ€Π°Π·ΠΎΠ±Ρ€Π°Ρ‚ΡŒΡΡ Π² содСрТании:

Бонусная ΠΏΡ€ΠΎΠ³Ρ€Π°ΠΌΠΌΠ°

Π‘Π΄Π΅Π»Π°Π»ΠΈ Π·Π°ΠΊΠ°Π· Π² нашСм Π˜Π½Ρ‚Π΅Ρ€Π½Π΅Ρ‚-ΠΌΠ°Π³Π°Π·ΠΈΠ½Π΅? ΠŸΠΎΠ·Π΄Ρ€Π°Π²Π»ΡΠ΅ΠΌ! Π’Ρ‹ стали участником бонусной ΠΏΡ€ΠΎΠ³Ρ€Π°ΠΌΠΌΡ‹! УчастиС Π² ΠΏΡ€ΠΎΠ³Ρ€Π°ΠΌΠΌΠ΅ Π½ΠΈΡ‡Π΅Π³ΠΎ Π½Π΅ Ρ‚Ρ€Π΅Π±ΡƒΠ΅Ρ‚ ΠΎΡ‚ Вас ΠΈ ΠΏΡ€ΠΈ ΠΆΠ΅Π»Π°Π½ΠΈΠΈ Π²Ρ‹ смоТСтС ΠΏΠΎΡ‚Ρ€Π°Ρ‚ΠΈΡ‚ΡŒ Π½Π°ΠΊΠΎΠΏΠ»Π΅Π½Π½Ρ‹Π΅ Π±Π°Π»Π»Ρ‹ Π½Π° ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΡƒΡŽ ΠΏΠΎΠΊΡƒΠΏΠΊΡƒ Π² нашСм Π˜Π½Ρ‚Π΅Ρ€Π½Π΅Ρ‚-ΠΌΠ°Π³Π°Π·ΠΈΠ½Π΅. Для накоплСния Π±Π°Π»Π»ΠΎΠ² просто Π΄Π΅Π»Π°ΠΉΡ‚Π΅ Π·Π°ΠΊΠ°Π·Ρ‹ ΠΏΠΎΠ΄ ΠΎΠ΄Π½ΠΈΠΌ ΠΈ Ρ‚Π΅ΠΌ ΠΆΠ΅ Π°ΠΊΠΊΠ°ΡƒΠ½Ρ‚ΠΎΠΌ ΠΏΡ€ΠΈ ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΠΈΡ… ΠΏΠΎΠΊΡƒΠΏΠΊΠ°Ρ…!

ΠšΠ°ΠΆΠ΄Ρ‹ΠΉ Ρ€Π°Π· ΠΏΡ€ΠΈ ΡΠΎΠ²Π΅Ρ€ΡˆΠ΅Π½ΠΈΠΈ ΠΏΠΎΠΊΡƒΠΏΠΊΠΈ Π’Ρ‹ автоматичСски ΠΏΠΎΠ»ΡƒΡ‡Π°Π΅Ρ‚Π΅ 10% ΠΎΡ‚ стоимости Ρ‚ΠΎΠ²Π°Ρ€Π° бонусными Π±Π°Π»Π»Π°ΠΌΠΈ. Π‘Π°Π»Π»Ρ‹, ΠΏΠΎΠ»ΡƒΡ‡Π΅Π½Π½Ρ‹Π΅ послС ΠΎΠΏΠ»Π°Ρ‚Ρ‹ Π·Π°ΠΊΠ°Π·Π° станут Π°ΠΊΡ‚ΠΈΠ²Π½Ρ‹ΠΌΠΈ Ρ‡Π΅Ρ€Π΅Π· 14 Π΄Π½Π΅ΠΉ ΠΈ смогут Π±Ρ‹Ρ‚ΡŒ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Π½Ρ‹ Π² ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΠΈΡ… Π·Π°ΠΊΠ°Π·Π°Ρ…. ΠœΡ‹ с ΡƒΠ΄ΠΎΠ²ΠΎΠ»ΡŒΡΡ‚Π²ΠΈΠ΅ΠΌ Π½Π°ΠΏΠΎΠΌΠ½ΠΈΠΌ Π’Π°ΠΌ ΠΎΠ± Π°ΠΊΡ‚ΠΈΠ²Π°Ρ†ΠΈΠΈ Π±Π°Π»Π»ΠΎΠ² Π½Π° счСту элСктронным письмом. Но, стоит ΠΏΠΎΠΌΠ½ΠΈΡ‚ΡŒ, Ρ‡Ρ‚ΠΎ срок дСйствия бонусных Π±Π°Π»Π»ΠΎΠ² ΠΎΠ³Ρ€Π°Π½ΠΈΡ‡Π΅Π½ ΠΈ составляСт 11 мСсяцСв с ΠΌΠΎΠΌΠ΅Π½Ρ‚Π° ΠΈΡ… Π°ΠΊΡ‚ΠΈΠ²Π°Ρ†ΠΈΠΈ.

Один бонусный Π±Π°Π»Π» = ΠžΠ΄Π½ΠΎΠΌΡƒ Ρ€ΡƒΠ±Π»ΡŽ Π Π€.
Π’Ρ‹ смоТСтС ΠΎΠΏΠ»Π°Ρ‚ΠΈΡ‚ΡŒ Π΄ΠΎ 30% суммы Π·Π°ΠΊΠ°Π·Π° Π½Π°ΠΊΠΎΠΏΠ»Π΅Π½Π½Ρ‹ΠΌΠΈ Ρ€Π°Π½Π΅Π΅ бонусными Π±Π°Π»Π»Π°ΠΌΠΈ. Бонусами Π²Ρ‹ смоТСтС ΠΎΠΏΠ»Π°Ρ‚ΠΈΡ‚ΡŒ любой Ρ‚ΠΎΠ²Π°Ρ€ ΠΈΠ· ассортимСнта Π˜Π½Ρ‚Π΅Ρ€Π½Π΅Ρ‚-ΠΌΠ°Π³Π°Π·ΠΈΠ½Π°, ΠΊΡ€ΠΎΠΌΠ΅: ΠΏΠΎΠ΄Π°Ρ€ΠΎΡ‡Π½Ρ‹Ρ… сСртификатов, услуг доставки ΠΈ Ρ€Π΅ΠΌΠΎΠ½Ρ‚Π°. ИспользованиС бонусных Π±Π°Π»Π»ΠΎΠ² для ΠΎΠΏΠ»Π°Ρ‚Ρ‹ ΠΏΠΎΠΊΡƒΠΏΠΊΠΈ совмСщаСтся с Π»ΡŽΠ±Ρ‹ΠΌΠΈ акциями Π½Π° нашСм сайтС. Π’ случаС Π²ΠΎΠ·Π²Ρ€Π°Ρ‚Π° Ρ‚ΠΎΠ²Π°Ρ€Π°, бонусныС Π±Π°Π»Π»Ρ‹ Π±ΡƒΠ΄ΡƒΡ‚ Π²ΠΎΠ·Π²Ρ€Π°Ρ‰Π΅Π½Ρ‹ Π½Π° ваш бонусный счСт.

Π‘Ρ‚Ρ€ΡƒΠΊΡ‚ΡƒΡ€Π°
Π’Ρ‚ΠΎΡ€ΠΎΠΉ шаг β€” привСсти Π² порядок структуру: Ρ€Π΅ΡˆΠΈΡ‚ΡŒ, Ρ‡Ρ‚ΠΎ здСсь Π²Π°ΠΆΠ½ΠΎ, Ρ‡Ρ‚ΠΎ Π½Π΅Ρ‚, Π½Π° ΠΊΠ°ΠΊΠΈΠ΅ части Ρ€Π°Π·Π΄Π΅Π»ΠΈΡ‚ΡŒ тСкст, Π² ΠΊΠ°ΠΊΠΎΠΉ ΠΏΠΎΡΠ»Π΅Π΄ΠΎΠ²Π°Ρ‚Π΅Π»ΡŒΠ½ΠΎΡΡ‚ΠΈ ΠΏΠΎΠ΄Π°Π²Π°Ρ‚ΡŒ ΠΈΠ½Ρ„ΠΎΡ€ΠΌΠ°Ρ†ΠΈΡŽ. На этом этапС Π½ΠΈΡ‡Π΅Π³ΠΎ Π½Π΅ рисуСм, просто пСрСписываСм тСкст ΠΈ ΠΎΡ‚ΠΆΠΈΠΌΠ°Π΅ΠΌ Π²ΠΎΠ΄Ρƒ. На всё 20 ΠΌΠΈΠ½ΡƒΡ‚.

АлСксандр Π²Ρ‹Π΄Π΅Π»ΠΈΠ» Π΄Π²Π° основных Π±Π»ΠΎΠΊΠ° (ΠΏΠΎΠ΄ ΠΆΠΈΡ€Π½Ρ‹ΠΌΠΈ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ°ΠΌΠΈ): ΠΎΠ΄ΠΈΠ½ ΠΏΡ€ΠΎ Π½Π°ΠΊΠΎΠΏΠ»Π΅Π½ΠΈΠ΅ бонусов, Π²Ρ‚ΠΎΡ€ΠΎΠΉ ΠΏΡ€ΠΎ ΠΈΡ… Ρ‚Ρ€Π°Ρ‚Ρƒ. Π’ Π½Π°Ρ‡Π°Π»Π΅ нСбольшоС вступлСниС, Π² ΠΊΠΎΠ½Ρ†Π΅ Ρ‡Ρ‚ΠΎ-Ρ‚ΠΎ Π²Ρ€ΠΎΠ΄Π΅ примСчания. ВСкст стал ΠΊΠΎΡ€ΠΎΡ‡Π΅ ΠΏΠΎΡ‡Ρ‚ΠΈ Π² Ρ‚Ρ€ΠΈ Ρ€Π°Π·Π°, ΠΏΡ€ΠΈ этом всС условия бонусной ΠΏΡ€ΠΎΠ³Ρ€Π°ΠΌΠΌΡ‹ Π½Π° мСстС:

Π’Ρ‹ стали участником бонусной ΠΏΡ€ΠΎΠ³Ρ€Π°ΠΌΠΌΡ‹!
Для накоплСния Π±Π°Π»Π»ΠΎΠ² ΠΏΡ€ΠΎΠ΄ΠΎΠ»ΠΆΠ°ΠΉΡ‚Π΅ ΠΏΠΎΠΊΡƒΠΏΠ°Ρ‚ΡŒ Ρ‚ΠΎΠ²Π°Ρ€Ρ‹ с этого Π°ΠΊΠΊΠ°ΡƒΠ½Ρ‚Π°.

Π’Π΅ΠΏΠ΅Ρ€ΡŒ Π’Ρ‹ ΠΏΠΎΠ»ΡƒΡ‡Π°Π΅Ρ‚Π΅ 10% ΠΎΡ‚ стоимости Ρ‚ΠΎΠ²Π°Ρ€Π° бонусными Π±Π°Π»Π»Π°ΠΌΠΈ
Π‘Π°Π»Π»Ρ‹, ΠΏΠΎΠ»ΡƒΡ‡Π΅Π½Π½Ρ‹Π΅ послС ΠΎΠΏΠ»Π°Ρ‚Ρ‹ Π·Π°ΠΊΠ°Π·Π°, станут Π°ΠΊΡ‚ΠΈΠ²Π½Ρ‹ΠΌΠΈ Ρ‡Π΅Ρ€Π΅Π· 14 Π΄Π½Π΅ΠΉ ΠΈ Π΄Π΅ΠΉΡΡ‚Π²ΡƒΡŽΡ‚ Π² Ρ‚Π΅Ρ‡Π΅Π½ΠΈΠ΅ 11 мСсяцСв.

ΠžΠΏΠ»Π°Ρ‡ΠΈΠ²Π°ΠΉΡ‚Π΅ Π΄ΠΎ 30% ΠΎΡ‚ суммы Π·Π°ΠΊΠ°Π·Π°
БонусныС Π±Π°Π»Π»Ρ‹ ΠΌΠΎΠΆΠ½ΠΎ Ρ‚Ρ€Π°Ρ‚ΠΈΡ‚ΡŒ Π²ΠΎ врСмя всСх Π°ΠΊΡ†ΠΈΠΉ ΠΌΠ°Π³Π°Π·ΠΈΠ½Π°.
ΠŸΡ€ΠΈ Π²ΠΎΠ·Π²Ρ€Π°Ρ‚Π° Ρ‚ΠΎΠ²Π°Ρ€Π° β€” Π²Π΅Ρ€Π½Ρ‘ΠΌ Π±Π°Π»Π»Ρ‹.

Бонусами нСльзя ΠΎΠΏΠ»Π°Ρ‚ΠΈΡ‚ΡŒ:
β€” ΠΏΠΎΠ΄Π°Ρ€ΠΎΡ‡Π½Ρ‹Π΅ сСртификаты,
β€” услуги доставки ΠΈ Ρ€Π΅ΠΌΠΎΠ½Ρ‚Π°.

ΠšΠΎΠ½ΡΡ‚Ρ€ΡƒΠΊΡ†ΠΈΡ
На основС структуры собираСм скСлСт Π±ΡƒΠ΄ΡƒΡ‰Π΅Π³ΠΎ ΠΌΠ°ΠΊΠ΅Ρ‚Π°. Π Π°Π·ΠΌΠ΅Ρ‰Π°Π΅ΠΌ тСкст Π½Π° Ρ„ΠΎΡ€ΠΌΠ°Ρ‚Π΅, оставляСм мСсто для ΠΊΠ°Ρ€Ρ‚ΠΈΠ½ΠΊΠΈ. ΠžΡ„ΠΎΡ€ΠΌΠ»Π΅Π½ΠΈΠ΅ условноС, Π±Π΅Π· ΠΏΡ€ΠΎΡ€Π°Π±ΠΎΡ‚ΠΊΠΈ. ВрСмя 30 ΠΌΠΈΠ½ΡƒΡ‚.

ВСрстка ΠΌΠ°ΠΊΠ΅Ρ‚Π° β€” ΠŸΡ€ΠΈΠ½Ρ†ΠΈΠΏΡ‹ β€” ΠšΠΎΠ½Ρ‚ΡƒΡ€.Π“Π°ΠΉΠ΄Ρ‹

Π’ ΠΏΡ€ΠΎΠ΄ΡƒΠΊΡ‚ΠΎΠ²ΠΎΠΉ Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚ΠΊΠ΅ Π²Π°ΠΆΠ½ΠΎ Π½Π΅ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ Ρ‚ΠΎ, ΠΊΠ°ΠΊ ΠΌΠ°ΠΊΠ΅Ρ‚ выглядит, Π½ΠΎ ΠΈ ΠΊΠ°ΠΊ ΠΎΠ½ ΠΎΡ€Π³Π°Π½ΠΈΠ·ΠΎΠ²Π°Π½: ΠΊΠ°ΠΊ сгруппированы ΠΎΠ±ΡŠΠ΅ΠΊΡ‚Ρ‹ ΠΈ Π½Π°Π·Π²Π°Π½Ρ‹ слои. На ΠΏΠ΅Ρ€Π²Ρ‹ΠΉ взгляд созданиС ΠΌΠ°ΠΊΠ΅Ρ‚Π° Π±Π΅Π· оглядки Π½Π° структуру слоёв экономит врСмя. Но Π² дальнСйшСм Ρ‚Π°ΠΊΠΎΠΉ ΠΌΠ°ΠΊΠ΅Ρ‚ Π±ΡƒΠ΄Π΅Ρ‚ слоТнСС Β«Ρ‡ΠΈΡ‚Π°Ρ‚ΡŒΒ» Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚Ρ‡ΠΈΠΊΠ°ΠΌ ΠΈ ΠΏΠΎΠ΄Π΄Π΅Ρ€ΠΆΠΈΠ²Π°Ρ‚ΡŒ Π΄ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€Π°ΠΌ.

ΠœΡ‹ ΠΏΡ€ΠΈΠ·Ρ‹Π²Π°Π΅ΠΌ ΠΎΡ€Π³Π°Π½ΠΈΠ·ΠΎΠ²Ρ‹Π²Π°Ρ‚ΡŒ структуру ΠΌΠ°ΠΊΠ΅Ρ‚Π° Ρ‚Π°ΠΊΠΈΠΌ ΠΎΠ±Ρ€Π°Π·ΠΎΠΌ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΎΠ½Π° Π±Ρ‹Π»Π° ΠΏΠΎΡ…ΠΎΠΆΠ° Π½Π° html-вёрстку. Π’Π°ΠΊΠΎΠΉ ΠΏΠΎΠ΄Ρ…ΠΎΠ΄ ΠΏΠΎΠΌΠΎΠ³Π°Π΅Ρ‚:

  • БистСмно ΠΌΡ‹ΡΠ»ΠΈΡ‚ΡŒ. Π›ΡƒΡ‡ΡˆΠ΅ ΠΏΡ€ΠΎΠ΄ΡƒΠΌΡ‹Π²Π°Ρ‚ΡŒ Π΄Π΅Ρ‚Π°Π»ΠΈ Ρ€Π΅Π°Π»ΠΈΠ·Π°Ρ†ΠΈΠΈ ΠΈ ΠΊΡ€Π°Π΅Π²Ρ‹Π΅ случаи Π΅Ρ‰Ρ‘ Π½Π° этапС Π΄ΠΈΠ·Π°ΠΉΠ½Π°.
  • Π£ΡΠΊΠΎΡ€ΡΡ‚ΡŒ Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚ΠΊΡƒ. Π Π°Π·Ρ€Π°Π±ΠΎΡ‚Ρ‡ΠΈΠΊ Π²ΠΈΠ΄ΠΈΡ‚ закономСрности ΠΈ ΠΈΠ΅Ρ€Π°Ρ€Ρ…ΠΈΡŽ сущностСй. Π‘Π°ΠΌΠΎΠ΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚ΠΈΡ€ΡƒΠ΅ΠΌΡ‹ΠΉ ΠΌΠ°ΠΊΠ΅Ρ‚ Ρ‚Ρ€Π΅Π±ΡƒΠ΅Ρ‚ мСньшС пояснСний ΠΈ ΠΊΠΎΠΌΠΌΠ΅Π½Ρ‚Π°Ρ€ΠΈΠ΅Π² Π½Π° полях. Π’Π°ΠΊΠΆΠ΅ ΡƒΠΌΠ΅Π½ΡŒΡˆΠ°Π΅Ρ‚ΡΡ количСство ΠΏΡ€Π°Π²ΠΎΠΊ ΠΏΡ€ΠΈ тСстировании.

    Π‘Π°ΠΌΠΎΠ΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚ΠΈΡ€ΡƒΠ΅ΠΌΡ‹ΠΌ Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚Ρ‡ΠΈΠΊΠΈ Π½Π°Π·Ρ‹Π²Π°ΡŽΡ‚ ΠΊΠΎΠ΄ Π½Π°ΡΡ‚ΠΎΠ»ΡŒΠΊΠΎ понятный, Ρ‡Ρ‚ΠΎ ΠΊ Π½Π΅ΠΌΡƒ Π½Π΅ Π½ΡƒΠΆΠ½Ρ‹ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡ‚Π΅Π»ΡŒΠ½Ρ‹Π΅ ΠΊΠΎΠΌΠΌΠ΅Π½Ρ‚Π°Ρ€ΠΈΠΈ. Π—Π΄Π΅ΡΡŒ ΠΌΡ‹ ΠΏΡ€ΠΈΠΌΠ΅Π½ΠΈΠ»ΠΈ этот Ρ‚Π΅Ρ€ΠΌΠΈΠ½ ΠΊ ΠΌΠ°ΠΊΠ΅Ρ‚Π°ΠΌ.

  • Π”ΠΎΡ€Π°Π±Π°Ρ‚Ρ‹Π²Π°Ρ‚ΡŒ Π΄ΠΈΠ·Π°ΠΉΠ½ Π² Π±ΡƒΠ΄ΡƒΡ‰Π΅ΠΌ. Π›Π΅Π³Ρ‡Π΅ ΠΏΠΎΠ΄Π΄Π΅Ρ€ΠΆΠΈΠ²Π°Ρ‚ΡŒ ΠΈ Π΄ΠΎΡ€Π°Π±Π°Ρ‚Ρ‹Π²Π°Ρ‚ΡŒ ΠΌΠ°ΠΊΠ΅Ρ‚, особСнно ΠΊΠΎΠ³Π΄Π° ΠΏΡ€ΠΎΠ΅ΠΊΡ‚ΠΈΡ€ΠΎΠ²Ρ‰ΠΈΠΊΠΎΠ² Π² ΠΊΠΎΠΌΠ°Π½Π΄Π΅ нСсколько.

Блочная модСль html-вёрстки

Html-вёрстка ΠΈΠΌΠ΅Π΅Ρ‚ Π±Π»ΠΎΡ‡Π½ΡƒΡŽ структуру: всС элСмСнты β€” это ΠΏΡ€ΡΠΌΠΎΡƒΠ³ΠΎΠ»ΡŒΠ½Ρ‹Π΅ ΠΊΠΎΠ½Ρ‚Π΅ΠΉΠ½Π΅Ρ€Ρ‹, ΠΈΠ΄ΡƒΡ‰ΠΈΠ΅ Π² ΠΏΠΎΡ‚ΠΎΠΊΠ΅ Π΄Ρ€ΡƒΠ³ Π·Π° Π΄Ρ€ΡƒΠ³ΠΎΠΌ. Они ΠΌΠΎΠ³ΡƒΡ‚ Ρ€Π°ΡΠΏΠΎΠ»Π°Π³Π°Ρ‚ΡŒΡΡ ΠΏΠΎ Π²Π΅Ρ€Ρ‚ΠΈΠΊΠ°Π»ΠΈ ΠΈΠ»ΠΈ ΠΏΠΎ Π³ΠΎΡ€ΠΈΠ·ΠΎΠ½Ρ‚Π°Π»ΠΈ. ΠšΠ°ΠΆΠ΄Ρ‹ΠΉ элСмСнт ΠΌΠΎΠΆΠ΅Ρ‚ ΡΠΎΠ΄Π΅Ρ€ΠΆΠ°Ρ‚ΡŒ Π² сСбС Π΄Ρ€ΡƒΠ³ΠΈΠ΅ элСмСнты, ΠΈ ΠΎΠ½ΠΈ Ρ‚Π°ΠΊΠΆΠ΅ Π±ΡƒΠ΄ΡƒΡ‚ ΠΆΠΈΡ‚ΡŒ ΠΏΠΎ Π·Π°ΠΊΠΎΠ½Π°ΠΌ Π±Π»ΠΎΡ‡Π½ΠΎΠΉ структуры.

Π‘ΡƒΡ‰Π΅ΡΡ‚Π²ΡƒΡŽΡ‚ особыС случаи, ΠΊΠΎΠ³Π΄Π° ΠΌΠΎΠΆΠ½ΠΎ ΠΏΠΎΠ»ΠΎΠΆΠΈΡ‚ΡŒ элСмСнт ΠΏΠΎΠ²Π΅Ρ€Ρ… Π±Π»ΠΎΡ‡Π½ΠΎΠΉ структуры. Для этого ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅Ρ‚ΡΡ свойство position. ПовСдСниС Ρ‚Π°ΠΊΠΈΡ… элСмСнтов Π² Π΄ΠΈΠ½Π°ΠΌΠΈΠΊΠ΅ Π½Π°Π΄ΠΎ ΠΏΡ€ΠΎΠ΄ΡƒΠΌΡ‹Π²Π°Ρ‚ΡŒ ΠΎΡ‚Π΄Π΅Π»ΡŒΠ½ΠΎ.

По ΡƒΠΌΠΎΠ»Ρ‡Π°Π½ΠΈΡŽ Ρƒ элСмСнтов Π½Π΅Ρ‚ отступов Π²Π½ΡƒΡ‚Ρ€ΠΈ ΠΈ снаруТи, Π½ΠΎ ΠΈΡ… ΠΌΠΎΠΆΠ½ΠΎ Π½Π°ΡΡ‚Ρ€ΠΎΠΈΡ‚ΡŒ. Для этого Π΅ΡΡ‚ΡŒ ΡΠΏΠ΅Ρ†ΠΈΠ°Π»ΡŒΠ½Ρ‹Π΅ css-Π°Ρ‚Ρ€ΠΈΠ±ΡƒΡ‚Ρ‹:

  • Padding β€” это отступ ΠΎΡ‚ ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚Π° Π΄ΠΎ края Π±Π»ΠΎΠΊΠ°.
  • Border β€” ΠΎΠ±Π²ΠΎΠ΄ΠΊΠ°.
  • Margin β€” отступы Π΄ΠΎ сосСдних элСмСнтов.

Π‘ΠΎΠ΄Π΅Ρ€ΠΆΠΈΠΌΠΎΠ΅ β€” это сам ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚, Π΅Π³ΠΎ Ρ€Π°Π·ΠΌΠ΅Ρ€Ρ‹ ΠΌΠΎΠ³ΡƒΡ‚ Π±Ρ‹Ρ‚ΡŒ Тёстко Π·Π°Π΄Π°Π½Ρ‹ ΠΈΠ»ΠΈ Π·Π°Π²ΠΈΡΠ΅Ρ‚ΡŒ ΠΎΡ‚ условий: Ρ€Π°Π·ΠΌΠ΅Ρ€Π° экрана, количСства символов тСкста ΠΈ ΠΏΡ€.

ΠŸΡ€ΠΈ вёрсткС ΠΌΠ°ΠΊΠ΅Ρ‚Π° ΡƒΡ‡ΠΈΡ‚Ρ‹Π²Π°ΠΉΡ‚Π΅ эти ΠΏΡ€ΠΈΠ½Ρ†ΠΈΠΏΡ‹: ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ Π°Π²Ρ‚ΠΎΠ»Π΅ΠΉΠ°ΡƒΡ‚Ρ‹ (Π°Π½Π°Π»ΠΎΠ³ padding ΠΈ margin) ΠΈ констрСйнсы. Π­Ρ‚ΠΎ ΠΏΠΎΠΌΠΎΠΆΠ΅Ρ‚ Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚Ρ‡ΠΈΠΊΡƒ ΠΏΠΎΠ½ΡΡ‚ΡŒ Π·Π°Π΄ΡƒΠΌΠΊΡƒ Π΄ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€Π° ΠΈ быстрСС воспроизвСсти вёрстку ΠΌΠ°ΠΊΠ΅Ρ‚Π° срСдствами html ΠΈ css.

Как Π½Π°Π·Ρ‹Π²Π°Ρ‚ΡŒ слои

НазывайтС слои Ρ‚Π°ΠΊ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π±Ρ‹Π»ΠΎ понятно, Ρ‡Ρ‚ΠΎ это Π·Π° элСмСнты ΠΈ ΠΊΠ°ΠΊ ΠΎΠ½ΠΈ сСбя Π²Π΅Π΄ΡƒΡ‚. ΠœΠ°ΠΊΠ΅Ρ‚ с Ρ…ΠΎΡ€ΠΎΡˆΠΈΠΌ Π½Π΅ΠΉΠΌΠΈΠ½Π³ΠΎΠΌ ΠΌΠΎΠΆΠ½ΠΎ ΠΏΠΎΠ½ΡΡ‚ΡŒ, глядя Π½Π° ΠΎΠ΄Π½ΠΎ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ Π΄Π΅Ρ€Π΅Π²ΠΎ элСмСнтов.

НапримСр, здСсь названия слоСв ΠΎΠ΄Π½ΠΎΠ·Π½Π°Ρ‡Π½ΠΎΠ³ΠΎ говорят ΠΎ Ρ‚ΠΎΠΌ, Ρ‡Ρ‚ΠΎ ΠΏΠ΅Ρ€Π΅Π΄ Π½Π°ΠΌΠΈ список ΠΏΡƒΠ½ΠΊΡ‚ΠΎΠ² с Π±ΡƒΠ»Π»ΠΈΡ‚Π°ΠΌΠΈ:

А здСсь, Ρ‡Ρ‚ΠΎ ΠΏΠ΅Ρ€Π΅Π΄ Π½Π°ΠΌΠΈ Π½Π΅ просто ΠΊΠ°Ρ€Ρ‚ΠΈΠ½ΠΊΠ°, Π° Π°Π²Π°Ρ‚Π°Ρ€ΠΊΠ°:

Как Π·Π°Π΄Π°Π²Π°Ρ‚ΡŒ Ρ€Π°Π·ΠΌΠ΅Ρ€Ρ‹

Π—Π°Π΄Π°Π²Π°ΠΉΡ‚Π΅ Ρ€Π°Π·ΠΌΠ΅Ρ€Ρ‹ элСмСнтам, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΏΠΎΠΊΠ°Π·Π°Ρ‚ΡŒ, ΠΊΠ°ΠΊ ΠΎΠ½ΠΈ Π²Π΅Π΄ΡƒΡ‚ сСбя ΠΏΡ€ΠΈ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΠΈ ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚Π°. НапримСр:

ΠŸΡ€ΠΎΠΈΠ·Π²ΠΎΠ»ΡŒΠ½ΠΎ Π·Π°Π΄Π°Π½Π½Ρ‹ΠΉ Ρ€Π°Π·ΠΌΠ΅Ρ€ сбиваСт с Ρ‚ΠΎΠ»ΠΊΡƒ ΠΈ ΠΌΠ΅ΡˆΠ°Π΅Ρ‚ ΠΏΠΎΠ½ΡΡ‚ΡŒ, ΠΊΠ°ΠΊ Ρ€Π°Π±ΠΎΡ‚Π°Π΅Ρ‚ ΠΌΠ°ΠΊΠ΅Ρ‚.

НапримСр, здСсь Π·Π°Π΄Π°Π½Π° высота тСкстовой области, которая Ρ‡ΡƒΡ‚ΡŒ большС высоты строки. ВСкстовая ΠΎΠ±Π»Π°ΡΡ‚ΡŒ Π² Ρ‚Π°ΠΊΠΎΠΉ конструкции Π½Π΅ Π±ΡƒΠ΄Π΅Ρ‚ Π½ΠΎΡ€ΠΌΠ°Π»ΡŒΠ½ΠΎ ΠΌΠ°ΡΡˆΡ‚Π°Π±ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒΡΡ ΠΏΡ€ΠΈ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΠΈ ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚Π° ΠΈ нСпонятно, Ρ‡Ρ‚ΠΎ Π΄ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€ ΠΈΠΌΠ΅Π» Π² Π²ΠΈΠ΄Ρƒ. Надо ΠΏΠΎΡΡ‚Π°Ρ€Π°Ρ‚ΡŒΡΡ ΠΏΠΎΠΊΠ°Π·Π°Ρ‚ΡŒ вёрсткой ΠΌΠ°ΠΊΠ΅Ρ‚Π°, Ρ‡Ρ‚ΠΎ Π΄ΠΎΠ»ΠΆΠ½ΠΎ ΡΠ»ΡƒΡ‡ΠΈΡ‚ΡŒΡΡ с тСкстом.

Как Π³Ρ€ΡƒΠΏΠΏΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ

Π“Ρ€ΡƒΠΏΠΏΠΈΡ€ΡƒΠΉΡ‚Π΅ элСмСнты Ρ‚Π°ΠΊ, ΠΊΠ°ΠΊ ΠΎΠ½ΠΈ Π±ΡƒΠ΄ΡƒΡ‚ связаны Π² html-вёрсткС. ОбъСдинСниС ΠΏΠΎ Π΄Ρ€ΡƒΠ³ΠΈΠΌ ΠΏΡ€ΠΈΠ½Ρ†ΠΈΠΏΠ°ΠΌ ΠΌΠΎΠΆΠ΅Ρ‚ Π·Π°ΠΏΡƒΡ‚Π°Ρ‚ΡŒ Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚Ρ‡ΠΈΠΊΠ°. НапримСр, здСсь нСпонятно, связаны Π±ΡƒΠ»Π»ΠΈΡ‚Ρ‹ с Ρ‚Скстом ΠΈΠ»ΠΈ Π½Π΅Ρ‚:

Группируя с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ Ρ„Ρ€Π΅ΠΉΠΌΠΎΠ² ΠΈ Π°Π²Ρ‚ΠΎΠ»Π΅ΠΉΠ°ΡƒΡ‚ΠΎΠ², ΠΌΠΎΠΆΠ½ΠΎ ΠΏΠΎΠΊΠ°Π·Π°Ρ‚ΡŒ, какая ΠΎΠ±Π»Π°ΡΡ‚ΡŒ Ρ…ΠΎΠ²Π΅Ρ€Π° Ρƒ ΡΠ»Π΅ΠΌΠ΅Π½Ρ‚Π°, ΠΈ ΠΎΠ±ΡŠΡΡΠ½ΠΈΡ‚ΡŒ Π»ΠΎΠ³ΠΈΠΊΡƒ отступов ΠΌΠ΅ΠΆΠ΄Ρƒ элСмСнтами:

Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ Π³Ρ€ΡƒΠΏΠΏΠΈΡ€ΠΎΠ²ΠΊΡƒ ΠΈ выравнивания, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΏΡ€ΠΎΠΈΠ»Π»ΡŽΡΡ‚Ρ€ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ, ΠΊΠ°ΠΊ элСмСнты ΠΏΠΎΠ²Π΅Π΄ΡƒΡ‚ сСбя ΠΏΡ€ΠΈ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΠΈ Ρ€Π°Π·ΠΌΠ΅Ρ€Π° экрана:

Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ Π°Π²Ρ‚ΠΎΠ»Π΅ΠΉΠ°ΡƒΡ‚Ρ‹ ΠΈ констрСйнсы, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡƒΠΏΠΎΡ€ΡΠ΄ΠΎΡ‡ΠΈΡ‚ΡŒ ΠΌΠ°ΠΊΠ΅Ρ‚ ΠΈ ΠΈΠ·Π±Π΅ΠΆΠ°Ρ‚ΡŒ случайных отступов.

Как Ρ€ΠΈΡΠΎΠ²Π°Ρ‚ΡŒ Π±Π΅Π· Π»ΠΈΡˆΠ½ΠΈΡ… элСмСнтов

Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ самый простой способ ΠΏΠΎΠ»ΡƒΡ‡ΠΈΡ‚ΡŒ Ρ‚ΠΎ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅, ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠ΅ Π²Ρ‹ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅. Π’Π°ΠΊ Π²Ρ‹ Π½Π΅ Π·Π°ΠΏΡƒΡ‚Π°Π΅Ρ‚Π΅ Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚Ρ‡ΠΈΠΊΠ° ΠΈ ΠΏΠΎΠΌΠΎΠΆΠ΅Ρ‚Π΅ Π΅ΠΌΡƒ ΠΏΡ€ΠΈΠ΄ΡƒΠΌΠ°Ρ‚ΡŒ простой способ Ρ€Π΅Π°Π»ΠΈΠ·Π°Ρ†ΠΈΠΈ.

НапримСр, Π°Π²Π°Ρ‚Π°Ρ€ΠΊΡƒ ΠΌΠΎΠΆΠ½ΠΎ ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ маски, Π½ΠΎ потрСбуСтся Π΄Π²Π° элСмСнта, ΠΎΠ±ΡŠΠ΅Π΄ΠΈΠ½Π΅Π½Π½Ρ‹Ρ… Π² Π³Ρ€ΡƒΠΏΠΏΡƒ. Π›ΡƒΡ‡ΡˆΠ΅ ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ Π·Π°Π»ΠΈΠ²ΠΊΡƒ Ρ„ΠΈΠ³ΡƒΡ€Ρ‹ ΠΊΠ°Ρ€Ρ‚ΠΈΠ½ΠΊΠΎΠΉ. Π’ΠΎΠ³Π΄Π° Π½Π΅ Π½ΡƒΠΆΠ½Ρ‹ Π±ΡƒΠ΄ΡƒΡ‚ лишниС элСмСнты ΠΈ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ само встанСт Ρ€ΠΎΠ²Π½ΠΎ посСрСдинС ΠΈ растянСтся Π΄ΠΎ Π½ΡƒΠΆΠ½ΠΎΠ³ΠΎ Ρ€Π°Π·ΠΌΠ΅Ρ€Π°.

ΠŸΡ€ΠΈΠΌΠ΅Ρ€ примСнСния

На ΠΏΡ€ΠΈΠΌΠ΅Ρ€Π΅ модального ΠΎΠΊΠ½Π° ΠΏΠΎΠΊΠ°Π·Π°Π½ΠΎ ΠΈΠ· ΠΊΠ°ΠΊΠΈΡ… логичСских Π±Π»ΠΎΠΊΠΎΠ² ΠΎΠ½ΠΎ состоит, ΠΊΠ°ΠΊ ΠΌΠ°ΡΡˆΡ‚Π°Π±ΠΈΡ€ΡƒΡŽΡ‚ΡΡ элСмСнты, ΠΊΠ°ΠΊΠΎΠ²Ρ‹ отступы ΠΈ ΠΊΠ°ΠΊ ΠΈΡ… ΠΈΠ·ΠΌΠ΅Ρ€ΡΡ‚ΡŒ.

Как воврСмя ΠΎΡΡ‚Π°Π½ΠΎΠ²ΠΈΡ‚ΡŒΡΡ

Π‘Ρ‚Π΅ΠΏΠ΅Π½ΡŒ ΠΏΡ€ΠΎΡ€Π°Π±ΠΎΡ‚ΠΊΠΈ ΠΌΠ°ΠΊΠ΅Ρ‚Π° зависит ΠΎΡ‚ этапа проСктирования. Если Π²Ρ‹ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ Π½Π°Ρ‡Π°Π»ΠΈ Π΄ΡƒΠΌΠ°Ρ‚ΡŒ Π½Π°Π΄ Π·Π°Π΄Π°Ρ‡Π΅ΠΉ ΠΈ Ρ€Π°Π±ΠΎΡ‚Π°Π΅Ρ‚Π΅ Π² Ρ€Π΅ΠΆΠΈΠΌΠ΅ Π³Π΅Π½Π΅Ρ€Π°Ρ†ΠΈΠΈ ΠΊΠΎΠ½Ρ†Π΅ΠΏΡ†ΠΈΠΉ, Π½Π΅ стоит Π²Π΅Ρ€ΡΡ‚Π°Ρ‚ΡŒ идСально. Π­Ρ‚ΠΎ ΠΌΠΎΠΆΠ΅Ρ‚ ΠΏΠΎΠΌΠ΅ΡˆΠ°Ρ‚ΡŒ, ΠΏΠΎΡ‚ΠΎΠΌΡƒ Ρ‡Ρ‚ΠΎ Π²Ρ‹ Π½Π°Ρ‡Π½Ρ‘Ρ‚Π΅ Π΄ΡƒΠΌΠ°Ρ‚ΡŒ Β«ΠΊΠ°ΠΊ Π½Π°Ρ€ΠΈΡΠΎΠ²Π°Ρ‚ΡŒΒ» вмСсто Β«Ρ‡Ρ‚ΠΎ Π½Π°Ρ€ΠΈΡΠΎΠ²Π°Ρ‚ΡŒΒ». А Π½Π° этапС ΠΏΠΎΠ΄Π³ΠΎΡ‚ΠΎΠ²ΠΊΠΈ ΠΌΠ°ΠΊΠ΅Ρ‚Π° ΠΊ ΠΏΠ΅Ρ€Π΅Π΄Π°Ρ‡Π΅ Π² Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚ΠΊΡƒ ΠΏΡ€ΠΈΡ…ΠΎΠ΄ΠΈΡ‚ врСмя ΠΏΠΎΠ΄ΡƒΠΌΠ°Ρ‚ΡŒ ΠΎ ΠΏΠΎΠ½ΡΡ‚Π½ΠΎΠΉ вёрсткС.

ΠœΠ°ΠΊΠ΅Ρ‚Ρ‹, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ Π΄ΠΎΠΏΠΎΠ»Π½ΡΡŽΡ‚ΡΡ Π½ΠΎΠ²Ρ‹ΠΌΠΈ Π·Π°Π΄Π°Ρ‡Π°ΠΌΠΈ ΠΈ ΠΏΡ€Π°Π²ΠΊΠ°ΠΌΠΈ, со Π²Ρ€Π΅ΠΌΠ΅Π½Π΅ΠΌ Β«Π·Π°Ρ…Π»Π°ΠΌΠ»ΡΡŽΡ‚ΡΡΒ». Π’ Π½ΠΈΡ… Π½ΡƒΠΆΠ½ΠΎ пСриодичСски ΠΏΡ€ΠΎΠ²ΠΎΠ΄ΠΈΡ‚ΡŒ ΡƒΠ±ΠΎΡ€ΠΊΡƒ, ΠΏΠΎΠ΄ΠΎΠ±Π½ΠΎ Ρ€Π΅Ρ„Π°ΠΊΡ‚ΠΎΡ€ΠΈΠ½Π³Ρƒ Π² ΠΊΠΎΠ΄Π΅.

Π Π΅Ρ„Π°ΠΊΡ‚ΠΎΡ€ΠΈΠ½Π³ΠΎΠΌ Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚Ρ‡ΠΈΠΊΠΈ Π½Π°Π·Ρ‹Π²Π°ΡŽΡ‚ процСсс ΡƒΠ»ΡƒΡ‡ΡˆΠ΅Π½ΠΈΡ ΠΊΠΎΠ΄Π° Π±Π΅Π· измСнСния Π΅Π³ΠΎ Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΎΠ½Π°Π»ΡŒΠ½ΠΎΡΡ‚ΠΈ. ЦСль β€” Π½Π°ΠΏΠΈΡΠ°Ρ‚ΡŒ «чистый» ΠΊΠΎΠ΄, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ просто Ρ‡ΠΈΡ‚Π°Ρ‚ΡŒ, ΠΏΠΎΠ½ΠΈΠΌΠ°Ρ‚ΡŒ ΠΈ ΠΏΠΎΠ΄Π΄Π΅Ρ€ΠΆΠΈΠ²Π°Ρ‚ΡŒ.

Как ΠΏΠΎΠ΄Π³ΠΎΡ‚ΠΎΠ²ΠΈΡ‚ΡŒ ΠΌΠ°ΠΊΠ΅Ρ‚Ρ‹ сайтов для вСрстки?


Π Π°Π·Ρ€Π°Π±ΠΎΡ‚ΠΊΠ° сайта β€” ΡΡ‚ΠΎ командная, многоэтапная Ρ€Π°Π±ΠΎΡ‚Π°. Однако, часто Π΄ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€ Π½Π΅ выполняСт ΠΎΠ±ΡΠ·Π°Ρ‚Π΅Π»ΡŒΠ½Ρ‹Π΅ шаги ΠΏΠΎ ΠΎΠΏΡ‚ΠΈΠΌΠΈΠ·Π°Ρ†ΠΈΠΈ ΠΌΠ°ΠΊΠ΅Ρ‚Π°  ΡΠ°ΠΉΡ‚Π° для вСрстки (рис.1). Π­Ρ‚ΠΎ заставляСт Π²Π΅Ρ€ΡΡ‚Π°Π»ΡŒΡ‰ΠΈΠΊΠ° Π΄Π΅Π»Π°Ρ‚ΡŒ Π΄Π²ΠΎΠΉΠ½ΡƒΡŽ Ρ€Π°Π±ΠΎΡ‚Ρƒ, Π·Π°Ρ‚Ρ€Π°Ρ‡ΠΈΠ²Π°Ρ‚ΡŒ большСС количСство Π²Ρ€Π΅ΠΌΠ΅Π½ΠΈ, нСэффСктивно Π΅Π³ΠΎ Ρ‚Ρ€Π°Ρ‚ΠΈΡ‚ΡŒ ΠΈ Ρ‚ΠΈΡ…ΠΎ вас Π½Π΅Π½Π°Π²ΠΈΠ΄Π΅Ρ‚ΡŒ Π² Ρ€Π΅Π·ΡƒΠ»ΡŒΡ‚Π°Ρ‚Π΅.

Рис. 1 Π Π°Π·Ρ€Π°Π±ΠΎΡ‚ΠΊΠ° сайта

На самом Π΄Π΅Π»Π΅, с Π²Π°ΠΌΠΈ становится Π½Π΅ приятно Ρ€Π°Π±ΠΎΡ‚Π°Ρ‚ΡŒ, ΠΊΠΎΠ³Π΄Π° Π²Ρ‹ скидываСтС Ρ‚ΠΎ, Ρ‡Ρ‚ΠΎ ΠΏΠΎΠ»ΡƒΡ‡ΠΈΠ»ΠΎΡΡŒ, ΠΊΠ°ΠΊΠΎΠΉ-Ρ‚ΠΎ Ρ€Π°Π±ΠΎΡ‡ΠΈΠΉ сырой Π²Π°Ρ€ΠΈΠ°Π½Ρ‚, понятный Ρ‚ΠΎΠ»ΡŒΠΊΠΎ Π²Π°ΠΌ. ΠžΡ‡Π΅Π½ΡŒ Π²Π°ΠΆΠ½ΠΎ ΠΏΡ€Π°Π²ΠΈΠ»ΡŒΠ½ΠΎ Π³ΠΎΡ‚ΠΎΠ²ΠΈΡ‚ΡŒ ΠΌΠ°ΠΊΠ΅Ρ‚Ρ‹ сайта для вСрстки, это просто Π΄Π°ΠΆΠ΅ вопрос уваТСния ΠΊ вашим ΠΊΠΎΠ»Π»Π΅Π³Π°ΠΌ.

10 совСтов ΠΏΠΎ ΠΏΠΎΠ΄Π³ΠΎΡ‚ΠΎΠ²ΠΊΠ΅ ΠΌΠ°ΠΊΠ΅Ρ‚Π° сайта для вСрстки.

1. Боблюдай порядок Π² слоях

ΠŸΠΎΡ€ΡΠ΄ΠΎΠΊ Π² слоях ΠΈ Π³Ρ€ΡƒΠΏΠΏΠ°Ρ… Π½ΡƒΠΆΠ΅Π½ Π·Π°Ρ‚Π΅ΠΌ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π΄ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€ ΠΈΠ»ΠΈ Π²Π΅Ρ€ΡΡ‚Π°Π»ΡŒΡ‰ΠΈΠΊ, ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠΌΡƒ достался ваш ΠΌΠ°ΠΊΠ΅Ρ‚, ΠΏΠΎΠ½ΠΈΠΌΠ°Π», Π³Π΄Π΅ Ρ‡Ρ‚ΠΎ Π»Π΅ΠΆΠΈΡ‚. Π’ΠΎ-ΠΏΠ΅Ρ€Π²Ρ‹Ρ…, это Π΄ΠΎΠ»ΠΆΠ½ΠΎ Π±Ρ‹Ρ‚ΡŒ понятно Π²Π°ΠΌ, Π²ΠΎ-Π²Ρ‚ΠΎΡ€Ρ‹Ρ…, Π²Π΅Ρ€ΡΡ‚Π°Π»ΡŒΡ‰ΠΈΠΊΡƒ Π³ΠΎΡ€Π°Π·Π΄ΠΎ ΠΏΡ€ΠΎΡ‰Π΅ ΠΎΡ€ΠΈΠ΅Π½Ρ‚ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒΡΡ ΠΈ Π²Ρ‹Π±ΠΈΡ€Π°Ρ‚ΡŒ ΠΊΠ°ΠΊΠΈΠ΅-Ρ‚ΠΎ Π±Π»ΠΎΠΊΠΈ. Π‘Π΅Π· навСдСния порядка Π² слоях Π½Π΅ ΠΏΡ€ΠΎΡ…ΠΎΠ΄ΠΈΡ‚ Π½ΠΈ ΠΎΠ΄Π½Π° ΠΏΠΎΠ΄Π³ΠΎΡ‚ΠΎΠ²ΠΊΠ° ΠΌΠ°ΠΊΠ΅Ρ‚Π° сайта для вСрстки.

Рис.2  Π‘Π»ΠΎΠΈ

2. ΠžΠ±ΡŠΠ΅ΠΊΡ‚ ΠΈΠ· Π½Π΅ΡΠΊΠΎΠ»ΡŒΠΊΠΈΡ… ΡΠ»ΠΎΠ΅Π²β€Š β€” β€ŠΡΡ‚ΠΎ ΠΏΠ°ΠΏΠΊΠ°

Π­Ρ‚ΠΎ Π³Π»Π°Π²Π½ΠΎΠ΅ ΠΏΡ€Π°Π²ΠΈΠ»ΠΎ. Если ΠΏΡ€ΠΈΡƒΡ‡ΠΈΡ‚ΡŒ сСбя осмыслСнно Π³Ρ€ΡƒΠΏΠΏΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ слои, Ρ‚ΠΎ порядок Π±ΡƒΠ΄Π΅Ρ‚ всСгда. Π­Ρ‚ΠΎ Ρ‚Π°ΠΊΠΆΠ΅ ΠΏΠΎΠ·Π²ΠΎΠ»ΠΈΡ‚ Π½Π΅ ΠΈΠΌΠ΅Π½ΠΎΠ²Π°Ρ‚ΡŒ ΠΎΡ‚Π΄Π΅Π»ΡŒΠ½ΠΎ ΠΊΠ°ΠΆΠ΄Ρ‹ΠΉ слой.

ΠšΡΡ‚Π°Ρ‚ΠΈ, Ρ€Π΅ΠΊΠΎΠΌΠ΅Π½Π΄ΡƒΡŽ ΠΏΠΎΡΠΌΠΎΡ‚Ρ€Π΅Ρ‚ΡŒ прямо сСйчас:

НапримСр, Ссли ΠΊΠ½ΠΎΠΏΠΊΠ° состоит ΠΈΠ· ΠΈΠΊΠΎΠ½ΠΊΠΈ ΠΈ ΠΏΠΎΠ΄ΠΏΠΈΡΠΈβ€Š β€” β€ŠΠΈΡ… стоит ΠΎΠ±ΡŠΠ΅Π΄ΠΈΠ½ΠΈΡ‚ΡŒ Π² ΠΏΠ°ΠΏΠΊΡƒ Button. МСню, ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠ΅ состоит ΠΈΠ· ΠΏΠ°Ρ€Ρ‹ Ρ‚Π°ΠΊΠΈΡ… ΠΊΠ½ΠΎΠΏΠΎΠΊ, становится Π³Ρ€ΡƒΠΏΠΏΠΎΠΉ Menu. Π€ΠΎΠ½ ΠΈΠ· Π½Π΅ΡΠΊΠΎΠ»ΡŒΠΊΠΈΡ… слоСв β€Šβ€” β€ŠΠΏΠ°ΠΏΠΊΠ° Background.

ΠŸΡ€ΠΈΠ½Ρ†ΠΈΠΏ ясСн: Π»ΠΎΠ³ΠΈΠΊΠ° Π³Ρ€ΡƒΠΏΠΏΠΈΡ€ΠΎΠ²ΠΊΠΈ ΠΏΠ°ΠΏΠΎΠΊ Π΄ΠΎΠ»ΠΆΠ½Π° ΡΠΎΠ²ΠΏΠ°Π΄Π°Ρ‚ΡŒ со структурой вашСго ΠΌΠ°ΠΊΠ΅Ρ‚Π°. Π­Ρ‚ΠΎ ΠΎΠ±ΡΠ·Π°Ρ‚Π΅Π»ΡŒΠ½Ρ‹ΠΉ ΠΏΡƒΠ½ΠΊΡ‚ ΠΎΠΏΡ‚ΠΈΠΌΠΈΠ·Π°Ρ†ΠΈΠΈ ΠΌΠ°ΠΊΠ΅Ρ‚Π° для вСрстки.

Рис.3 Π“Ρ€ΡƒΠΏΠΏΠΈΡ€ΠΎΠ²ΠΊΠ°

3. ВСрсии β€” это Ρ‚ΠΎΠΆΠ΅ ΠΎΡ‚Π΄Π΅Π»ΡŒΠ½Π°Ρ ΠΏΠ°ΠΏΠΊΠ°

Часто Π²Π½ΡƒΡ‚Ρ€ΠΈ Ρ„Π°ΠΉΠ»Π° с ΠΌΠ°ΠΊΠ΅Ρ‚ΠΎΠΌ сайта для вСрстки хранится нСсколько вСрсий элСмСнтов (Π²Ρ‹ экспСримСнтируСтС с Ρ†Π²Π΅Ρ‚Π°ΠΌΠΈ,ΡˆΡ€ΠΈΡ„Ρ‚Π°ΠΌΠΈ ΠΈ Ρ‚.Π΄.), Π½Π°ΠΏΡ€ΠΈΠΌΠ΅Ρ€ Ρ„ΠΎΠ½Ρ‹ для ΠΊΠ½ΠΎΠΏΠΊΠΈ Ρ€Π°Π·Π½ΠΎΠ³ΠΎ Ρ†Π²Π΅Ρ‚Π°.

Π§Ρ‚ΠΎΠ±Ρ‹ Π²Ρ‹ сами ΠΆΠ΅ ΠΏΠΎΡ‚ΠΎΠΌ Π½Π΅ Π·Π°Π±Ρ‹Π»ΠΈ, Ρ‡Ρ‚ΠΎ ΠΏΠ°Ρ‡ΠΊΠ° нСпонятных скрытых ΡΠ»ΠΎΠ΅Π²β€Šβ€” β€ŠΡΡ‚ΠΎ вСрсии Ρ‚ΠΎΠ³ΠΎ самого Ρ„ΠΎΠ½Π°, просто ΠΏΡ€Π°Π²ΠΈΠ»ΡŒΠ½ΠΎ сгруппируйтС ΠΈΡ….

Π‘Π°ΠΌΠΎΠ΅ ΠΏΡ€ΠΎΡΡ‚ΠΎΠ΅β€Š β€” β€ŠΡΠ΄Π΅Π»Π°Ρ‚ΡŒ ΠΏΠ°ΠΏΠΊΡƒ Background ΠΈ ΠΏΠΎΠ»ΠΎΠΆΠΈΡ‚ΡŒ Ρ‚ΡƒΠ΄Π° всС вСрсии ( ΠΊΠ°ΠΊΠΈΠ΅-Ρ‚ΠΎ ΠΌΠΎΠ³ΡƒΡ‚ Π±Ρ‹Ρ‚ΡŒ Π²ΠΊΠ»ΡŽΡ‡Π΅Π½Ρ‹, ΠΊΠ°ΠΊΠΈΠ΅-Ρ‚ΠΎ ΠΎΡ‚ΠΊΠ»ΡŽΡ‡Π΅Π½Ρ‹). Π’ рис.4 ΠΌΡ‹ Π²ΠΈΠ΄ΠΈΠΌ Π΄Π²Π° Π²Π°Ρ€ΠΈΠ°Π½Ρ‚Π°: ΠΏΡ€Π°Π²ΠΈΠ»ΡŒΠ½Ρ‹ΠΉ (ΠΏΠ°ΠΏΠΊΠ° Background) ΠΈ Π½Π΅ΠΏΡ€Π°Π²ΠΈΠ»ΡŒΠ½Ρ‹ΠΉ (просто Π΄Π΅Π»Π°Π΅ΠΌ копипасты, Π½Π°ΠΏΡ€ΠΈΠΌΠ΅Ρ€, ΠΊΠ½ΠΎΠΏΠΎΠΊ с Ρ€Π°Π·Π½Ρ‹ΠΌΠΈ Ρ†Π²Π΅Ρ‚Π°ΠΌΠΈ). Π’Π°ΠΊ получаСтся Π³ΠΎΡ€Π°Π·Π΄ΠΎ большС слоСв, соотвСтствСнно, большС ΠΏΡƒΡ‚Π°Π½ΠΈΡ†Ρ‹ ΠΈ Π½Π΅Ρ€Π°Π·Π±Π΅Ρ€ΠΈΡ…ΠΈ.

Рис.4 ВСрсии  

4. ΠžΡ‚ΠΊΡ€Ρ‹Π²Π°ΠΉ Π·Π°ΠΌΠΊΠΈ

Часто Π΄ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€Ρ‹ Π»ΡŽΠ±ΡΡ‚ Π»ΠΎΡ‡ΠΈΡ‚ΡŒ ΠΊΠ°ΠΊΠΈΠ΅-Ρ‚ΠΎ слои ΠΈ Ρ€Π°Π±ΠΎΡ‚Π°Ρ‚ΡŒ Ρ‚Π°ΠΊ. Но Ссли Π²Ρ‹ оставили Π³Π΄Π΅-Ρ‚ΠΎ Π² дСбрях ΠΏΠ°ΠΏΠΎΠΊ Ρ‚Π°ΠΊΠΎΠΉ слой, Ρ‚ΠΎ Π²Π°ΡˆΠ΅ΠΌΡƒ ΠΊΠΎΠ»Π»Π΅Π³Π΅ придётся ΠΏΠ΅Ρ€Π΅ΡΠΌΠΎΡ‚Ρ€Π΅Ρ‚ΡŒ всС ΠΏΠ°ΠΏΠΊΠΈ, ΠΏΠΎΡ‚ΠΎΠΌΡƒ Ρ‡Ρ‚ΠΎ вся корнСвая ΠΏΠ°ΠΏΠΊΠ° Π±Π»ΠΎΠΊΠΈΡ€ΡƒΠ΅Ρ‚ΡΡβ€Šβ€”β€ŠΠ΅Ρ‘ нСльзя ΠΏΠ΅Ρ€Π΅ΠΌΠ΅Ρ‰Π°Ρ‚ΡŒ. Π’ процСссС ΠΎΠΏΡ‚ΠΈΠΌΠΈΠ·Π°Ρ†ΠΈΠΈ ΠΌΠ°ΠΊΠ΅Ρ‚Π° сайта для вСрстки ΠΏΡ€ΠΎΠΉΠ΄ΠΈΡ‚Π΅ всС слои ΠΈ ΡƒΠ±Π΅Ρ€ΠΈΡ‚Π΅ всС Π·Π°ΠΌΠΊΠΈ.

Π’Π°ΠΊΠΆΠ΅ Π½Π΅ Π·Π°Π±Ρ‹Π²Π°ΠΉΡ‚Π΅ ΠΏΡ€ΠΎ случайно ΠΎΡ‚ΠΊΡ€Π΅ΠΏΠ»Π΅Π½Π½Ρ‹Π΅ ΠΈ Π·Π°Π±Ρ‹Ρ‚Ρ‹Π΅ маски. Если ΠΊΠΎΠ»Π»Π΅Π³Π° Π½Π΅ Π·Π°ΠΌΠ΅Ρ‚ΠΈΡ‚ Ρ‚Π°ΠΊΡƒΡŽ маску ΠΈ ΠΏΡ€ΠΎΠ΄ΠΎΠ»ΠΆΠΈΡ‚ Ρ€Π°Π±ΠΎΡ‚Π°Ρ‚ΡŒ, Ρ‚ΠΎ ΠΌΠΎΠΆΠ½ΠΎ Π½Π°Π²ΠΎΡ€ΠΎΡ‚ΠΈΡ‚ΡŒ массу ΠΏΡ€ΠΎΠ±Π»Π΅ΠΌ Π² Π±ΡƒΠ΄ΡƒΡ‰Π΅ΠΌ.

Рис. 5 Π—Π°ΠΌΠΊΠΈ

5. Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉ Layer Styles

Много Π΄ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€ΠΎΠ²-старичков Π½Π΅ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽΡ‚ Layer Styles ΠΈ всС, казалось Π±Ρ‹, простыС Π²Π΅Ρ‰ΠΈ Π΄Π΅Π»Π°ΡŽΡ‚ ΠΎΡ‚Π΄Π΅Π»ΡŒΠ½Ρ‹ΠΌΠΈ растровыми слоями. Π­Ρ‚ΠΎ приносит адскиС страдания всСм, ΠΊΡ‚ΠΎ Π·Π°Ρ‚Π΅ΠΌ Ρ…ΠΎΡ‡Π΅Ρ‚ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚ΡŒ ΠΎΠ±ΡŠΠ΅ΠΊΡ‚. Π’ΠΎ Π²Ρ‚ΠΎΡ€ΠΎΠΌ ΠΏΡ€ΠΈΠΌΠ΅Ρ€Π΅ (рис.6)  Π΅ΡΡ‚ΡŒ слой с Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚ΠΎΠΌ, Ρ†Π²Π΅Ρ‚ΠΎΠΌ, Π±Π»ΠΈΠΊΠΎΠΌ ΠΈ это всС ΠΎΡ‚Π΄Π΅Π»ΡŒΠ½Ρ‹Π΅ слои. Π­Ρ‚ΠΎ Π½Π΅ΠΏΡ€Π°Π²ΠΈΠ»ΡŒΠ½Ρ‹ΠΉ Π²Π°Ρ€ΠΈΠ°Π½Ρ‚. ΠŸΡ€Π°Π²ΠΈΠ»ΡŒΠ½ΠΎ Π² процСссС ΠΏΠΎΠ΄Π³ΠΎΡ‚ΠΎΠ²ΠΊΠΈ ΠΌΠ°ΠΊΠ΅Ρ‚Π° ΠΊ вСрсткС Π΄Π΅Π»Π°Ρ‚ΡŒ ΠΎΠ΄ΠΈΠ½ слой ΠΈ дальшС ΡƒΠΆΠ΅ Π½Π° Π½Π΅Π³ΠΎ Π½Π°ΠΊΠ»Π°Π΄Ρ‹Π²Π°Ρ‚ΡŒ эффСкты. Π—Π°Ρ‚Π΅ΠΌ Π²Π°ΠΌ Π±ΡƒΠ΄Π΅Ρ‚ Π³ΠΎΡ€Π°Π·Π΄ΠΎ ΠΏΡ€ΠΎΡ‰Π΅ эти эффСкты ΠΌΠ΅Π½ΡΡ‚ΡŒ, Ρ‡Π΅ΠΌ Π²ΠΎΠ·ΠΈΡ‚ΡŒΡΡ с растовыми слоями.

Рис.6 Layer Styles Π’ ΠΏΡ€Π΅Π·Π΅Π½Ρ‚Π°Ρ†ΠΈΠΈ другая ΠΊΠ°Ρ€Ρ‚ΠΈΠ½ΠΊΠ° (ΡΠΎΡΠΊΡ€ΠΈΠ½ΡˆΠΎΡ‚ΠΈΡ‚ΡŒ Π½Π΅ ΠΏΠΎΠ»ΡƒΡ‡ΠΈΠ»ΠΎΡΡŒ β€” накладываСтся Π²ΠΈΠ΄Π΅ΠΎ с Π²Π΅Π±-ΠΊΠ°ΠΌΠ΅Ρ€Ρ‹)

6. Π£Π΄Π°Π»ΠΈ лишниС Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΠΈΠ΅

ΠΠ°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΠΈΠ΅ ΠΏΠΎΠΌΠΎΠ³Π°ΡŽΡ‚ Π½Π°ΠΌ ΠΆΠΈΡ‚ΡŒ. МоТно быстро ΡΠΌΠ°ΡΡ‚Π΅Ρ€ΠΈΡ‚ΡŒ сСтку ΠΈΠ»ΠΈ просто Ρ‡Ρ‚ΠΎ-Ρ‚ΠΎ Π²Ρ‹Ρ€ΠΎΠ²Π½ΡΡ‚ΡŒ. Но Π·Π°Ρ‡Π°ΡΡ‚ΡƒΡŽ ΠΌΡ‹ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅ΠΌ ΠΈΡ… Ρ€Π°Π·ΠΎΠ²ΠΎ, Ρ‚ΠΎ Π΅ΡΡ‚ΡŒ выровняли ΠΎΠ±ΡŠΠ΅ΠΊΡ‚ ΠΈ Π·Π°Π±Ρ‹Π»ΠΈ, Π° Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΠΈΠ΅ ΠΌΠ΅ΠΆΠ΄Ρƒ Ρ‚Π΅ΠΌ копятся ΠΈ копятся.

Если Π²Ρ‹ Π½Π΅ Π΄Π΅Π»Π°Π΅Ρ‚Π΅ Π½Π°ΠΏΡ€Π°Π²Π»ΡΡŽΡ‰ΠΈΠΌΠΈ Π°ΠΊΠΊΡƒΡ€Π°Ρ‚Π½ΡƒΡŽ сСтку Π½Π° вСсь ΠΏΡ€ΠΎΠ΅ΠΊΡ‚, Ρ‚ΠΎ ΡΡ‚Π°Ρ€Π°ΠΉΡ‚Π΅ΡΡŒ ΡƒΠ΄Π°Π»ΡΡ‚ΡŒ ΠΈΡ… сразу послС использования. И ΡƒΠΆ Ρ‚ΠΎΡ‡Π½ΠΎ ΡƒΠ΄Π°Π»ΠΈΡ‚Π΅ лишнС, ΠΊΠΎΠ³Π΄Π° Π³ΠΎΡ‚ΠΎΠ²ΠΈΡ‚Π΅ ΠΌΠ°ΠΊΠ΅Ρ‚ сайта ΠΊ вСрсткС.

Рис.7 Π‘Π΅Ρ‚ΠΊΠ°

7. Удали лишниС слои

НС Π·Π°Π±Ρ‹Π²Π°ΠΉΡ‚Π΅ ΡƒΠ΄Π°Π»ΡΡ‚ΡŒ вСсь Ρ…Π»Π°ΠΌ послС Ρ€Π°Π±ΠΎΡ‚Ρ‹ с Ρ„Π°ΠΉΠ»ΠΎΠΌβ€Šβ€”β€ŠΠΎΠ½ Π²Π°ΠΌ большС Π½Π΅ пригодится. Π’Ρ‹ Π² процСссС экспСримСнтируСтС: Ρ‡Ρ‚ΠΎ-Ρ‚ΠΎ Π²ΠΊΠ»ΡŽΡ‡Π°Π΅Ρ‚Π΅, Ρ‡Ρ‚ΠΎ-Ρ‚ΠΎ Π²Ρ‹ΠΊΠ»ΡŽΡ‡Π°Π΅Ρ‚Π΅. Когда ΠΎΠΏΡ‚ΠΈΠΌΠΈΠ·ΠΈΡ€ΡƒΠ΅Ρ‚Π΅ ΠΌΠ°ΠΊΠ΅Ρ‚ Π½Π° вСрстку, Ρ‡Ρ‚ΠΎΠ±Ρ‹ программист Π½Π΅ запутался Π² вашСм ΠΌΠ°ΠΊΠ΅Ρ‚Π΅, стоит ΠΎΠ±ΡΠ·Π°Ρ‚Π΅Π»ΡŒΠ½ΠΎ Ρ‚Π΅ слои, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ Π²Π°ΠΌ Π½Π΅ Π½ΡƒΠΆΠ½ΠΎ ΡƒΠ΄Π°Π»ΠΈΡ‚ΡŒ.

Рис. 8 Π‘Π»ΠΎΠΈ Π’ΠΎΠΆΠ΅ Π΄Ρ€ΡƒΠ³ΠΎΠΉ рисунок Π² ΠΏΡ€Π΅Π·Π΅Π½Ρ‚Π°Ρ†ΠΈΠΈ

8. БыстроС ΠΎΡ‚ΠΊΡ€Ρ‹Ρ‚ΠΈΠ΅ ΠΏΠ°ΠΏΠΎΠΊ

[βŒ₯] click β€” быстро ΠΎΡ‚ΠΊΡ€Ρ‹Ρ‚ΡŒ/Π·Π°ΠΊΡ€Ρ‹Ρ‚ΡŒ ΠΏΠ°ΠΏΠΊΡƒ.

НаТмитС Π½Π° Π·Π½Π°Ρ‡ΠΎΠΊ закрытия ΠΊΠΎΡ€Π½Π΅Π²ΠΎΠΉ ΠΏΠ°ΠΏΠΊΠΈ с Π·Π°ΠΆΠ°Ρ‚Ρ‹ΠΌ Π°Π»ΡŒΡ‚ΠΎΠΌ, ΠΈ всС Π²Π½ΡƒΡ‚Ρ€Π΅Π½Π½ΠΈΠ΅ ΠΏΠ°ΠΏΠΊΠΈ Π°ΠΊΠΊΡƒΡ€Π°Ρ‚Π½ΠΎ схлопнутся автоматичСски.

ΠœΡ‹ ΡƒΠΆΠ΅ Π³ΠΎΠ²ΠΎΡ€ΠΈΠ»ΠΈ ΠΏΡ€ΠΎ Π³Ρ€ΡƒΠΏΠΏΠΈΡ€ΠΎΠ²ΠΊΡƒ ΠΈ Ρ‚ΡƒΡ‚ Π΅ΡΡ‚ΡŒ малСнький сСкрСт, ΠΊΠΎΠ³Π΄Π° Π²Ρ‹ Π½Π°ΠΆΠΈΠΌΠ°Π΅Ρ‚Π΅ Π½Π° ΠΊΠ»Π°Π²ΠΈΡˆΡƒ Alt ΠΈ ΠΊΠ»ΠΈΠΊΠ°Π΅Ρ‚Π΅ Π² ΠΏΠ°ΠΏΠΊΡƒ, Ρ‚ΠΎ ΠΎΡ‚ΠΊΡ€Ρ‹Π²Π°ΡŽΡ‚ΡΡ сразу всС ΠΏΠ°ΠΏΠΊΠΈ Π² Π½Π΅ΠΉ. НС Π½ΡƒΠΆΠ½ΠΎ ΠΊΠ°ΠΆΠ΄ΡƒΡŽ ΠΏΠ°ΠΏΠΊΡƒ ΠΏΡ€ΠΎΠΊΠ»ΠΈΠΊΠΈΠ²Π°Ρ‚ΡŒ.

Рис.9 ΠžΡ‚ΠΊΡ€Ρ‹Ρ‚ΠΈΠ΅ ΠΏΠ°ΠΏΠΎΠΊ клавишой Alt

9. Π’ΠΊΠ»ΡŽΡ‡ΠΈ ΡƒΠ΄ΠΎΠ±Π½Ρ‹ΠΉ Π²ΠΈΠ΄ слоСв

Π­Ρ‚ΠΎ Layer Panel Options. Π—Π΄Π΅ΡΡŒ слСдуСт ΡƒΡΡ‚Π°Π½ΠΎΠ²ΠΈΡ‚ΡŒ (рис.10).

  • Thumbnail Contents. Π­Ρ‚Π° позволяСт ΠΏΠΎΠΊΠ°Π·Ρ‹Π²Π°Ρ‚ΡŒ Π² ΠΏΡ€Π΅Π²ΡŒΡŽ слоя Π½Π΅ вСсь слой Ρ†Π΅Π»ΠΈΠΊΠΎΠΌ, Π° Ρ‚ΠΎΠ»ΡŒΠΊΠΎ Ρ‚ΠΎ, Ρ‡Ρ‚ΠΎ Π΅ΡΡ‚ΡŒ Π² Π½Π΅ΠΌ.
  • Expand New Effects. ΠžΡ‚ΠΆΠ°Π² эту Π³Π°Π»ΠΎΡ‡ΠΊΡƒ, Π²Ρ‹ смоТСтС Π°Π²Ρ‚ΠΎΠΌΠ°Ρ‚ΠΎΠΌ ΡΡ…Π»ΠΎΠΏΡ‹Π²Π°Ρ‚ΡŒ всС Π΄ΠΎΠ±Π°Π²Π»Π΅Π½Π½Ρ‹Π΅ стили слоя.
  • Add Copy. ΠžΡ‚ΠΆΠ°Π² эту Π³Π°Π»ΠΎΡ‡ΠΊΡƒ Π²Ρ‹ ΡƒΠ±Π΅Ρ€Π΅Ρ‚Π΅ всС Ρ‚Π΅ β€œCopy 230β€³ Π² названиях слоСв. Чистота исходника Ρ€Π°Π·ΠΎΠΌ вырастСт Π½Π° 30%. ΠžΠ±ΡΠ·Π°Ρ‚Π΅Π»ΡŒΠ½ΠΎ это Π΄Π΅Π»Π°ΠΉΡ‚Π΅ ΠΏΡ€ΠΈ ΠΏΠΎΠ΄Π³ΠΎΡ‚ΠΎΠ²ΠΊΠ΅ ΠΌΠ°ΠΊΠ΅Ρ‚Π° сайта Π½Π° вСрстку.

МоТно Π½Π°ΡΡ‚Ρ€ΠΎΠΈΡ‚ΡŒ прямо ΠΊΠ°ΠΊ Π½Π° ΠΊΠ°Ρ€Ρ‚ΠΈΠ½ΠΊΠ΅ ΠΈ Ρ‚Π°ΠΊ Ρ€Π°Π±ΠΎΡ‚Π°Ρ‚ΡŒ.

Рис. 10 Π’ΠΈΠ΄ слоСв

10. Π₯ΠΎΡ‚ΠΊΠ΅ΠΈ для стилСй слоя

Рис. 11 Π₯ΠΎΡ‚ΠΊΠ΅ΠΈ

ΠœΡ‹ ΡƒΠΆΠ΅ Π³ΠΎΠ²ΠΎΡ€ΠΈΠ»ΠΈ ΠΏΡ€ΠΎ стили слоя. ΠœΡ‹ ΠΌΠΎΠΆΠ΅ΠΌ ΠΏΠΎΡΠΌΠΎΡ‚Ρ€Π΅Ρ‚ΡŒ Π½Π° ΠΏΡ€ΠΈΠΌΠ΅Ρ€Π΅ рис.11: Π·Π΅Π»Π΅Π½Ρ‹ΠΉ ΠΊΠ²Π°Π΄Ρ€Π°Ρ‚, Ρƒ Π½Π΅Π³ΠΎ Π΅ΡΡ‚ΡŒ ΠΎΠ±Π²ΠΎΠ΄ΠΊΠ°, ΡΡ‚ΠΈΠ»ΡŒ, Ρ‚Π΅Π½ΡŒ. ΠœΡ‹ ΠΌΠΎΠΆΠ΅ΠΌ быстро ΡΠΊΠΎΠΏΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ Π΅Ρ‰Π΅ Π½Π° 5 ΠΊΠ²Π°Π΄Ρ€Π°Ρ‚ΠΎΠ² эти элСмСнты (см. рис.12)

Рис. 12 ГорячиС клавиши

Π˜Π΄Π΅Π°Π»ΡŒΠ½Ρ‹Π΅ Ρ€Π°Π·ΠΌΠ΅Ρ€Ρ‹ ΠΌΠ°ΠΊΠ΅Ρ‚Π° Π΄ΠΈΠ·Π°ΠΉΠ½Π° сайта

Π—Π½Π°Π΅Ρ‚Π΅ Ρ‚Π°ΠΊΡƒΡŽ ΡΠΈΡ‚ΡƒΠ°Ρ†ΠΈΡŽ, ΠΊΠΎΠ³Π΄Π° Π²Π΅Π±-Π΄ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€ сдаСт ΠΌΠ°ΠΊΠ΅Ρ‚ сайта, Π° программист ΠΏΠΎΡ‚ΠΎΠΌ Π½Π΅ ΠΌΠΎΠΆΠ΅Ρ‚ ΡΠΊΠ°Ρ‡Π°Ρ‚ΡŒ этот ΠΌΠ°ΠΊΠ΅Ρ‚ ΠΈΠ·-Π·Π° Π΅Π³ΠΎ слишком большого вСса? Π­Ρ‚ΠΎ ΠΎΠ±Ρ‹Ρ‡Π½ΠΎ происходит ΠΈΠ·-Π·Π° Ρ‚ΠΎΠ³ΠΎ, Ρ‡Ρ‚ΠΎ Π²Π΅Π±-Π΄ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€ Π½Π΅ ΠΎΠΏΡ‚ΠΈΠΌΠΈΠ·ΠΈΡ€ΠΎΠ²Π°Π» ΠΊΠ°Ρ€Ρ‚ΠΈΠ½ΠΊΠΈ Π² ΠΌΠ°ΠΊΠ΅Ρ‚Π΅, ΠΈ ΠΎΠ½ΠΈ ΡƒΠ²Π΅Π»ΠΈΡ‡ΠΈΠ»ΠΈ Ρ€Π°Π·ΠΌΠ΅Ρ€ ΠΌΠ°ΠΊΠ΅Ρ‚Π° Π΄ΠΈΠ·Π°ΠΉΠ½Π° сайта Π΄ΠΎ космичСских 10 ΠΈ Π±ΠΎΠ»Π΅Π΅ Π³ΠΈΠ³Π°Π±Π°ΠΉΡ‚. ΠžΠ±ΡΠ·Π°Ρ‚Π΅Π»ΡŒΠ½ΠΎ ΠΎΠΏΡ‚ΠΈΠΌΠΈΠ·ΠΈΡ€ΡƒΠΉΡ‚Π΅ ΠΊΠ°Ρ€Ρ‚ΠΈΠ½ΠΊΠΈ, ΡƒΠΌΠ΅Π½ΡŒΡˆΠ°ΠΉΡ‚Π΅ ΠΈΡ… максимально Π΄ΠΎ Ρ‚Π΅Ρ… ΠΏΠΎΡ€, ΠΏΠΎΠΊΠ° Π΅Ρ‰Π΅ Π½Π΅ Π²ΠΈΠ΄Π½ΠΎ отличия, Π° Ρ€Π°Π·ΠΌΠ΅Ρ€ ΡƒΠΆΠ΅ ΠΌΠΈΠ½ΠΈΠΌΠ°Π»ΡŒΠ½Ρ‹ΠΉ.

Π§Ρ‚ΠΎΠ±Ρ‹ с Π²Π°ΠΌΠΈ Π±Ρ‹Π»ΠΎ приятно ΠΈ Ρ…ΠΎΡ€ΠΎΡˆΠΎ Ρ€Π°Π±ΠΎΡ‚Π°Ρ‚ΡŒ β€” ΠΎΠ±ΡΠ·Π°Ρ‚Π΅Π»ΡŒΠ½ΠΎ ΡΠΎΠ±Π»ΡŽΠ΄Π°ΠΉΡ‚Π΅ эти ΠΏΡ€Π°Π²ΠΈΠ»Π° ΠΏΠΎΠ΄Π³ΠΎΡ‚ΠΎΠ²ΠΊΠΈ ΠΌΠ°ΠΊΠ΅Ρ‚Π° сайта для вСрстки. УспСхов!

Π‘ΠΎΠ·Π΄Π°Ρ‚ΡŒ Π³Ρ€Π°ΠΌΠΎΡ‚Π½Ρ‹ΠΉ ΠΌΠ°ΠΊΠ΅Ρ‚ для вСрстки сайта

ΠžΡ‡Π΅Π½ΡŒ часто ΠΏΡ€ΠΈ создании сайта ΠΌΠΎΠΆΠ΅Ρ‚ ΠΏΡ€ΠΎΠΈΠ·ΠΎΠΉΡ‚ΠΈ ситуация, ΠΊΠΎΠ³Π΄Π° ΠΌΠ°ΠΊΠ΅Ρ‚ создавался Π² ΠΎΠ΄Π½ΠΎΠΌ мСстС, Π° Ρ€Π°Π·Ρ€Π°Π±Π°Ρ‚Ρ‹Π²Π°ΡŽΡ‚ Π΅Π³ΠΎ Π² Π΄Ρ€ΡƒΠ³ΠΎΠΌ. Π’ Ρ‚Π°ΠΊΠΎΠΌ случаС Π½Π΅Π²ΠΎΠ·ΠΌΠΎΠΆΠ½Π° ΠΊΠΎΠΌΠΌΡƒΠ½ΠΈΠΊΠ°Ρ†ΠΈΡ ΠΌΠ΅ΠΆΠ΄Ρƒ Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚Ρ‡ΠΈΠΊΠ°ΠΌΠΈ ΠΈ Π΄ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€Π°ΠΌΠΈ ΠΈ любая ΠΎΠΏΠ»ΠΎΡˆΠ½ΠΎΡΡ‚ΡŒ ΠΏΡ€ΠΈ создании ΠΌΠ°ΠΊΠ΅Ρ‚Π° ΠΏΠΎΡ‚ΠΎΠΌ Π²Ρ‹Ρ…ΠΎΠ΄ΠΈΡ‚ Π±ΠΎΠΊΠΎΠΌ Π²Π΅Ρ€ΡΡ‚Π°Π»ΡŒΡ‰ΠΈΠΊΡƒ. Π’ этой ΡΡ‚Π°Ρ‚ΡŒΠ΅ ΠΌΡ‹ расскаТСм Π³Π΄Π΅ Ρ‡Π°Ρ‰Π΅ всСго Π²ΡΠΏΠ»Ρ‹Π²Π°ΡŽΡ‚ ΠΏΠΎΠ΄ΠΎΠ±Π½Ρ‹Π΅ ΠΏΡ€ΠΎΠ±Π»Π΅ΠΌΡ‹ ΠΈ Ρ‡Ρ‚ΠΎ Π½ΡƒΠΆΠ½ΠΎ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎ ΠΏΡ€ΠΎΠ²Π΅Ρ€ΠΈΡ‚ΡŒ ΠΏΠ΅Ρ€Π΅Π΄ Ρ‚Π΅ΠΌ, ΠΊΠ°ΠΊ ΠΎΡ‚Π΄Π°Π²Π°Ρ‚ΡŒ Π΅Π³ΠΎ Π½Π° вСрстку. ΠœΡ‹ Π½Π΅ Π±ΡƒΠ΄Π΅ΠΌ Ρ€Π°ΡΡΠΊΠ°Π·Ρ‹Π²Π°Ρ‚ΡŒ, ΠΊΠ°ΠΊ ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ ΠΌΠ°ΠΊΠ΅Ρ‚ сайта, Π° ΡƒΠΊΠ°ΠΆΠ΅ΠΌ Π½Π° Ρ‚Π΅ ошибки, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ профСссионалы Π΄Π΅Π»Π°ΡŽΡ‚ ΠΏΠΎ Π½Π΅Π²Π½ΠΈΠΌΠ°Ρ‚Π΅Π»ΡŒΠ½ΠΎΡΡ‚ΠΈ ΠΈΠ»ΠΈ ΠΈΠ·-Π·Π° Π΅Π³ΠΎ ΠΏΠΎΠ²Ρ‹ΡˆΠ΅Π½Π½ΠΎΠΉ слоТности.

Π˜Π³Π½ΠΎΡ€ΠΈΡ€ΠΎΠ²Π°Π½ΠΈΠ΅ сСтки

12-ΠΊΠΎΠ»ΠΎΠ½ΠΎΡ‡Π½Ρ‹ΠΉ Π³Ρ€ΠΈΠ΄ ΠΏΡ€ΠΈΠ·Π²Π°Π½ ΡƒΠΏΡ€ΠΎΡΡ‚ΠΈΡ‚ΡŒ Π²Π΅Ρ€ΡΡ‚Π°Π»ΡŒΡ‰ΠΈΠΊΡƒ Тизнь, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΎΠ½ Ρ‚ΠΎΡ‡Π½ΠΎ Π·Π½Π°Π» ΠΊΠ°ΠΊ ΠΈ Π³Π΄Π΅ Ρ€Π°ΡΠΏΠΎΠ»Π°Π³Π°ΡŽΡ‚ΡΡ ΠΊΠ»ΡŽΡ‡Π΅Π²Ρ‹Π΅ элСмСнты. Но ΠΈΠ½ΠΎΠ³Π΄Π° Π΄ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€Ρ‹ Π½Π°ΠΌΠ΅Ρ€Π΅Π½Π½ΠΎ отходят ΠΎΡ‚ Π½Π΅Π³ΠΎ для создания Π½Π΅ΠΎΠ±Ρ‹Ρ‡Π½ΠΎΠ³ΠΎ Π΄ΠΈΠ·Π°ΠΉΠ½Π°. Π­Ρ‚ΠΎ Π½ΠΎΡ€ΠΌΠ°Π»ΡŒΠ½ΠΎ.

ΠΠ΅Π½ΠΎΡ€ΠΌΠ°Π»ΡŒΠ½ΠΎ – ΠΊΠΎΠ³Π΄Π° всС ΠΆΠ΅ ΠΏΡ€ΠΈΠ΄Π΅Ρ€ΠΆΠΈΠ²Π°ΡΡΡŒ сСтки постоянно нСобоснованно ΠΎΡ‚Ρ…ΠΎΠ΄ΠΈΡ‚ΡŒ ΠΎΡ‚ Π½Π΅Π΅. На ΠΎΠ΄Π½ΠΎΠΉ страницС Π±Π»ΠΎΠΊΠΈ Ρ€Π°ΡΠΏΠΎΠ»Π°Π³Π°ΡŽΡ‚ΡΡ Π² ΠΎΠ΄Π½ΠΎΠΌ мСстС, Π° Π½Π° ΡΠ»Π΅Π΄ΡƒΡŽΡ‰Π΅ΠΉ ΠΎΠ½ΠΈ ΠΆΠ΅ находятся Ρ‡ΡƒΡ‚ΡŒ ΠΏΡ€Π°Π²Π΅Π΅ ΠΈΠ»ΠΈ Π»Π΅Π²Π΅Π΅; ΠΈΠΊΠΎΠ½ΠΊΠΈ ΠΌΠ΅Π½ΡΡŽΡ‚ Ρ€Π°Π·ΠΌΠ΅Ρ€; ΠΊΠ½ΠΎΠΏΠΊΠΈ ΠΌΠ΅Π½ΡΡŽΡ‚ Ρ„ΠΎΡ€ΠΌΡƒ ΠΈ Ρ‚.Π΄.

Когда Ρ‚Π°ΠΊ случаСтся, вСрстка ΠΈΠ· PDS ΠΌΠ°ΠΊΠ΅Ρ‚Π° замСдляСтся, вСдь постоянно приходится Π²Ρ‹ΡΡΠ½ΡΡ‚ΡŒ, ΠΊΠ°ΠΊ Ρ‚ΠΎΡ‚ ΠΈΠ»ΠΈ ΠΈΠ½ΠΎΠΉ ΠΈΠ΄Π΅Π½Ρ‚ΠΈΡ‡Π½Ρ‹ΠΉ Π±Π»ΠΎΠΊ Π΄ΠΎΠ»ΠΆΠ΅Π½ Ρ€Π°ΡΠΏΠΎΠ»Π°Π³Π°Ρ‚ΡŒΡΡ Π½Π° самом Π΄Π΅Π»Π΅. ΠŸΡ€ΠΈ этом ΠΌΠΎΠΆΠ΅Ρ‚ Π²ΠΎΠ·Π½ΠΈΠΊΠ½ΡƒΡ‚ΡŒ ΠΏΡ€ΠΎΠ±Π»Π΅ΠΌΡ‹ с Π°Π΄Π°ΠΏΡ‚ΠΈΠ²ΠΎΠΌ, Ρ‚.ΠΊ. нСпонятно, ΠΊΠ°ΠΊ Π²Ρ‹ΡˆΠ΅Π΄ΡˆΠΈΠ΅ ΠΈΠ· сСтки элСмСнты Π΄ΠΎΠ»ΠΆΠ½Ρ‹ вСсти сСбя ΠΏΡ€ΠΈ ΠΌΠ΅Π½ΡŒΡˆΠΈΡ… Ρ€Π°ΡΡˆΠΈΡ€Π΅Π½ΠΈΡΡ….

ΠΠ΅ΡƒΠΏΠΎΡ€ΡΠ΄ΠΎΡ‡Π΅Π½Π½ΠΎΡΡ‚ΡŒ Π² слоях

Π”ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€Ρ‹ – творчСскиС люди. И Π² процСссС Ρ€Π°Π±ΠΎΡ‚Ρ‹ Π½Π°Π΄ ΠΌΠ°ΠΊΠ΅Ρ‚ΠΎΠΌ ΠΌΠΎΠ³ΡƒΡ‚ Π·Π°Π±Ρ‹Π²Π°Ρ‚ΡŒ Π΄Π°Π²Π°Ρ‚ΡŒ слоям понятныС ΠΈ ΠΎΠ΄Π½ΠΎΠ·Π½Π°Ρ‡Π½Ρ‹Π΅ названия ΠΈ ΡƒΠΏΠΎΡ€ΡΠ΄ΠΎΡ‡ΠΈΠ²Π°Ρ‚ΡŒ ΠΈΡ… слСдуя Π»ΠΎΠ³ΠΈΠΊΠ΅ ΠΌΠ°ΠΊΠ΅Ρ‚Π°. Из-Π·Π° этого ΠΎΠ½ΠΈ сами часто Π½Π΅ ΠΌΠΎΠ³ΡƒΡ‚ Ρ€Π°Π·ΠΎΠ±Ρ€Π°Ρ‚ΡŒΡΡ Π² своСй Ρ€Π°Π±ΠΎΡ‚Π΅ ΠΈ Π³Π΄Π΅ Ρ‡Ρ‚ΠΎ Π½Π°Π΄ΠΎ ΠΈΡΠΊΠ°Ρ‚ΡŒ.

ΠŸΠΎΡΡ‚ΠΎΠΌΡƒ, Ссли Π²Ρ‹ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ ΠΈΠ·Π±Π΅ΠΆΠ°Ρ‚ΡŒ этого: удаляйтС Π½Π΅Π½ΡƒΠΆΠ½Ρ‹Π΅ слои, склСивайтС слои с эффСктами ΠΈ распрСдСляйтС ΠΈΡ… ΠΏΠΎ ΠΏΠ°ΠΏΠΊΠ°ΠΌ Π² понятном порядкС.

ΠžΡ‚ΡΡ‚ΡƒΠΏΡ‹

ΠŸΡ€ΠΈ ΠΈΠ΄Π΅Π°Π»ΡŒΠ½Ρ‹Ρ… условиях всС отступы ΠΈ Ρ€Π°Π·ΠΌΠ΅Ρ€Ρ‹ элСмСнтов Π΄ΠΎΠ»ΠΆΠ½Ρ‹ Π±Ρ‹Ρ‚ΡŒ стандартизированы для всСго ΠΌΠ°ΠΊΠ΅Ρ‚Π°. Если Π² Ρ€Π°Π·Π½Ρ‹Ρ… мСстах ΠΎΠ½ΠΈ ΠΎΡ‚Π»ΠΈΡ‡Π°ΡŽΡ‚ΡΡ хотя Π±Ρ‹ Π½Π° ΠΎΠ΄ΠΈΠ½ пиксСль – это ΡƒΠΆΠ΅ затрудняСт Ρ€Π°Π±ΠΎΡ‚Ρƒ Π²Π΅Ρ€ΡΡ‚Π°Π»ΡŒΡ‰ΠΈΠΊΠ°. Π₯ΠΎΡ‚ΡŒ Ρ‚Π°ΠΊΠΎΠ΅ малСнькоС Ρ€Π°Π·Π»ΠΈΡ‡ΠΈΠ΅ Π½Π΅Π·Π½Π°Ρ‡ΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎ влияСт Π½Π° внСшний Π²ΠΈΠ΄ сайта (хотя Π½Π΅ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ Π΄ΠΎΡ‚ΠΎΡˆΠ½Ρ‹Π΅ ΠΊΠ»ΠΈΠ΅Π½Ρ‚Ρ‹ Π·Π°ΠΌΠ΅Ρ‡Π°ΡŽΡ‚ ΠΈ это), Π½ΠΎ ΠΏΡ€ΠΈ вСрсткС Π΄ΠΈΠ·Π°ΠΉΠ½Π° сайта ΠΎΠ½ΠΈ, скорСС всСго, Π±ΡƒΠ΄ΡƒΡ‚ просто ΠΎΠ±Ρ€Π΅Π·Π°Π½Ρ‹. ΠŸΠΎΡΡ‚ΠΎΠΌΡƒ Π²ΠΎΠ·ΡŒΠΌΠΈΡ‚Π΅ Π·Π° ΠΏΡ€Π°Π²ΠΈΠ»ΠΎ – слСдитС Π·Π° всСми отступами, Π° Π²ΠΎ врСмя создания ΠΎΠ±ΡŠΠ΅ΠΊΡ‚ΠΎΠ² ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ цСлочислСнныС Ρ€Π°Π·ΠΌΠ΅Ρ€Ρ‹.


Π Π°Π·Π½Ρ‹Π΅ Ρ†Π²Π΅Ρ‚Π°

Часто Π²ΠΎ врСмя Ρ€Π°Π±ΠΎΡ‚Ρ‹ Π΄ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€Ρ‹ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽΡ‚ инструмСнт Β«ΠΏΠΈΠΏΠ΅Ρ‚ΠΊΠ°Β» ΠΈ просто Ρ‚Ρ‹ΠΊΠ°ΡŽΡ‚ Сю Π² элСмСнт, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π½Π΅ Π·Π°ΠΏΠΎΠΌΠΈΠ½Π°Ρ‚ΡŒ ΠΊΠΎΠ΄Ρ‹ Ρ†Π²Π΅Ρ‚Π°. Но Ссли Π²Π·ΡΡ‚ΡŒ Ρ†Π²Π΅Ρ‚ с края, Ρ‚ΠΎ ΠΎΠ½ ΠΌΠΎΠΆΠ΅Ρ‚ Π±Ρ‹Ρ‚ΡŒ искаТСнным ΠΎΡ‚ Ρ„ΠΎΠ½Π°. И Ρ‚ΠΎΠ³Π΄Π° Π½ΠΎΠΌΠ΅Ρ€ Ρ†Π²Π΅Ρ‚Π° помСняСтся. ΠœΠΎΠΆΠ΅Ρ‚ ΡΠ»ΡƒΡ‡ΠΈΡ‚ΡŒΡΡ Ρ‚Π°ΠΊ, Ρ‡Ρ‚ΠΎ Ρƒ ΠΏΠΈΠΏΠ΅Ρ‚ΠΊΠΈ Π±ΡƒΠ΄Π΅Ρ‚ Ρ€Π°Π·ΠΌΠ΅Ρ€ Π±ΠΎΠ»Π΅Π΅ ΠΎΠ΄Π½ΠΎΠ³ΠΎ пиксСля ΠΈ Ρ‚ΠΎΠ³Π΄Π° Ρ€Π΅Π΄Π°ΠΊΡ‚ΠΎΡ€ Π²ΠΎΠ·ΡŒΠΌΠ΅Ρ‚ срСднСС значСния ΠΌΠ΅ΠΆΠ΄Ρƒ попавшими Π² Π½Π΅Π΅ Ρ†Π²Π΅Ρ‚ΠΎΠΌ. ΠŸΠΎΡΡ‚ΠΎΠΌΡƒ Π»ΡƒΡ‡ΡˆΠ΅ всСго ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒΡΡ ΠΈΡΠΊΠ»ΡŽΡ‡ΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎ Π½ΠΎΠΌΠ΅Ρ€ Ρ†Π²Π΅Ρ‚Π°.


ΠŸΡ€ΠΈΠΌΠ΅Ρ‡Π°Π½ΠΈΠ΅: Π½Π΅ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ Π΄ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€Ρ‹, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΎΡΠ²Π΅Ρ‚Π»ΠΈΡ‚ΡŒ Ρ†Π²Π΅Ρ‚ просто ΡƒΠ²Π΅Π»ΠΈΡ‡ΠΈΠ²Π°ΡŽΡ‚ ΠΏΡ€ΠΎΠ·Ρ€Π°Ρ‡Π½ΠΎΡΡ‚ΡŒ слоя. ΠŸΡ€ΠΈ вСрсткС Π² Ρ‚Π°ΠΊΠΎΠΌ случаС Π²Π΅Π»ΠΈΠΊΠ° Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡ‚ΡŒ ошибкС Π² Ρ†Π²Π΅Ρ‚Π΅.

РастрированныС элСмСнты

Если Π±Π΅Π·Π΄ΡƒΠΌΠ½ΠΎ Ρ€Π°ΡΡ‚Ρ€ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ Ρ€Π°Π·Π½Ρ‹Π΅ элСмСнты ΠΌΠ°ΠΊΠ΅Ρ‚Π°, Ρ‚ΠΎ ΠΌΠΎΠ³ΡƒΡ‚ Π²ΠΎΠ·Π½ΠΈΠΊΠ½ΡƒΡ‚ΡŒ ошибки ΠΈ нСточности. НапримСр, растрированный тСкст Π½Π΅Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎ ΡΠΊΠΎΠΏΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ, Ρ‚ΠΎΠ»ΡŒΠΊΠΎ Π·Π°Π½ΠΎΠ²ΠΎ Π½Π°Π±Ρ€Π°Ρ‚ΡŒ. А Π³Π΄Π΅ Π² этом случаС Π²Π΅Ρ€ΡΡ‚Π°Π»ΡŒΡ‰ΠΈΠΊΡƒ Π±Ρ€Π°Ρ‚ΡŒ Π½Π°Ρ‡Π΅Ρ€Ρ‚Π°Π½ΠΈΠ΅, ΠΎΡ‚Ρ‚Π΅Π½ΠΎΠΊ, ΠΈ Ρ€Π°Π·ΠΌΠ΅Ρ€? Если растрирован слой, Ρ‚ΠΎ Π±ΡƒΠ΄Π΅Ρ‚ ΠΎΡ‡Π΅Π½ΡŒ Ρ‚Ρ€ΡƒΠ΄Π½ΠΎ Ρ‚ΠΎΡ‡Π½ΠΎ ΡƒΠ·Π½Π°Ρ‚ΡŒ ΠΏΠ°Ρ€Π°ΠΌΠ΅Ρ‚Ρ€Ρ‹ Ρ‚Π΅Π½ΠΈ ΠΈΠ»ΠΈ Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚Π°.

Π’Π°ΠΊΠΆΠ΅ Π²Π΅Ρ€ΡΡ‚Π°Π»ΡŒΡ‰ΠΈΠΊΠΈ Π½Π΅Π΄ΠΎΠ»ΡŽΠ±Π»ΠΈΠ²Π°ΡŽΡ‚ эффСкты налоТСния, Ρ‚Π°ΠΊ ΠΊΠ°ΠΊ ΠΈΡ… ΠΎΡ‡Π΅Π½ΡŒ Ρ‚Ρ€ΡƒΠ΄Π½ΠΎ ΠΏΠ΅Ρ€Π΅Π΄Π°Ρ‚ΡŒ ΠΏΡ€ΠΈ Ρ€Π°Π±ΠΎΡ‚Π΅. К Ρ‚ΠΎΠΌΡƒ ΠΆΠ΅ Π΄Π°Π»Π΅ΠΊΠΎ Π½Π΅ ΠΊΠ°ΠΆΠ΄Ρ‹ΠΉ Π±Ρ€Π°ΡƒΠ·Π΅Ρ€ Π±ΡƒΠ΄Π΅Ρ‚ ΠΎΡ‚ΠΎΠ±Ρ€Π°ΠΆΠ°Ρ‚ΡŒ ΠΈΡ… Ρ‚Π°ΠΊ, ΠΊΠ°ΠΊ Π·Π°Π΄ΡƒΠΌΠ°Π½ΠΎ.

Π­Ρ„Ρ„Π΅ΠΊΡ‚Ρ‹ налоТСния Π² Ρ€Π°Π·Π½Ρ‹Ρ… Π±Ρ€Π°ΡƒΠ·Π΅Ρ€Π°Ρ…

Π¨Ρ€ΠΈΡ„Ρ‚Ρ‹

Π‘Ρ€Π΅Π΄ΠΈ профСссионалов отрасли принято ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ Π½Π΅ Π±ΠΎΠ»Π΅Π΅ Ρ‚Ρ€Π΅Ρ… Ρ€Π°Π·Π»ΠΈΡ‡Π½Ρ‹Ρ… ΡˆΡ€ΠΈΡ„Ρ‚ΠΎΠ² Π½Π° ΠΎΠ΄Π½ΠΎΠΌ сайтС. ΠšΠΎΠ½Π΅Ρ‡Π½ΠΎ, это Π½Π΅ строгоС ΠΏΡ€Π°Π²ΠΈΠ»ΠΎ, Π½ΠΎ Ρ‡Π΅ΠΌ мСньшС ΠΈΡ… ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅Ρ‚ΡΡ Π² ΠΎΠ΄Π½ΠΎΠΌ мСстС, Ρ‚Π΅ΠΌ Π»Π΅Π³Ρ‡Π΅ Ρ‡ΠΈΡ‚Π°Ρ‚Π΅Π»ΡŽ ΠΎΡ€ΠΈΠ΅Π½Ρ‚ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒΡΡ Π² тСкстС. ВмСстС с ΠΌΠ°ΠΊΠ΅Ρ‚ΠΎΠΌ для вСрстки сайта Π΄ΠΎΠ»ΠΆΠ½Ρ‹ ΠΏΠ΅Ρ€Π΅Π΄Π°Π²Π°Ρ‚ΡŒΡΡ ΠΈ Π³Π°Ρ€Π½ΠΈΡ‚ΡƒΡ€Ρ‹ ΠΈΠ»ΠΈ ссылки Π½Π° Ρ‚ΠΎ, ΠΎΡ‚ΠΊΡƒΠ΄Π° ΠΈΡ… ΡΠΊΠ°Ρ‡Π°Ρ‚ΡŒ.

ΠŸΡ€ΠΈ Ρ€Π°Π±ΠΎΡ‚Π΅ со ΡˆΡ€ΠΈΡ„Ρ‚Π°ΠΌΠΈ Ρ‚ΠΎΠΆΠ΅ Π½ΡƒΠΆΠ½ΠΎ Π±Ρ‹Ρ‚ΡŒ остороТным. Π’Π°ΠΊ, Ссли ΠΊΠΎ всСму Π±Π»ΠΎΠΊΡƒ ΠΏΡ€ΠΈΠΌΠ΅Π½ΠΈΠ»ΠΈ трансформированиС, Ρ‚ΠΎ ΡˆΡ€ΠΈΡ„Ρ‚ Π² Π½Π΅ΠΌ ΠΌΠΎΠΆΠ΅Ρ‚ ΡƒΠ²Π΅Π»ΠΈΡ‡ΠΈΡ‚ΡŒΡΡ ΠΈΠ»ΠΈ ΡƒΠΌΠ΅Π½ΡŒΡˆΠΈΡ‚ΡŒΡΡ Π΄ΠΎ Π΄Ρ€ΠΎΠ±Π½Ρ‹Ρ… Π·Π½Π°Ρ‡Π΅Π½ΠΈΠΉ. А Π±Ρ€Π°ΡƒΠ·Π΅Ρ€ Π½Π΅ Π±ΡƒΠ΄Π΅Ρ‚ это ΡƒΡ‡ΠΈΡ‚Ρ‹Π²Π°Ρ‚ΡŒ ΠΈ ΠΎΠΊΡ€ΡƒΠ³Π»ΠΈΡ‚ Π΅Π³ΠΎ, Ρ‡Ρ‚ΠΎ Π½Π΅ Π΅ΡΡ‚ΡŒ Ρ…ΠΎΡ€ΠΎΡˆΠΎ.

Π‘ΡƒΠ΄ΡŒΡ‚Π΅ остороТны с нСстандартными ΡˆΡ€ΠΈΡ„Ρ‚Π°ΠΌΠΈ. Они ΠΌΠΎΠ³ΡƒΡ‚ Π²Ρ‹Π³Π»ΡΠ΄Π΅Ρ‚ΡŒ красиво, Π½ΠΎ ΠΎΠ½ΠΈ Π½Π°Π³Ρ€ΡƒΠΆΠ°ΡŽΡ‚ сайт ΠΈ Π·Π°ΠΌΠ΅Π΄Π»ΡΡŽΡ‚ Π΅Π³ΠΎ Ρ€Π°Π±ΠΎΡ‚Ρƒ. ΠŸΠΎΡΡ‚Π°Ρ€Π°ΠΉΡ‚Π΅ΡΡŒ ΠΌΠΈΠ½ΠΈΠΌΠΈΠ·ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ использованиС Ρ‚Π°ΠΊΠΈΡ… ΡˆΡ€ΠΈΡ„Ρ‚ΠΎΠ² ΠΈ сокращайтС ΠΈΡ… вСс ΠΊΠ°ΠΊ ΠΌΠΎΠΆΠ½ΠΎ большС.

Π’ΠΈΠΏΠΎΠ³Ρ€Π°Ρ„ΠΈΠΊΠ°

ΠžΡ‡Π΅Π½ΡŒ часто Π΄ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€Ρ‹ Π½Π΅ Π·Π°ΠΌΠΎΡ€Π°Ρ‡ΠΈΠ²Π°ΡŽΡ‚ΡΡ Π½Π°Π΄ Ρ‚ΠΈΠΏΠΎΠ³Ρ€Π°Ρ„ΠΈΠΊΠΎΠΉ тСкста ΠΈ Π½Π΅ ΡΠΎΠ±Π»ΡŽΠ΄Π°ΡŽΡ‚ ΠΎΠ΄ΠΈΠ½Π°ΠΊΠΎΠ²Ρ‹Π΅ мСТстрочныС ΠΈΠ½Ρ‚Π΅Ρ€Π²Π°Π»Ρ‹ Π² ΠΎΠ΄ΠΈΠ½Π°ΠΊΠΎΠ²Ρ‹Ρ… Π±Π»ΠΎΠΊΠ°Ρ… Π½Π° страницах, отступы Π² Π°Π±Π·Π°Ρ†Π°Ρ… Π²Π΅Π·Π΄Π΅ Ρ€Π°Π·Π½Ρ‹Π΅, Π° ΠΈΠ½ΠΎΠ³Π΄Π°, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚ΡŒ отступы ΠΌΠ΅ΠΆΠ΄Ρƒ Π½ΠΈΠΌΠΈ просто Π΄Π΅Π»Π°ΡŽΡ‚ ΠΎΡ‚Π΄Π΅Π»ΡŒΠ½Ρ‹Π΅ тСкстовыС Π±Π»ΠΎΠΊΠΈ. Π’Π°ΠΊ Π΄Π΅Π»Π°Ρ‚ΡŒ Π½Π΅ стоит. Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ настройки ΠΈΠ½Ρ‚Π΅Ρ€Π»ΠΈΠ½ΡŒΡΠΆΠ° ΠΈ Π°Π±Π·Π°Ρ†Π°, для привСдСния всСй структуры ΠΊ Π΅Π΄ΠΈΠ½ΠΎΠΌΡƒ стандарту. Π£ΠΊΠ°ΠΆΠΈΡ‚Π΅ Π³Π΄Π΅ Π² ΠΌΠ°ΠΊΠ΅Ρ‚Π΅ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠΈ h2, h3, h4, h5 ΠΈ Ρ‚.Π΄., Π³Π΄Π΅ ΠΌΠ°Ρ€ΠΊΠΈΡ€ΠΎΠ²Π°Π½Π½Ρ‹ΠΉ список, Π³Π΄Π΅ Π½ΡƒΠΌΠ΅Ρ€ΠΎΠ²Π°Π½Π½Ρ‹ΠΉ. Π‘ΠΎΠ±Π΅Ρ€ΠΈΡ‚Π΅ всС это Π² Π΅Π΄ΠΈΠ½Ρ‹ΠΉ Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚ послС Ρ‚ΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ создали ΠΌΠ°ΠΊΠ΅Ρ‚ сайта Π² Ρ€Π΅Π΄Π°ΠΊΡ‚ΠΎΡ€Π΅ ΠΈ ΠΏΡ€ΠΈΡˆΠ»ΠΈΡ‚Π΅ вмСстС с Π½ΠΈΠΌ.

Анимации

Когда Ρƒ элСмСнта (ΠΊΠ½ΠΎΠΏΠΊΠΈ ΠΈΠ»ΠΈ Π±Π°Π½Π½Π΅Ρ€Π°) Π·Π°Π΄ΡƒΠΌΠ°Π½Π° анимация, Ρ‚ΠΎ Π΄ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€ всСгда Π΄ΠΎΠ»ΠΆΠ΅Π½ ΠΏΠΎΠΊΠ°Π·Π°Ρ‚ΡŒ всС Π΅Π³ΠΎ состояния послойно, сопровоТдая это коммСнтариями с ΠΏΡ€ΠΈΠΌΠ΅Ρ€Π°ΠΌΠΈ. Π˜Π½Π°Ρ‡Π΅ Π±Π΅Π· нСимСния ΠΎΠ±Ρ€Π°Π·Ρ†Π° Π²Π΅Ρ€ΡΡ‚Π°Π»ΡŒΡ‰ΠΈΠΊ Π±ΡƒΠ΄Π΅Ρ‚ Π·Π°Π½ΠΈΠΌΠ°Ρ‚ΡŒΡΡ ΡΠ°ΠΌΠΎΠ΄Π΅ΡΡ‚Π΅Π»ΡŒΠ½ΠΎΡΡ‚ΡŒΡŽ, которая ΠΏΠΎΡ‚ΠΎΠΌ Π²Ρ‹ΠΉΠ΄Π΅Ρ‚ Π±ΠΎΠΊΠΎΠΌ ΠΊΠ°ΠΊ Π·Π°ΠΊΠ°Π·Ρ‡ΠΈΠΊΡƒ, Ρ‚Π°ΠΊ ΠΈ ΠΈΡΠΏΠΎΠ»Π½ΠΈΡ‚Π΅Π»ΡŽ.

PNG ΠΏΡ€ΠΎΡ‚ΠΈΠ² SVG

Π•Ρ‰Π΅ ΠΎΠ΄Π½ΠΎ ΠΏΡ€Π°Π²ΠΈΠ»ΠΎ ΠΏΡ€ΠΎΡ„Π΅ΡΡΠΈΠΎΠ½Π°Π»ΡŒΠ½Ρ‹Ρ… Π΄ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€ΠΎΠ² – ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ ΠΈΠΊΠΎΠ½ΠΊΠΈ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ Π² Ρ„ΠΎΡ€ΠΌΠ°Ρ‚Π΅ SVG. НСваТно, нарисовал Π»ΠΈ ΠΎΠ½ ΠΈΡ… сам ΠΈΠ»ΠΈ скачал ΠΎΡ‚ΠΊΡƒΠ΄Π°-Ρ‚ΠΎ, Ссли ΠΈΠΊΠΎΠ½ΠΊΠ° сохранСна Π² Ρ„ΠΎΡ€ΠΌΠ°Ρ‚Π΅ PNG, Ρ‚ΠΎ Π΅Π΅ края ΠΏΡ€ΠΈ ΠΌΠ°ΡΡˆΡ‚Π°Π±ΠΈΡ€ΠΎΠ²Π°Π½ΠΈΠΈ ΠΌΠΎΠ³ΡƒΡ‚ Ρ€Π°ΡΠΏΠ»Ρ‹Π²Π°Ρ‚ΡŒΡΡ. ΠŸΠΎΡΡ‚ΠΎΠΌΡƒ Π½ΠΈΠΊΠΎΠ³Π΄Π° Π½Π΅ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ Ρ„ΠΎΡ€ΠΌΠ°Ρ‚ PNG для ΠΈΠΊΠΎΠ½ΠΎΠΊ Π² ΠΌΠ°ΠΊΠ΅Ρ‚Π΅.

РСзюмС

Π“Π»Π°Π²Π½ΠΎΠ΅ ΠΏΡ€Π°Π²ΠΈΠ»ΠΎ ΠΏΡ€ΠΈ Ρ€Π°Π±ΠΎΡ‚Π΅ Π½Π°Π΄ ΠΌΠ°ΠΊΠ΅Ρ‚ΠΎΠΌ – это Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅ ΠΊ дСталям ΠΈ ΡΡ‚Π°Π½Π΄Π°Ρ€Ρ‚ΠΈΠ·ΠΈΡ€ΠΎΠ²Π°Π½Π½ΠΎΡΡ‚ΡŒ. НС стоит Π΄Π΅Π»Π°Ρ‚ΡŒ Ρ‡Ρ‚ΠΎ-Ρ‚ΠΎ Β«Π½Π° Π³Π»Π°Π·Β» ΠΈΠ»ΠΈ Π²Ρ€Π°Π·Π½ΠΎΠ±ΠΎΠΉ. Π§Ρ‚ΠΎΠ±Ρ‹ Π½Π΅ Π·Π°Π±Ρ‹Ρ‚ΡŒ всС Π½ΡŽΠ°Π½ΡΡ‹, сохранитС этот Ρ‡Π΅ΠΊ-лист:

  • Если ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅Ρ‚ΡΡ сСтка, Ρ‚ΠΎ всС Π΄ΠΎΠ»ΠΆΠ½ΠΎ строго ΡΠ»Π΅Π΄ΠΎΠ²Π°Ρ‚ΡŒ Π΅ΠΉ.
  • ЦСлочислСнныС Ρ€Π°Π·ΠΌΠ΅Ρ€Ρ‹ Π½Π° всСх ΠΎΠ±ΡŠΠ΅ΠΊΡ‚Π°Ρ….
  • ВсС элСмСнты, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ ΠΏΠΎΠ²Ρ‚ΠΎΡ€ΡΡŽΡ‚ΡΡ Π΄ΠΎΠ»ΠΆΠ½Ρ‹ Π±Ρ‹Ρ‚ΡŒ ΠΎΠ΄ΠΈΠ½Π°ΠΊΠΎΠ²Ρ‹ΠΌΠΈ.
  • ΠœΠ°ΠΊΠ΅Ρ‚ Π΄ΠΎΠ»ΠΆΠ΅Π½ Π±Ρ‹Ρ‚ΡŒ логичСски собранным, лишниС слои ΡƒΠ΄Π°Π»Π΅Π½Ρ‹, Π° ΠΎΡΡ‚Π°Π»ΡŒΠ½Ρ‹Π΅ сгруппированы слСдуя Π»ΠΎΠ³ΠΈΠΊΠ΅ ΠΌΠ°ΠΊΠ΅Ρ‚Π°.
  • ΠžΡ‚ΡΡ‚ΡƒΠΏΡ‹ ΠΎΡ‚ шапки ΠΈ Ρ„ΡƒΡ‚Π΅Ρ€Π° ΠΎΠ΄ΠΈΠ½Π°ΠΊΠΎΠ²Ρ‹.
  • Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ Π½ΠΎΠΌΠ΅Ρ€Π° Ρ†Π²Π΅Ρ‚ΠΎΠ², Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π½Π΅ ΠΏΠ΅Ρ€Π΅ΠΏΡƒΡ‚Π°Ρ‚ΡŒ ΠΈΡ….
  • НС Ρ€Π°ΡΡ‚Ρ€ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ тСкст, Ρ‚Π΅Π½ΠΈ, Π³Ρ€Π°Π΄ΠΈΠ΅Π½Ρ‚Ρ‹ ΠΈ эффСкты налоТСния.
  • НС ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ эффСкт налоТСния Π±Π΅Π· надобности.
  • НСдробныС Ρ€Π°Π·ΠΌΠ΅Ρ€Ρ‹ Ρƒ ΡˆΡ€ΠΈΡ„Ρ‚ΠΎΠ², всС ΠΎΠ½ΠΈ собраны Π² ΠΎΠ΄Π½ΠΎΠΌ мСстС ΠΈ ΠΏΡ€ΠΎΠ²Π΅Ρ€Π΅Π½ΠΎ ΠΈΡ… Π½Π°Π»ΠΈΡ‡ΠΈΠ΅ Π² Π²Π΅Π±-вСрсии. Π Π°Π·ΠΌΠ΅Ρ€ Π½Π΅ ΠΏΡ€Π΅Π²Ρ‹ΡˆΠ°Π΅Ρ‚ 1 Мб.
  • Единая Ρ‚ΠΈΠΏΠΎΠ³Ρ€Π°Ρ„ΠΈΠΊΠ°.
  • ВсС ΠΈΠΊΠΎΠ½ΠΊΠΈ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ Π² Ρ„ΠΎΡ€ΠΌΠ°Ρ‚Π΅ SVG. Они собраны логичСски ΠΏΡ€Π°Π²ΠΈΠ»ΡŒΠ½ΠΎ Π±Π΅Π· нСпонятных Π½Π°Π·Π²Π°Π½ΠΈΠΉ.
  • ВсС Π°ΠΊΡ‚ΠΈΠ²Π½Ρ‹Π΅ элСмСнты Π΄ΠΎΠ»ΠΆΠ½Ρ‹ Π±Ρ‹Ρ‚ΡŒ с Ρ…ΠΎΠ²Π΅Ρ€Π°ΠΌΠΈ.
  • Π”Π΅Π»Π°Ρ‚ΡŒ ΠΏΠΎΠ½ΡΡ‚Π½ΡƒΡŽ для Π²Π΅Ρ€ΡΡ‚Π°Π»ΡŒΡ‰ΠΈΠΊΠ° Π°Π½ΠΈΠΌΠ°Ρ†ΠΈΡŽ.
  • Π‘Ρ‚ΠΈΠ»ΠΈ ΠΈ Ρ†Π²Π΅Ρ‚Π° Π΄ΠΎΠ»ΠΆΠ½Ρ‹ понятно описаны Π² Π΅Π΄ΠΈΠ½ΠΎΠΌ Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚Π΅.

Π—Π°ΠΊΠ°Π·Π°Ρ‚ΡŒ вСрстку сайта ΠΈΠ· PSD ΠΌΠ°ΠΊΠ΅Ρ‚Π°

Π—Π°ΠΊΠ°Π·Π°Ρ‚ΡŒ вСрстку ΠΌΠ°ΠΊΠ΅Ρ‚Π° сайта Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Π² блиТайшСС врСмя Ρƒ исполнитСля YouDo. ВсС, Ρ‡Ρ‚ΠΎ Π½ΡƒΠΆΠ½ΠΎ ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π½Π°ΠΉΡ‚ΠΈ мастСра – Ρ€Π°Π·ΠΌΠ΅ΡΡ‚ΠΈΡ‚ΡŒ Π½Π° сайтС YouDo Π·Π°Π΄Π°Π½ΠΈΠ΅. ПослС ΠΏΡƒΠ±Π»ΠΈΠΊΠ°Ρ†ΠΈΠΈ заявки Π²Ρ‹ Π½Π°Ρ‡Π½Π΅Ρ‚Π΅ ΠΏΠΎΠ»ΡƒΡ‡Π°Ρ‚ΡŒ прСдлоТСния ΠΎ Π²Ρ‹ΠΏΠΎΠ»Π½Π΅Π½ΠΈΠΈ Ρ€Π°Π±ΠΎΡ‚Ρ‹ ΠΎΡ‚ заинтСрСсованных спСциалистов. Π˜Π·ΡƒΡ‡ΠΈΡ‚Π΅ ΠΎΡ‚ΠΊΠ»ΠΈΠΊΠΈ ΠΈ Π²Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ подходящСго программиста.

Π”ΠΎ оформлСния Π·Π°ΠΊΠ°Π·Π° Ρƒ вас Π΅ΡΡ‚ΡŒ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡ‚ΡŒ ΡƒΠ·Π½Π°Ρ‚ΡŒ ΠΎ ΠΏΡ€ΠΎΡ„Π΅ΡΡΠΈΠΎΠ½Π°Π»ΡŒΠ½ΠΎΠΌ ΠΎΠΏΡ‹Ρ‚Π΅ Π²Π΅Ρ€ΡΡ‚Π°Π»ΡŒΡ‰ΠΈΠΊΠ°, ΠΏΡ€ΠΎΡ‡Π΅ΡΡ‚ΡŒ Π½Π° YouDo достовСрныС ΠΎΡ‚Π·Ρ‹Π²Ρ‹ ΠΎ мастСрС, Π° Ρ‚Π°ΠΊΠΆΠ΅ ΡƒΠ²ΠΈΠ΄Π΅Ρ‚ΡŒ ΠΏΡ€ΠΈΠΌΠ΅Ρ€Ρ‹ Π²Ρ‹ΠΏΠΎΠ»Π½Π΅Π½Π½Ρ‹Ρ… ΠΈΠΌ Ρ€Π°Π±ΠΎΡ‚.

ΠžΡΠΎΠ±Π΅Π½Π½ΠΎΡΡ‚ΠΈ оказания услуг

ΠžΠ±ΡΡƒΠ΄ΠΈΡ‚Π΅ с Π²Ρ‹Π±Ρ€Π°Π½Π½Ρ‹ΠΌ исполнитСлСм YouDo условия Π·Π°ΠΊΠ°Π·Π° ΠΏΠΎ Ρ‚Π΅Π»Π΅Ρ„ΠΎΠ½Ρƒ ΠΈΠ»ΠΈ Π»ΠΈΡ‡Π½ΠΎ. Π”Π΅Ρ‚Π°Π»ΡŒΠ½ΠΎ расскаТитС мастСру ΠΎ своих идСях, обрисуйтС, ΠΊΠ°ΠΊΠΈΠΌ Π²Ρ‹ Π²ΠΈΠ΄ΠΈΡ‚Π΅ Π΄ΠΈΠ·Π°ΠΉΠ½ ΠΈ ΠΎΠ±Ρ‰ΡƒΡŽ структуру Π±ΡƒΠ΄ΡƒΡ‰Π΅ΠΉ ΠΈΠ½Ρ‚Π΅Ρ€Π½Π΅Ρ‚-ΠΏΠ»ΠΎΡ‰Π°Π΄ΠΊΠΈ. БпСциалист, зарСгистрированный Π½Π° YouDo, ΡƒΡ‡Ρ‚Π΅Ρ‚ всС ваши трСбования ΠΈ Π²Ρ‹ΠΏΠΎΠ»Π½ΠΈΡ‚ Ρ€Π°Π±ΠΎΡ‚Ρ‹ Π² Ρ‚ΠΎΡ‡Π½ΠΎΠΌ соотвСтствии с Π½ΠΈΠΌΠΈ.

Условно вСрстка ΠΌΠ°ΠΊΠ΅Ρ‚Π° сайта дСлится Π½Π° нСсколько этапов. Π­Ρ‚ΠΎ:

  • прСдоставлСниС Π²Π΅Ρ€ΡΡ‚Π°Π»ΡŒΡ‰ΠΈΠΊΡƒ тСхничСского задания
  • созданиС исполнитСлСм YouDo Π½Π°Ρ‡Π°Π»ΡŒΠ½ΠΎΠ³ΠΎ Π²Π°Ρ€ΠΈΠ°Π½Ρ‚Π° Π² соотвСтствии с Π’Π—
  • ΡƒΡ‚Π²Π΅Ρ€ΠΆΠ΄Π΅Π½ΠΈΠ΅ Π²Π°ΠΌΠΈ Π²Ρ‹ΠΏΠΎΠ»Π½Π΅Π½Π½ΠΎΠΉ Ρ€Π°Π±ΠΎΡ‚Ρ‹ ΠΈΠ»ΠΈ внСсСниС исправлСний ΠΈ ΠΊΠΎΡ€Ρ€Π΅ΠΊΡ‚ΠΈΠ²ΠΎΠ² (ΠΏΡ€ΠΈ нСобходимости)

Π‘ ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ сСрвиса YouDo Π²Ρ‹ Π² ΠΊΡ€Π°Ρ‚Ρ‡Π°ΠΉΡˆΠΈΠ΅ сроки Π½Π°ΠΉΠ΄Π΅Ρ‚Π΅ ΠΎΠΏΡ‹Ρ‚Π½ΠΎΠ³ΠΎ ΠΈΠ»ΠΈ Π½Π°Ρ‡ΠΈΠ½Π°ΡŽΡ‰Π΅Π³ΠΎ частного мастСра, Π° Ρ‚Π°ΠΊΠΆΠ΅ ΠΏΡ€ΠΎΡ„ΠΈΠ»ΡŒΠ½ΡƒΡŽ компанию. БвСдСния ΠΎ ΠΊΠ°ΠΆΠ΄ΠΎΠΌ спСциалистС, зарСгистрированном Π½Π° YouDo, ΠΏΠΎΠ΄Ρ‚Π²Π΅Ρ€Π΄ΠΈΠ»Π° администрация сайта.

ΠŸΠΎΡ€ΡƒΡ‡ΠΈΡ‚Π΅ HTML-вСрстку отвСтствСнному профСссионалу, Π½Π΅ тратя врСмя Π½Π° Π΄Π»ΠΈΡ‚Π΅Π»ΡŒΠ½Ρ‹ΠΉ поиск Π½Π°Π΄Π΅ΠΆΠ½ΠΎΠ³ΠΎ мастСра. Π˜ΡΠΏΠΎΠ»Π½ΠΈΡ‚Π΅Π»ΡŒ YouDo Π²Ρ‹ΠΏΠΎΠ»Π½ΠΈΡ‚ Ρ€Π°Π±ΠΎΡ‚Ρƒ Π² строго условлСнный срок.

Бколько стоят услуги Π²Π΅Ρ€ΡΡ‚Π°Π»ΡŒΡ‰ΠΈΠΊΠ°?

Π£ исполнитСлСй YouDo ΠΌΠΎΠΆΠ½ΠΎ Π·Π°ΠΊΠ°Π·Π°Ρ‚ΡŒ вСрстку ΠΌΠ°ΠΊΠ΅Ρ‚Π° сайта ΠΏΠΎ Π²Ρ‹Π³ΠΎΠ΄Π½ΠΎΠΉ Ρ†Π΅Π½Π΅. Π‘Ρ‚ΠΎΠΈΠΌΠΎΡΡ‚ΡŒ Π² ΠΊΠ°ΠΆΠ΄ΠΎΠΌ случаС рассчитываСтся ΠΈΠ½Π΄ΠΈΠ²ΠΈΠ΄ΡƒΠ°Π»ΡŒΠ½ΠΎ, Π½ΠΎ всСгда остаСтся ΠΏΡ€ΠΈΠ΅ΠΌΠ»Π΅ΠΌΠΎΠΉ. ΠžΠ±Ρ‰ΠΈΠ΅ ΠΏΠ°Ρ€Π°ΠΌΠ΅Ρ‚Ρ€Ρ‹, Π²Π»ΠΈΡΡŽΡ‰ΠΈΠ΅ Π½Π° Ρ‚Π°Ρ€ΠΈΡ„ – это:

  • объСм Ρ€Π°Π±ΠΎΡ‚Ρ‹
  • ΡΠ»ΠΎΠΆΠ½ΠΎΡΡ‚ΡŒ выполнСния Π·Π°ΠΊΠ°Π·Π°
  • Π½Π΅ΠΎΠ±Ρ…ΠΎΠ΄ΠΈΠΌΠΎΡΡ‚ΡŒ Π²Π½ΠΎΡΠΈΡ‚ΡŒ ΠΊΠΎΡ€Ρ€Π΅ΠΊΡ‚ΠΈΠ²Ρ‹, дополнСния Π² ΠΎΡ„ΠΎΡ€ΠΌΠ»Π΅Π½ΠΈΠ΅ сайтов, ΠΏΠ΅Ρ€Π΅Π΄Π΅Π»Ρ‹Π²Π°Ρ‚ΡŒ ΠΈΡ‚ΠΎΠ³ΠΎΠ²Ρ‹ΠΉ Π²Π°Ρ€ΠΈΠ°Π½Ρ‚ ΠΏΠΎ вашСй ΠΈΠ½ΠΈΡ†ΠΈΠ°Ρ‚ΠΈΠ²Π΅ (ΠΏΠΎΠ»Π½ΠΎΡΡ‚ΡŒΡŽ ΠΈΠ»ΠΈ частично)

Если Π±ΡƒΠ΄Π΅Ρ‚ Π½Π΅ΠΎΠ±Ρ…ΠΎΠ΄ΠΈΠΌΠΎ, программист, зарСгистрированный Π½Π° YouDo, Π½Π΅Π΄ΠΎΡ€ΠΎΠ³ΠΎ ΠΎΠ±Ρ€Π°Π±ΠΎΡ‚Π°Π΅Ρ‚ изобраТСния, ΠΏΠΎΠ΄ΠΊΠ»ΡŽΡ‡ΠΈΡ‚ внСшниС ΠΌΠΎΠ΄ΡƒΠ»ΠΈ ΠΈ ΠΌΠ΅Ρ‚Ρ€ΠΈΠΊΡƒ, настроит Ρ€Π°Π±ΠΎΡ‚Ρƒ Ρ„ΠΎΡ€ΠΌ. Π’Ρ‹ Ρ‚Π°ΠΊΠΆΠ΅ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΠΏΠΎΡ€ΡƒΡ‡ΠΈΡ‚ΡŒ ΠΈΡΠΏΠΎΠ»Π½ΠΈΡ‚Π΅Π»ΡŽ Π½Π°ΠΏΠΎΠ»Π½Π΅Π½ΠΈΠ΅ ΠΏΠ»ΠΎΡ‰Π°Π΄ΠΊΠΈ ΡƒΠ½ΠΈΠΊΠ°Π»ΡŒΠ½Ρ‹ΠΌ графичСским ΠΈ тСкстовым ΠΌΠ°Ρ‚Π΅Ρ€ΠΈΠ°Π»ΠΎΠΌ.

На YouDo зарСгистрированы ΠΊΠΎΠΌΠΏΠ°Π½ΠΈΠΈ, ΡΠΎΠ·Π΄Π°ΡŽΡ‰ΠΈΠ΅ сайты Π·Π° Ρ€Π°Π·ΡƒΠΌΠ½ΡƒΡŽ ΠΏΠ»Π°Ρ‚Ρƒ. Π£ вас Ρ‚Π°ΠΊΠΆΠ΅ Π΅ΡΡ‚ΡŒ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡ‚ΡŒ ΠΎΠ±Ρ€Π°Ρ‚ΠΈΡ‚ΡŒΡΡ ΠΊ частному мастСру, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ ΠΎΠΊΠ°Π·Ρ‹Π²Π°Π΅Ρ‚ услуги Π±Π΅Π· посрСдников. Π˜ΡΠΏΠΎΠ»Π½ΠΈΡ‚Π΅Π»ΠΈ, Ρ€Π°Π±ΠΎΡ‚Π°ΡŽΡ‰ΠΈΠ΅ Π½Π° сСбя, часто Π²Π΅Π΄ΡƒΡ‚ Π³ΠΈΠ±ΠΊΠΎΠ΅ Ρ†Π΅Π½ΠΎΠΎΠ±Ρ€Π°Π·ΠΎΠ²Π°Π½ΠΈΠ΅ услуг. Π—Π° счСт отсутствия фиксированных Ρ†Π΅Π½ Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Π»ΠΈΡ‡Π½ΠΎ ΡΠΎΠ³Π»Π°ΡΠΎΠ²Π°Ρ‚ΡŒ с мастСром ΡΡ‚ΠΎΠΈΠΌΠΎΡΡ‚ΡŒ Ρ€Π°Π±ΠΎΡ‚Ρ‹.

ΠŸΠΎΡ‡Π΅ΠΌΡƒ стоит ΠΎΠ±Ρ€Π°Ρ‚ΠΈΡ‚ΡŒΡΡ ΠΊ исполнитСлям YouDo?

ВсС Π²Π΅Ρ€ΡΡ‚Π°Π»ΡŒΡ‰ΠΈΠΊΠΈ, зарСгистрированныС Π½Π° YouDo, заинтСрСсованы Π² ΡΡ‚Π°Π±ΠΈΠ»ΡŒΠ½ΠΎΠΌ ΠΏΡ€ΠΈΡ‚ΠΎΠΊΠ΅ Π·Π°ΠΊΠ°Π·ΠΎΠ². ИмСнно поэтому ΠΈΡΠΏΠΎΠ»Π½ΠΈΡ‚Π΅Π»ΡŽ Π²Π°ΠΆΠ½ΠΎ ΠΏΡ€ΠΎΡ„Π΅ΡΡΠΈΠΎΠ½Π°Π»ΡŒΠ½ΠΎ Π²Ρ‹ΠΏΠΎΠ»Π½ΠΈΡ‚ΡŒ Ρ€Π°Π±ΠΎΡ‚Ρƒ, ΠΏΠΎΠ»ΡƒΡ‡ΠΈΠ² ΠΎΡ‚ вас Ρ…ΠΎΡ€ΠΎΡˆΡƒΡŽ Ρ€Π΅ΠΊΠΎΠΌΠ΅Π½Π΄Π°Ρ†ΠΈΡŽ. ΠžΠΏΡ‹Ρ‚Π½Ρ‹ΠΉ спСциалист создаст ΠΌΠ°ΠΊΠ΅Ρ‚Ρ‹ для ΠΈΠ½Ρ‚Π΅Ρ€Π½Π΅Ρ‚-ΠΌΠ°Π³Π°Π·ΠΈΠ½ΠΎΠ², Π±Π»ΠΎΠ³ΠΎΠ², ΠΊΠΎΡ€ΠΏΠΎΡ€Π°Ρ‚ΠΈΠ²Π½Ρ‹Ρ… страниц ΠΈ Π΄Ρ€ΡƒΠ³ΠΈΡ… web-сайтов, Ρ‚ΠΎΡ‡Π½ΠΎ слСдуя Π’Π—.

Π’ΠΎΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ΡΡŒ ΠΊΠ²Π°Π»ΠΈΡ„ΠΈΡ†ΠΈΡ€ΠΎΠ²Π°Π½Π½ΠΎΠΉ ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ исполнитСля YouDo ΠΈ ΠΎΡ†Π΅Π½ΠΈΡ‚Π΅ высокоС качСство Ρ€Π°Π±ΠΎΡ‚Ρ‹ ΠΈ ΠΈΠ½Π΄ΠΈΠ²ΠΈΠ΄ΡƒΠ°Π»ΡŒΠ½Ρ‹ΠΉ ΠΏΠΎΠ΄Ρ…ΠΎΠ΄ ΠΊ Π²Π°ΡˆΠ΅ΠΌΡƒ заданию. Π’ ΠΏΠΎΠ»ΡŒΠ·Ρƒ Π·Π°ΠΊΠ°Π·Π° услуг Π½Π° YouDo ΠΌΠΎΠΆΠ½ΠΎ привСсти нСсколько Π΄ΠΎΠ²ΠΎΠ΄ΠΎΠ². Π­Ρ‚ΠΎ:

  • ΡΠ°ΠΌΠΎΡΡ‚ΠΎΡΡ‚Π΅Π»ΡŒΠ½Ρ‹ΠΉ ΠΈ ΡƒΠ΄ΠΎΠ±Π½Ρ‹ΠΉ Π²Ρ‹Π±ΠΎΡ€ ΠΊΠΎΠΌΠΏΠ°Π½ΠΈΠΈ ΠΈΠ»ΠΈ Π²Π΅Ρ€ΡΡ‚Π°Π»ΡŒΡ‰ΠΈΠΊΠ° Π½Π° фрилансС ΠΏΠΎ ряду ΠΊΡ€ΠΈΡ‚Π΅Ρ€ΠΈΠ΅Π² (расцСнки Π½Π° услуги, ΠΊΠ²Π°Π»ΠΈΡ„ΠΈΠΊΠ°Ρ†ΠΈΠΈ исполнитСля ΠΈ Ρ‚. Π΄.)
  • обсуТдСниС Ρ€Π°Π±ΠΎΡ‡ΠΈΡ… ΠΌΠΎΠΌΠ΅Π½Ρ‚ΠΎΠ² с мастСром Π΅Ρ‰Π΅ Π΄ΠΎ оформлСния Π·Π°ΠΊΠ°Π·Π°
  • Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡ‚ΡŒ ΠΎΡ†Π΅Π½ΠΈΡ‚ΡŒ ΠΏΠΎΡ€Ρ‚Ρ„ΠΎΠ»ΠΈΠΎ спСциалиста ΠΈ ΠΏΡ€ΠΎΡ‡Π΅ΡΡ‚ΡŒ ΠΎΠ±ΡŠΠ΅ΠΊΡ‚ΠΈΠ²Π½Ρ‹Π΅ Ρ€Π΅ΠΊΠΎΠΌΠ΅Π½Π΄Π°Ρ†ΠΈΠΈ Π² Π΅Π³ΠΎ ΠΏΠΎΠ»ΡŒΠ·Ρƒ

Π˜ΡΠΏΠΎΠ»Π½ΠΈΡ‚Π΅Π»ΠΈ YouDo Π³Π°Ρ€Π°Π½Ρ‚ΠΈΡ€ΡƒΡŽΡ‚ сдачу Π³ΠΎΡ‚ΠΎΠ²ΠΎΠ³ΠΎ ΠΏΡ€ΠΎΠ΅ΠΊΡ‚Π° Ρ‚ΠΎΡ‡Π½ΠΎ Π² срок. ΠœΠ°ΡΡ‚Π΅Ρ€, ΠΊ ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠΌΡƒ Π²Ρ‹ ΠΎΠ±Ρ€Π°Ρ‚ΠΈΡ‚Π΅ΡΡŒ, ΠΏΡ€ΠΎΡ„Π΅ΡΡΠΈΠΎΠ½Π°Π»ΡŒΠ½ΠΎ Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚Π°Π΅Ρ‚ Π΄ΠΈΠ·Π°ΠΉΠ½ Π²Π΅Π±-страниц сайта, Π³Ρ€Π°ΠΌΠΎΡ‚Π½ΠΎ располоТит Π½Π° Π½ΠΈΡ… тСкст, изобраТСния ΠΈ Π΄Ρ€ΡƒΠ³ΠΎΠΉ Π²Π°ΠΆΠ½Ρ‹ΠΉ для посСтитСлСй ΠΌΠ°Ρ‚Π΅Ρ€ΠΈΠ°Π».

Π‘ΠΎΠ·Π΄Π°Ρ‚ΡŒ Π·Π°Π΄Π°Π½ΠΈΠ΅ для спСциалистов, зарСгистрированных Π½Π° YouDo, ΠΌΠΎΠΆΠ½ΠΎ Π² любой дСнь Π½Π΅Π΄Π΅Π»ΠΈ 24 часа Π² сутки. Для ΡƒΠ΄ΠΎΠ±Π½ΠΎΠΉ ΠΈ быстрой ΠΏΠΎΠ΄Π°Ρ‡ΠΈ заявки Π½Π° поиск мастСра, ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠΌΡƒ Π±ΡƒΠ΄Π΅Ρ‚ Π΄ΠΎΠ²Π΅Ρ€Π΅Π½Π° вСрстка сайта ΠΈΠ· PSD ΠΈ созданиС ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚Π°, Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Π²ΠΎΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒΡΡ ΠΊΠ°ΠΊ ПК, Ρ‚Π°ΠΊ ΠΈ смартфоном Π½Π° Π±Π°Π·Π΅ Android ΠΈ iOS. ΠžΡ‚ΠΊΠ»ΠΈΠΊΠΈ ΠΎΡ‚ мастСров, Π³ΠΎΡ‚ΠΎΠ²Ρ‹Ρ… ΠΏΡ€ΠΈΡΡ‚ΡƒΠΏΠΈΡ‚ΡŒ ΠΊ Ρ€Π°Π±ΠΎΡ‚Π΅, поступят достаточно быстро, Ρ‡Ρ‚ΠΎ ΠΏΠΎΠ·Π²ΠΎΠ»ΠΈΡ‚ Π²Π°ΠΌ срочно Π·Π°ΠΊΠ°Π·Π°Ρ‚ΡŒ вСрстку ΠΌΠ°ΠΊΠ΅Ρ‚Π° сайта для ΠΌΠ°Π³Π°Π·ΠΈΠ½Π° ΠΈΠ»ΠΈ ΠΊΠ°Ρ‚Π°Π»ΠΎΠ³Π°.

ВрСбования ΠΊ ΠΌΠ°ΠΊΠ΅Ρ‚Π°ΠΌ для вСрстки письма Π² UniSender

Как ΠΏΠΎΠ΄Π³ΠΎΡ‚ΠΎΠ²ΠΈΡ‚ΡŒ ΠΌΠ°ΠΊΠ΅Ρ‚ для ΠΏΠ»Π°Ρ‚Π½ΠΎΠΉ услуги вСрстки письма Π² UniSender

Π’Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Π·Π°ΠΊΠ°Π·Π°Ρ‚ΡŒ ΠΏΠ»Π°Ρ‚Π½ΡƒΡŽ услугу «ВСрстка письма Π² UniSenderΒ». ΠœΠ°ΠΊΠ΅Ρ‚Ρ‹ ΠΏΡ€ΠΈΠ½ΠΈΠΌΠ°ΡŽΡ‚ΡΡ Π² Π΄Π²ΡƒΡ… Ρ„ΠΎΡ€ΠΌΠ°Ρ‚Π°Ρ…:

  • исходник письма Π² Figma ΠΈ PSD;
  • набросок письма Π² Π²ΠΈΠ΄Π΅ изобраТСния Π² JPG ΠΈΠ»ΠΈ PNG Ρ„ΠΎΡ€ΠΌΠ°Ρ‚Π΅.

ΠŸΡ€Π΅ΠΆΠ΄Π΅ Ρ‡Π΅ΠΌ ΠΎΡ‚ΠΏΡ€Π°Π²Π»ΡΡ‚ΡŒ ΠΌΠ°ΠΊΠ΅Ρ‚, ΠΎΠ·Π½Π°ΠΊΠΎΠΌΡŒΡ‚Π΅ΡΡŒ c трСбованиями

ВрСбования ΠΊ ΠΌΠ°ΠΊΠ΅Ρ‚Π°ΠΌ Π² Figma ΠΈΠ»ΠΈ PSD

Как ΠΌΡ‹ Ρ€Π°Π±ΠΎΡ‚Π°Π΅ΠΌ. Π’Ρ‹ прСдоставляСтС Π³ΠΎΡ‚ΠΎΠ²Ρ‹ΠΉ Π²ΠΈΠ·ΡƒΠ°Π»ΡŒΠ½Ρ‹ΠΉ ΠΌΠ°ΠΊΠ΅Ρ‚ шаблона, Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚Π°Π½Π½Ρ‹ΠΉ Π²Π°ΠΌΠΈ ΠΈΠ»ΠΈ вашим Π΄ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€ΠΎΠΌ. ΠœΡ‹ Π΅Π³ΠΎ вСрстаСм ΠΈ провСряСм Π² ΠΏΠΎΡ‡Ρ‚ΠΎΠ²ΠΈΠΊΠ°Ρ….

Π§Ρ‚ΠΎ Π½ΡƒΠΆΠ½ΠΎ Π²Ρ‹ΡΠ»Π°Ρ‚ΡŒ:

  1. Π¨Π°Π±Π»ΠΎΠ½ Π² Figma ΠΈ PSD.
  2. ВСкстовоС Π½Π°ΠΏΠΎΠ»Π½Π΅Π½ΠΈΠ΅ Π² Ρ„Π°ΠΉΠ»Π°Ρ… Ρ„ΠΎΡ€ΠΌΠ°Ρ‚Π° DOC ΠΈΠ»ΠΈ DOCX ΠΈΠ»ΠΈ Π² Google Docs.

Каким Π΄ΠΎΠ»ΠΆΠ΅Π½ Π±Ρ‹Ρ‚ΡŒ ΠΌΠ°ΠΊΠ΅Ρ‚:

  1. Π¨Π°Π±Π»ΠΎΠ½ Π΄ΠΎΠ»ΠΆΠ΅Π½ Π±Ρ‹Ρ‚ΡŒ Π² слоях. Π‘Π»ΠΎΠΈ Π½Π΅ склССны.
  2. Π’ шаблонС ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ стандартныС ΡˆΡ€ΠΈΡ„Ρ‚Ρ‹, Π΄Ρ€ΡƒΠ³ΠΈΠ΅ Π½Π΅ загрузятся Π² ΠΏΠΎΡ‡Ρ‚Π΅. ΠŸΠ΅Ρ€Π΅Ρ‡Π΅Π½ΡŒ ΡˆΡ€ΠΈΡ„Ρ‚ΠΎΠ²:
    1. Arial.
    2. Verdana.
    3. Times New Roman.
    4. Georgia.
    5. Tahoma.
    6. Trebuchet MS.
  3. Если Π²Π°ΠΆΠ½ΠΎ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ Π΄Ρ€ΡƒΠ³ΠΈΠ΅ ΡˆΡ€ΠΈΡ„Ρ‚Ρ‹, Π²Ρ‹ΡˆΠ»ΠΈΡ‚Π΅ ΠΈΡ… Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎ. Π£ΠΊΠ°ΠΆΠΈΡ‚Π΅, ΠΊΠ°ΠΊΠΈΠΌ стандартным ΡˆΡ€ΠΈΡ„Ρ‚ΠΎΠΌ Π·Π°ΠΌΠ΅Π½ΡΡ‚ΡŒ ΠΊΠ°ΠΆΠ΄Ρ‹ΠΉ ΠΈΠ· Π½ΠΈΡ… для ΠΏΠΎΡ‡Ρ‚ΠΎΠ²Ρ‹Ρ… ΠΊΠ»ΠΈΠ΅Π½Ρ‚ΠΎΠ², для ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Ρ… Π½Π΅ загрузится нСстандартный ΡˆΡ€ΠΈΡ„Ρ‚.
  4. Π Π΅ΠΊΠΎΠΌΠ΅Π½Π΄ΡƒΠ΅ΠΌΡ‹Π΅ ΠΏΠ°Ρ€Π°ΠΌΠ΅Ρ‚Ρ€Ρ‹ для письма:
    1. Π Π°Π·ΠΌΠ΅Ρ€ ΡˆΡ€ΠΈΡ„Ρ‚Π° основного тСкста: 12-13 px.
    2. Π¨ΠΈΡ€ΠΈΠ½Π° ΠΌΠ°ΠΊΠ΅Ρ‚Π°: 600-700 пиксСлСй.
    3. Π Π°Π·ΠΌΠ΅Ρ€ ΠΌΠ°ΠΊΠ΅Ρ‚Π°: Π΄ΠΎ 8 Мб.
  5. Π¦Π²Π΅Ρ‚Π° шаблона Π΄ΠΎΠ»ΠΆΠ½Ρ‹ Π±Ρ‹Ρ‚ΡŒ Π² CMYK.

ВрСбования ΠΊ ΠΌΠ°ΠΊΠ΅Ρ‚Π°ΠΌ Π² JPG ΠΈΠ»ΠΈ PNG

Как ΠΌΡ‹ Ρ€Π°Π±ΠΎΡ‚Π°Π΅ΠΌ. Π’Ρ‹ прСдоставляСтС набросок письма Π² Π²ΠΈΠ΄Π΅ ΠΊΠ°Ρ€Ρ‚ΠΈΠ½ΠΊΠΈ. ΠœΡ‹ Ρ€Π°Π·Ρ€Π°Π±Π°Ρ‚Ρ‹Π²Π°Π΅ΠΌ шаблон ΠΈ провСряСм Π΅Π³ΠΎ Π² ΠΏΠΎΡ‡Ρ‚ΠΎΠ²ΠΈΠΊΠ°Ρ….

Π§Ρ‚ΠΎ Π½ΡƒΠΆΠ½ΠΎ Π²Ρ‹ΡΠ»Π°Ρ‚ΡŒ:

  1. Π¨Π°Π±Π»ΠΎΠ½ ΠΎΠ΄Π½ΠΎΠΉ ΠΊΠ°Ρ€Ρ‚ΠΈΠ½ΠΊΠΎΠΉ Π² JPG ΠΈΠ»ΠΈ PNG Ρ„ΠΎΡ€ΠΌΠ°Ρ‚Π΅.
  2. ВсС ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅ΠΌΡ‹Π΅ графичСскиС ΠΌΠ°Ρ‚Π΅Ρ€ΠΈΠ°Π»Ρ‹ (ΠΊΠ°Ρ€Ρ‚ΠΈΠ½ΠΊΠΈ).
  3. ВСкстовоС Π½Π°ΠΏΠΎΠ»Π½Π΅Π½ΠΈΠ΅ Π² Ρ„Π°ΠΉΠ»Π°Ρ… Ρ„ΠΎΡ€ΠΌΠ°Ρ‚Π° DOC ΠΈΠ»ΠΈ DOCX.

 

НаглядноС руководство для ΠΌΠ΅Π½Π΅Π΄ΠΆΠ΅Ρ€ΠΎΠ² ΠΏΠΎ ΠΊΠΎΠΌΠΏΠΎΠ½ΠΎΠ²ΠΊΠ΅ (Π£Ρ‡Π΅Π±Π½ΠΈΠΊΠΈ ΠΏΠΎ Java β„’> Π‘ΠΎΠ·Π΄Π°Π½ΠΈΠ΅ графичСского интСрфСйса ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»Ρ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ JFC / Swing> Компоновка ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½Ρ‚ΠΎΠ² Π² ΠΊΠΎΠ½Ρ‚Π΅ΠΉΠ½Π΅Ρ€Π΅)

НСсколько классов AWT ΠΈ Swing ΠΏΡ€Π΅Π΄ΠΎΡΡ‚Π°Π²Π»ΡΡŽΡ‚ ΠΌΠ΅Π½Π΅Π΄ΠΆΠ΅Ρ€Ρ‹ ΠΊΠΎΠΌΠΏΠΎΠ½ΠΎΠ²ΠΊΠΈ для ΠΎΠ±Ρ‰Π΅Π³ΠΎ использования:

Π’ этом Ρ€Π°Π·Π΄Π΅Π»Π΅ ΠΏΠΎΠΊΠ°Π·Π°Π½Ρ‹ ΠΏΡ€ΠΈΠΌΠ΅Ρ€Ρ‹ графичСских интСрфСйсов ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»Ρ, Π² ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Ρ… ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽΡ‚ΡΡ эти ΠΌΠ΅Π½Π΅Π΄ΠΆΠ΅Ρ€Ρ‹ ΠΊΠΎΠΌΠΏΠΎΠ½ΠΎΠ²ΠΊΠΈ, ΠΈ рассказываСтся, Π³Π΄Π΅ Π½Π°ΠΉΡ‚ΠΈ страницу с инструкциями для ΠΊΠ°ΠΆΠ΄ΠΎΠ³ΠΎ ΠΌΠ΅Π½Π΅Π΄ΠΆΠ΅Ρ€Π° ΠΊΠΎΠΌΠΏΠΎΠ½ΠΎΠ²ΠΊΠΈ. Π’Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Π½Π°ΠΉΡ‚ΠΈ ссылки для запуска ΠΏΡ€ΠΈΠΌΠ΅Ρ€ΠΎΠ² Π½Π° страницах с инструкциями ΠΈ Π² ΠΏΡ€ΠΈΠΌΠ΅Ρ€ index.


ΠŸΡ€ΠΈΠΌΠ΅Ρ‡Π°Π½ΠΈΠ΅: Π­Ρ‚ΠΎΡ‚ ΡƒΡ€ΠΎΠΊ посвящСн написанию ΠΊΠΎΠ΄Π° ΠΌΠ°ΠΊΠ΅Ρ‚Π° Π²Ρ€ΡƒΡ‡Π½ΡƒΡŽ, Ρ‡Ρ‚ΠΎ ΠΌΠΎΠΆΠ΅Ρ‚ Π±Ρ‹Ρ‚ΡŒ нСпросто.Если Π²Ρ‹ Π½Π΅ заинтСрСсованы Π² ΠΈΠ·ΡƒΡ‡Π΅Π½ΠΈΠΈ всСх Π΄Π΅Ρ‚Π°Π»Π΅ΠΉ управлСния ΠΊΠΎΠΌΠΏΠΎΠ½ΠΎΠ²ΠΊΠΎΠΉ, Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΠΏΡ€Π΅Π΄ΠΏΠΎΡ‡Π΅ΡΡ‚ΡŒ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ ΠΌΠ΅Π½Π΅Π΄ΠΆΠ΅Ρ€ ΠΊΠΎΠΌΠΏΠΎΠ½ΠΎΠ²ΠΊΠΈ GroupLayout Π² сочСтании с инструмСнтом построСния для ΠΊΠΎΠΌΠΏΠΎΠ½ΠΎΠ²ΠΊΠΈ вашСго графичСского интСрфСйса. Одним ΠΈΠ· Ρ‚Π°ΠΊΠΈΡ… ΡΡ‚Ρ€ΠΎΠΈΡ‚Π΅Π»ΡŒΠ½Ρ‹Ρ… инструмСнтов являСтся IDE NetBeans. Π’ ΠΏΡ€ΠΎΡ‚ΠΈΠ²Π½ΠΎΠΌ случаС, Ссли Π²Ρ‹ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ ΠΊΠΎΠ΄ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ Π²Ρ€ΡƒΡ‡Π½ΡƒΡŽ ΠΈ Π½Π΅ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ GroupLayout , рСкомСндуСтся ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ GridBagLayout Π² качСствС ΡΠ»Π΅Π΄ΡƒΡŽΡ‰Π΅Π³ΠΎ Π½Π°ΠΈΠ±ΠΎΠ»Π΅Π΅ Π³ΠΈΠ±ΠΊΠΎΠ³ΠΎ ΠΈ ΠΌΠΎΡ‰Π½ΠΎΠ³ΠΎ ΠΌΠ΅Π½Π΅Π΄ΠΆΠ΅Ρ€Π° ΠΊΠΎΠΌΠΏΠΎΠ½ΠΎΠ²ΠΊΠΈ.

Если вас интСрСсуСт использованиС JavaFX для создания графичСского интСрфСйса ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»Ρ, см. Π Π°Π±ΠΎΡ‚Π° с ΠΌΠ°ΠΊΠ΅Ρ‚Π°ΠΌΠΈ Π² JavaFX.

BorderLayout

КаТдая панСль содСрТимого инициализируСтся для использования BorderLayout . (Π’ Π²ΠΈΠ΄Π΅ ИспользованиС ΠΊΠΎΠ½Ρ‚Π΅ΠΉΠ½Π΅Ρ€ΠΎΠ² Π²Π΅Ρ€Ρ…Π½Π΅Π³ΠΎ уровня ΠΎΠ±ΡŠΡΡΠ½ΡΠ΅Ρ‚, Ρ‡Ρ‚ΠΎ панСль содСрТимого являСтся основным ΠΊΠΎΠ½Ρ‚Π΅ΠΉΠ½Π΅Ρ€ΠΎΠΌ для всСх Ρ„Ρ€Π΅ΠΉΠΌΠΎΠ², Π°ΠΏΠΏΠ»Π΅Ρ‚ΠΎΠ² ΠΈ Π΄ΠΈΠ°Π»ΠΎΠ³ΠΎΠ².) BorderLayout Ρ€Π°Π·ΠΌΠ΅Ρ‰Π°Π΅Ρ‚ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½Ρ‚Ρ‹ максимум Π² пяти областях: свСрху, снизу, слСва, справа ΠΈ ΠΏΠΎ Ρ†Π΅Π½Ρ‚Ρ€Ρƒ. ВсС лишнСС пространство размСщаСтся Π² Ρ†Π΅Π½Ρ‚Ρ€Π°Π»ΡŒΠ½ΠΎΠΉ части. ПанСли инструмСнтов, созданныС с использованиСм JToolBar Π΄ΠΎΠ»ΠΆΠ΅Π½ Π±Ρ‹Ρ‚ΡŒ создан Π² ΠΊΠΎΠ½Ρ‚Π΅ΠΉΠ½Π΅Ρ€Π΅ BorderLayout , Ссли Π²Ρ‹ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ ΠΈΠΌΠ΅Ρ‚ΡŒ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡ‚ΡŒ ΠΏΠ΅Ρ€Π΅Ρ‚Π°ΡΠΊΠΈΠ²Π°Ρ‚ΡŒ полосы с ΠΈΡ… Π½Π°Ρ‡Π°Π»ΡŒΠ½Ρ‹Ρ… ΠΏΠΎΠ·ΠΈΡ†ΠΈΠΉ.Для получСния Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡ‚Π΅Π»ΡŒΠ½Ρ‹Ρ… свСдСний см. Как ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ BorderLayout.

Класс BoxLayout ΠΏΠΎΠΌΠ΅Ρ‰Π°Π΅Ρ‚ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½Ρ‚Ρ‹ Π² ΠΎΠ΄Π½Ρƒ строку ΠΈΠ»ΠΈ столбСц. Он ΡƒΡ‡ΠΈΡ‚Ρ‹Π²Π°Π΅Ρ‚ Π·Π°ΠΏΡ€ΠΎΡˆΠ΅Π½Π½Ρ‹Π΅ ΠΌΠ°ΠΊΡΠΈΠΌΠ°Π»ΡŒΠ½Ρ‹Π΅ Ρ€Π°Π·ΠΌΠ΅Ρ€Ρ‹ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½Ρ‚ΠΎΠ², Π° Ρ‚Π°ΠΊΠΆΠ΅ позволяСт Π²Ρ‹Ρ€Π°Π²Π½ΠΈΠ²Π°Ρ‚ΡŒ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½Ρ‚Ρ‹. Для получСния Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡ‚Π΅Π»ΡŒΠ½Ρ‹Ρ… свСдСний см. Как ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ BoxLayout.

Класс CardLayout позволяСт Ρ€Π΅Π°Π»ΠΈΠ·ΠΎΠ²Π°Ρ‚ΡŒ ΠΎΠ±Π»Π°ΡΡ‚ΡŒ, ΡΠΎΠ΄Π΅Ρ€ΠΆΠ°Ρ‰ΡƒΡŽ Ρ€Π°Π·Π½Ρ‹Π΅ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½Ρ‚Ρ‹ Π² Ρ€Π°Π·Π½ΠΎΠ΅ врСмя. CardLayout часто управляСтся ΠΏΠΎΠ»Π΅ΠΌ со списком, ΠΏΡ€ΠΈ этом состояниС поля со списком опрСдСляСт, ΠΊΠ°ΠΊΡƒΡŽ панСль (Π³Ρ€ΡƒΠΏΠΏΡƒ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½Ρ‚ΠΎΠ²) ΠΎΡ‚ΠΎΠ±Ρ€Π°ΠΆΠ°Π΅Ρ‚ CardLayout .ΠΠ»ΡŒΡ‚Π΅Ρ€Π½Π°Ρ‚ΠΈΠ²ΠΎΠΉ использованию CardLayout являСтся использованиС панСль с Π²ΠΊΠ»Π°Π΄ΠΊΠ°ΠΌΠΈ, которая прСдоставляСт Π°Π½Π°Π»ΠΎΠ³ΠΈΡ‡Π½Ρ‹Π΅ Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΈ, Π½ΠΎ с ΠΏΡ€Π΅Π΄ΠΎΠΏΡ€Π΅Π΄Π΅Π»Π΅Π½Π½Ρ‹ΠΌ графичСским интСрфСйсом. Для получСния Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡ‚Π΅Π»ΡŒΠ½Ρ‹Ρ… свСдСний см. Как ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ CardLayout.

FlowLayout β€” это ΠΌΠ΅Π½Π΅Π΄ΠΆΠ΅Ρ€ ΠΊΠΎΠΌΠΏΠΎΠ½ΠΎΠ²ΠΊΠΈ ΠΏΠΎ ΡƒΠΌΠΎΠ»Ρ‡Π°Π½ΠΈΡŽ для ΠΊΠ°ΠΆΠ΄ΠΎΠΉ JPanel . Он просто Π²Ρ‹ΠΊΠ»Π°Π΄Ρ‹Π²Π°Π΅Ρ‚ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½Ρ‚Ρ‹ Π² ΠΎΠ΄Π½Ρƒ строку, начиная Π½ΠΎΠ²ΡƒΡŽ строку, Ссли Π΅Π΅ ΠΊΠΎΠ½Ρ‚Π΅ΠΉΠ½Π΅Ρ€ нСдостаточно ΡˆΠΈΡ€ΠΎΠΊ. ОбС ΠΏΠ°Π½Π΅Π»ΠΈ Π² CardLayoutDemo, ΠΏΠΎΠΊΠ°Π·Π°Π½Π½Ρ‹Π΅ Ρ€Π°Π½Π΅Π΅, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽΡ‚ FlowLayout . Для получСния Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎΠΉ ΠΈΠ½Ρ„ΠΎΡ€ΠΌΠ°Ρ†ΠΈΠΈ см. Как ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ FlowLayout.

GridBagLayout β€” это слоТный ΠΈ Π³ΠΈΠ±ΠΊΠΈΠΉ ΠΌΠ΅Π½Π΅Π΄ΠΆΠ΅Ρ€ ΠΊΠΎΠΌΠΏΠΎΠ½ΠΎΠ²ΠΊΠΈ. Он Π²Ρ‹Ρ€Π°Π²Π½ΠΈΠ²Π°Π΅Ρ‚ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½Ρ‚Ρ‹, помСщая ΠΈΡ… Π² сСтку ячССк, позволяя ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½Ρ‚Π°ΠΌ Π·Π°Π½ΠΈΠΌΠ°Ρ‚ΡŒ Π±ΠΎΠ»Π΅Π΅ ΠΎΠ΄Π½ΠΎΠΉ ячСйки. Π‘Ρ‚Ρ€ΠΎΠΊΠΈ Π² сСткС ΠΌΠΎΠ³ΡƒΡ‚ ΠΈΠΌΠ΅Ρ‚ΡŒ Ρ€Π°Π·Π½ΡƒΡŽ высоту, Π° столбцы сСтки β€” Ρ€Π°Π·Π½ΡƒΡŽ ΡˆΠΈΡ€ΠΈΠ½Ρƒ. Для получСния Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡ‚Π΅Π»ΡŒΠ½Ρ‹Ρ… свСдСний см. Как ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ GridBagLayout.

GridLayout просто Π΄Π΅Π»Π°Π΅Ρ‚ Π½Π°Π±ΠΎΡ€ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½Ρ‚ΠΎΠ² ΠΎΠ΄ΠΈΠ½Π°ΠΊΠΎΠ²ΠΎΠ³ΠΎ Ρ€Π°Π·ΠΌΠ΅Ρ€Π° ΠΈ ΠΎΡ‚ΠΎΠ±Ρ€Π°ΠΆΠ°Π΅Ρ‚ ΠΈΡ… Π² Ρ‚Ρ€Π΅Π±ΡƒΠ΅ΠΌΠΎΠΌ количСствС строк ΠΈ столбцов. Для получСния Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡ‚Π΅Π»ΡŒΠ½Ρ‹Ρ… свСдСний см. Как ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ GridLayout.

GroupLayout β€” это ΠΌΠ΅Π½Π΅Π΄ΠΆΠ΅Ρ€ ΠΊΠΎΠΌΠΏΠΎΠ½ΠΎΠ²ΠΊΠΈ, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ Π±Ρ‹Π» Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚Π°Π½ для использования инструмСнтами построСния графичСского интСрфСйса ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»Ρ, Π½ΠΎ Π΅Π³ΠΎ Ρ‚Π°ΠΊΠΆΠ΅ ΠΌΠΎΠΆΠ½ΠΎ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ Π²Ρ€ΡƒΡ‡Π½ΡƒΡŽ. GroupLayout Ρ€Π°Π±ΠΎΡ‚Π°Π΅Ρ‚ с Π³ΠΎΡ€ΠΈΠ·ΠΎΠ½Ρ‚Π°Π»ΡŒΠ½ΠΎΠΉ ΠΈ Π²Π΅Ρ€Ρ‚ΠΈΠΊΠ°Π»ΡŒΠ½ΠΎΠΉ раскладками ΠΎΡ‚Π΄Π΅Π»ΡŒΠ½ΠΎ. ΠœΠ°ΠΊΠ΅Ρ‚ опрСдСляСтся для ΠΊΠ°ΠΆΠ΄ΠΎΠ³ΠΎ измСрСния нСзависимо. Π‘Π»Π΅Π΄ΠΎΠ²Π°Ρ‚Π΅Π»ΡŒΠ½ΠΎ, ΠΎΠ΄Π½Π°ΠΊΠΎ, ΠΊΠ°ΠΆΠ΄Ρ‹ΠΉ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½Ρ‚ Π½Π΅ΠΎΠ±Ρ…ΠΎΠ΄ΠΈΠΌΠΎ ΠΎΠΏΡ€Π΅Π΄Π΅Π»ΡΡ‚ΡŒ Π΄Π²Π°ΠΆΠ΄Ρ‹ Π² ΠΌΠ°ΠΊΠ΅Ρ‚Π΅. Окно поиска, ΠΏΠΎΠΊΠ°Π·Π°Π½Π½ΠΎΠ΅ Π²Ρ‹ΡˆΠ΅, являСтся ΠΏΡ€ΠΈΠΌΠ΅Ρ€ΠΎΠΌ GroupLayout . Для получСния Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡ‚Π΅Π»ΡŒΠ½Ρ‹Ρ… свСдСний см. Как ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ GroupLayout.

SpringLayout β€” это Π³ΠΈΠ±ΠΊΠΈΠΉ ΠΌΠ΅Π½Π΅Π΄ΠΆΠ΅Ρ€ ΠΊΠΎΠΌΠΏΠΎΠ½ΠΎΠ²ΠΊΠΈ, ΠΏΡ€Π΅Π΄Π½Π°Π·Π½Π°Ρ‡Π΅Π½Π½Ρ‹ΠΉ для использования Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚Ρ‡ΠΈΠΊΠ°ΠΌΠΈ графичСского интСрфСйса.Он позволяСт Π²Π°ΠΌ ΡƒΠΊΠ°Π·Π°Ρ‚ΡŒ Ρ‚ΠΎΡ‡Π½Ρ‹Π΅ ΠΎΡ‚Π½ΠΎΡˆΠ΅Π½ΠΈΡ ΠΌΠ΅ΠΆΠ΄Ρƒ краями ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½Ρ‚ΠΎΠ², находящихся ΠΏΠΎΠ΄ Π΅Π³ΠΎ ΠΊΠΎΠ½Ρ‚Ρ€ΠΎΠ»Π΅ΠΌ. НапримСр, Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΠΎΠΏΡ€Π΅Π΄Π΅Π»ΠΈΡ‚ΡŒ, Ρ‡Ρ‚ΠΎ Π»Π΅Π²Ρ‹ΠΉ ΠΊΡ€Π°ΠΉ ΠΎΠ΄Π½ΠΎΠ³ΠΎ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½Ρ‚Π° находится Π½Π° ΠΎΠΏΡ€Π΅Π΄Π΅Π»Π΅Π½Π½ΠΎΠΌ расстоянии (ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠ΅ ΠΌΠΎΠΆΠ΅Ρ‚ Π±Ρ‹Ρ‚ΡŒ вычислСно динамичСски) ΠΎΡ‚ ΠΏΡ€Π°Π²ΠΎΠ³ΠΎ края Π²Ρ‚ΠΎΡ€ΠΎΠ³ΠΎ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½Ρ‚Π°. SpringLayout Ρ€Π°Π·ΠΌΠ΅Ρ‰Π°Π΅Ρ‚ Π΄ΠΎΡ‡Π΅Ρ€Π½ΠΈΠ΅ элСмСнты связанного с Π½ΠΈΠΌ ΠΊΠΎΠ½Ρ‚Π΅ΠΉΠ½Π΅Ρ€Π° Π² соотвСтствии с Π½Π°Π±ΠΎΡ€ΠΎΠΌ ΠΎΠ³Ρ€Π°Π½ΠΈΡ‡Π΅Π½ΠΈΠΉ, ΠΊΠ°ΠΊ Π±ΡƒΠ΄Π΅Ρ‚ ΠΏΠΎΠΊΠ°Π·Π°Π½ΠΎ Π² Ρ€Π°Π·Π΄Π΅Π»Π΅ «Как ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ SpringLayoutΒ».

ΠΌΠ°ΠΊΠ΅Ρ‚ΠΎΠ² ΠΈ шаблонов | Заставка CMS

ΠœΠ°ΠΊΠ΅Ρ‚Ρ‹

дСлят страницы вашСго сайта Π½Π° Ρ€Π°Π·Π½Ρ‹Π΅ столбцы ΠΈΠ»ΠΈ области, Π³Π΄Π΅ ΠΌΠΎΠΆΠ½ΠΎ Ρ€Π°Π·ΠΌΠ΅ΡΡ‚ΠΈΡ‚ΡŒ ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚.

Основной инструмСнт

Backdrop для позиционирования ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚Π° β€” это Layouts . ΠœΠΎΠ΄ΡƒΠ»ΡŒ Layout позволяСт Π²Π°ΠΌ Π½Π°Π·Π½Π°Ρ‡Π°Ρ‚ΡŒ ΠΎΠΏΡ€Π΅Π΄Π΅Π»Π΅Π½Π½Ρ‹Π΅ Β«ΡˆΠ°Π±Π»ΠΎΠ½Ρ‹Β» Π²Π°ΡˆΠ΅ΠΌΡƒ сайту ΠΈΠ»ΠΈ ΠΎΠΏΡ€Π΅Π΄Π΅Π»Π΅Π½Π½Ρ‹ΠΌ страницам вашСго сайта. Β«Π¨Π°Π±Π»ΠΎΠ½ ΠΌΠ°ΠΊΠ΅Ρ‚Π°Β» β€” это шаблон, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ опрСдСляСт Ρ€Π΅Π³ΠΈΠΎΠ½Ρ‹, Π² ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Ρ… ΠΌΠΎΠ³ΡƒΡ‚ Π±Ρ‹Ρ‚ΡŒ Ρ€Π°Π·ΠΌΠ΅Ρ‰Π΅Π½Ρ‹ Ρ„Ρ€Π°Π³ΠΌΠ΅Π½Ρ‚Ρ‹ ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚Π°.

ΠžΠΏΡ€Π΅Π΄Π΅Π»Π΅Π½ΠΈΡ

  • ΠœΠ°ΠΊΠ΅Ρ‚ β€” конфигурация, Π² ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠΉ ΠΊΠΎΠ½ΠΊΡ€Π΅Ρ‚Π½Ρ‹ΠΉ шаблон ΠΌΠ°ΠΊΠ΅Ρ‚Π° Π±Ρ‹Π» Π½Π°Π·Π½Π°Ρ‡Π΅Π½ ΠΏΡƒΡ‚ΠΈ ΠΊ Π²Π΅Π±-сайту. ΠœΠ°ΠΊΠ΅Ρ‚ ΠΏΠΎ ΡƒΠΌΠΎΠ»Ρ‡Π°Π½ΠΈΡŽ примСняСт шаблон ΠΏΠΎ ΡƒΠΌΠΎΠ»Ρ‡Π°Π½ΠΈΡŽ ΠΊΠΎ всСм путям Π±Π΅Π· ΡƒΠΊΠ°Π·Π°Π½Π½ΠΎΠ³ΠΎ ΠΌΠ°ΠΊΠ΅Ρ‚Π°.
  • Π¨Π°Π±Π»ΠΎΠ½ ΠΌΠ°ΠΊΠ΅Ρ‚Π° β€” Π΄ΠΈΠ·Π°ΠΉΠ½ страницы, созданный с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ Ρ€Π°Π·ΠΌΠ΅Ρ‚ΠΊΠΈ HTML ΠΈ ΠΏΠ΅Ρ€Π΅ΠΌΠ΅Π½Π½Ρ‹Ρ… PHP, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ ΠΎΠΏΡ€Π΅Π΄Π΅Π»ΡΡŽΡ‚ области, Π² ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Ρ… ΠΌΠΎΠ³ΡƒΡ‚ Π±Ρ‹Ρ‚ΡŒ Ρ€Π°Π·ΠΌΠ΅Ρ‰Π΅Π½Ρ‹ Ρ„Ρ€Π°Π³ΠΌΠ΅Π½Ρ‚Ρ‹ ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚Π°.
  • Автономный ΠΌΠ°ΠΊΠ΅Ρ‚ β€” Π°Π²Ρ‚ΠΎΠ½ΠΎΠΌΠ½Ρ‹ΠΉ ΠΌΠ°ΠΊΠ΅Ρ‚ влияСт Ρ‚ΠΎΠ»ΡŒΠΊΠΎ Π½Π° ΠΎΠ΄Π½Ρƒ страницу Π½Π° сайтС. Π‘Π°ΠΌ ΠΌΠ°ΠΊΠ΅Ρ‚ Π³Π΅Π½Π΅Ρ€ΠΈΡ€ΡƒΠ΅Ρ‚ эту страницу. Π₯ΠΎΡ€ΠΎΡˆΠΈΠΌ ΠΏΡ€ΠΈΠΌΠ΅Ρ€ΠΎΠΌ Π°Π²Ρ‚ΠΎΠ½ΠΎΠΌΠ½ΠΎΠ³ΠΎ ΠΌΠ°ΠΊΠ΅Ρ‚Π° являСтся домашняя страница ΠΏΠΎ ΡƒΠΌΠΎΠ»Ρ‡Π°Π½ΠΈΡŽ.
  • ДинамичСский ΠΌΠ°ΠΊΠ΅Ρ‚ β€” динамичСский ΠΌΠ°ΠΊΠ΅Ρ‚ β€” это ΠΌΠ°ΠΊΠ΅Ρ‚, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ ΠΌΠΎΠΆΠ΅Ρ‚ Π²Π»ΠΈΡΡ‚ΡŒ Π½Π° нСсколько страниц. Π’ этом случаС Π·Π°Ρ‚Ρ€ΠΎΠ½ΡƒΡ‚Ρ‹Π΅ страницы всСгда ΡΠΎΠ·Π΄Π°ΡŽΡ‚ΡΡ ΠΈΠ· Π΄Ρ€ΡƒΠ³ΠΈΡ… источников.Для этого Ρ‚ΠΈΠΏΠ° ΠΌΠ°ΠΊΠ΅Ρ‚Π° потрСбуСтся Π±Π»ΠΎΠΊ Β«Π‘ΡƒΡ‰Π΅ΡΡ‚Π²ΡƒΡŽΡ‰Π΅Π΅ содСрТимоС страницы».

ΠœΠ°ΠΊΠ΅Ρ‚Ρ‹ ΠΏΠΎ ΡƒΠΌΠΎΠ»Ρ‡Π°Π½ΠΈΡŽ

Π§Ρ‚ΠΎΠ±Ρ‹ Π»ΡƒΡ‡ΡˆΠ΅ ΠΏΠΎΠ½ΡΡ‚ΡŒ ΠΌΠ°ΠΊΠ΅Ρ‚Ρ‹, ΠΌΡ‹ ΠΌΠΎΠΆΠ΅ΠΌ Π²Π·Π³Π»ΡΠ½ΡƒΡ‚ΡŒ Π½Π° значСния ΠΏΠΎ ΡƒΠΌΠΎΠ»Ρ‡Π°Π½ΠΈΡŽ, прСдоставлСнныС Backdrop. По ΡƒΠΌΠΎΠ»Ρ‡Π°Π½ΠΈΡŽ Π½Π° Π½ΠΎΠ²ΠΎΠΌ сайтС Π±ΡƒΠ΄Π΅Ρ‚ ΠΎΠΏΡ€Π΅Π΄Π΅Π»Π΅Π½ΠΎ Ρ‚Ρ€ΠΈ ΠΌΠ°ΠΊΠ΅Ρ‚Π°:

  • ΠΎΠ΄ΠΈΠ½ для домашнСй страницы, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽΡ‰Π΅ΠΉ ΠΌΠ°ΠΊΠ΅Ρ‚ Бокстона
  • ΠΎΠ΄ΠΈΠ½ для ΠΌΠ°ΠΊΠ΅Ρ‚Π° ΠΏΠΎ ΡƒΠΌΠΎΠ»Ρ‡Π°Π½ΠΈΡŽ, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅Ρ‚ ΠΌΠ°ΠΊΠ΅Ρ‚ Moscone Flipped
  • ΠΈ ΠΎΠ΄ΠΈΠ½ для административного ΠΌΠ°ΠΊΠ΅Ρ‚Π° ΠΏΠΎ ΡƒΠΌΠΎΠ»Ρ‡Π°Π½ΠΈΡŽ, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅Ρ‚ ΠΌΠ°ΠΊΠ΅Ρ‚ Бокстона

ΠœΠ°ΠΊΠ΅Ρ‚ ΠΏΠΎ ΡƒΠΌΠΎΠ»Ρ‡Π°Π½ΠΈΡŽ назначаСтся для всСх ΠΏΡƒΡ‚Π΅ΠΉ Π½Π° сайтС Backdrop, поэтому ΠΏΠΎ ΡƒΠΌΠΎΠ»Ρ‡Π°Π½ΠΈΡŽ всС страницы вашСго сайта, ΠΊΡ€ΠΎΠΌΠ΅ Home Page, Π±ΡƒΠ΄ΡƒΡ‚ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ шаблон Moscone Flipped, Ρ‡Ρ‚ΠΎ ΠΎΠ·Π½Π°Ρ‡Π°Π΅Ρ‚, Ρ‡Ρ‚ΠΎ Π±Π»ΠΎΠΊΠΈ ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚Π° Π½Π° вашСм сайтС Π±ΡƒΠ΄ΡƒΡ‚ ΠΎΡ€Π³Π°Π½ΠΈΠ·ΠΎΠ²Π°Π½Ρ‹ Π² соотвСтствии с ΠΎΠΏΡ€Π΅Π΄Π΅Π»Π΅Π½Π½Ρ‹ΠΌ шаблоном. ΠΏΠΎ этому ΡˆΠ°Π±Π»ΠΎΠ½Ρƒ.

Если, ΠΎΠ΄Π½Π°ΠΊΠΎ, Π²Ρ‹ Ρ€Π΅ΡˆΠΈΠ»ΠΈ, Ρ‡Ρ‚ΠΎ всС страницы вашСго сайта Π΄ΠΎΠ»ΠΆΠ½Ρ‹ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ Π΄Ρ€ΡƒΠ³ΠΎΠΉ шаблон, Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚ΡŒ шаблон ΠΏΠΎ ΡƒΠΌΠΎΠ»Ρ‡Π°Π½ΠΈΡŽ, пСрСйдя Π² Π‘Ρ‚Ρ€ΡƒΠΊΡ‚ΡƒΡ€Π°> ΠœΠ°ΠΊΠ΅Ρ‚Ρ‹> ΠœΠ°ΠΊΠ΅Ρ‚ ΠΏΠΎ ΡƒΠΌΠΎΠ»Ρ‡Π°Π½ΠΈΡŽ> ΠΠ°ΡΡ‚Ρ€ΠΎΠΈΡ‚ΡŒ ΠΌΠ°ΠΊΠ΅Ρ‚ ΠΈ ΠΈΠ·ΠΌΠ΅Π½ΠΈΠ² Π·Π½Π°Ρ‡Π΅Π½ΠΈΠ΅ Moscone Flipped Π½Π° Π΄Ρ€ΡƒΠ³ΠΎΠΉ шаблон ΠΏΠΎ Π²Π°ΡˆΠ΅ΠΌΡƒ Π²Ρ‹Π±ΠΎΡ€Ρƒ. . Если Π²Ρ‹ Π²Ρ‹Π±Ρ€Π°Π»ΠΈ шаблон Π’Π΅ΠΉΠ»ΠΎΡ€Π° , Π½Π°ΠΏΡ€ΠΈΠΌΠ΅Ρ€, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΈΠΌΠ΅Ρ‚ΡŒ Π±ΠΎΠΊΠΎΠ²ΡƒΡŽ панСль с двумя столбцами; ΠΊΠ°ΠΊ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ Π²Ρ‹ это сдСлаСтС, всС страницы сайта Π±ΡƒΠ΄ΡƒΡ‚ ΠΈΠΌΠ΅Ρ‚ΡŒ ΠΊΠΎΠ½Ρ„ΠΈΠ³ΡƒΡ€Π°Ρ†ΠΈΡŽ Π±ΠΎΠΊΠΎΠ²ΠΎΠΉ ΠΏΠ°Π½Π΅Π»ΠΈ с двумя столбцами.

Π¨Π°Π±Π»ΠΎΠ½Ρ‹ ΠΌΠ°ΠΊΠ΅Ρ‚ΠΎΠ²

Π¨Π°Π±Π»ΠΎΠ½Ρ‹ ΠΌΠ°ΠΊΠ΅Ρ‚Π°

β€” это Ρ„Π°ΠΉΠ»Ρ‹ PHP ΠΈ HTML, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ ΠΎΠΏΡ€Π΅Π΄Π΅Π»ΡΡŽΡ‚ области страницы. ΠŸΡ€Π΅Π΄ΠΎΡΡ‚Π°Π²Π»ΡΠ΅Ρ‚ΡΡ нСсколько основных шаблонов, ΠΈ Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡ‚Π΅Π»ΡŒΠ½Ρ‹Π΅ ΡˆΠ°Π±Π»ΠΎΠ½Ρ‹ ΠΌΠΎΠΆΠ½ΠΎ ΡƒΡΡ‚Π°Π½ΠΎΠ²ΠΈΡ‚ΡŒ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ модуля Project Installer.

ΠžΡΠ½ΠΎΠ²Π½Ρ‹Π΅ ΡˆΠ°Π±Π»ΠΎΠ½Ρ‹ Π²ΠΊΠ»ΡŽΡ‡Π°ΡŽΡ‚: Boxton, Geary, Harris, Moscone, Moscone Flipped, Rolph, Simmons, Sutro, Taylor ΠΈ Taylor Flipped

ΠšΠ°ΠΆΠ΄Ρ‹ΠΉ ΠΌΠ°ΠΊΠ΅Ρ‚ опрСдСляСт Ρ€Π΅Π³ΠΈΠΎΠ½Ρ‹, Π² ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ ΠΌΠΎΠ³ΡƒΡ‚ Π±Ρ‹Ρ‚ΡŒ ΠΏΠΎΠΌΠ΅Ρ‰Π΅Π½Ρ‹ Π±Π»ΠΎΠΊΠΈ.

Π’ΠΊΠ»ΡŽΡ‡Π΅Π½ΠΈΠ΅ ΠΈ ΠΎΡ‚ΠΊΠ»ΡŽΡ‡Π΅Π½ΠΈΠ΅ шаблонов ΠΌΠ°ΠΊΠ΅Ρ‚Π°

На страницС «Настройки ΠΌΠ°ΠΊΠ΅Ρ‚Π° Β» Π½Π° страницС «Администратор Β»> Β«Π‘Ρ‚Ρ€ΡƒΠΊΡ‚ΡƒΡ€Π°Β»> Β«ΠœΠ°ΠΊΠ΅Ρ‚Ρ‹Β»> «Настройка Β» пСрСчислСны всС основныС ΠΈ Π΄ΠΎΠ±Π°Π²Π»Π΅Π½Π½Ρ‹Π΅ ΡˆΠ°Π±Π»ΠΎΠ½Ρ‹ ΠΌΠ°ΠΊΠ΅Ρ‚Π° ΠΈ ΠΌΠΎΠΆΠ½ΠΎ Π²Ρ‹Π±Ρ€Π°Ρ‚ΡŒ, ΠΊΠ°ΠΊΠΈΠ΅ ΠΈΠ· Π½ΠΈΡ… Π±ΡƒΠ΄ΡƒΡ‚ доступны ΠΏΡ€ΠΈ создании Π½ΠΎΠ²Ρ‹Ρ… ΠΌΠ°ΠΊΠ΅Ρ‚ΠΎΠ².Π§Ρ‚ΠΎΠ±Ρ‹ ΠΎΡ‚ΠΊΠ»ΡŽΡ‡ΠΈΡ‚ΡŒ шаблон ΠΌΠ°ΠΊΠ΅Ρ‚Π°, снимитС Ρ„Π»Π°ΠΆΠΎΠΊ Π½Π°Π΄ Π΅Π³ΠΎ Π·Π½Π°Ρ‡ΠΊΠΎΠΌ Π½Π° этой страницС ΠΈ Π½Π°ΠΆΠΌΠΈΡ‚Π΅ Π‘ΠΎΡ…Ρ€Π°Π½ΠΈΡ‚ΡŒ ΠΊΠΎΠ½Ρ„ΠΈΠ³ΡƒΡ€Π°Ρ†ΠΈΡŽ , ΠΊΠΎΠ³Π΄Π° Π·Π°ΠΊΠΎΠ½Ρ‡ΠΈΡ‚Π΅.

(ΠŸΠΎΠ΄Ρ€ΠΎΠ±Π½Π΅Π΅ ΠΎ настройкС ΠΌΠ°ΠΊΠ΅Ρ‚ΠΎΠ² см. Π’ Deep Dive: Advanced Layout Options)

КниТная навигация

ΠœΠ°ΠΊΠ΅Ρ‚Ρ‹, ΡˆΠ°Π±Π»ΠΎΠ½Ρ‹ ΠΌΠ°ΠΊΠ΅Ρ‚ΠΎΠ² ΠΈ ΠΌΠ°ΠΊΠ΅Ρ‚Ρ‹ ΠΏΠΎ ΡƒΠΌΠΎΠ»Ρ‡Π°Π½ΠΈΡŽ

ΠœΠ°ΠΊΠ΅Ρ‚ β€” это Π½Π°Π±ΠΎΡ€ Π²ΠΈΠ΄ΠΆΠ΅Ρ‚ΠΎΠ², ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ содСрТат ΠΈΠ»ΠΈ ΠΈΠ·Π²Π»Π΅ΠΊΠ°ΡŽΡ‚ содСрТимоС ΠΌΠ°Π³Π°Π·ΠΈΠ½Π°. А ΠΌΠ°ΠΊΠ΅Ρ‚ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅Ρ‚ΡΡ для Ρ€Π΅Π½Π΄Π΅Ρ€ΠΈΠ½Π³Π° страницы ΠΌΠ°Π³Π°Π·ΠΈΠ½Π°. Π’Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΡΠΎΠ·Π΄Π°Π²Π°Ρ‚ΡŒ ΠΌΠ°ΠΊΠ΅Ρ‚Ρ‹ Π² инструмСнтС Commerce Composer.

Для использования ΠΌΠ°ΠΊΠ΅Ρ‚Π° Π½Π° Π²ΠΈΡ‚Ρ€ΠΈΠ½Π΅ Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Π½Π°Π·Π½Π°Ρ‡ΠΈΡ‚ΡŒ ΠΌΠ°ΠΊΠ΅Ρ‚ ΠΎΠ΄Π½ΠΎΠΉ страницС, нСскольким страницам ΠΈΠ»ΠΈ поисковому запросу. НапримСр:
  • ΠΠ°Π·Π½Π°Ρ‡ΡŒΡ‚Π΅ для своСй домашнСй страницы ΠΌΠ°ΠΊΠ΅Ρ‚, Π΄Π΅ΠΌΠΎΠ½ΡΡ‚Ρ€ΠΈΡ€ΡƒΡŽΡ‰ΠΈΠΉ распродаТу Π½Π° НСдСлС бокса.
  • ΠΠ°Π·Π½Π°Ρ‡ΡŒΡ‚Π΅ ΠΌΠ°ΠΊΠ΅Ρ‚ для всСх страниц ΠΏΠΎΠ΄ΠΊΠ°Ρ‚Π΅Π³ΠΎΡ€ΠΈΠΉ Π² ΠΊΠ°Ρ‚Π΅Π³ΠΎΡ€ΠΈΠΈ «МСбСль», Ρ‡Ρ‚ΠΎΠ±Ρ‹ страницы ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ ΠΏΠΎΡΠ»Π΅Π΄ΠΎΠ²Π°Ρ‚Π΅Π»ΡŒΠ½Ρ‹ΠΉ Π΄ΠΈΠ·Π°ΠΉΠ½.
  • Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ ΠΌΠ°ΠΊΠ΅Ρ‚, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ Π±ΡƒΠ΄Π΅Ρ‚ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒΡΡ Π² качСствС страницы Ρ€Π΅Π·ΡƒΠ»ΡŒΡ‚Π°Ρ‚ΠΎΠ² поиска для вашСго Π±Ρ€Π΅Π½Π΄Π° Hermitage, ΠΈ Π½Π°Π·Π½Π°Ρ‡ΡŒΡ‚Π΅ Π΅Π³ΠΎ поисковый запрос Π­Ρ€ΠΌΠΈΡ‚Π°ΠΆ . Когда ΠΏΠΎΠΊΡƒΠΏΠ°Ρ‚Π΅Π»ΠΈ ΠΈΡ‰ΡƒΡ‚ ваш сайт ΠΏΠΎ запросу Hermitage , ваш ΠΌΠ°ΠΊΠ΅Ρ‚ отобраТаСтся вмСсто ΠΎΠ±Ρ‹Ρ‡Π½ΠΎΠΉ страницы Ρ€Π΅Π·ΡƒΠ»ΡŒΡ‚Π°Ρ‚ΠΎΠ² поиска.
ΠœΠ°ΠΊΠ΅Ρ‚Ρ‹ ΠΌΠΎΠ³ΡƒΡ‚ Π±Ρ‹Ρ‚ΡŒ:
  • По Ρ€Π°ΡΠΏΠΈΡΠ°Π½ΠΈΡŽ; Π½Π°ΠΏΡ€ΠΈΠΌΠ΅Ρ€, для страницы ΠΎΡ‚Π΄Π΅Π»Π° ΠΎΠ΄Π΅ΠΆΠ΄Ρ‹ Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Π·Π°ΠΏΠ»Π°Π½ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ Π΄Ρ€ΡƒΠ³ΠΎΠΉ ΠΌΠ°ΠΊΠ΅Ρ‚ для ΠΊΠ°ΠΆΠ΄ΡƒΡŽ нСдСлю Π² Π³ΠΎΠ΄Ρƒ.
  • с ΠΏΡ€ΠΈΠΎΡ€ΠΈΡ‚Π΅Ρ‚ΠΎΠΌ; ΠΊΠ°ΠΆΠ΄ΠΎΠΌΡƒ ΠΌΠ°ΠΊΠ΅Ρ‚Ρƒ ΠΌΠΎΠΆΠ½ΠΎ ΠΏΡ€ΠΈΡΠ²ΠΎΠΈΡ‚ΡŒ Π½ΠΎΠΌΠ΅Ρ€ ΠΏΡ€ΠΈΠΎΡ€ΠΈΡ‚Π΅Ρ‚Π°. Π­Ρ‚ΠΎ число опрСдСляСт, ΠΊΠ°ΠΊΠΎΠΉ Π½Π°Π·Π½Π°Ρ‡Π΅Π½ΠΈΠ΅ ΠΌΠ°ΠΊΠ΅Ρ‚Π° для использования Π½Π° Π²ΠΈΡ‚Ρ€ΠΈΠ½Π΅ ΠΏΡ€ΠΈ Π²ΠΎΠ·Π½ΠΈΠΊΠ½ΠΎΠ²Π΅Π½ΠΈΠΈ ΠΊΠΎΠ½Ρ„Π»ΠΈΠΊΡ‚ΠΎΠ², Π½Π°ΠΏΡ€ΠΈΠΌΠ΅Ρ€, ΠΏΡ€ΠΈ Π½Π°Π»ΠΎΠΆΠ΅Π½ΠΈΠΈ расписаний для Π΄Π²ΡƒΡ… Ρ€Π°Π·Π½Ρ‹Ρ… Π½Π°Π·Π½Π°Ρ‡Π΅Π½ΠΈΠΉ ΠΌΠ°ΠΊΠ΅Ρ‚Π°. НазначСниС ΠΌΠ°ΠΊΠ΅Ρ‚Π° с Π½Π°ΠΈΠ²Ρ‹ΡΡˆΠΈΠΌ ΠΏΡ€ΠΈΠΎΡ€ΠΈΡ‚Π΅Ρ‚ΠΎΠΌ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅Ρ‚ΡΡ Π½Π° Π²ΠΈΡ‚Ρ€ΠΈΠ½Π°.

ΠŸΡ€ΠΈΠΌΠ΅Ρ‡Π°Π½ΠΈΠ΅. Π’Ρ‹ Π½Π΅ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΠΏΡ€ΠΈΡΠ²ΠΎΠΈΡ‚ΡŒ Ρ„ΠΎΡ€ΠΌΠ°Ρ‚ ΠΎΠΏΡ€Π΅Π΄Π΅Π»Π΅Π½Π½ΠΎΠΌΡƒ сСгмСнту ΠΊΠ»ΠΈΠ΅Π½Ρ‚ΠΎΠ².Однако Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΠΏΠ΅Ρ€ΡΠΎΠ½Π°Π»ΠΈΠ·ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ содСрТимоС ΠΎΠΏΡ€Π΅Π΄Π΅Π»Π΅Π½Π½Ρ‹Ρ… Π²ΠΈΠ΄ΠΆΠ΅Ρ‚ΠΎΠ² Π² ΠΌΠ°ΠΊΠ΅Ρ‚Π΅, выполняя Π²Π΅Π±-дСйствия, содСрТащиС Ρ†Π΅Π»ΠΈ.

Π¨Π°Π±Π»ΠΎΠ½Ρ‹ ΠΌΠ°ΠΊΠ΅Ρ‚Π°

Π¨Π°Π±Π»ΠΎΠ½ ΠΌΠ°ΠΊΠ΅Ρ‚Π° β€” это многоразовая отправная Ρ‚ΠΎΡ‡ΠΊΠ° для создания ΠΌΠ°ΠΊΠ΅Ρ‚. Π’ инструмСнтС Commerce Composer Π²Ρ‹ Π’Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Π²Ρ‹Π±Ρ€Π°Ρ‚ΡŒ ΠΎΠ΄ΠΈΠ½ ΠΈΠ· Π½Π΅ΡΠΊΠΎΠ»ΡŒΠΊΠΈΡ… шаблонов ΠΌΠ°ΠΊΠ΅Ρ‚Π°, Π½Π° ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠΌ Π±ΡƒΠ΄ΡƒΡ‚ построСны ΠΌΠ°ΠΊΠ΅Ρ‚Ρ‹ страниц. ΠšΠ°ΠΆΠ΄Ρ‹ΠΉ ΠΌΠ°ΠΊΠ΅Ρ‚ шаблон β€” это каркас, содСрТащий ΠΎΠΏΡ€Π΅Π΄Π΅Π»Π΅Π½Π½ΠΎΠ΅ располоТСниС слотов. Π§Ρ‚ΠΎΠ±Ρ‹ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ ΠΌΠ°ΠΊΠ΅Ρ‚, Π²Ρ‹ Π²Ρ‹Π±ΠΈΡ€Π°Π΅Ρ‚Π΅ шаблона, Π½Π°Π·Π½Π°Ρ‡ΡŒΡ‚Π΅ Π²ΠΈΠ΄ΠΆΠ΅Ρ‚Ρ‹ ΠΌΠ°ΠΊΠ΅Ρ‚Π° для слотов, Π° Π·Π°Ρ‚Π΅ΠΌ Π·Π°ΠΏΠΎΠ»Π½ΠΈΡ‚Π΅ Π²ΠΈΠ΄ΠΆΠ΅Ρ‚Ρ‹.Π’ зависимости ΠΎΡ‚ вашСго Π’ соотвСтствии с трСбованиями ΠΊΠΎΠΌΠΏΠ°Π½ΠΈΠΈ, слоты Π² шаблонС ΠΌΠ°ΠΊΠ΅Ρ‚Π° ΠΌΠΎΠ³ΡƒΡ‚ Π±Ρ‹Ρ‚ΡŒ пустыми ΠΈΠ»ΠΈ ΠΏΡ€Π΅Π΄Π²Π°Ρ€ΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎ Π·Π°ΠΏΠΎΠ»Π½Π΅Π½Π½Ρ‹ΠΌΠΈ Π²ΠΈΠ΄ΠΆΠ΅Ρ‚Π°ΠΌΠΈ.

Π˜Π½ΡΡ‚Ρ€ΡƒΠΌΠ΅Π½Ρ‚ Commerce Composer прСдоставляСт Π½Π°Π±ΠΎΡ€ ΠΎΠ±Ρ€Π°Π·Ρ†ΠΎΠ² шаблонов ΠΌΠ°ΠΊΠ΅Ρ‚ΠΎΠ², ΠΏΡ€Π΅Π΄Π½Π°Π·Π½Π°Ρ‡Π΅Π½Π½Ρ‹Ρ… для использования с Π½Π°Ρ‡Π°Π»ΡŒΠ½Ρ‹ΠΌΠΈ ΠΌΠ°Π³Π°Π·ΠΈΠ½Π°ΠΌΠΈ WebSphere Commerce. Π Π°Π·Ρ€Π°Π±ΠΎΡ‚Ρ‡ΠΈΠΊΠΈ ΠΌΠ°Π³Π°Π·ΠΈΠ½Π° ΠΌΠΎΠ³ΡƒΡ‚ Π½Π°ΡΡ‚Ρ€Π°ΠΈΠ²Π°Ρ‚ΡŒ эти ΡˆΠ°Π±Π»ΠΎΠ½Ρ‹ для вашСго ΠΌΠ°Π³Π°Π·ΠΈΠ½Π° ΠΈΠ»ΠΈ ΡΠΎΠ·Π΄Π°Π²Π°Ρ‚ΡŒ Π½ΠΎΠ²Ρ‹Π΅ ΡˆΠ°Π±Π»ΠΎΠ½Ρ‹, создавая ΡΠΏΠ΅Ρ†ΠΈΠ°Π»ΡŒΠ½Ρ‹Π΅ страницы JSP ΠΈ ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ ΠΈΡ… доступными Π² инструмСнтС Commerce Composer. НиТС ΠΏΡ€ΠΈΠ²Π΅Π΄Π΅Π½Ρ‹ ΠΏΡ€ΠΈΠΌΠ΅Ρ€Ρ‹ ΡˆΠ°Π±Π»ΠΎΠ½Ρ‹ вСрстки; числа ΠΏΡ€Π΅Π΄ΡΡ‚Π°Π²Π»ΡΡŽΡ‚ собой слоты Π² ΡˆΠ°Π±Π»ΠΎΠ½Π°Ρ…, Π² ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ Π²ΠΈΠ΄ΠΆΠ΅Ρ‚Ρ‹:


Π’ инструмСнтС Commerce Composer ΡˆΠ°Π±Π»ΠΎΠ½Ρ‹ ΠΌΠ°ΠΊΠ΅Ρ‚ΠΎΠ² ΠΌΠΎΠ³ΡƒΡ‚ Π±Ρ‹Ρ‚ΡŒ любого ΠΈΠ· ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΠΈΡ… Ρ‚ΠΈΠΏΠΎΠ²:

Π¨Π°Π±Π»ΠΎΠ½Ρ‹ ΠΌΠ°ΠΊΠ΅Ρ‚ΠΎΠ² Ρ€Π°Π±ΠΎΡ‡Π΅Π³ΠΎ стола
Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅Ρ‚ΡΡ для создания страниц, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ ΠΏΡ€ΠΎΡΠΌΠ°Ρ‚Ρ€ΠΈΠ²Π°ΡŽΡ‚ΡΡ Π½Π° Π½Π°ΡΡ‚ΠΎΠ»ΡŒΠ½Ρ‹Ρ… ΠΊΠΎΠΌΠΏΡŒΡŽΡ‚Π΅Ρ€Π°Ρ…, Π½ΠΎΡƒΡ‚Π±ΡƒΠΊΠ°Ρ… ΠΈ ΠΏΠ»Π°Π½ΡˆΠ΅Ρ‚Π°Ρ….
Π¨Π°Π±Π»ΠΎΠ½Ρ‹ ΠΌΠΎΠ±ΠΈΠ»ΡŒΠ½Ρ‹Ρ… ΠΌΠ°ΠΊΠ΅Ρ‚ΠΎΠ²
Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅Ρ‚ΡΡ для создания страниц, просматриваСмых Π½Π° ΠΌΠΎΠ±ΠΈΠ»ΡŒΠ½Ρ‹Ρ… устройствах.
Π¨Π°Π±Π»ΠΎΠ½Ρ‹ Π°Π΄Π°ΠΏΡ‚ΠΈΠ²Π½ΠΎΠ³ΠΎ ΠΌΠ°ΠΊΠ΅Ρ‚Π°
Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅Ρ‚ΡΡ для создания страниц, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ ΠΌΠΎΠΆΠ½ΠΎ ΠΏΡ€ΠΎΡΠΌΠ°Ρ‚Ρ€ΠΈΠ²Π°Ρ‚ΡŒ Π½Π° любом устройствС. Π‘Ρ‚Ρ€Π°Π½ΠΈΡ†Ρ‹, основанныС Π½Π° этих ΡˆΠ°Π±Π»ΠΎΠ½Π°Ρ… Π°Π΄Π°ΠΏΡ‚ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒΡΡ ΠΊ Ρ€Π°Π·Π½Ρ‹ΠΌ Ρ€Π°Π·ΠΌΠ΅Ρ€Π°ΠΌ экрана с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ Π³ΠΈΠ±ΠΊΠΈΡ… сСток ΠΈ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠΉ, Π° Ρ‚Π°ΠΊΠΆΠ΅ Π΄Ρ€ΡƒΠ³ΠΎΠ³ΠΎ Π°Π΄Π°ΠΏΡ‚ΠΈΠ²Π½ΠΎΠ³ΠΎ Π΄ΠΈΠ·Π°ΠΉΠ½Π° Ρ‚Π΅Ρ…Π½ΠΈΠΊΠΈ. Π­Ρ‚ΠΈ ΡˆΠ°Π±Π»ΠΎΠ½Ρ‹ ΠΏΡ€Π΅Π΄Π½Π°Π·Π½Π°Ρ‡Π΅Π½Ρ‹ для использования с Π°Π΄Π°ΠΏΡ‚ΠΈΠ²Π½Ρ‹ΠΌΠΈ Π²ΠΈΠ΄ΠΆΠ΅Ρ‚Π°ΠΌΠΈ.

ΠžΠ±Ρ€Π°Π·Ρ†Ρ‹ шаблонов ΠΌΠ°ΠΊΠ΅Ρ‚ΠΎΠ², ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ Π²ΠΊΠ»ΡŽΡ‡Π΅Π½Ρ‹ Π² инструмСнт Commerce Composer, ΡΠ²Π»ΡΡŽΡ‚ΡΡ Π°Π΄Π°ΠΏΡ‚ΠΈΠ²Π½Ρ‹ΠΌΠΈ ΠΌΠ°ΠΊΠ΅Ρ‚Π°ΠΌΠΈ. ΡˆΠ°Π±Π»ΠΎΠ½Ρ‹.Π­Ρ‚ΠΈ ΠΎΠ±Ρ€Π°Π·Ρ†Ρ‹ шаблонов ΠΈΠΌΠ΅ΡŽΡ‚ ΠΎΠΏΡ€Π΅Π΄Π΅Π»Π΅Π½Π½Ρ‹Π΅ характСристики:

  • Π’ ΠΎΠ΄ΠΈΠ½ слот ΠΌΠΎΠΆΠ½ΠΎ Π΄ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ нСсколько Π²ΠΈΠ΄ΠΆΠ΅Ρ‚ΠΎΠ². Π’ΠΈΠ΄ΠΆΠ΅Ρ‚Ρ‹ с ΠΎΠ±Ρ‰ΠΈΠΌ слотом ΠΌΠΎΠ³ΡƒΡ‚ Π±Ρ‹Ρ‚ΡŒ ΠΎΠ΄Π½ΠΎΠ³ΠΎ Ρ‚ΠΈΠΏΠ° ΠΈΠ»ΠΈ Π΄Ρ€ΡƒΠ³ΠΎΠΉ Ρ‚ΠΈΠΏ. Если Π²Ρ‹ добавляСтС Π² слот Π±ΠΎΠ»Π΅Π΅ ΠΎΠ΄Π½ΠΎΠ³ΠΎ Π²ΠΈΠ΄ΠΆΠ΅Ρ‚Π°, Π²ΠΈΠ΄ΠΆΠ΅Ρ‚Ρ‹ всСгда Ρ€Π°ΡΠΏΠΎΠ»Π°Π³Π°ΡŽΡ‚ΡΡ Π²Π΅Ρ€Ρ‚ΠΈΠΊΠ°Π»ΡŒΠ½ΠΎ. Π² слотС. Π’Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΠΊΠΎΠ½Ρ‚Ρ€ΠΎΠ»ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ ΠΏΠΎΡΠ»Π΅Π΄ΠΎΠ²Π°Ρ‚Π΅Π»ΡŒΠ½ΠΎΡΡ‚ΡŒ, Π² ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠΉ Π²ΠΈΠ΄ΠΆΠ΅Ρ‚Ρ‹ ΡƒΠΊΠ»Π°Π΄Ρ‹Π²Π°ΡŽΡ‚ΡΡ Π² слот. Если Π²Ρ‹ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ Ρ€Π°Π·ΠΌΠ΅ΡΡ‚ΠΈΡ‚ΡŒ Π΄Π²Π° Π²ΠΈΠ΄ΠΆΠ΅Ρ‚Π° рядом, Π²Ρ‹ Π΄ΠΎΠ»ΠΆΠ½Ρ‹ ΠΏΠΎΠΌΠ΅ΡΡ‚ΠΈΡ‚ΡŒ Π²ΠΈΠ΄ΠΆΠ΅Ρ‚Ρ‹ Π² Π΄Π²Π° Ρ€Π°Π·Π½Ρ‹Ρ… слота. Π­Ρ‚ΠΎΡ‚ Для ΠΊΠΎΠΌΠΏΠΎΠ½ΠΎΠ²ΠΊΠΈ трСбуСтся шаблон ΠΌΠ°ΠΊΠ΅Ρ‚Π°, Π² ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠΌ Π΅ΡΡ‚ΡŒ ΠΊΠ°ΠΊ ΠΌΠΈΠ½ΠΈΠΌΡƒΠΌ Π΄Π²Π΅ ΠΊΠΎΠ»ΠΎΠ½ΠΊΠΈ.
  • Π’Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΠΎΡΡ‚Π°Π²ΠΈΡ‚ΡŒ слоты пустыми, Ссли ΠΎΠ½ΠΈ Π²Π°ΠΌ Π½Π΅ Π½ΡƒΠΆΠ½Ρ‹ для вашСго ΠΌΠ°ΠΊΠ΅Ρ‚Π°. Когда страница ΠΌΠ°Π³Π°Π·ΠΈΠ½Π° ΠΏΡ€ΠΈ Π²ΠΈΠ·ΡƒΠ°Π»ΠΈΠ·Π°Ρ†ΠΈΠΈ ΠΎΠ±Π»Π°ΡΡ‚ΡŒ, ΠΏΡ€Π΅Π΄ΡΡ‚Π°Π²Π»ΡΡŽΡ‰Π°Ρ слот, Π½Π΅ Π±ΡƒΠ΄Π΅Ρ‚ Π·Π°Π½ΠΈΠΌΠ°Ρ‚ΡŒ Π²Π΅Ρ€Ρ‚ΠΈΠΊΠ°Π»ΡŒΠ½ΠΎΠ΅ пространство Π½Π° ΠΎΡ‚ΠΎΠ±Ρ€Π°ΠΆΠ°Π΅ΠΌΠΎΠΉ страницС.

ΠœΠ°ΠΊΠ΅Ρ‚Ρ‹ ΠΏΠΎ ΡƒΠΌΠΎΠ»Ρ‡Π°Π½ΠΈΡŽ

НазначСниС ΠΌΠ°ΠΊΠ΅Ρ‚Π° ΠΏΠΎ ΡƒΠΌΠΎΠ»Ρ‡Π°Π½ΠΈΡŽ β€” ΠΎΡ‚ΠΎΠ±Ρ€Π°Π·ΠΈΡ‚ΡŒ страницу Π² Π²ΠΈΡ‚Ρ€ΠΈΠ½Π°, ΠΊΠΎΠ³Π΄Π° страницС Π½Π΅ Π½Π°Π·Π½Π°Ρ‡Π΅Π½ ΠΌΠ°ΠΊΠ΅Ρ‚. ΠžΠ±Ρ‹Ρ‡Π½ΠΎ ΠΊΠ°ΠΆΠ΄Ρ‹ΠΉ Ρ‚ΠΈΠΏ страницы, управляСмый Π² инструмСнт Commerce Composer ΠΏΠΎ ΡƒΠΌΠΎΠ»Ρ‡Π°Π½ΠΈΡŽ ΠΌΠ°ΠΊΠ΅Ρ‚. НапримСр, Π² стартовом ΠΌΠ°Π³Π°Π·ΠΈΠ½Π΅ Aurora Π΅ΡΡ‚ΡŒ ΠΌΠ°ΠΊΠ΅Ρ‚ ΠΏΠΎ ΡƒΠΌΠΎΠ»Ρ‡Π°Π½ΠΈΡŽ, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ опрСдСляСтся для ΠΊΠ°ΠΆΠ΄ΠΎΠ³ΠΎ ΠΈΠ· ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΠΈΠ΅ Π³Ρ€ΡƒΠΏΠΏΡ‹ страниц:
  • Π‘Ρ‚Ρ€Π°Π½ΠΈΡ†Ρ‹ содСрТимого
  • Π‘Ρ‚Ρ€Π°Π½ΠΈΡ†Ρ‹ Ρ€Π΅Π·ΡƒΠ»ΡŒΡ‚Π°Ρ‚ΠΎΠ² поиска
  • Π‘Ρ‚Ρ€Π°Π½ΠΈΡ†Ρ‹ ΠΊΠ°Ρ‚Π΅Π³ΠΎΡ€ΠΈΠΉ
  • Π‘Ρ‚Ρ€Π°Π½ΠΈΡ†Ρ‹ ΠΏΡ€ΠΎΠ΄ΡƒΠΊΡ‚Π°
  • ΠŸΠ°Ρ‡ΠΊΠ° страниц
  • ΠšΠΎΠΌΠΏΠ»Π΅ΠΊΡ‚ страниц
  • ДинамичСский ΠΊΠΎΠΌΠΏΠ»Π΅ΠΊΡ‚, страницы
  • ΠŸΡ€Π΅Π΄Π²Π°Ρ€ΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎ ΠΎΠΏΡ€Π΅Π΄Π΅Π»Π΅Π½Π½Ρ‹Π΅ страницы динамичСского Π½Π°Π±ΠΎΡ€Π°
  • Π‘Ρ‚Ρ€Π°Π½ΠΈΡ†Ρ‹ SKU ΠŸΡ€ΠΈΠΌΠ΅Ρ‡Π°Π½ΠΈΠ΅:
    • Если Π²Ρ‹ ΠΏΡƒΠ±Π»ΠΈΠΊΡƒΠ΅Ρ‚Π΅ стартовый ΠΌΠ°Π³Π°Π·ΠΈΠ½ Aurora ΠΊΠ°ΠΊ ΠΌΠ°Π³Π°Π·ΠΈΠ½ B2C, Π½Π° страницС SKU ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅Ρ‚ΡΡ ΠΌΠ°ΠΊΠ΅Ρ‚ ΠΏΠΎ ΡƒΠΌΠΎΠ»Ρ‡Π°Π½ΠΈΡŽ для страницы ΠΏΡ€ΠΎΠ΄ΡƒΠΊΡ‚ΠΎΠ².
    • Если Π²Ρ‹ ΠΏΡƒΠ±Π»ΠΈΠΊΡƒΠ΅Ρ‚Π΅ ΠΌΠ°Π³Π°Π·ΠΈΠ½ ΠΊΠ°ΠΊ прямой ΠΌΠ°Π³Π°Π·ΠΈΠ½ B2B, Π½Π° страницС SKU ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅Ρ‚ΡΡ ΠΌΠ°ΠΊΠ΅Ρ‚ ΠΏΠΎ ΡƒΠΌΠΎΠ»Ρ‡Π°Π½ΠΈΡŽ для SKU. страниц.

ΠšΠ°ΠΆΠ΄Ρ‹ΠΉ ΠΌΠ°ΠΊΠ΅Ρ‚ ΠΏΠΎ ΡƒΠΌΠΎΠ»Ρ‡Π°Π½ΠΈΡŽ содСрТит ΠΏΡ€Π΅Π΄ΠΎΠΏΡ€Π΅Π΄Π΅Π»Π΅Π½Π½Ρ‹Π΅ слоты ΠΈ Π²ΠΈΠ΄ΠΆΠ΅Ρ‚Ρ‹, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ Π½Π°ΡΡ‚Ρ€Π°ΠΈΠ²Π°ΡŽΡ‚ΡΡ ИВ-Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚Ρ‡ΠΈΠΊΠ°ΠΌΠΈ.

Когда Π²Ρ‹ создаСтС Π½ΠΎΠ²ΡƒΡŽ страницу содСрТимого ΠΈΠ»ΠΈ добавляСтС ΠΊΠ°Ρ‚Π΅Π³ΠΎΡ€ΠΈΡŽ ΠΈΠ»ΠΈ запись ΠΊΠ°Ρ‚Π°Π»ΠΎΠ³Π° Π² свой ΠΊΠ°Ρ‚Π°Π»ΠΎΠ³, ΠΌΠ°ΠΊΠ΅Ρ‚ ΠΏΠΎ ΡƒΠΌΠΎΠ»Ρ‡Π°Π½ΠΈΡŽ ΠΈΠ·Π½Π°Ρ‡Π°Π»ΡŒΠ½ΠΎ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅Ρ‚ΡΡ для Ρ€Π΅Π½Π΄Π΅Ρ€ΠΈΠ½Π³Π° Π½ΠΎΠ²ΠΎΠΉ страницы. Когда Π²Ρ‹ просматриваСтС Π½ΠΎΠ²Ρ‹ΠΉ ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚ ΠΈΠ»ΠΈ ΠΊΠ°Ρ‚Π΅Π³ΠΎΡ€ΠΈΡŽ На страницС ΠΏΡ€Π΅Π΄Π²Π°Ρ€ΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎΠ³ΠΎ просмотра Π² ΠΌΠ°Π³Π°Π·ΠΈΠ½Π΅ Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΡƒΠ²ΠΈΠ΄Π΅Ρ‚ΡŒ ΠΌΠ°ΠΊΠ΅Ρ‚ ΠΏΠΎ ΡƒΠΌΠΎΠ»Ρ‡Π°Π½ΠΈΡŽ ΠΈ Π΅Π³ΠΎ содСрТимоС.ΠœΠ°ΠΊΠ΅Ρ‚ ΠΏΠΎ ΡƒΠΌΠΎΠ»Ρ‡Π°Π½ΠΈΡŽ ΠΌΠΎΠΆΠ΅Ρ‚ содСрТат ΠΎΠ΄Π½ΠΎ ΠΈΠ»ΠΈ нСсколько мСст элСктронного ΠΌΠ°Ρ€ΠΊΠ΅Ρ‚ΠΈΠ½Π³Π°, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ ΠΌΠΎΠΆΠ½ΠΎ Π·Π°ΠΏΠΎΠ»Π½ΠΈΡ‚ΡŒ ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚ΠΎΠΌ ΠΏΠΎ ΡƒΠΌΠΎΠ»Ρ‡Π°Π½ΠΈΡŽ ΠΈΠ»ΠΈ Π²Π΅Π±- Π²ΠΈΠ΄Ρ‹ Π΄Π΅ΡΡ‚Π΅Π»ΡŒΠ½ΠΎΡΡ‚ΠΈ. Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ инструмСнт ΠΌΠ°Ρ€ΠΊΠ΅Ρ‚ΠΈΠ½Π³Π° для управлСния Ρ‚ΠΎΡ‡ΠΊΠ°ΠΌΠΈ элСктронного ΠΌΠ°Ρ€ΠΊΠ΅Ρ‚ΠΈΠ½Π³Π° Π² ΠΌΠ°ΠΊΠ΅Ρ‚Π΅ ΠΏΠΎ ΡƒΠΌΠΎΠ»Ρ‡Π°Π½ΠΈΡŽ, ΠΊΠ°ΠΊ Π²Ρ‹ Π±ΡƒΠ΄Π΅Ρ‚ со страницами, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ Π½Π΅ ΡƒΠΏΡ€Π°Π²Π»ΡΡŽΡ‚ΡΡ Π² инструмСнтС Commerce Composer. Если Π²Ρ‹ Π½Π΅ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ ΠΌΠ°ΠΊΠ΅Ρ‚ ΠΏΠΎ ΡƒΠΌΠΎΠ»Ρ‡Π°Π½ΠΈΡŽ для Π½ΠΎΠ²ΠΎΠΉ страницы, Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΠΏΠ΅Ρ€Π΅ΠΎΠΏΡ€Π΅Π΄Π΅Π»ΠΈΡ‚ΡŒ ΠΌΠ°ΠΊΠ΅Ρ‚ ΠΏΠΎ ΡƒΠΌΠΎΠ»Ρ‡Π°Π½ΠΈΡŽ, Π½Π°Π·Π½Π°Ρ‡ΠΈΠ² Π½ΠΎΠ²Ρ‹ΠΉ ΠΌΠ°ΠΊΠ΅Ρ‚ для страница.

Π‘ΠΎΠ²Π΅Ρ‚. Π§Ρ‚ΠΎΠ±Ρ‹ ΡƒΠ·Π½Π°Ρ‚ΡŒ, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅Ρ‚ΡΡ Π»ΠΈ Π½Π° страницС ΠΌΠ°ΠΊΠ΅Ρ‚ ΠΏΠΎ ΡƒΠΌΠΎΠ»Ρ‡Π°Π½ΠΈΡŽ, просмотритС страницу Π² ΠΏΡ€Π΅Π΄Π²Π°Ρ€ΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎΠΌ просмотрС ΠΌΠ°Π³Π°Π·ΠΈΠ½Π° ΠΈ Π½Π°ΠΆΠΌΠΈΡ‚Π΅ ΠΊΠ½ΠΎΠΏΠΊΡƒ ΠŸΠΎΠΊΠ°Π·Π°Ρ‚ΡŒ ΠΈΠ½Ρ„ΠΎΡ€ΠΌΠ°Ρ†ΠΈΡŽ ΠΎ ΠΌΠ°ΠΊΠ΅Ρ‚Π΅.Π’ Окно ΠΈΠ½Ρ„ΠΎΡ€ΠΌΠ°Ρ†ΠΈΠΈ ΠΎ страницС ΠΈ ΠΌΠ°ΠΊΠ΅Ρ‚Π΅ опрСдСляСт ΠΌΠ°ΠΊΠ΅Ρ‚, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ примСняСтся ΠΊ страницу, ΠΊΠ°ΠΊ ΠΏΠΎΠΊΠ°Π·Π°Π½ΠΎ здСсь:

ИВ-Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚Ρ‡ΠΈΠΊΠΈ ΠΌΠΎΠ³ΡƒΡ‚ ΡƒΠΏΡ€Π°Π²Π»ΡΡ‚ΡŒ ΠΌΠ°ΠΊΠ΅Ρ‚Π°ΠΌΠΈ ΠΏΠΎ ΡƒΠΌΠΎΠ»Ρ‡Π°Π½ΠΈΡŽ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ ΡƒΡ‚ΠΈΠ»ΠΈΡ‚Ρ‹ Π·Π°Π³Ρ€ΡƒΠ·ΠΊΠΈ Π΄Π°Π½Π½Ρ‹Ρ…. Для большСго Π˜Π½Ρ„ΠΎΡ€ΠΌΠ°Ρ†ΠΈΡŽ, Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚Ρ‡ΠΈΠΊΠΈ ИВ ΠΌΠΎΠ³ΡƒΡ‚ ΠΎΠ±Ρ€Π°Ρ‚ΠΈΡ‚ΡŒΡΡ ΠΊ Π²Ρ…ΠΎΠ΄Π½ΠΎΠΌΡƒ Ρ„Π°ΠΉΠ»Ρƒ ΠΌΠ°ΠΊΠ΅Ρ‚Π°.

Как ΡΠΎΠ·Π΄Π°Π²Π°Ρ‚ΡŒ сбалансированныС ΠΌΠ°ΠΊΠ΅Ρ‚Ρ‹ страниц

Основная Ρ†Π΅Π»ΡŒ любого ΠΌΠ°ΠΊΠ΅Ρ‚Π° страницы, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ Π²Ρ‹ Ρ€Π°Π·Ρ€Π°Π±Π°Ρ‚Ρ‹Π²Π°Π΅Ρ‚Π΅, Π±ΡƒΠ΄ΡŒ Ρ‚ΠΎ пСчатная Π±Ρ€ΠΎΡˆΡŽΡ€Π° ΠΈΠ»ΠΈ новСйшСС Π²Π΅Π±-ΠΏΡ€ΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅, β€” Ρ‡Π΅Ρ‚ΠΊΠΎ ΠΈ эффСктивно донСсти ΠΈΠ½Ρ„ΠΎΡ€ΠΌΠ°Ρ†ΠΈΡŽ Π΄ΠΎ читатСля.Один ΠΈΠ· Π»ΡƒΡ‡ΡˆΠΈΡ… способов Π³Π°Ρ€Π°Π½Ρ‚ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ, Ρ‡Ρ‚ΠΎ ΠΊΠ»ΡŽΡ‡Π΅Π²Ρ‹Π΅ сообщСния Π±ΡƒΠ΄ΡƒΡ‚ доставлСны Ρ‡ΠΈΡ‚Π°Ρ‚Π΅Π»ΡŽ, β€” это ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ сбалансированный ΠΌΠ°ΠΊΠ΅Ρ‚ страницы.

Π”ΠΈΠ·Π°ΠΉΠ½ ΠΌΠ°ΠΊΠ΅Ρ‚Π° страницы ΠΎΠ±Ρ‹Ρ‡Π½ΠΎ Π²ΠΊΠ»ΡŽΡ‡Π°Π΅Ρ‚ Π² сСбя мноТСство элСмСнтов размСщСния, пСрСстановки ΠΈ форматирования. МногиС Π΄ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€Ρ‹ подходят ΠΊ этому процСссу ΠΎΡ€Π³Π°Π½ΠΈΡ‡Π½ΠΎ, нащупывая ΠΏΡƒΡ‚ΡŒ ΠΊ приятному ΠΊΠΎΠ½Π΅Ρ‡Π½ΠΎΠΌΡƒ Ρ€Π΅Π·ΡƒΠ»ΡŒΡ‚Π°Ρ‚Ρƒ. Π₯отя это ΠΌΠΎΠΆΠ΅Ρ‚ привСсти ΠΊ ΠΎΡ‚Π»ΠΈΡ‡Π½Ρ‹ΠΌ счастливым случаям, сущСствуСт риск Ρ‚ΠΎΠ³ΠΎ, Ρ‡Ρ‚ΠΎ использованиС ΠΌΠ΅Ρ‚ΠΎΠ΄ΠΎΠ»ΠΎΠ³ΠΈΠΈ свободной Ρ„ΠΎΡ€ΠΌΡ‹ ΠΌΠΎΠΆΠ΅Ρ‚ привСсти ΠΊ ΠΎΡ‚ΡΡƒΡ‚ΡΡ‚Π²ΠΈΡŽ Π²ΠΈΠ·ΡƒΠ°Π»ΡŒΠ½ΠΎΠ³ΠΎ баланса Π½Π° страницС.

Π₯ΠΎΡ€ΠΎΡˆΠ°Ρ композиция страницы Π΄ΠΎΠ»ΠΆΠ½Π° Π½Π΅ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ Ρ€Π°Π΄ΠΎΠ²Π°Ρ‚ΡŒ Π³Π»Π°Π·, Π½ΠΎ ΠΈ Ρ‡Π΅Ρ‚ΠΊΠΎ ΠΏΠ΅Ρ€Π΅Π΄Π°Π²Π°Ρ‚ΡŒ эти ΠΊΠ»ΡŽΡ‡Π΅Π²Ρ‹Π΅ сообщСния Ρ†Π΅Π»Π΅Π²ΠΎΠΉ Π°ΡƒΠ΄ΠΈΡ‚ΠΎΡ€ΠΈΠΈ.ΠœΡ‹ собрали нСсколько основных совСтов, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ ΠΏΠΎΠΌΠΎΠ³ΡƒΡ‚ Π²Π°ΠΌ ΠΎΠ±Π΅ΡΠΏΠ΅Ρ‡ΠΈΡ‚ΡŒ ΡΠ±Π°Π»Π°Π½ΡΠΈΡ€ΠΎΠ²Π°Π½Π½ΠΎΡΡ‚ΡŒ ΠΌΠ°ΠΊΠ΅Ρ‚ΠΎΠ² страниц (Ρ‚Π°ΠΊΠΆΠ΅ ΠΏΠΎΠΌΠΎΠΆΠ΅Ρ‚ Ρ…ΠΎΡ€ΠΎΡˆΠΈΠΉ конструктор Π²Π΅Π±-сайтов). Π­Ρ‚ΠΈ ΠΏΠΎΠ΄Ρ…ΠΎΠ΄Ρ‹ Π±ΡƒΠ΄ΡƒΡ‚ Ρ…ΠΎΡ€ΠΎΡˆΠΎ Ρ€Π°Π±ΠΎΡ‚Π°Ρ‚ΡŒ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΎΠ±Π΅ΡΠΏΠ΅Ρ‡ΠΈΡ‚ΡŒ структуру для баланса, нСзависимо ΠΎΡ‚ срСды, с ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠΉ Π²Ρ‹ Ρ€Π°Π±ΠΎΡ‚Π°Π΅Ρ‚Π΅.

Π”ΠΎΠΏΠΎΠ»Π½ΠΈΡ‚Π΅Π»ΡŒΠ½Ρ‹Π΅ совСты ΠΏΠΎ Π²Π΅Π±-сайтам см. Π’ нашСм руководствС ΠΏΠΎ созданию ΠΈΠ΄Π΅Π°Π»ΡŒΠ½Ρ‹Ρ… ΠΌΠ°ΠΊΠ΅Ρ‚ΠΎΠ² Π²Π΅Π±-сайтов.

01. Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ сСтку

Один ΠΈΠ· самых простых способов ΠΎΠ±Π΅ΡΠΏΠ΅Ρ‡ΠΈΡ‚ΡŒ ΡΠ±Π°Π»Π°Π½ΡΠΈΡ€ΠΎΠ²Π°Π½Π½ΠΎΡΡ‚ΡŒ вашСй страницы β€” это ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ систСму сСтки. РаньшС сСтки Π±Ρ‹Π»ΠΈ СдинствСнной ΠΏΡ€Π΅Ρ€ΠΎΠ³Π°Ρ‚ΠΈΠ²ΠΎΠΉ ΠΏΠ΅Ρ‡Π°Ρ‚Π½ΠΎΠΉ страницы, Π½ΠΎ Π·Π° послСдниС нСсколько Π»Π΅Ρ‚ Π² Π˜Π½Ρ‚Π΅Ρ€Π½Π΅Ρ‚Π΅ Π±Ρ‹Π»Π° ΠΏΡ€ΠΎΠ΄Π΅Π»Π°Π½Π° большая Ρ€Π°Π±ΠΎΡ‚Π°, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΏΠΎΠΌΠΎΡ‡ΡŒ пСрСнСсти ΠΊΠΎΠ½Ρ†Π΅ΠΏΡ†ΠΈΡŽ сСтки Π½Π° Ρ†ΠΈΡ„Ρ€ΠΎΠ²ΠΎΠΉ Π½ΠΎΡΠΈΡ‚Π΅Π»ΡŒ.

Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ сСтку для опрСдСлСния полоТСния Ρ€Π°Π·Π»ΠΈΡ‡Π½Ρ‹Ρ… элСмСнтов Π½Π° страницС, Π²Ρ‹ создадитС связь ΠΌΠ΅ΠΆΠ΄Ρƒ Ρ€Π°Π·Π»ΠΈΡ‡Π½Ρ‹ΠΌΠΈ элСмСнтами, ΡΠΎΡΡ‚Π°Π²Π»ΡΡŽΡ‰ΠΈΠΌΠΈ Π²Π°ΡˆΡƒ страницу. Π­Ρ‚ΠΎ ΠΌΠΎΠΆΠ΅Ρ‚ ΠΏΠΎΠΌΠΎΡ‡ΡŒ ΡƒΠΏΠΎΡ€ΡΠ΄ΠΎΡ‡ΠΈΡ‚ΡŒ ваш ΠΌΠ°ΠΊΠ΅Ρ‚, ΠΏΡ€Π΅Π΄ΠΎΡΡ‚Π°Π²ΠΈΡ‚ΡŒ Ρ‡ΠΈΡ‚Π°Ρ‚Π΅Π»ΡŽ Ρ‡Π΅Ρ‚ΠΊΡƒΡŽ ΡΡ‚Ρ€ΡƒΠΊΡ‚ΡƒΡ€Π½ΡƒΡŽ ссылку, ΠΊ ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠΉ ΠΎΠ½ ΠΌΠΎΠΆΠ΅Ρ‚ Π²Π΅Ρ€Π½ΡƒΡ‚ΡŒΡΡ, ΠΈ повысит успСх вашСй страницы.

Π­Ρ‚ΠΎ Π²Π°ΠΆΠ½ΠΎ, ΠΏΠΎΡ‚ΠΎΠΌΡƒ Ρ‡Ρ‚ΠΎ, ΠΊΠΎΠ³Π΄Π° всС элСмСнты вашСй страницы связаны Π΄Ρ€ΡƒΠ³ с Π΄Ρ€ΡƒΠ³ΠΎΠΌ, ΠΎΠ±Ρ‰ΠΈΠΉ эффСкт ощущаСтся Π±ΠΎΠ»Π΅Π΅ ΠΊΠΎΠΌΡ„ΠΎΡ€Ρ‚Π½Ρ‹ΠΌ для читатСля, помогая ΠΈΠΌ Ρ€Π°ΡΡΠ»Π°Π±ΠΈΡ‚ΡŒΡΡ ΠΈ облСгчая ΠΈΠΌ доступ ΠΊ Π²Π°ΠΆΠ½ΠΎΠΌΡƒ ΠΌΠ°Ρ‚Π΅Ρ€ΠΈΠ°Π»Ρƒ: ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚Ρƒ.

02. Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ ΠΎΠ΄Π½Ρƒ Ρ‚ΠΎΡ‡ΠΊΡƒ фокусировки

Один ΠΈΠ· Π½Π°ΠΈΠ±ΠΎΠ»Π΅Π΅ эффСктивных способов ΠΎΠ±Π΅ΡΠΏΠ΅Ρ‡ΠΈΡ‚ΡŒ чувство баланса β€” Π²Ρ‹Π±Ρ€Π°Ρ‚ΡŒ ΠΎΠ΄Π½Ρƒ Ρ‚ΠΎΡ‡ΠΊΡƒ фокусировки для Π΄ΠΈΠ·Π°ΠΉΠ½Π° ΠΌΠ°ΠΊΠ΅Ρ‚Π°. Π₯ΠΎΡ€ΠΎΡˆΠΈΠΌ ΠΏΡ€ΠΈΠΌΠ΅Ρ€ΠΎΠΌ этого Π½Π° ΠΏΡ€Π°ΠΊΡ‚ΠΈΠΊΠ΅ являСтся использованиС большого изобраТСния Π² качСствС самого большого элСмСнта Π½Π° страницС.

Бильная визуализация ΠΌΠΎΠΆΠ΅Ρ‚ ΠΎΠ±Π΅ΡΠΏΠ΅Ρ‡ΠΈΡ‚ΡŒ ΠΌΠΎΡ‰Π½Ρ‹ΠΉ способ привСсти читатСля Π½Π° Π²Π°ΡˆΡƒ страницу (ΠΊΠ°ΠΊ ΠΈ экспСртный Π°Π½Π°Π»ΠΈΠ· идСального Π²Π΅Π±-хостинга), Π° Ρ‚Π°ΠΊΠΆΠ΅ прСдоставляСт ΠΏΠΎΠ»Π΅Π·Π½Ρ‹ΠΉ структурный элСмСнт, Π²ΠΎΠΊΡ€ΡƒΠ³ ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠ³ΠΎ ΠΌΠΎΠΆΠ½ΠΎ Ρ€Π°ΡΠΏΠΎΠ»ΠΎΠΆΠΈΡ‚ΡŒ ΠΎΡΡ‚Π°Π²ΡˆΠΈΠΉΡΡ ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚ Π² вашСм ΠΌΠ°ΠΊΠ΅Ρ‚Π΅.Если Ρƒ вас нСсколько Π²ΠΈΠ·ΡƒΠ°Π»ΡŒΠ½Ρ‹Ρ… элСмСнтов, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ ΠΏΡ€ΠΈΠ½Ρ†ΠΈΠΏ близости Π“Π΅ΡˆΡ‚Π°Π»ΡŒΡ‚-Ρ‚Π΅ΠΎΡ€ΠΈΠΈ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΡΠ³Ρ€ΡƒΠΏΠΏΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ ΠΈΡ… вмСстС, выровняв ΠΈΡ… Ρ‚Π°ΠΊΠΈΠΌ ΠΆΠ΅ ΠΎΠ±Ρ€Π°Π·ΠΎΠΌ.

Π’Π°ΠΊΠΆΠ΅ стоит ΠΈΠΌΠ΅Ρ‚ΡŒ Π² Π²ΠΈΠ΄Ρƒ, Ρ‡Ρ‚ΠΎ Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ ΠΈΠ»ΠΈ Ρ†ΠΈΡ‚Π°Ρ‚Ρƒ Ρ‚Π°ΠΊΠΈΠΌ ΠΆΠ΅ ΠΎΠ±Ρ€Π°Π·ΠΎΠΌ; Π₯ΠΎΡ€ΠΎΡˆΠΈΠΉ ΠΎΡ‚ΠΎΠ±Ρ€Π°ΠΆΠ°Π΅ΠΌΡ‹ΠΉ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ ΠΌΠΎΠΆΠ΅Ρ‚ ΠΏΡ€Π΅Π΄Π»ΠΎΠΆΠΈΡ‚ΡŒ Ρ‚Π°ΠΊΠΎΠΉ ΠΆΠ΅ Π²ΠΈΠ·ΡƒΠ°Π»ΡŒΠ½Ρ‹ΠΉ интСрСс, ΠΊΠ°ΠΊ ΠΈ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅, ΠΏΡ€ΠΈ этом сохраняя структуру, которая ΠΏΠΎΠΌΠΎΠΆΠ΅Ρ‚ Π²Π°ΠΌ ΠΎΠ±Π΅ΡΠΏΠ΅Ρ‡ΠΈΡ‚ΡŒ сбалансированный ΠΌΠ°ΠΊΠ΅Ρ‚.

03. Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ ΠΏΡ€Π°Π²ΠΈΠ»ΠΎ Ρ‚Ρ€Π΅Ρ‚Π΅ΠΉ

Один ΠΈΠ· Π»ΡƒΡ‡ΡˆΠΈΡ… способов ΠΎΠ±Π΅ΡΠΏΠ΅Ρ‡ΠΈΡ‚ΡŒ чувство баланса β€” ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ любимоС Π΄ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€ΠΎΠΌ ΠΏΡ€Π°Π²ΠΈΠ»ΠΎ Ρ‚Ρ€Π΅Ρ‚Π΅ΠΉ ΠΈΠ»ΠΈ Π·ΠΎΠ»ΠΎΡ‚ΠΎΠ΅ сСчСниС.ΠŸΡ€ΠΎΡ‰Π΅ говоря, ΠΏΡ€Π°Π²ΠΈΠ»ΠΎ Ρ‚Ρ€Π΅Ρ‚Π΅ΠΉ гласит, Ρ‡Ρ‚ΠΎ Ссли Π²Ρ‹ Ρ€Π°Π·Π΄Π΅Π»ΠΈΡ‚Π΅ свою страницу Π½Π° Ρ‚Ρ€Π΅Ρ‚ΠΈ ΠΊΠ°ΠΊ ΠΏΠΎ Π²Π΅Ρ€Ρ‚ΠΈΠΊΠ°Π»ΠΈ, Ρ‚Π°ΠΊ ΠΈ ΠΏΠΎ Π³ΠΎΡ€ΠΈΠ·ΠΎΠ½Ρ‚Π°Π»ΠΈ, Ρ‚ΠΎΡ‡ΠΊΠΈ, Π² ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Ρ… ΠΏΠ΅Ρ€Π΅ΡΠ΅ΠΊΠ°ΡŽΡ‚ΡΡ Π»ΠΈΠ½ΠΈΠΈ сСтки, ΡΠ²Π»ΡΡŽΡ‚ΡΡ СстСствСнными фокусными Ρ‚ΠΎΡ‡ΠΊΠ°ΠΌΠΈ ΠΊΠΎΠΌΠΏΠΎΠ·ΠΈΡ†ΠΈΠΈ.

БовмСстив ΠΊΠ»ΡŽΡ‡Π΅Π²Ρ‹Π΅ элСмСнты с этими Ρ‡Π΅Ρ‚Ρ‹Ρ€ΡŒΠΌΡ Ρ‚ΠΎΡ‡ΠΊΠ°ΠΌΠΈ, Π²Ρ‹ ΠΏΠΎΠ»ΡƒΡ‡ΠΈΡ‚Π΅ Π±ΠΎΠ»Π΅Π΅ ΠΏΡ€ΠΈΡΡ‚Π½ΡƒΡŽ ΠΊΠΎΠΌΠΏΠΎΠ·ΠΈΡ†ΠΈΡŽ, Ρ‡Π΅ΠΌ Ссли Π±Ρ‹ Π²Ρ‹, Π½Π°ΠΏΡ€ΠΈΠΌΠ΅Ρ€, идСально Ρ†Π΅Π½Ρ‚Ρ€ΠΈΡ€ΠΎΠ²Π°Π»ΠΈ элСмСнты Π½Π° своСй страницС.

Π‘Π°ΠΌΠΎ ΠΏΠΎ сСбС ΠΏΡ€Π°Π²ΠΈΠ»ΠΎ Ρ‚Ρ€Π΅Ρ‚Π΅ΠΉ Π½Π΅ ΠΌΠΎΠΆΠ΅Ρ‚ Π²ΠΎΠ»ΡˆΠ΅Π±Π½Ρ‹ΠΌ ΠΎΠ±Ρ€Π°Π·ΠΎΠΌ ΠΎΠ±Π΅ΡΠΏΠ΅Ρ‡ΠΈΡ‚ΡŒ баланс вашСго ΠΌΠ°ΠΊΠ΅Ρ‚Π°, Π½ΠΎ, Ρ€Π°ΡΡˆΠΈΡ€ΡΡ ΠΏΡ€ΠΈΠ½Ρ†ΠΈΠΏ, Π»Π΅Π³ΠΊΠΎ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ эту Ρ‚Π΅Π½Π΄Π΅Π½Ρ†ΠΈΡŽ ΠΊ СстСствСнному фокусу, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΏΠΎΠΌΠΎΡ‡ΡŒ ΡΠ±Π°Π»Π°Π½ΡΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ ваш ΠΌΠ°ΠΊΠ΅Ρ‚.

РаспространСнный ΠΏΠΎΠ΄Ρ…ΠΎΠ΄ Π·Π°ΠΊΠ»ΡŽΡ‡Π°Π΅Ρ‚ΡΡ Π² Ρ€Π°Π·ΠΌΠ΅Ρ‰Π΅Π½ΠΈΠΈ Π½Π°ΠΈΠ±ΠΎΠ»Π΅Π΅ Π²Π°ΠΆΠ½Ρ‹Ρ… элСмСнтов вашСй страницы Π² Π²Π΅Ρ€Ρ…Π½Π΅ΠΉ (ΠΈΠ»ΠΈ Π½ΠΈΠΆΠ½Π΅ΠΉ) Ρ‚Ρ€Π΅Ρ‚ΠΈ страницы с Π²Ρ‹Ρ€Π°Π²Π½ΠΈΠ²Π°Π½ΠΈΠ΅ΠΌ основной Ρ‚ΠΎΡ‡ΠΊΠΈ фокуса Π² соотвСтствии с ΠΎΠ΄Π½ΠΈΠΌ ΠΈΠ· пСрСсСчСний. Π•ΡΡ‚ΡŒ ΠΌΠ½ΠΎΠ³ΠΎ рСсурсов для вашСго сайта? ΠžΠ·Π½Π°ΠΊΠΎΠΌΡŒΡ‚Π΅ΡΡŒ с этими Π²Π°Ρ€ΠΈΠ°Π½Ρ‚Π°ΠΌΠΈ ΠΎΠ±Π»Π°Ρ‡Π½ΠΎΠ³ΠΎ Ρ…Ρ€Π°Π½ΠΈΠ»ΠΈΡ‰Π°.

04. Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ ΠΏΡ€ΠΎΠ±Π΅Π»Ρ‹

ΠΠ°Ρ‡ΠΈΠ½Π°ΡŽΡ‰ΠΈΠ΅ Π΄ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€Ρ‹ ΠΎΠ±Ρ‹Ρ‡Π½ΠΎ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽΡ‚ ΠΊΠ°ΠΆΠ΄Ρ‹ΠΉ Π±ΠΈΡ‚ пространства Π½Π° страницС, заполняя содСрТимоС Π΄ΠΎ Ρ‚Π΅Ρ… ΠΏΠΎΡ€, ΠΏΠΎΠΊΠ° всС ΠΏΡ€ΠΎΠ±Π΅Π»Ρ‹ Π½Π΅ Π±ΡƒΠ΄ΡƒΡ‚ Π·Π°ΠΏΠΎΠ»Π½Π΅Π½Ρ‹. Π‘ΠΎΠ»Π΅Π΅ ΠΎΠΏΡ‹Ρ‚Π½Ρ‹Π΅ Π·Π½Π°ΡŽΡ‚, Ρ‡Ρ‚ΠΎ ΠΈΠ½ΠΎΠ³Π΄Π° Π»ΡƒΡ‡ΡˆΠΈΠΉ способ Π΄ΠΈΠ·Π°ΠΉΠ½Π° Π·Π°ΠΊΠ»ΡŽΡ‡Π°Π΅Ρ‚ΡΡ Π² Ρ‚ΠΎΠΌ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΈΡΠΊΠ»ΡŽΡ‡ΠΈΡ‚ΡŒ элСмСнты, Π° Π½Π΅ Π²Ρ‚ΠΈΡΠ½ΡƒΡ‚ΡŒ ΠΈΡ… Π²Π½ΡƒΡ‚Ρ€ΡŒ.

Π’ ΠΏΠ΅Ρ‡Π°Ρ‚Π½Ρ‹Ρ… носитСлях Π½Π°ΠΈΠ±ΠΎΠ»Π΅Π΅ распространСнным способом использования пустого пространства являСтся ΡƒΠ²Π΅Π»ΠΈΡ‡Π΅Π½ΠΈΠ΅ ΠΏΠΎΠ»Π΅ΠΉ ΠΈ ΠΏΡ€ΠΎΠΌΠ΅ΠΆΡƒΡ‚ΠΊΠΎΠ² страницы. Π’ Π˜Π½Ρ‚Π΅Ρ€Π½Π΅Ρ‚Π΅ простоС обСспСчСниС достаточного пространства для ΠΏΠ΅Ρ€Π΅Π΄Ρ‹ΡˆΠΊΠΈ Π²ΠΎΠΊΡ€ΡƒΠ³ элСмСнтов ΠΌΠΎΠΆΠ΅Ρ‚ ΠΏΠΎΠΌΠΎΡ‡ΡŒ ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ Π΄ΠΈΠ·Π°ΠΉΠ½ ΠΌΠ°ΠΊΠ΅Ρ‚Π° собранным ΠΈ сбалансированным.

ИспользованиС ΠΎΡ‚Ρ€ΠΈΡ†Π°Ρ‚Π΅Π»ΡŒΠ½ΠΎΠ³ΠΎ пространства Π»ΡƒΡ‡ΡˆΠ΅ всСго Ρ€Π°Π±ΠΎΡ‚Π°Π΅Ρ‚, ΠΊΠΎΠ³Π΄Π° Ρƒ вас Π΅ΡΡ‚ΡŒ чСткая структура, которая связываСт содСрТимоС вмСстС (Π½Π°ΠΏΡ€ΠΈΠΌΠ΅Ρ€, прСдоставляСмая сСткой), ΠΏΠΎΡΠΊΠΎΠ»ΡŒΠΊΡƒ риск пустого пространства ΠΌΠΎΠΆΠ΅Ρ‚ Π±Ρ‹Ρ‚ΡŒ ΠΎΡ‰ΡƒΡ‰Π΅Π½ΠΈΠ΅ΠΌ Ρ€Π°Π·ΡŠΠ΅Π΄ΠΈΠ½Π΅Π½ΠΈΡ ΠΌΠ΅ΠΆΠ΄Ρƒ элСмСнтами страницы, Ссли ΠΎΠ½ΠΈ Π²Π²Π΅Π΄Π΅Π½Ρ‹ случайно.

05. ΠŸΠΎΠ²Ρ‚ΠΎΡ€ΡΡŽΡ‰ΠΈΠ΅ΡΡ элСмСнты Π΄ΠΈΠ·Π°ΠΉΠ½Π°

ΠŸΠΎΠ²Ρ‚ΠΎΡ€Π΅Π½ΠΈΠ΅ Ρ‚Π°ΠΊΠΆΠ΅ ΠΌΠΎΠΆΠ΅Ρ‚ Π΄Π°Ρ‚ΡŒ сильноС ΠΎΡ‰ΡƒΡ‰Π΅Π½ΠΈΠ΅ связности Π΄ΠΈΠ·Π°ΠΉΠ½Π° ΠΈ сбалансированности ΠΊΠΎΠΌΠΏΠΎΠ·ΠΈΡ†ΠΈΠΈ. ИдСя состоит Π² Ρ‚ΠΎΠΌ, Ρ‡Ρ‚ΠΎ, идСнтифицируя ΠΈ ΠΏΠΎΠ²Ρ‚ΠΎΡ€Π½ΠΎ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ ΠΌΠΎΡ‚ΠΈΠ² ΠΈΠ»ΠΈ Π΄ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€ΡΠΊΡƒΡŽ ΠΎΠ±Ρ€Π°Π±ΠΎΡ‚ΠΊΡƒ Π²ΠΎ всСм ΠΌΠ°ΠΊΠ΅Ρ‚Π΅, Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΠΏΡ€Π΅Π΄ΠΎΡΡ‚Π°Π²ΠΈΡ‚ΡŒ Ρ‡ΠΈΡ‚Π°Ρ‚Π΅Π»ΡŽ ссылку, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Ρ€Π°Π·Ρ€ΠΎΠ·Π½Π΅Π½Π½Ρ‹Π΅ области ΠΎΡ‰ΡƒΡ‰Π°Π»ΠΈΡΡŒ связанными ΠΈ ΡΠΎΡΡ‚Π°Π²Π»ΡΡŽΡ‰ΠΈΠΌΠΈ ΠΎΠ΄Π½Ρƒ ΠΈ Ρ‚Ρƒ ΠΆΠ΅ ΠΎΠ±Ρ‰ΡƒΡŽ ΠΊΠΎΠΌΠΏΠΎΠ·ΠΈΡ†ΠΈΡŽ.

Π’Ρ‹ Ρ‚Π°ΠΊΠΆΠ΅ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ эту Ρ‚Π΅Ρ…Π½ΠΈΠΊΡƒ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΎΠ±Π΅ΡΠΏΠ΅Ρ‡ΠΈΡ‚ΡŒ фокус Π² вашСм Π΄ΠΈΠ·Π°ΠΉΠ½Π΅, сохраняя ΠΏΡ€ΠΈ этом ΠΎΠ±Ρ‰ΠΈΠΉ баланс, Π½Π°ΠΌΠ΅Ρ€Π΅Π½Π½ΠΎ Π½Π°Ρ€ΡƒΡˆΠ°Ρ ΠΎΠ±Ρ€Π°Π·Π΅Ρ† сходства, Π²Π²Π΅Π΄Π΅Π½Π½Ρ‹ΠΉ посрСдством повторСния.

06. Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ ΠΈΠ΅Ρ€Π°Ρ€Ρ…ΠΈΡŽ

Один ΠΈΠ· ΠΊΠ»ΡŽΡ‡Π΅Π²Ρ‹Ρ… ΠΏΠΎΠ΄Ρ…ΠΎΠ΄ΠΎΠ² ΠΊ Π΄ΠΎΡΡ‚ΠΈΠΆΠ΅Π½ΠΈΡŽ Π½ΠΈΡ€Π²Π°Π½Ρ‹ ΠΌΠ°ΠΊΠ΅Ρ‚Π° страницы β€” это Ρ‡Π΅Ρ‚ΠΊΠΎΠ΅ прСдставлСниС ΠΎ структурС ΠΈ ΠΈΠ΅Ρ€Π°Ρ€Ρ…ΠΈΠΈ. ΠœΡ‹ ΡƒΠΆΠ΅ ΠΊΠΎΡΠ½ΡƒΠ»ΠΈΡΡŒ структуры, Π½ΠΎ Π²Π°ΠΆΠ½ΠΎ Ρ‚Π°ΠΊΠΆΠ΅ ΠΏΠ΅Ρ€Π΅Π΄Π°Ρ‚ΡŒ ΠΎΡ‚Π½ΠΎΡΠΈΡ‚Π΅Π»ΡŒΠ½ΡƒΡŽ Π²Π°ΠΆΠ½ΠΎΡΡ‚ΡŒ Ρ€Π°Π·Π»ΠΈΡ‡Π½Ρ‹Ρ… частСй ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚Π° Π½Π° вашСй страницС. НапримСр, Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ ΠΏΠΎΡ‡Ρ‚ΠΈ всСгда Π΄ΠΎΠ»ΠΆΠ΅Π½ Π±Ρ‹Ρ‚ΡŒ Π²ΠΈΠ·ΡƒΠ°Π»ΡŒΠ½ΠΎ Π±ΠΎΠ»Π΅Π΅ Π²Π°ΠΆΠ½Ρ‹ΠΌ, Ρ‡Π΅ΠΌ основной тСкст.

ΠŸΠΎΡΠΌΠΎΡ‚Ρ€ΠΈΡ‚Π΅ Π½Π° Ρ€Π°Π·Π»ΠΈΡ‡Π½Ρ‹Π΅ элСмСнты, ΡΠΎΡΡ‚Π°Π²Π»ΡΡŽΡ‰ΠΈΠ΅ ваш ΠΌΠ°ΠΊΠ΅Ρ‚, ΠΈ Ρ€Π΅ΡˆΠΈΡ‚Π΅, ΠΊΠ°ΠΊΠΎΠΉ ΠΈΠ· Π½ΠΈΡ… являСтся Π½Π°ΠΈΠ±ΠΎΠ»Π΅Π΅ Π²Π°ΠΆΠ½Ρ‹ΠΌ.Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ этот элСмСнт, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΎΠ±Π΅ΡΠΏΠ΅Ρ‡ΠΈΡ‚ΡŒ структурный Π·Π°Ρ†Π΅ΠΏ для ΠΎΡΡ‚Π°Π»ΡŒΠ½Ρ‹Ρ… элСмСнтов Π½Π° страницС, сохраняя Π΅Π³ΠΎ Π½Π°ΠΈΠ±ΠΎΠ»Π΅Π΅ Π²Π°ΠΆΠ½Ρ‹ΠΌ.

07. Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ ΠΌΠ°ΡΡˆΡ‚Π°Π±, контраст ΠΈ Π³Π°Ρ€ΠΌΠΎΠ½ΠΈΡŽ.

НаконСц, использованиС ΠΌΠ°ΡΡˆΡ‚Π°Π±Π° ΠΌΠΎΠΆΠ΅Ρ‚ Π±Ρ‹Ρ‚ΡŒ ΠΎΡ‡Π΅Π½ΡŒ эффСктивным ΠΌΠ΅Ρ‚ΠΎΠ΄ΠΎΠΌ для достиТСния Ρ…ΠΎΡ€ΠΎΡˆΠ΅Π³ΠΎ Π²ΠΈΠ·ΡƒΠ°Π»ΡŒΠ½ΠΎΠ³ΠΎ баланса Π² ΠΌΠ°ΠΊΠ΅Ρ‚Π΅. ДСлая ΠΎΠ΄Π½ΠΈ элСмСнты ΠΊΡ€ΡƒΠΏΠ½Π΅Π΅ Π΄Ρ€ΡƒΠ³ΠΈΡ…, Π²ΠΎΠ·Π½ΠΈΠΊΠ°Π΅Ρ‚ чувство порядка ΠΈ ΠΈΠ΅Ρ€Π°Ρ€Ρ…ΠΈΠΈ. Π­Ρ‚ΠΎ ΠΏΠΎΠΌΠΎΠ³Π°Π΅Ρ‚ ΡΠΎΠ·Π΄Π°Ρ‚ΡŒ ΡƒΠ΄ΠΎΠ±Π½Ρ‹ΠΉ ΠΌΠ°ΠΊΠ΅Ρ‚, ΠΏΠΎΡ‚ΠΎΠΌΡƒ Ρ‡Ρ‚ΠΎ Π·Ρ€ΠΈΡ‚Π΅Π»ΡŒ автоматичСски сначала Π±ΡƒΠ΄Π΅Ρ‚ ΡΠΌΠΎΡ‚Ρ€Π΅Ρ‚ΡŒ Π½Π° Π±ΠΎΠ»Π΅Π΅ ΠΊΡ€ΡƒΠΏΠ½Ρ‹Π΅ элСмСнты Π² ΠΌΠ°ΠΊΠ΅Ρ‚Π΅, пСрСходя ΠΊ Π±ΠΎΠ»Π΅Π΅ ΠΌΠ΅Π»ΠΊΠΈΠΌ элСмСнтам ΠΏΠΎ ΠΌΠ΅Ρ€Π΅ чтСния.

Π­Ρ‚ΠΎΡ‚ ΠΏΡ€ΠΈΠ½Ρ†ΠΈΠΏ Ρ‚Π°ΠΊΠΆΠ΅ Ρ€Π°Π±ΠΎΡ‚Π°Π΅Ρ‚ с ΠΏΠΎΠ²Ρ‹ΡˆΠ΅Π½Π½ΠΎΠΉ ΠΊΠΎΠ½Ρ‚Ρ€Π°ΡΡ‚Π½ΠΎΡΡ‚ΡŒΡŽ, Ρ‚Π°ΠΊ Ρ‡Ρ‚ΠΎ Π²Ρ‹Π΄Π΅Π»Π΅Π½ΠΈΠ΅ элСмСнта Π½Π° страницС с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ контраста заставит Π³Π»Π°Π· сначала ΡΡ„ΠΎΠΊΡƒΡΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒΡΡ Π½Π° этой Ρ‚ΠΎΡ‡ΠΊΠ΅. Π­Ρ‚ΠΎ обСспСчиваСт ΠΏΡƒΡ‚ΡŒ Π½Π° страницу ΠΈ снова Π΄Π°Π΅Ρ‚ ΠΏΠΎΠ»Π΅Π·Π½ΡƒΡŽ ΡΡ‚Ρ€ΡƒΠΊΡ‚ΡƒΡ€Π½ΡƒΡŽ Ρ‚ΠΎΡ‡ΠΊΡƒ для Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚ΠΊΠΈ вашСго ΠΌΠ°ΠΊΠ΅Ρ‚Π°.

И ΠΌΠ°ΡΡˆΡ‚Π°Π±, ΠΈ контраст Ρ€Π°Π±ΠΎΡ‚Π°ΡŽΡ‚ Π»ΡƒΡ‡ΡˆΠ΅ всСго, ΠΊΠΎΠ³Π΄Π° ΠΎΠ½ΠΈ ΠΏΡ€ΠΈΠΌΠ΅Π½ΡΡŽΡ‚ΡΡ ΠΊ ΠΎΠ΄Π½ΠΎΠΌΡƒ элСмСнту, выдСляя Π΅Π³ΠΎ срСди Π΄Ρ€ΡƒΠ³ΠΈΡ… частСй ΠΌΠ°ΠΊΠ΅Ρ‚Π°. Π˜ΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠΉΡ‚Π΅ ΠΏΡ€ΠΈΠ½Ρ†ΠΈΠΏΡ‹ Π³Π°Ρ€ΠΌΠΎΠ½ΠΈΠΈ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π·Π°ΡΡ‚Π°Π²ΠΈΡ‚ΡŒ Π΄Ρ€ΡƒΠ³ΠΈΡ… ΠΏΠΎΡ‡ΡƒΠ²ΡΡ‚Π²ΠΎΠ²Π°Ρ‚ΡŒ сСбя связанными ΠΈ Π°ΠΊΡ†Π΅Π½Ρ‚ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅ Π½Π° фокусС.

Π‘Ρ‚Π°Ρ‚ΡŒΠΈ ΠΏΠΎ Ρ‚Π΅ΠΌΠ΅:

Π§Ρ‚ΠΎ содСрТат ΠΎΠ±Ρ‹Ρ‡Π½Ρ‹Π΅ Π²Π΅Π±-ΠΌΠ°ΠΊΠ΅Ρ‚Ρ‹? β€” Π˜Π·ΡƒΡ‡ΠΈΡ‚Π΅ Π²Π΅Π±-Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚ΠΊΡƒ

ΠŸΡ€ΠΈ Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚ΠΊΠ΅ страниц для вашСго Π²Π΅Π±-сайта ΠΏΠΎΠ»Π΅Π·Π½ΠΎ ΠΈΠΌΠ΅Ρ‚ΡŒ прСдставлСниС ΠΎ Π½Π°ΠΈΠ±ΠΎΠ»Π΅Π΅ распространСнных ΠΌΠ°ΠΊΠ΅Ρ‚Π°Ρ….

ΠŸΡ€Π΅Π΄Π²Π°Ρ€ΠΈΡ‚Π΅Π»ΡŒΠ½Ρ‹Π΅ трСбования: Π£Π±Π΅Π΄ΠΈΡ‚Π΅ΡΡŒ, Ρ‡Ρ‚ΠΎ Π²Ρ‹ ΡƒΠΆΠ΅ ΠΏΠΎΠ΄ΡƒΠΌΠ°Π»ΠΈ ΠΎ Ρ‚ΠΎΠΌ, Ρ‡Π΅Π³ΠΎ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ Π΄ΠΎΡΡ‚ΠΈΡ‡ΡŒ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ своСго Π²Π΅Π±-ΠΏΡ€ΠΎΠ΅ΠΊΡ‚Π°.
ЦСль: Π£Π·Π½Π°ΠΉΡ‚Π΅, Π³Π΄Π΅ Ρ€Π°Π·ΠΌΠ΅ΡΡ‚ΠΈΡ‚ΡŒ элСмСнты Π½Π° своих Π²Π΅Π±-страницах ΠΈ ΠΊΠ°ΠΊ ΠΈΡ… Ρ€Π°Π·ΠΌΠ΅ΡΡ‚ΠΈΡ‚ΡŒ.

Π•ΡΡ‚ΡŒ ΠΏΡ€ΠΈΡ‡ΠΈΠ½Π°, ΠΏΠΎ ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠΉ ΠΌΡ‹ Π³ΠΎΠ²ΠΎΡ€ΠΈΠΌ ΠΎ Π²Π΅Π±-Π΄ΠΈΠ·Π°ΠΉΠ½Π΅. Π’Ρ‹ Π½Π°Ρ‡ΠΈΠ½Π°Π΅Ρ‚Π΅ с пустой страницы, ΠΈ Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Π΄Π²ΠΈΠ³Π°Ρ‚ΡŒΡΡ Π² Ρ€Π°Π·Π½Ρ‹Ρ… направлСниях. А Ссли Ρƒ вас Π½Π΅Ρ‚ большого ΠΎΠΏΡ‹Ρ‚Π°, Π½Π°Ρ‡ΠΈΠ½Π°Ρ‚ΡŒ с пустой страницы ΠΌΠΎΠΆΠ΅Ρ‚ Π±Ρ‹Ρ‚ΡŒ Π½Π΅ΠΌΠ½ΠΎΠ³ΠΎ ΡΡ‚Ρ€Π°ΡˆΠ½ΠΎ. Π£ нас Π±ΠΎΠ»Π΅Π΅ 25 Π»Π΅Ρ‚ ΠΎΠΏΡ‹Ρ‚Π°, ΠΈ ΠΌΡ‹ Π΄Π°Π΄ΠΈΠΌ Π²Π°ΠΌ нСсколько ΠΎΠ±Ρ‰ΠΈΡ… практичСских ΠΏΡ€Π°Π²ΠΈΠ», ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ ΠΏΠΎΠΌΠΎΠ³ΡƒΡ‚ Π²Π°ΠΌ Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚Π°Ρ‚ΡŒ свой сайт.

Π”Π°ΠΆΠ΅ сСйчас, с Π½ΠΎΠ²Ρ‹ΠΌ Π°ΠΊΡ†Π΅Π½Ρ‚ΠΎΠΌ Π½Π° ΠΌΠΎΠ±ΠΈΠ»ΡŒΠ½Ρ‹ΠΉ Π˜Π½Ρ‚Π΅Ρ€Π½Π΅Ρ‚, ΠΏΠΎΡ‡Ρ‚ΠΈ всС основныС Π²Π΅Π±-страницы состоят ΠΈΠ· этих частСй:

Π—Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ
ΠžΡ‚ΠΎΠ±Ρ€Π°ΠΆΠ°Π΅Ρ‚ΡΡ Π²Π²Π΅Ρ€Ρ…Ρƒ ΠΊΠ°ΠΆΠ΄ΠΎΠΉ страницы сайта.Π‘ΠΎΠ΄Π΅Ρ€ΠΆΠΈΡ‚ ΠΈΠ½Ρ„ΠΎΡ€ΠΌΠ°Ρ†ΠΈΡŽ, ΠΎΡ‚Π½ΠΎΡΡΡ‰ΡƒΡŽΡΡ ΠΊΠΎ всСм страницам (Π½Π°ΠΏΡ€ΠΈΠΌΠ΅Ρ€, Π½Π°Π·Π²Π°Π½ΠΈΠ΅ сайта ΠΈΠ»ΠΈ Π»ΠΎΠ³ΠΎΡ‚ΠΈΠΏ), ΠΈ ΠΏΡ€ΠΎΡΡ‚ΡƒΡŽ Π² использовании систСму Π½Π°Π²ΠΈΠ³Π°Ρ†ΠΈΠΈ.
ОсновноС содСрТаниС
Π‘Π°ΠΌΡ‹ΠΉ большой Ρ€Π΅Π³ΠΈΠΎΠ½, содСрТащий ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚, ΡƒΠ½ΠΈΠΊΠ°Π»ΡŒΠ½Ρ‹ΠΉ для Ρ‚Π΅ΠΊΡƒΡ‰Π΅ΠΉ страницы.
МСшок сбоку
1) Π˜Π½Ρ„ΠΎΡ€ΠΌΠ°Ρ†ΠΈΡ, Π΄ΠΎΠΏΠΎΠ»Π½ΡΡŽΡ‰Π°Ρ основноС содСрТаниС; 2) информация, совмСстно ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅ΠΌΠ°Ρ подмноТСством страниц; 3) Π°Π»ΡŒΡ‚Π΅Ρ€Π½Π°Ρ‚ΠΈΠ²Π½Π°Ρ систСма Π½Π°Π²ΠΈΠ³Π°Ρ†ΠΈΠΈ. ЀактичСски, всС, Ρ‡Ρ‚ΠΎ Π½Π΅ являСтся Π°Π±ΡΠΎΠ»ΡŽΡ‚Π½ΠΎ Π½Π΅ΠΎΠ±Ρ…ΠΎΠ΄ΠΈΠΌΡ‹ΠΌ для основного ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚Π° страницы.
НиТний ΠΊΠΎΠ»ΠΎΠ½Ρ‚ΠΈΡ‚ΡƒΠ»
ΠžΡ‚ΠΎΠ±Ρ€Π°ΠΆΠ°Π΅Ρ‚ΡΡ Π²Π½ΠΈΠ·Ρƒ ΠΊΠ°ΠΆΠ΄ΠΎΠΉ страницы сайта.Как ΠΈ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ, содСрТит ΠΌΠ΅Π½Π΅Π΅ Π²Π°ΠΆΠ½ΡƒΡŽ Π³Π»ΠΎΠ±Π°Π»ΡŒΠ½ΡƒΡŽ ΠΈΠ½Ρ„ΠΎΡ€ΠΌΠ°Ρ†ΠΈΡŽ, Ρ‚Π°ΠΊΡƒΡŽ ​​как ΡŽΡ€ΠΈΠ΄ΠΈΡ‡Π΅ΡΠΊΠΈΠ΅ увСдомлСния ΠΈΠ»ΠΈ ΠΊΠΎΠ½Ρ‚Π°ΠΊΡ‚Π½ΡƒΡŽ ΠΈΠ½Ρ„ΠΎΡ€ΠΌΠ°Ρ†ΠΈΡŽ.

Π­Ρ‚ΠΈ элСмСнты Π²ΡΡ‚Ρ€Π΅Ρ‡Π°ΡŽΡ‚ΡΡ довольно часто Π²ΠΎ всСх Ρ„ΠΎΡ€ΠΌ-Ρ„Π°ΠΊΡ‚ΠΎΡ€Π°Ρ…, Π½ΠΎ ΠΈΡ… ΠΌΠΎΠΆΠ½ΠΎ Ρ€Π°ΡΠΏΠΎΠ»ΠΎΠΆΠΈΡ‚ΡŒ ΠΏΠΎ-Ρ€Π°Π·Π½ΠΎΠΌΡƒ. Π’ΠΎΡ‚ нСсколько ΠΏΡ€ΠΈΠΌΠ΅Ρ€ΠΎΠ² ( 1 прСдставляСт Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ, 2 Π½ΠΈΠΆΠ½ΠΈΠΉ ΠΊΠΎΠ»ΠΎΠ½Ρ‚ΠΈΡ‚ΡƒΠ»; A основноС содСрТимоС; B1, B2 элСмСнтов сбоку):

ΠœΠ°ΠΊΠ΅Ρ‚ Π² 1 столбСц. ОсобСнно Π²Π°ΠΆΠ½ΠΎ для ΠΌΠΎΠ±ΠΈΠ»ΡŒΠ½Ρ‹Ρ… Π±Ρ€Π°ΡƒΠ·Π΅Ρ€ΠΎΠ², Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π½Π΅ Π·Π°Π³Ρ€ΠΎΠΌΠΎΠΆΠ΄Π°Ρ‚ΡŒ малСнький экран.

Двухколоночная раскладка. Часто ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅Ρ‚ΡΡ для Ρ‚Π°Ρ€Π³Π΅Ρ‚ΠΈΠ½Π³Π° Π½Π° ΠΏΠ»Π°Π½ΡˆΠ΅Ρ‚Ρ‹, Ρ‚Π°ΠΊ ΠΊΠ°ΠΊ Ρƒ Π½ΠΈΡ… экран срСднСго Ρ€Π°Π·ΠΌΠ΅Ρ€Π°.

ВрСхколоночная раскладка . ΠŸΠΎΠ΄Ρ…ΠΎΠ΄ΠΈΡ‚ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ для Π½Π°ΡΡ‚ΠΎΠ»ΡŒΠ½Ρ‹Ρ… ΠΊΠΎΠΌΠΏΡŒΡŽΡ‚Π΅Ρ€ΠΎΠ² с большими экранами. (Π”Π°ΠΆΠ΅ ΠΌΠ½ΠΎΠ³ΠΈΠ΅ ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»ΠΈ Π½Π°ΡΡ‚ΠΎΠ»ΡŒΠ½Ρ‹Ρ… ΠΊΠΎΠΌΠΏΡŒΡŽΡ‚Π΅Ρ€ΠΎΠ² ΠΏΡ€Π΅Π΄ΠΏΠΎΡ‡ΠΈΡ‚Π°ΡŽΡ‚ ΠΏΡ€ΠΎΡΠΌΠ°Ρ‚Ρ€ΠΈΠ²Π°Ρ‚ΡŒ ΠΎΠ±ΡŠΠ΅ΠΊΡ‚Ρ‹ Π² ΠΌΠ°Π»Π΅Π½ΡŒΠΊΠΈΡ… ΠΎΠΊΠ½Π°Ρ…, Π° Π½Π΅ Π² полноэкранном Ρ€Π΅ΠΆΠΈΠΌΠ΅.)

НастоящСС вСсСльС начинаСтся, ΠΊΠΎΠ³Π΄Π° Π²Ρ‹ Π½Π°Ρ‡ΠΈΠ½Π°Π΅Ρ‚Π΅ ΡΠΌΠ΅ΡˆΠΈΠ²Π°Ρ‚ΡŒ ΠΈΡ… всС вмСстС:

…

Π­Ρ‚ΠΎ всСго лишь ΠΏΡ€ΠΈΠΌΠ΅Ρ€Ρ‹, ΠΈ Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Ρ€Π°ΡΠΏΠΎΠ»Π°Π³Π°Ρ‚ΡŒ ΠΈΡ… ΠΊΠ°ΠΊ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅. Π’Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Π·Π°ΠΌΠ΅Ρ‚ΠΈΡ‚ΡŒ, Ρ‡Ρ‚ΠΎ, хотя ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚ ΠΌΠΎΠΆΠ΅Ρ‚ ΠΏΠ΅Ρ€Π΅ΠΌΠ΅Ρ‰Π°Ρ‚ΡŒΡΡ ΠΏΠΎ экрану, ΠΌΡ‹ всСгда оставляСм Π²Π΅Ρ€Ρ…Π½ΠΈΠΉ ΠΊΠΎΠ»ΠΎΠ½Ρ‚ΠΈΡ‚ΡƒΠ» (1) Π²Π²Π΅Ρ€Ρ…Ρƒ, Π° Π½ΠΈΠΆΠ½ΠΈΠΉ ΠΊΠΎΠ»ΠΎΠ½Ρ‚ΠΈΡ‚ΡƒΠ» (2) Π²Π½ΠΈΠ·Ρƒ.ΠšΡ€ΠΎΠΌΠ΅ Ρ‚ΠΎΠ³ΠΎ, основноС содСрТаниС (A) ΠΈΠΌΠ΅Π΅Ρ‚ наибольшСС Π·Π½Π°Ρ‡Π΅Π½ΠΈΠ΅, поэтому Π²Ρ‹Π΄Π΅Π»ΠΈΡ‚Π΅ Π΅ΠΌΡƒ Π±ΠΎΠ»ΡŒΡˆΡƒΡŽ Ρ‡Π°ΡΡ‚ΡŒ мСста.

Π­Ρ‚ΠΎ эмпиричСскиС ΠΏΡ€Π°Π²ΠΈΠ»Π°, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ. ΠšΠΎΠ½Π΅Ρ‡Π½ΠΎ, Π±Ρ‹Π²Π°ΡŽΡ‚ слоТныС конструкции ΠΈ ΠΈΡΠΊΠ»ΡŽΡ‡Π΅Π½ΠΈΡ. Π’ Π΄Ρ€ΡƒΠ³ΠΈΡ… ΡΡ‚Π°Ρ‚ΡŒΡΡ… ΠΌΡ‹ обсудим, ΠΊΠ°ΠΊ ΡΠΎΠ·Π΄Π°Π²Π°Ρ‚ΡŒ Π°Π΄Π°ΠΏΡ‚ΠΈΠ²Π½Ρ‹Π΅ сайты (сайты, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ ΠΌΠ΅Π½ΡΡŽΡ‚ΡΡ Π² зависимости ΠΎΡ‚ Ρ€Π°Π·ΠΌΠ΅Ρ€Π° экрана) ΠΈ сайты, ΠΌΠ°ΠΊΠ΅Ρ‚Ρ‹ ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Ρ… Ρ€Π°Π·Π»ΠΈΡ‡Π°ΡŽΡ‚ΡΡ ΠΌΠ΅ΠΆΠ΄Ρƒ страницами. На Π΄Π°Π½Π½Ρ‹ΠΉ ΠΌΠΎΠΌΠ΅Π½Ρ‚ Π»ΡƒΡ‡ΡˆΠ΅ всСго ΠΏΠΎΠ΄Π΄Π΅Ρ€ΠΆΠΈΠ²Π°Ρ‚ΡŒ Π΅Π΄ΠΈΠ½ΠΎΠΎΠ±Ρ€Π°Π·ΠΈΠ΅ ΠΌΠ°ΠΊΠ΅Ρ‚Π° Π½Π° всСм сайтС.

Рассмотрим Π΅Ρ‰Π΅ нСсколько ΠΊΠΎΠ½ΠΊΡ€Π΅Ρ‚Π½Ρ‹Ρ… ΠΏΡ€ΠΈΠΌΠ΅Ρ€ΠΎΠ², взятых с извСстных сайтов.

ΠžΠ΄Π½ΠΎΠΊΠΎΠ»ΠΎΠ½ΠΎΡ‡Π½Π°Ρ вСрстка

ΠŸΡ€ΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅ Invision .Π’ΠΈΠΏΠΈΡ‡Π½Ρ‹ΠΉ ΠΎΠ΄Π½ΠΎΠΊΠΎΠ»ΠΎΠ½ΠΎΡ‡Π½Ρ‹ΠΉ ΠΌΠ°ΠΊΠ΅Ρ‚, ΠΎΡ‚ΠΎΠ±Ρ€Π°ΠΆΠ°ΡŽΡ‰ΠΈΠΉ всю ΠΈΠ½Ρ„ΠΎΡ€ΠΌΠ°Ρ†ΠΈΡŽ Π»ΠΈΠ½Π΅ΠΉΠ½ΠΎ Π½Π° ΠΎΠ΄Π½ΠΎΠΉ страницС.

Π”ΠΎΠ²ΠΎΠ»ΡŒΠ½ΠΎ просто. ΠŸΡ€ΠΎΡΡ‚ΠΎ ΠΏΠΎΠΌΠ½ΠΈΡ‚Π΅, Ρ‡Ρ‚ΠΎ ΠΌΠ½ΠΎΠ³ΠΈΠ΅ люди ΠΏΠΎ-ΠΏΡ€Π΅ΠΆΠ½Π΅ΠΌΡƒ Π±ΡƒΠ΄ΡƒΡ‚ ΠΏΡ€ΠΎΡΠΌΠ°Ρ‚Ρ€ΠΈΠ²Π°Ρ‚ΡŒ ваш сайт с Π½Π°ΡΡ‚ΠΎΠ»ΡŒΠ½Ρ‹Ρ… ΠΊΠΎΠΌΠΏΡŒΡŽΡ‚Π΅Ρ€ΠΎΠ², поэтому сдСлайтС свой ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚ ΠΏΡ€ΠΈΠ³ΠΎΠ΄Π½Ρ‹ΠΌ для использования / чтСния ΠΈ Ρ‚Π°ΠΌ.

Двухколонная ΠΊΠΎΠΌΠΏΠΎΠ½ΠΎΠ²ΠΊΠ°.

Abduzeedo , простой ΠΌΠ°ΠΊΠ΅Ρ‚ Π±Π»ΠΎΠ³Π°. Π’ Π±Π»ΠΎΠ³Π°Ρ… ΠΎΠ±Ρ‹Ρ‡Π½ΠΎ Π΅ΡΡ‚ΡŒ Π΄Π²Π° столбца: толстый для основного ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚Π° ΠΈ Ρ‚ΠΎΠ½ΠΊΠΈΠΉ для ΠΏΠΎΠ±ΠΎΡ‡Π½ΠΎΠ³ΠΎ ΠΌΠ°Ρ‚Π΅Ρ€ΠΈΠ°Π»Π° (Π½Π°ΠΏΡ€ΠΈΠΌΠ΅Ρ€, Π²ΠΈΠ΄ΠΆΠ΅Ρ‚ΠΎΠ², Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡ‚Π΅Π»ΡŒΠ½Ρ‹Ρ… ΡƒΡ€ΠΎΠ²Π½Π΅ΠΉ Π½Π°Π²ΠΈΠ³Π°Ρ†ΠΈΠΈ ΠΈ Ρ€Π΅ΠΊΠ»Π°ΠΌΡ‹).

Π’ этом ΠΏΡ€ΠΈΠΌΠ΅Ρ€Π΅ посмотритС Π½Π° ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ (B1) прямо ΠΏΠΎΠ΄ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠΎΠΌ. Он связан с основным ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚ΠΎΠΌ, Π½ΠΎ основной ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚ ΠΈΠΌΠ΅Π΅Ρ‚ смысл ΠΈ Π±Π΅Π· Π½Π΅Π³ΠΎ, поэтому Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ Ρ€Π°ΡΡΠΌΠ°Ρ‚Ρ€ΠΈΠ²Π°Ρ‚ΡŒ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ Π»ΠΈΠ±ΠΎ ΠΊΠ°ΠΊ основноС, Π»ΠΈΠ±ΠΎ ΠΊΠ°ΠΊ ΠΏΠΎΠ±ΠΎΡ‡Π½ΠΎΠ΅ содСрТимоС. На самом Π΄Π΅Π»Π΅ это Π½Π΅ ΠΈΠΌΠ΅Π΅Ρ‚ значСния. Π’Π°ΠΆΠ½ΠΎ Ρ‚ΠΎ, Ρ‡Ρ‚ΠΎ Ссли Π²Ρ‹ помСститС Ρ‡Ρ‚ΠΎ-Ρ‚ΠΎ прямо ΠΏΠΎΠ΄ Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ, это Π΄ΠΎΠ»ΠΆΠ½ΠΎ Π±Ρ‹Ρ‚ΡŒ Π»ΠΈΠ±ΠΎ основноС содСрТимоС, Π»ΠΈΠ±ΠΎ , нСпосрСдствСнно связанноС с основным содСрТимым.

Π­Ρ‚ΠΎ Π»ΠΎΠ²ΡƒΡˆΠΊΠ°

MICA . Π­Ρ‚ΠΎ Π½Π΅ΠΌΠ½ΠΎΠ³ΠΎ слоТнСС.ΠŸΠΎΡ…ΠΎΠΆΠ΅ Π½Π° Ρ‚Ρ€Π΅Ρ…ΠΊΠΎΠ»ΠΎΠ½ΠΎΡ‡Π½ΡƒΡŽ раскладку …

… Π½ΠΎ это Π½Π΅ Ρ‚Π°ΠΊ. B1 ΠΈ B2 ΠΏΠ»Π°Π²Π°ΡŽΡ‚ Π²ΠΎΠΊΡ€ΡƒΠ³ основного ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚Π°. Π—Π°ΠΏΠΎΠΌΠ½ΠΈΡ‚Π΅ слово Β«floatΒ» β€” ΠΎΠ½ΠΎ станСт сигналом, ΠΊΠΎΠ³Π΄Π° Π²Ρ‹ Π½Π°Ρ‡Π½Π΅Ρ‚Π΅ ΠΈΠ·ΡƒΡ‡Π°Ρ‚ΡŒ CSS.

ΠŸΠΎΡ‡Π΅ΠΌΡƒ Π²Ρ‹ Π΄ΡƒΠΌΠ°Π΅Ρ‚Π΅, Ρ‡Ρ‚ΠΎ это ΠΌΠ°ΠΊΠ΅Ρ‚ ΠΈΠ· Ρ‚Ρ€Π΅Ρ… столбцов? ΠŸΠΎΡ‚ΠΎΠΌΡƒ Ρ‡Ρ‚ΠΎ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ Π² ΠΏΡ€Π°Π²ΠΎΠΌ Π²Π΅Ρ€Ρ…Π½Π΅ΠΌ ΡƒΠ³Π»Ρƒ ΠΈΠΌΠ΅Π΅Ρ‚ L-ΠΎΠ±Ρ€Π°Π·Π½ΡƒΡŽ Ρ„ΠΎΡ€ΠΌΡƒ, ΠΏΠΎΡ‚ΠΎΠΌΡƒ Ρ‡Ρ‚ΠΎ B1 выглядит ΠΊΠ°ΠΊ столбСц, ΠΏΠΎΠ΄Π΄Π΅Ρ€ΠΆΠΈΠ²Π°ΡŽΡ‰ΠΈΠΉ смСщСнноС основноС содСрТаниС, ΠΈ ΠΏΠΎΡ‚ΠΎΠΌΡƒ, Ρ‡Ρ‚ΠΎ Β«MΒ» ΠΈ Β«IΒ» Π»ΠΎΠ³ΠΎΡ‚ΠΈΠΏΠ° MICA ΡΠΎΠ·Π΄Π°ΡŽΡ‚ Π²Π΅Ρ€Ρ‚ΠΈΠΊΠ°Π»ΡŒΠ½ΡƒΡŽ ΡΠΈΠ»ΠΎΠ²ΡƒΡŽ линию.

Π­Ρ‚ΠΎ Ρ…ΠΎΡ€ΠΎΡˆΠΈΠΉ ΠΏΡ€ΠΈΠΌΠ΅Ρ€ классичСского ΠΌΠ°ΠΊΠ΅Ρ‚Π°, ΠΏΠΎΠ΄Π΄Π΅Ρ€ΠΆΠΈΠ²Π°ΡŽΡ‰Π΅Π³ΠΎ творчСский ΠΏΠΎΠ΄Ρ…ΠΎΠ΄ ΠΊ Π΄ΠΈΠ·Π°ΠΉΠ½Ρƒ.ΠŸΡ€ΠΎΡΡ‚Ρ‹Π΅ ΠΌΠ°ΠΊΠ΅Ρ‚Ρ‹ ΠΏΡ€ΠΎΡ‰Π΅ Ρ€Π΅Π°Π»ΠΈΠ·ΠΎΠ²Π°Ρ‚ΡŒ, Π½ΠΎ ΠΏΠΎΠ·Π²ΠΎΠ»ΡŒΡ‚Π΅ сСбС ΠΏΡ€ΠΎΡΠ²ΠΈΡ‚ΡŒ свои творчСскиС способности Π² этой области.

Π‘ΠΎΠ»Π΅Π΅ слоТная ΠΏΠ»Π°Π½ΠΈΡ€ΠΎΠ²ΠΊΠ°

ΠŸΠ°Ρ€ΠΈΠΆΡΠΊΠ°Ρ ΠΎΠΏΠ΅Ρ€Π°.

Π’ основном Π΄Π²ΡƒΡ…ΠΊΠΎΠ»ΠΎΠ½ΠΎΡ‡Π½Ρ‹ΠΉ ΠΌΠ°ΠΊΠ΅Ρ‚, Π½ΠΎ Π²Ρ‹ Π·Π°ΠΌΠ΅Ρ‚ΠΈΡ‚Π΅ ΠΌΠ½ΠΎΠ³ΠΎ хитростСй здСсь ΠΈ Ρ‚Π°ΠΌ, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ Π²ΠΈΠ·ΡƒΠ°Π»ΡŒΠ½ΠΎ Ρ€Π°Π·Π±ΠΈΠ²Π°ΡŽΡ‚ ΠΌΠ°ΠΊΠ΅Ρ‚. Π’ частности, Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ ΠΏΠ΅Ρ€Π΅ΠΊΡ€Ρ‹Π²Π°Π΅Ρ‚ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠ΅ основного ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚Π°. Π’ΠΎ, ΠΊΠ°ΠΊ кривая мСню Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ° связана с ΠΊΡ€ΠΈΠ²ΠΎΠΉ Π²Π½ΠΈΠ·Ρƒ изобраТСния, Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΎΠΊ ΠΈ основноС содСрТимоС выглядят ΠΊΠ°ΠΊ ΠΎΠ΄Π½ΠΎ, хотя тСхничСски ΠΎΠ½ΠΈ ΡΠΎΠ²Π΅Ρ€ΡˆΠ΅Π½Π½ΠΎ Ρ€Π°Π·Π½Ρ‹Π΅.ΠŸΡ€ΠΈΠΌΠ΅Ρ€ Opera выглядит Π±ΠΎΠ»Π΅Π΅ слоТным, Ρ‡Π΅ΠΌ ΠΏΡ€ΠΈΠΌΠ΅Ρ€ MICA, Π½ΠΎ Π½Π° самом Π΄Π΅Π»Π΅ Π΅Π³ΠΎ ΠΏΡ€ΠΎΡ‰Π΅ Ρ€Π΅Π°Π»ΠΈΠ·ΠΎΠ²Π°Ρ‚ΡŒ (Ρ…ΠΎΡ€ΠΎΡˆΠΎ, Β«Π»Π΅Π³ΠΊΠΈΠΉΒ» β€” это ΠΎΡ‚Π½ΠΎΡΠΈΡ‚Π΅Π»ΡŒΠ½Π°Ρ концСпция).

Как Π²ΠΈΠ΄ΠΈΡ‚Π΅, Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΡΠΎΠ·Π΄Π°Π²Π°Ρ‚ΡŒ ΠΏΠΎΡ‚Ρ€ΡΡΠ°ΡŽΡ‰ΠΈΠ΅ Π²Π΅Π±-сайты Π΄Π°ΠΆΠ΅ с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ простых ΠΌΠ°ΠΊΠ΅Ρ‚ΠΎΠ². ΠŸΠΎΡΠΌΠΎΡ‚Ρ€ΠΈΡ‚Π΅ Π½Π° свои Π»ΡŽΠ±ΠΈΠΌΡ‹Π΅ Π²Π΅Π±-сайты ΠΈ спроситС сСбя, Π³Π΄Π΅ Π²Π΅Ρ€Ρ…Π½ΠΈΠΉ, Π½ΠΈΠΆΠ½ΠΈΠΉ ΠΊΠΎΠ»ΠΎΠ½Ρ‚ΠΈΡ‚ΡƒΠ»Ρ‹, основноС ΠΈ ΠΏΠΎΠ±ΠΎΡ‡Π½ΠΎΠ΅ содСрТимоС? Π­Ρ‚ΠΎ Π²Π΄ΠΎΡ…Π½ΠΎΠ²ΠΈΡ‚ вас Π½Π° созданиС собствСнного Π΄ΠΈΠ·Π°ΠΉΠ½Π° ΠΈ подскаТСт, ΠΊΠ°ΠΊΠΈΠ΅ конструкции Ρ€Π°Π±ΠΎΡ‚Π°ΡŽΡ‚, Π° ΠΊΠ°ΠΊΠΈΠ΅ Π½Π΅Ρ‚.

ΠŸΡ€ΠΈΠΌΠ΅Π½Π΅Π½ΠΈΠ΅ ΠΌΠ°ΠΊΠ΅Ρ‚Π° слайда β€” слуТба ΠΏΠΎΠ΄Π΄Π΅Ρ€ΠΆΠΊΠΈ Office

УпорядочивайтС содСрТимоС слайдов с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ Ρ€Π°Π·Π»ΠΈΡ‡Π½Ρ‹Ρ… ΠΌΠ°ΠΊΠ΅Ρ‚ΠΎΠ² слайдов Π² соотвСтствии со своим вкусом ΠΈ прСдпочтСниями ΠΈΠ»ΠΈ для ΠΏΠΎΠ²Ρ‹ΡˆΠ΅Π½ΠΈΡ чСткости ΠΈ читаСмости содСрТимого.

  1. Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ слайд, для ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠ³ΠΎ Π½ΡƒΠΆΠ½ΠΎ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚ΡŒ ΠΌΠ°ΠΊΠ΅Ρ‚.

  2. Π’Ρ‹Π±Ρ€Π°Ρ‚ΡŒ Π”ΠΎΠΌ > ΠœΠ°ΠΊΠ΅Ρ‚ .

  3. Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ Π½ΡƒΠΆΠ½Ρ‹ΠΉ ΠΌΠ°ΠΊΠ΅Ρ‚.

    ΠœΠ°ΠΊΠ΅Ρ‚Ρ‹ содСрТат Π·Π°ΠΏΠΎΠ»Π½ΠΈΡ‚Π΅Π»ΠΈ для тСкста, Π²ΠΈΠ΄Π΅ΠΎ, ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠΉ, Π΄ΠΈΠ°Π³Ρ€Π°ΠΌΠΌ, Ρ„ΠΈΠ³ΡƒΡ€, ΠΊΠ°Ρ€Ρ‚ΠΈΠ½ΠΎΠΊ, Ρ„ΠΎΠ½Π° ΠΈ ΠΌΠ½ΠΎΠ³ΠΎΠ³ΠΎ Π΄Ρ€ΡƒΠ³ΠΎΠ³ΠΎ.ΠœΠ°ΠΊΠ΅Ρ‚Ρ‹ Ρ‚Π°ΠΊΠΆΠ΅ содСрТат Ρ„ΠΎΡ€ΠΌΠ°Ρ‚ΠΈΡ€ΠΎΠ²Π°Π½ΠΈΠ΅ для этих ΠΎΠ±ΡŠΠ΅ΠΊΡ‚ΠΎΠ², Π½Π°ΠΏΡ€ΠΈΠΌΠ΅Ρ€ Ρ†Π²Π΅Ρ‚Π° Ρ‚Π΅ΠΌΡ‹, ΡˆΡ€ΠΈΡ„Ρ‚Ρ‹ ΠΈ эффСкты.

    ΠŸΡ€ΠΈΠΌΠ΅Ρ‡Π°Π½ΠΈΠ΅: Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ Π”ΠΎΠΌΠ°ΡˆΠ½ΠΈΠΉ > Π‘Π±Ρ€ΠΎΡΡŒΡ‚Π΅ , Ссли Π²Ρ‹ внСсли измСнСния ΠΌΠ°ΠΊΠ΅Ρ‚Π°, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ Π²Π°ΠΌ Π½Π΅ нравятся, ΠΈ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ Π²Π΅Ρ€Π½ΡƒΡ‚ΡŒΡΡ ΠΊ исходному ΠΌΠ°ΠΊΠ΅Ρ‚Ρƒ. ИспользованиС Reset Π½Π΅ удаляСт ΠΊΠ°ΠΊΠΎΠΉ-Π»ΠΈΠ±ΠΎ ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ Π²Ρ‹ Π΄ΠΎΠ±Π°Π²ΠΈΠ»ΠΈ.

Π˜Π·ΠΌΠ΅Π½ΠΈΡ‚Π΅ ΠΎΡ€ΠΈΠ΅Π½Ρ‚Π°Ρ†ΠΈΡŽ

слайдов

Π’ ΠΎΡ‚Π΄Π΅Π»ΡŒΠ½ΠΎΠΉ ΡΡ‚Π°Ρ‚ΡŒΠ΅ справки описано, ΠΊΠ°ΠΊ ΠΏΠ΅Ρ€Π΅ΠΊΠ»ΡŽΡ‡Π°Ρ‚ΡŒΡΡ ΠΌΠ΅ΠΆΠ΄Ρƒ ΠΊΠ½ΠΈΠΆΠ½ΠΎΠΉ ΠΈ альбомной ΠΎΡ€ΠΈΠ΅Π½Ρ‚Π°Ρ†ΠΈΠ΅ΠΉ:

ΠΏΠ΅ΠΉΠ·Π°ΠΆ
ΠΏΠΎΡ€Ρ‚Ρ€Π΅Ρ‚

Π‘ΠΌ. Π’Π°ΠΊΠΆΠ΅

ΠšΠ°ΠΆΠ΄Ρ‹ΠΉ ΠΌΠ°ΠΊΠ΅Ρ‚ слайда содСрТит Π·Π°ΠΏΠΎΠ»Π½ΠΈΡ‚Π΅Π»ΠΈ для тСкста, ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠΉ, Π΄ΠΈΠ°Π³Ρ€Π°ΠΌΠΌ, Ρ„ΠΈΠ³ΡƒΡ€ ΠΈ ΠΌΠ½ΠΎΠ³ΠΎΠ³ΠΎ Π΄Ρ€ΡƒΠ³ΠΎΠ³ΠΎ.Когда Π²Ρ‹ Ρ€Π°Π·ΠΌΠ΅Ρ‰Π°Π΅Ρ‚Π΅ ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚ Π½Π° своих слайдах, Π²Ρ‹Π±ΠΎΡ€ ΠΌΠ°ΠΊΠ΅Ρ‚Π° слайда, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ Π»ΡƒΡ‡ΡˆΠ΅ всСго ΠΏΠΎΠ΄Ρ…ΠΎΠ΄ΠΈΡ‚ для вашСго ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚Π°, Π΄Π°Π΅Ρ‚ Π²Π°ΠΌ Ρ„ΠΎΡ€Ρƒ.

Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ ΠΌΠ°ΠΊΠ΅Ρ‚ ΠΏΡ€ΠΈ Π΄ΠΎΠ±Π°Π²Π»Π΅Π½ΠΈΠΈ Π½ΠΎΠ²ΠΎΠ³ΠΎ слайда:

  1. На Π²ΠΊΠ»Π°Π΄ΠΊΠ΅ Home Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ New Slide .

  2. Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ ΠΌΠ°ΠΊΠ΅Ρ‚ для Π½ΠΎΠ²ΠΎΠ³ΠΎ слайда ΠΈ Π½Π°ΠΆΠΌΠΈΡ‚Π΅ Π”ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ слайд .

Π˜Π·ΠΌΠ΅Π½ΠΈΡ‚ΡŒ ΠΌΠ°ΠΊΠ΅Ρ‚ ΡΡƒΡ‰Π΅ΡΡ‚Π²ΡƒΡŽΡ‰Π΅Π³ΠΎ слайда:

  1. На Π²ΠΊΠ»Π°Π΄ΠΊΠ΅ Π”ΠΎΠΌΠ°ΡˆΠ½ΡΡ страница Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ ΠœΠ°ΠΊΠ΅Ρ‚ .

  2. Π’Ρ‹Π±Π΅Ρ€ΠΈΡ‚Π΅ ΠΌΠ°ΠΊΠ΅Ρ‚, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ Π»ΡƒΡ‡ΡˆΠ΅ соотвСтствуСт содСрТимому слайда, ΠΈ Π½Π°ΠΆΠΌΠΈΡ‚Π΅ Π˜Π·ΠΌΠ΅Π½ΠΈΡ‚ΡŒ ΠΌΠ°ΠΊΠ΅Ρ‚ .

Π˜Π·ΠΌΠ΅Π½ΠΈΡ‚Π΅ ΠΎΡ€ΠΈΠ΅Π½Ρ‚Π°Ρ†ΠΈΡŽ

слайдов

ΠΏΠ΅ΠΉΠ·Π°ΠΆ
ΠΏΠΎΡ€Ρ‚Ρ€Π΅Ρ‚

Design Better Layouts β€” 6 ΠΏΡ€ΠΎΡ„Π΅ΡΡΠΈΠΎΠ½Π°Π»ΡŒΠ½Ρ‹Ρ… совСтов ΠΏΠΎ Π΄ΠΈΠ·Π°ΠΉΠ½Ρƒ ΠΌΠ°ΠΊΠ΅Ρ‚Π° β”‚Blurb Blog

Если Π²Ρ‹ Π½ΠΎΠ²ΠΈΡ‡ΠΎΠΊ Π² Π΄ΠΈΠ·Π°ΠΉΠ½Π΅, рСкомСндуСтся Π½Π°Ρ‡Π°Ρ‚ΡŒ с основ.

ΠœΠ°ΠΊΠ΅Ρ‚ β€” это способ располоТСния тСкста ΠΈ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠΉ. Когда эти элСмСнты ΠΎΠ±ΡŠΠ΅Π΄ΠΈΠ½Π΅Π½Ρ‹ эффСктивно, Π·Π°ΠΏΠΎΠΌΠΈΠ½Π°Π΅ΠΌΠΎΡΡ‚ΡŒ вашСго ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚Π°, Π΅Π³ΠΎ Π²ΠΈΠ·ΡƒΠ°Π»ΡŒΠ½ΠΎΠ΅ воздСйствиС ΠΈ впСчатлСния зритСля возрастут Π² гСомСтричСской прогрСссии. Π’Π°ΠΊΠΈΠ΅ срСдства массовой ΠΈΠ½Ρ„ΠΎΡ€ΠΌΠ°Ρ†ΠΈΠΈ, ΠΊΠ°ΠΊ ΠΊΠ½ΠΈΠ³ΠΈ, Π²Π΅Π±-сайты, Ρ€Π΅ΠΊΠ»Π°ΠΌΠ° ΠΈ стСны ΠΌΡƒΠ·Π΅Π΅Π², ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽΡ‚ ΠΌΠ°ΠΊΠ΅Ρ‚ Π² Ρ€Π°Π·Π½Ρ‹Ρ… Ρ„ΠΎΡ€ΠΌΠ°Ρ….

Π§Ρ‚ΠΎΠ±Ρ‹ ΠΏΠΎΠ½ΡΡ‚ΡŒ Ρ€Π°Π·Π»ΠΈΡ‡Π½Ρ‹Π΅ эффСкты Ρ€Π°Π·Π»ΠΈΡ‡Π½Ρ‹Ρ… ΠΌΠ°ΠΊΠ΅Ρ‚ΠΎΠ², Π²Π°ΠΆΠ½ΠΎ Π·Π½Π°Ρ‚ΡŒ ΡƒΠ½ΠΈΠ²Π΅Ρ€ΡΠ°Π»ΡŒΠ½Ρ‹Π΅ ΠΏΡ€ΠΈΠ½Ρ†ΠΈΠΏΡ‹ Π΄ΠΈΠ·Π°ΠΉΠ½Π°, Π° Ρ‚Π°ΠΊΠΆΠ΅ свою ΡΠΎΠ±ΡΡ‚Π²Π΅Π½Π½ΡƒΡŽ Π»ΠΈΡ‡Π½ΡƒΡŽ Ρ„ΠΈΠ»ΠΎΡΠΎΡ„ΠΈΡŽ, ΠΎΠΊΡ€ΡƒΠΆΠ°ΡŽΡ‰ΡƒΡŽ Π΅Π³ΠΎ.Π― надСюсь, Ρ‡Ρ‚ΠΎ эти совСты Π΄Π°Π΄ΡƒΡ‚ Π²Π°ΠΌ Π½Π΅ΠΎΠ±Ρ…ΠΎΠ΄ΠΈΠΌΡƒΡŽ основу для Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚ΠΊΠΈ вашСго собствСнного процСсса ΠΈ ΡΠ΄Π΅Π»Π°ΡŽΡ‚ ваши ΠΌΠ°ΠΊΠ΅Ρ‚Ρ‹ Π±ΠΎΠ»Π΅Π΅ ΡƒΡΠΏΠ΅ΡˆΠ½Ρ‹ΠΌΠΈ.

T ip # 1. ИсслСдования

ΠŸΡ€Π΅ΠΆΠ΄Π΅ Ρ‡Π΅ΠΌ ΠΏΡ€ΠΈΡΡ‚ΡƒΠΏΠΈΡ‚ΡŒ ΠΊ творчСскому ΠΏΡ€ΠΎΠ΅ΠΊΡ‚Ρƒ, Π²Π°ΠΆΠ½ΠΎ ΠΏΠΎΠ½ΡΡ‚ΡŒ своС мСсто Π² Π±ΠΎΠ»Π΅Π΅ ΡˆΠΈΡ€ΠΎΠΊΠΎΠΉ истории искусства ΠΈ Π΄ΠΈΠ·Π°ΠΉΠ½Π°. Никогда Π½Π΅ ΠΏΡ€Π΅ΠΊΡ€Π°Ρ‰Π°ΠΉΡ‚Π΅ ΠΈΡΡΠ»Π΅Π΄ΠΎΠ²Π°Ρ‚ΡŒ ΠΈ ΡƒΠ·Π½Π°Π²Π°Ρ‚ΡŒ ΠΎ Ρ€Π°Π·Π»ΠΈΡ‡Π½Ρ‹Ρ… стилях, двиТСниях ΠΈ эстСтикС β€” историчСских ΠΈ соврСмСнных. НапримСр, популярный минималистский ΡΡ‚ΠΈΠ»ΡŒ Π²Π΅Π±-Π΄ΠΈΠ·Π°ΠΉΠ½Π° β€” это ΡΠ²ΠΎΠ»ΡŽΡ†ΠΈΡ эстСтики, популяризированной Π½Π΅ΠΌΠ΅Ρ†ΠΊΠΈΠΌ Π΄Π²ΠΈΠΆΠ΅Π½ΠΈΠ΅ΠΌ Π² области искусства ΠΈ Π΄ΠΈΠ·Π°ΠΉΠ½Π° Π½Π°Ρ‡Π°Π»Π° 20-Π³ΠΎ Π²Π΅ΠΊΠ°, извСстным ΠΊΠ°ΠΊ Баухаус.

ΠžΠΏΠΈΡ€Π°ΡΡΡŒ Π½Π° собствСнноС ΠΎΠ±Ρ€Π°Π·ΠΎΠ²Π°Π½ΠΈΠ΅ ΠΈ обращая Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅ Π½Π° Ρ‚ΠΎ, Ρ‡Ρ‚ΠΎ Π³ΠΎΠ²ΠΎΡ€ΠΈΡ‚ Π²Π°ΠΌ Π»ΠΈΡ‡Π½ΠΎ, Π²Ρ‹ смоТСтС Ρ€Π°Π·Π²ΠΈΡ‚ΡŒ ΡƒΠ½ΠΈΠΊΠ°Π»ΡŒΠ½Ρ‹ΠΉ, Π½ΠΎ Π°ΠΊΡ‚ΡƒΠ°Π»ΡŒΠ½Ρ‹ΠΉ голос, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ ΠΏΠΎΠ·Π²ΠΎΠ»ΠΈΡ‚ Π²Π°ΠΌ ΡΡΡ‹Π»Π°Ρ‚ΡŒΡΡ (Π½Π΅ копируя) Π½Π° Ρ€Π°Π±ΠΎΡ‚Ρƒ, ΠΊΠΎΡ‚ΠΎΡ€ΠΎΠΉ Π²Ρ‹ большС всСго Π²ΠΎΡΡ…ΠΈΡ‰Π°Π΅Ρ‚Π΅ΡΡŒ.

Начиная Π½ΠΎΠ²Ρ‹ΠΉ ΠΏΡ€ΠΎΠ΅ΠΊΡ‚, Π²Π΅Ρ€Π½ΠΈΡ‚Π΅ΡΡŒ ΠΊ созданным Π²Π°ΠΌΠΈ доскам настроСния ΠΈ изобраТСниям, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ Π²Ρ‹ сохранили с Ρ‚Π΅Ρ‡Π΅Π½ΠΈΠ΅ΠΌ Π²Ρ€Π΅ΠΌΠ΅Π½ΠΈ. Если Ρƒ вас Π½Π΅Ρ‚ доски настроСния, которая каТСтся Ρ€Π΅Π»Π΅Π²Π°Π½Ρ‚Π½ΠΎΠΉ Π²Π°ΡˆΠ΅ΠΌΡƒ Ρ‚Π΅ΠΊΡƒΡ‰Π΅ΠΌΡƒ ΠΏΡ€ΠΎΠ΅ΠΊΡ‚Ρƒ, создайтС Π½ΠΎΠ²ΡƒΡŽ ΠΈ Π½Π°ΠΉΠ΄ΠΈΡ‚Π΅ врСмя, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΏΠΎΠ½ΡΡ‚ΡŒ ΠΈΡΡ‚ΠΎΡ€ΠΈΡ‡Π΅ΡΠΊΡƒΡŽ Π·Π½Π°Ρ‡ΠΈΠΌΠΎΡΡ‚ΡŒ этого направлСния.

НаконСчник β„–2. Π‘ΠΎΠ΄Π΅Ρ€ΠΆΠ°Π½ΠΈΠ΅ ΠΈ концСпция

Π‘Π°ΠΌΡ‹ΠΌ Π²Π°ΠΆΠ½Ρ‹ΠΌ шагом ΠΏΡ€ΠΈ ΠΏΡ€ΠΎΠ΅ΠΊΡ‚ΠΈΡ€ΠΎΠ²Π°Π½ΠΈΠΈ ΠΊΠΎΠΌΠΏΠΎΠ½ΠΎΠ²ΠΊΠΈ являСтся Π²Ρ‹Π±ΠΎΡ€ Π΄ΠΈΠ·Π°ΠΉΠ½Π° ΠšΠΎΠ½Ρ†Π΅ΠΏΡ†ΠΈΡ .

ПослС просмотра содСрТания Π·Π°Π΄Π°ΠΉΡ‚Π΅ сСбС ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΠΈΠ΅ вопросы:

ΠšΡ‚ΠΎ ваша аудитория?

Какой вашС сообщСниС?

ΠŸΠΎΡ‡Π΅ΠΌΡƒ Π²Π°ΠΆΠ½Π° для вашСго сообщСния?

Как я Ρ…ΠΎΡ‡Ρƒ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ чувствовал Π·Ρ€ΠΈΡ‚Π΅Π»ΡŒ?

ΠžΡ‚Π²Π΅Ρ‚ΠΈΠ² Π½Π° эти вопросы, ΠΏΠΎΠ΄ΡƒΠΌΠ°ΠΉΡ‚Π΅ ΠΎ Π»ΡŽΠ±Ρ‹Ρ… Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡ‚Π΅Π»ΡŒΠ½Ρ‹Ρ… ΠΏΠ°Ρ€Π°ΠΌΠ΅Ρ‚Ρ€Π°Ρ… ΠΈ ΠΎ Ρ‚ΠΎΠΌ, считаСтС Π»ΠΈ Π²Ρ‹, Ρ‡Ρ‚ΠΎ ваш ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚ Π»ΡƒΡ‡ΡˆΠ΅ всСго пСрСдаСтся с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ Ρ‚Ρ€Π°Π΄ΠΈΡ†ΠΈΠΎΠ½Π½Ρ‹Ρ… ΠΈΠ»ΠΈ Π½Π΅Ρ‚Ρ€Π°Π΄ΠΈΡ†ΠΈΠΎΠ½Π½Ρ‹Ρ… ΠΌΠ΅Ρ‚ΠΎΠ΄ΠΎΠ².НапримСр, Π²Ρ‹ Ρ€Π°Π·Ρ€Π°Π±Π°Ρ‚Ρ‹Π²Π°Π΅Ρ‚Π΅ ΠΌΠ°ΠΊΠ΅Ρ‚ для мСдицинской Π±Ρ€ΠΎΡˆΡŽΡ€Ρ‹ для Π±ΠΎΠ»ΡŒΠ½ΠΈΡ†Ρ‹ ΠΈΠ»ΠΈ вставку для альбома для ΠΏΠ°Π½ΠΊ-Π³Ρ€ΡƒΠΏΠΏΡ‹?

Π Π°Π·Π½Ρ‹Π΅ ΠΏΡ€ΠΎΠ΅ΠΊΡ‚Ρ‹ Ρ‚Ρ€Π΅Π±ΡƒΡŽΡ‚ ΡΠΎΠ²Π΅Ρ€ΡˆΠ΅Π½Π½ΠΎ Ρ€Π°Π·Π½Ρ‹Ρ… ΠΏΠΎΠ΄Ρ…ΠΎΠ΄ΠΎΠ². Π’Π°ΠΌ Ρ€Π΅ΡˆΠ°Ρ‚ΡŒ, ΠΊΠ°ΠΊ Π»ΡƒΡ‡ΡˆΠ΅ всСго донСсти своС сообщСниС Π΄ΠΎ Π°ΡƒΠ΄ΠΈΡ‚ΠΎΡ€ΠΈΠΈ.

НаконСчник β„–3. Π˜Π΅Ρ€Π°Ρ€Ρ…ΠΈΡ

Π’ Ρ€Π΅ΠΊΠ»Π°ΠΌΠ½ΠΎΠΉ индустрии часто говорят, Ρ‡Ρ‚ΠΎ ΠΏΠΎΡ‚Ρ€Π΅Π±ΠΈΡ‚Π΅Π»ΠΈ Ρ€Π΅ΡˆΠ°ΡŽΡ‚, заинтСрСсованы Π»ΠΈ ΠΎΠ½ΠΈ Π² ΠΏΡ€ΠΎΠ΄ΡƒΠΊΡ‚Π΅, Π² Ρ‚Π΅Ρ‡Π΅Π½ΠΈΠ΅ Ρ‚Ρ€Π΅Ρ… сСкунд послС просмотра Ρ€Π΅ΠΊΠ»Π°ΠΌΡ‹. По этой ΠΏΡ€ΠΈΡ‡ΠΈΠ½Π΅ Π΄ΠΈΠ·Π°ΠΉΠ½ вашСго ΠΌΠ°ΠΊΠ΅Ρ‚Π° всСгда Π΄ΠΎΠ»ΠΆΠ΅Π½ Π² ΠΏΠ΅Ρ€Π²ΡƒΡŽ ΠΎΡ‡Π΅Ρ€Π΅Π΄ΡŒ ΠΏΠ΅Ρ€Π΅Π΄Π°Π²Π°Ρ‚ΡŒ самоС Π²Π°ΠΆΠ½ΠΎΠ΅.Π‘Ρ‚Ρ€ΡƒΠΊΡ‚ΡƒΡ€ΠΈΡ€ΠΎΠ²Π°Π½ΠΈΠ΅ тСкста ΠΈ ΠΈΠ·ΠΎΠ±Ρ€Π°ΠΆΠ΅Π½ΠΈΠΉ вашСго ΠΌΠ°ΠΊΠ΅Ρ‚Π° с ΡƒΡ‡Π΅Ρ‚ΠΎΠΌ этой ΠΈΠ΅Ρ€Π°Ρ€Ρ…ΠΈΠΈ прСдоставит Π²Π°ΠΌ Π½Π΅ΠΎΠ±Ρ…ΠΎΠ΄ΠΈΠΌΡ‹Π΅ ΠΏΠ°Ρ€Π°ΠΌΠ΅Ρ‚Ρ€Ρ‹ ΠΏΡ€ΠΈ рассмотрСнии Ρ„ΠΎΡ€ΠΌΠ°Ρ‚Π°, сСтки ΠΈ выравнивания.

Π”ΠΈΠ·Π°ΠΉΠ½ Π½ΠΈΠΊΠΎΠ³Π΄Π° Π½Π΅ Π΄ΠΎΠ»ΠΆΠ΅Π½ Π΄ΠΈΠΊΡ‚ΠΎΠ²Π°Ρ‚ΡŒ тСкстовыС элСмСнты, ΠΈ Π½Π°ΠΎΠ±ΠΎΡ€ΠΎΡ‚. Как Π΄ΠΈΠ·Π°ΠΉΠ½Π΅Ρ€, ваша Π·Π°Π΄Π°Ρ‡Π° β€” ΡƒΠ±Π΅Π΄ΠΈΡ‚ΡŒΡΡ, Ρ‡Ρ‚ΠΎ эти Π΄Π²Π° ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½Ρ‚Π° Ρ€Π°Π±ΠΎΡ‚Π°ΡŽΡ‚ вмСстС Π² Π³Π°Ρ€ΠΌΠΎΠ½ΠΈΠΈ ΠΈ Ρ‡Ρ‚ΠΎ вашС сообщСниС понято.

НаконСчник β„–4. Π€ΠΎΡ€ΠΌΠ°Ρ‚, сСтка ΠΈ Π²Ρ‹Ρ€Π°Π²Π½ΠΈΠ²Π°Π½ΠΈΠ΅

На этом этапС Ρ„ΠΎΡ€ΠΌΠ°Ρ‚, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ Π±ΡƒΠ΄Π΅Ρ‚ Π»ΡƒΡ‡ΡˆΠ΅ всСго Ρ€Π°Π±ΠΎΡ‚Π°Ρ‚ΡŒ с вашим Π²ΠΈΠ·ΡƒΠ°Π»ΡŒΠ½Ρ‹ΠΌ Π½Π°ΠΏΡ€Π°Π²Π»Π΅Π½ΠΈΠ΅ΠΌ, ΠΊΠΎΠ½Ρ†Π΅ΠΏΡ†ΠΈΠ΅ΠΉ ΠΈ установлСнной ΠΈΠ΅Ρ€Π°Ρ€Ρ…ΠΈΠ΅ΠΉ, Π΄ΠΎΠ»ΠΆΠ΅Π½ Π½Π°Ρ‡Π°Ρ‚ΡŒ Π·Π°ΠΊΡ€Π΅ΠΏΠ»ΡΡ‚ΡŒΡΡ.ΠžΡ‚ΡΡŽΠ΄Π° Π²Ρ‹ смоТСтС ΡƒΡΡ‚Π°Π½ΠΎΠ²ΠΈΡ‚ΡŒ ΠΏΡ€Π°Π²ΠΈΠ»ΡŒΠ½Ρ‹Π΅ Ρ€Π°Π·ΠΌΠ΅Ρ€Ρ‹ вашСго ΠΌΠ°ΠΊΠ΅Ρ‚Π° ΠΈ основы вашСй сСтки.

Π‘Π΅Ρ‚ΠΊΠ° ΠΏΠΎΠΌΠΎΠΆΠ΅Ρ‚ Π²Π°ΠΌ Ρ€Π°ΡΠΏΠΎΠ»ΠΎΠΆΠΈΡ‚ΡŒ элСмСнты Π½Π° основС ΠΎΠΏΡ€Π΅Π΄Π΅Π»Π΅Π½Π½ΠΎΠ³ΠΎ количСства столбцов ΠΈ строк. Π‘Π΅Ρ‚ΠΊΠΈ Π΄Π°ΡŽΡ‚ Π½Π°ΠΌ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡ‚ΡŒ Ρ‚ΠΎΡ‡Π½ΠΎ ΡΠΎΠ³Π»Π°ΡΠΎΠ²Ρ‹Π²Π°Ρ‚ΡŒ Π½Π°ΡˆΡƒ Ρ€Π°Π±ΠΎΡ‚Ρƒ ΠΈ ΡΠ²Π»ΡΡŽΡ‚ΡΡ Π½Π΅ΠΎΡ‚ΡŠΠ΅ΠΌΠ»Π΅ΠΌΠΎΠΉ Ρ‡Π°ΡΡ‚ΡŒΡŽ Ρ€Π°Π·Ρ€Π°Π±ΠΎΡ‚ΠΊΠΈ вашСго ΠΌΠ°ΠΊΠ΅Ρ‚Π°.

ΠŸΡ€ΠΈ рассмотрСнии выравнивания ΠΌΠ°ΠΊΠ΅Ρ‚Π° ΠΏΠΎΠΌΠ½ΠΈΡ‚Π΅ ΡΠ»Π΅Π΄ΡƒΡŽΡ‰ΠΈΠ΅ ΠΏΡ€ΠΈΠ½Ρ†ΠΈΠΏΡ‹:

  • Π—ΠΎΠ»ΠΎΡ‚ΠΎΠ΅ сСчСниС: ΡΠΏΠ΅Ρ†ΠΈΠ°Π»ΡŒΠ½ΠΎΠ΅ число, ΠΏΡ€ΠΈΠ±Π»ΠΈΠ·ΠΈΡ‚Π΅Π»ΡŒΠ½ΠΎ Ρ€Π°Π²Π½ΠΎΠ΅ 1.618, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ ΠΌΠ½ΠΎΠ³ΠΎ Ρ€Π°Π· встрСчаСтся Π² Π³Π΅ΠΎΠΌΠ΅Ρ‚Ρ€ΠΈΠΈ, искусствС, Π°Ρ€Ρ…ΠΈΡ‚Π΅ΠΊΡ‚ΡƒΡ€Π΅ ΠΈ Π΄Ρ€ΡƒΠ³ΠΈΡ… областях. Π•Π³ΠΎ ΠΌΠΎΠΆΠ½ΠΎ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ для создания приятных, СстСствСнно выглядящих ΠΊΠΎΠΌΠΏΠΎΠ·ΠΈΡ†ΠΈΠΉ Π² Π²Π°ΡˆΠΈΡ… дизайнСрских Ρ€Π°Π±ΠΎΡ‚Π°Ρ….
  • ΠžΡ‚ΠΊΠ»ΠΎΠ½Π΅Π½ΠΈΠ΅ ΠΎΡ‚ выравнивания ΠΈΠ»ΠΈ Β«Ρ€Π°Π·Ρ€Ρ‹Π² сСтки» (ΠΊΠΎΠ³Π΄Π° это ΡƒΠ»ΡƒΡ‡ΡˆΠ°Π΅Ρ‚ Π²Π°ΡˆΡƒ ΠΊΠΎΠ½Ρ†Π΅ΠΏΡ†ΠΈΡŽ)
  • Π’ΠΈΠΏΠΎΠ³Ρ€Π°Ρ„ΠΈΠΊΠ° (ΠΏΠΎΠ΄Ρ€ΠΎΠ±Π½Π΅Π΅ ΠΎΠ± этом Π΄Π°Π»Π΅Π΅)

Π‘ΠΎΠ²Π΅Ρ‚ β„– 5. Π’ΠΈΠΏΠΎΠ³Ρ€Π°Ρ„ΠΈΠΊΠ° ΠΈ сочСтаниС ΡˆΡ€ΠΈΡ„Ρ‚ΠΎΠ²

Π’Ρ‹Π±ΠΎΡ€ Π»ΡƒΡ‡ΡˆΠΈΡ… ΡˆΡ€ΠΈΡ„Ρ‚ΠΎΠ² для ΠΌΠ°ΠΊΠ΅Ρ‚Π° ΠΌΠΎΠΆΠ΅Ρ‚ ΠΎΠΊΠ°Π·Π°Ρ‚ΡŒΡΡ нСпростой Π·Π°Π΄Π°Ρ‡Π΅ΠΉ.Π’ΠΎ-ΠΏΠ΅Ρ€Π²Ρ‹Ρ…, ΠΏΠΎΡ‚ΠΎΠΌΡƒ Ρ‡Ρ‚ΠΎ сущСствуСт Ρ‚Π°ΠΊ ΠΌΠ½ΠΎΠ³ΠΎ Π²Π°Ρ€ΠΈΠ°Π½Ρ‚ΠΎΠ²; Π²ΠΎ-Π²Ρ‚ΠΎΡ€Ρ‹Ρ…, ΠΏΠΎΡ‚ΠΎΠΌΡƒ Ρ‡Ρ‚ΠΎ эстСтика Ρ‚ΠΈΠΏΠΎΠ³Ρ€Π°Ρ„ΠΈΠΊΠΈ ΡΡƒΠ±ΡŠΠ΅ΠΊΡ‚ΠΈΠ²Π½Π°. Π—Π΄Π΅ΡΡŒ Π²Π°ΠΌ пригодятся ваши знания ΠΎ Π³Π°Ρ€Π½ΠΈΡ‚ΡƒΡ€Π΅ ΠΈ истории Ρ€Π°Π·Π»ΠΈΡ‡Π½Ρ‹Ρ… ΡˆΡ€ΠΈΡ„Ρ‚ΠΎΠ². НапримСр, Ссли Π²Ρ‹ нСосознанно Π²Ρ‹Π±Π΅Ρ€Π΅Ρ‚Π΅ ΡˆΡ€ΠΈΡ„Ρ‚, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ Ρ€Π°Π½Π΅Π΅ использовался Π² популярной Ρ€Π΅ΠΊΠ»Π°ΠΌΠ½ΠΎΠΉ ΠΊΠ°ΠΌΠΏΠ°Π½ΠΈΠΈ, ΠΎΠ½ ΠΌΠΎΠΆΠ΅Ρ‚ ΠΈΠΌΠ΅Ρ‚ΡŒ Π½Π΅ΠΏΡ€Π΅Π΄Π½Π°ΠΌΠ΅Ρ€Π΅Π½Π½ΠΎΠ΅ Π·Π½Π°Ρ‡Π΅Π½ΠΈΠ΅ для вашСй Π°ΡƒΠ΄ΠΈΡ‚ΠΎΡ€ΠΈΠΈ.

ΠŸΡ€ΠΎΠ²Π΅Π΄ΠΈΡ‚Π΅ исслСдованиС ΠΈ Π²Π΅Ρ€Π½ΠΈΡ‚Π΅ΡΡŒ ΠΊ доску настроСния своСго ΠΏΡ€ΠΎΠ΅ΠΊΡ‚Π°, ΠΏΡ€Π΅ΠΆΠ΄Π΅ Ρ‡Π΅ΠΌ ΠΏΡ€ΠΈΠ½ΡΡ‚ΡŒ Ρ€Π΅ΡˆΠ΅Π½ΠΈΠ΅.

БущСствуСт Ρ‡Π΅Ρ‚Ρ‹Ρ€Π΅ основных Ρ‚ΠΈΠΏΠ° Ρ‚ΠΈΠΏΠΎΠ³Ρ€Π°Ρ„ΠΈΠΊΠΈ: Π±Π΅Π· засСчСк, засСчСк, Π΄Π΅ΠΊΠΎΡ€Π°Ρ‚ΠΈΠ²Π½Ρ‹ΠΉ ΠΈ ΡˆΡ€ΠΈΡ„Ρ‚.Π’ΠΎΡ‚ нСсколько основных ΠΌΠΎΠΌΠ΅Π½Ρ‚ΠΎΠ², ΠΎ ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Ρ… слСдуСт ΠΏΠΎΠΌΠ½ΠΈΡ‚ΡŒ, ΠΊΠΎΠ³Π΄Π° Π²Ρ‹ ΠΈΠ³Ρ€Π°Π΅Ρ‚Π΅ с Ρ€Π°Π·Π½Ρ‹ΠΌΠΈ сочСтаниями ΡˆΡ€ΠΈΡ„Ρ‚ΠΎΠ²:

  • T he Π§ΠΈΡ‚Π°Π΅ΠΌΠΎΡΡ‚ΡŒ ΡˆΡ€ΠΈΡ„Ρ‚Π° Π΄ΠΎΠ»ΠΆΠ½Π° ΠΈΠΌΠ΅Ρ‚ΡŒ ΠΏΡ€ΠΈΠΎΡ€ΠΈΡ‚Π΅Ρ‚ Π½Π°Π΄ эстСтикой. Π§Ρ‚ΠΎΠ±Ρ‹ ΠΎΠ±Π΅ΡΠΏΠ΅Ρ‡ΠΈΡ‚ΡŒ ΡƒΠ΄ΠΎΠ±ΠΎΡ‡ΠΈΡ‚Π°Π΅ΠΌΠΎΡΡ‚ΡŒ, ΡƒΡ‡ΠΈΡ‚Ρ‹Π²Π°ΠΉΡ‚Π΅ Π²Ρ‹Ρ€Π°Π²Π½ΠΈΠ²Π°Π½ΠΈΠ΅ тСкста, Π° Ρ‚Π°ΠΊΠΆΠ΅ ΠΈΠ½Ρ‚Π΅Ρ€Π»ΠΈΠ½ΡŒΡΠΆ ΠΈ ΠΊΠ΅Ρ€Π½ΠΈΠ½Π³ ΡˆΡ€ΠΈΡ„Ρ‚Π°. ΠΠ΅Π·Π½Π°Ρ‡ΠΈΡ‚Π΅Π»ΡŒΠ½Ρ‹Π΅ ΠΊΠΎΡ€Ρ€Π΅ΠΊΡ‚ΠΈΡ€ΠΎΠ²ΠΊΠΈ ΠΈΠ½Ρ‚Π΅Ρ€Π²Π°Π»ΠΎΠ² ΠΌΠΎΠ³ΡƒΡ‚ ΠΈΠΌΠ΅Ρ‚ΡŒ большоС Π·Π½Π°Ρ‡Π΅Π½ΠΈΠ΅.

  • Π‘ΠΎΠ·Π΄Π°ΠΉΡ‚Π΅ Π²ΠΈΠ·ΡƒΠ°Π»ΡŒΠ½Ρ‹ΠΉ контраст , комбинируя Π΄Π²Π° Ρ€Π°Π·Π½Ρ‹Ρ… ΡˆΡ€ΠΈΡ„Ρ‚Π° ΠΈΠ»ΠΈ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡ ΠΎΠ΄ΠΈΠ½ ΠΈ Ρ‚ΠΎΡ‚ ΠΆΠ΅ ΡˆΡ€ΠΈΡ„Ρ‚ с Ρ€Π°Π·Π½ΠΎΠΉ ΠΏΠ»ΠΎΡ‚Π½ΠΎΡΡ‚ΡŒΡŽ.ΠšΠ»Π°ΡΡΠΈΡ‡Π΅ΡΠΊΠΎΠ΅ сочСтаниС Π·Π°Π³ΠΎΠ»ΠΎΠ²ΠΊΠ° Π±Π΅Π· засСчСк ΠΈ основного тСкста с засСчками β€” Ρ…ΠΎΡ€ΠΎΡˆΠΈΠΉ ΠΏΡ€ΠΈΠΌΠ΅Ρ€ простого ΠΈ эффСктного сочСтания ΡˆΡ€ΠΈΡ„Ρ‚ΠΎΠ². ΠžΠ±Ρ‹Ρ‡Π½ΠΎΠ΅ практичСскоС ΠΏΡ€Π°Π²ΠΈΠ»ΠΎ β€” ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚ΡŒ Π½Π΅ большС ΠΈΠ»ΠΈ мСньшС Π΄Π²ΡƒΡ… ΠΈΠ»ΠΈ Ρ‚Ρ€Π΅Ρ… ΡˆΡ€ΠΈΡ„Ρ‚ΠΎΠ² Π² ΠΎΠ΄Π½ΠΎΠΌ ΠΌΠ°ΠΊΠ΅Ρ‚Π΅, Π½ΠΎ ΠΊΠ°ΠΊ Ρ‚ΠΎΠ»ΡŒΠΊΠΎ Π²Ρ‹ ΠΎΠ·Π½Π°ΠΊΠΎΠΌΠΈΡ‚Π΅ΡΡŒ с ΠΏΡ€Π°Π²ΠΈΠ»Π°ΠΌΠΈ, ΠΈΡ… ΠΌΠΎΠΆΠ½ΠΎ эффСктивно Π½Π°Ρ€ΡƒΡˆΠΈΡ‚ΡŒ.

  • БупСрсСмСйство ΡΠΏΠ΅ΡˆΠΈΡ‚ Π½Π° ΠΏΠΎΠΌΠΎΡ‰ΡŒ! Если Π΅ΡΡ‚ΡŒ сомнСния, самоС простоС Ρ€Π΅ΡˆΠ΅Π½ΠΈΠ΅ Π΄ΠΈΠ»Π΅ΠΌΠΌΡ‹ сочСтания ΡˆΡ€ΠΈΡ„Ρ‚ΠΎΠ² β€” это Π²Ρ‹Π±Ρ€Π°Ρ‚ΡŒ Π³Π°Ρ€Π½ΠΈΡ‚ΡƒΡ€Ρ‹ ΠΈΠ· ΠΎΠ΄Π½ΠΎΠ³ΠΎ сСмСйства ΡˆΡ€ΠΈΡ„Ρ‚ΠΎΠ² с нСсколькими вСсами ΡˆΡ€ΠΈΡ„Ρ‚ΠΎΠ².Π­Ρ‚ΠΈ ΡˆΡ€ΠΈΡ„Ρ‚Ρ‹ СстСствСнно Ρ€Π°Π±ΠΎΡ‚Π°ΡŽΡ‚ вмСстС. ВсС, Ρ‡Ρ‚ΠΎ Π²Π°ΠΌ Π½ΡƒΠΆΠ½ΠΎ Π²Ρ‹ΡΡΠ½ΠΈΡ‚ΡŒ, это ΠΊΠ°ΠΊ Π²Ρ‹ Ρ…ΠΎΡ‚ΠΈΡ‚Π΅ ΠΈΡ… Ρ€Π°ΡΠΏΠΎΠ»ΠΎΠΆΠΈΡ‚ΡŒ.

  • РассмотритС настроСниС ΡˆΡ€ΠΈΡ„Ρ‚Π° ΠΈΠ»ΠΈ Π΅Π³ΠΎ Π½Π΅Π²Ρ‹Ρ€Π°Π·ΠΈΠΌΡ‹Π΅ ΡΠΌΠΎΡ†ΠΈΠΎΠ½Π°Π»ΡŒΠ½Ρ‹Π΅ качСства. Π­Ρ‚ΠΎ ΠΏΡ€ΠΈΠ»Π°Π³Π°Ρ‚Π΅Π»ΡŒΠ½Ρ‹Π΅, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ ΠΌΡ‹ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΠ΅ΠΌ, Ρ‡Ρ‚ΠΎΠ±Ρ‹ ΠΎΠΏΠΈΡΠ°Ρ‚ΡŒ «ощущСния» ΡˆΡ€ΠΈΡ„Ρ‚Π° β€” ΠΈΠ³Ρ€ΠΈΠ²Ρ‹ΠΉ, Π·Π°Π³Π°Π΄ΠΎΡ‡Π½Ρ‹ΠΉ, Ρ€Π΅Ρ‚Ρ€ΠΎ, β€‹β€‹ΡΠ΅Ρ€ΡŒΠ΅Π·Π½Ρ‹ΠΉ, грустный ΠΈ Ρ‚. Π”. ΠžΠΏΡ€Π΅Π΄Π΅Π»Π΅Π½ΠΈΠ΅ настроСния ΡˆΡ€ΠΈΡ„Ρ‚Π° β€” самая ΡΡƒΠ±ΡŠΠ΅ΠΊΡ‚ΠΈΠ²Π½Π°Ρ Ρ‡Π°ΡΡ‚ΡŒ Ρ‚ΠΈΠΏΠΎΠ³Ρ€Π°Ρ„ΠΈΠΊΠΈ, Π½ΠΎ это ΠΎΠ΄Π½Π° ΠΈΠ· самых Π²Π°ΠΆΠ½Ρ‹Ρ… ΠΊΠΎΠ½Ρ†Π΅ΠΏΡ†ΠΈΠΈ, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ слСдуСт ΡƒΡ‡ΠΈΡ‚Ρ‹Π²Π°Ρ‚ΡŒ ΠΏΡ€ΠΈ объСдинСнии ΡˆΡ€ΠΈΡ„Ρ‚ΠΎΠ². БмСшиваниС ΡˆΡ€ΠΈΡ„Ρ‚ΠΎΠ² нСсовмСстимых настроСний ΠΌΠΎΠΆΠ΅Ρ‚ ΠΈΡΠΏΠΎΡ€Ρ‚ΠΈΡ‚ΡŒ Π΄Π°ΠΆΠ΅ самый Π»ΡƒΡ‡ΡˆΠΈΠΉ ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚.ВсС, Ρ‡Ρ‚ΠΎ Π²Ρ‹ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΡΠ΄Π΅Π»Π°Ρ‚ΡŒ, это ΠΏΠΎΠ»Π°Π³Π°Ρ‚ΡŒΡΡ Π½Π° свои исслСдования ΠΈ Π΄Π΅ΠΉΡΡ‚Π²ΠΎΠ²Π°Ρ‚ΡŒ ΠΈΠ½Ρ‚ΡƒΠΈΡ‚ΠΈΠ²Π½ΠΎ.
  • Π—Π½Π°ΠΉ, Π³Π΄Π΅ ΠΈΡΠΊΠ°Ρ‚ΡŒ для интСрСсных классичСских ΠΈΠ»ΠΈ ΠΎΡ€ΠΈΠ³ΠΈΠ½Π°Π»ΡŒΠ½Ρ‹Ρ… Ρ‚ΠΈΠΏΠΎΠ³Ρ€Π°Ρ„ΠΈΠΉ. Π£ ΠΊΠ°ΠΆΠ΄ΠΎΠ³ΠΎ Π΅ΡΡ‚ΡŒ свои Π²Π΅Π±-сайты (ΠΌΠΎΠΉ β€” Typewolf), Π½ΠΎ доступно бСсчислСнноС количСство рСсурсов.
  • НС Π±ΠΎΠΉΡ‚Π΅ΡΡŒ ΡΠΊΡΠΏΠ΅Ρ€ΠΈΠΌΠ΅Π½Ρ‚ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ ΠΈΠ»ΠΈ Π½Π°Ρ€ΡƒΡˆΠ°Ρ‚ΡŒ ΠΏΡ€Π°Π²ΠΈΠ»Π°. Π’ΠΎΡ‚ ΠΊΠ°ΠΊ ΠΌΡ‹ учимся. Π‘ΠΎΡ‡Π΅Ρ‚Π°Π½ΠΈΠ΅ ΡˆΡ€ΠΈΡ„Ρ‚ΠΎΠ² ΠΌΠΎΠΆΠ΅Ρ‚ Π±Ρ‹Ρ‚ΡŒ ΠΏΡƒΠ³Π°ΡŽΡ‰ΠΈΠΌ, ΠΏΠΎΡ‚ΠΎΠΌΡƒ Ρ‡Ρ‚ΠΎ это Π½Π΅ точная Π½Π°ΡƒΠΊΠ°, Π½ΠΎ ΠΊΠΎΠ³Π΄Π° творчСскиС профСссионалы говорят Π°Π±ΡΠΎΠ»ΡŽΡ‚Π½ΠΎ, это ΠΌΠ΅ΡˆΠ°Π΅Ρ‚ прогрСссу ΠΈ поощряСт Β«ΠΎΠ΄ΠΈΠ½Π°ΠΊΠΎΠ²ΠΎΡΡ‚ΡŒΒ».”

ΠŸΠΎΠ³Ρ€ΡƒΠ·ΠΈΡ‚Π΅ΡΡŒ Π² Ρ‚ΠΈΠΏΠΎΠ³Ρ€Π°Ρ„ΠΈΠΊΡƒ Π³Π»ΡƒΠ±ΠΆΠ΅.

НаконСчник β„–6. ΠžΠ±Π·ΠΎΡ€ ΠΈ ΡƒΠ»ΡƒΡ‡ΡˆΠ΅Π½ΠΈΠ΅

Π’ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡ‚ΡŒ Ρ€Π΅Π΄Π°ΠΊΡ‚ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ ΠΈ ΠΈΠ·ΠΌΠ΅Π½ΡΡ‚ΡŒ ΠΌΠ°ΠΊΠ΅Ρ‚ ΠΈΠΌΠ΅Π΅Ρ‚ Ρ€Π΅ΡˆΠ°ΡŽΡ‰Π΅Π΅ Π·Π½Π°Ρ‡Π΅Π½ΠΈΠ΅ для творчСского процСсса. ВрСбуСтся ΠΏΡ€Π°ΠΊΡ‚ΠΈΠΊΠ°, Ρ‚Π΅Ρ€ΠΏΠ΅Π½ΠΈΠ΅ ΠΈ ΡƒΠΌΠ΅Π½ΠΈΠ΅ ΠΎΡ‚Π»ΠΈΡ‡Π°Ρ‚ΡŒ ΠΊΠΎΠ½ΡΡ‚Ρ€ΡƒΠΊΡ‚ΠΈΠ²Π½ΡƒΡŽ ΠΊΡ€ΠΈΡ‚ΠΈΠΊΡƒ ΠΎΡ‚ эстСтичСской.

Π£ мСня Π΅ΡΡ‚ΡŒ мыслСнный ΠΊΠΎΠ½Ρ‚Ρ€ΠΎΠ»ΡŒΠ½Ρ‹ΠΉ список, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ я ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽ Π² процСссС ΠΏΡ€ΠΎΠ²Π΅Ρ€ΠΊΠΈ:

  • Π― Π³ΠΎΠ²ΠΎΡ€ΡŽ ΠΈΠΌΠ΅Π½Π½ΠΎ Ρ‚ΠΎ, Ρ‡Ρ‚ΠΎ Ρ…ΠΎΡ‡Ρƒ? ΠŸΠΎΠΉΠΌΠ΅Ρ‚ Π»ΠΈ моя аудитория мою ΠΊΠΎΠ½Ρ†Π΅ΠΏΡ†ΠΈΡŽ?
  • Π•ΡΡ‚ΡŒ Π»ΠΈ Ρ€ΠΈΡ‚ΠΌ ΠΈ ΠΏΠΎΡΠ»Π΅Π΄ΠΎΠ²Π°Ρ‚Π΅Π»ΡŒΠ½ΠΎΡΡ‚ΡŒ Π² ΠΌΠΎΠ΅ΠΌ ΠΌΠ°ΠΊΠ΅Ρ‚Π΅ ΠΈ Π΄ΠΈΠ·Π°ΠΉΠ½Π΅?
  • Достаточно Π»ΠΈ Ρƒ мСня контраста? Если я ΠΏΡ€ΠΈΡ‰ΡƒΡ€ΠΈΠ²Π°ΡŽΡΡŒ, ΠΏΡ€ΠΈΠ²Π»Π΅ΠΊΠ°Π΅Ρ‚ Π»ΠΈ ΠΌΠΎΠ΅ Π²Π½ΠΈΠΌΠ°Π½ΠΈΠ΅ основноС сообщСниС?
  • ВсС Π»ΠΈ располоТСно Ρ€Π°Π²Π½ΠΎΠΌΠ΅Ρ€Π½ΠΎ ΠΈ сбалансирована Π»ΠΈ иСрархия?
  • Π•ΡΡ‚ΡŒ Π»ΠΈ Π² ΠΌΠΎΠ΅ΠΌ Ρ‚Π΅Π»Π΅ «сироты»?
  • НСобходимы Π»ΠΈ ΠΏΡ€Π°Π²ΠΈΠ»Π° проСктирования, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ я Π½Π°Ρ€ΡƒΡˆΠ°ΡŽ?
  • НуТно Π»ΠΈ ΠΌΠ½Π΅ Ρ€Π΅Π΄Π°ΠΊΡ‚ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ ΠΈΠ»ΠΈ ΡƒΠ΄Π°Π»ΡΡ‚ΡŒ тСкст ΠΈΠ»ΠΈ изобраТСния, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ каТутся излишними?

ПослС ΠΏΡ€ΠΎΠ²Π΅Ρ€ΠΊΠΈ Π²Ρ‹ Ρ‚Π°ΠΊΠΆΠ΅ ΠΌΠΎΠΆΠ΅Ρ‚Π΅ ΠΏΠΎΠΏΡ€ΠΎΡΠΈΡ‚ΡŒ ΠΊΠΎΠ»Π»Π΅Π³Ρƒ ΠΈΠ»ΠΈ ΠΊΠΎΠ»Π»Π΅Π³Ρƒ Π΄Π°Ρ‚ΡŒ конструктивный ΠΎΡ‚Π·Ρ‹Π².

Π”ΠΎΠ±Π°Π²ΠΈΡ‚ΡŒ ΠΊΠΎΠΌΠΌΠ΅Π½Ρ‚Π°Ρ€ΠΈΠΉ

Π’Π°Ρˆ адрСс email Π½Π΅ Π±ΡƒΠ΄Π΅Ρ‚ ΠΎΠΏΡƒΠ±Π»ΠΈΠΊΠΎΠ²Π°Π½. ΠžΠ±ΡΠ·Π°Ρ‚Π΅Π»ΡŒΠ½Ρ‹Π΅ поля ΠΏΠΎΠΌΠ΅Ρ‡Π΅Π½Ρ‹ *