Кіраўніцтва па размяшчэнні змесціва

Калі мы хочам усталяваць кантэнт у Інтэрнэце, адной з вялікіх праблем, якія мы выяўляем, з'яўляецца тое, што прапановы, якія я атрымліваю, ніколі не вельмі добра прадумваліся, каб яны былі інтэграваны ў Інтэрнэт. Увогуле праблема заключаецца ў тым, што без адэкватнай структуры дызайн і планіроўка звычайна не выглядаюць занадта добра, даючы нездавальняючы вынік.

Менавіта таму я збіраюся даць некалькі прынцыповых тлумачэнняў таго, як варта разглядаць макет зместу ва ўмовах, каб максімальна спрасціць працу і каб вынік быў аптымальным.

Задача гэтага кіраўніцтва складаецца ў тым, каб любы чалавек, які не ведаў праграмавання або распрацоўкі вэб, мог даць мне якасную раскладку, і што мне не трэба марнаваць занадта шмат часу, спрабуючы здабыць гэтую ідэю праз некалькі размоваў, пакуль не прыйшоў да высновы.

Крок 1: Шаблон

Для таго, каб мець шаблон для «намалявання» нашай прапановы, мы возьмем аркуш паперы фармату А4 і сагнем яго на АДНУ ТРЭЦЬ уздоўж.

Крок 2: Блок зместу

Давайце ўявім, што ў нас ёсць некалькі тыпаў зместу: відэа, малюнак, тэкст. Кожны змест уяўляе сабой прастакутны або квадратны блок. Мы павінны ўкладваць блокі зверху ўніз шаблона на наш выбар. Мы праілюструем тры тыпы зместу.

Відэаблок

Будзем лічыць, што відэа звычайна будзе відэа YouTube, мы прадстаўляем яго ў шаблоне наступным чынам:

Іміджавы блок

Гэта залежыць ад таго, ці будзе малюнак пейзажам альбо партрэтам, як мы пагадзімся.

Тэкставы блок

Гэтак жа, як блок малюнка, у залежнасці ад таго, як мы хочам, каб тэкст мы паставілі блок ці іншы. Мы ўяўляем яго паралельнымі лініямі.

Тэкставыя блокі могуць быць тэкставымі блокамі з уключанымі абзацамі і нават Спісы тэкставых элементаў

Я збіраюся прыкласці два прыклады: блок тэксту побач з выявай альбому і другі побач з партрэтным выявай:

Загаловак блока

Загалоўкі ідуць у асобныя блокі - гэта выцягнутыя блокі, якія звычайна займаюць усю радок.

Кнопкавы блок

Калі мы хочам паставіць кнопку, каб людзі націскалі і пераносілі іх у іншую частку Інтэрнэту, альбо проста з'явілася акно з нейкай інфармацыяй (ці формай)

Іншыя блокі

Ідэя падобная. Калі б мы зразумелі, як працуюць блокі, я думаю, мы маглі б выразна змясціць блок іншага тыпу, які, падобна папярэднім, падыходзіць квадратным і прамавугольным. Напрыклад, калі б мы хацелі змясціць форму, уключаную ў змест. Хоць гэта звычайна менш за ўсё распаўсюджана, лепш спытаць перад выкарыстаннем новых блокаў, якія не з'яўляюцца з названых вышэй тыпаў. Я паспрабую абнавіць гэты спіс, бо з'явяцца новыя ідэі блокаў, якія могуць зацікавіць усіх.

Нарэшце, вось прыклад шаблона з усімі тыпамі блокаў, згаданых вышэй:

Пашырэнне блокаў

Калі нам патрэбна больш месца, нам проста трэба дадаць больш старонак у дызайн блока ўнізе. Не трэба ўсё запаўняць, але важна не пакідаць пустыя прабелы зверху ўніз паміж сярэдзінай кожнага блока. Такім чынам мы можам пашырыць старонку:

Крок 3: Стварэнне змесціва

Цяпер, калі мы маем змесціва змесціва па блоках і тыпах блокаў, неабходна стварыць змест, які будзе ісці ў гэтых блоках. Крок 3 ўзаемазаменны з крокам 2. Іншымі словамі, мы можам стварыць змест раней, а потым размясціць, ведаючы колькасць зместу, які мы хочам уключыць. Невыразна рабіць гэта ў той ці іншай меры, але мы павінны ведаць, што змест павінен дакладна ўпісвацца ў наш макет.

Мы будзем прытрымлівацца папярэдняга прыкладу. На малюнку 4 мы бачым наступныя блокі:

• Загалоўныя блокі 2
• Тэкставыя блокі 4
• Відэаблок 1
• Блокі малюнкаў 2
• Кнопкавы блок 1
• Цэна: Блокі 10

Таму нам давядзецца наладзіць змест так, каб ён ідэальна ўпісваўся ў гэтыя блокі, не пакідаючы яго, і каб памер шрыфта быў аднолькавы ва ўсіх іх. Дзеля гэтага магчыма варта таго спачатку стварыце змест, а потым заблакуйце яго. Гэта ўжо шмат што залежыць ад чалавека.

Крок 4: Падганянне змесціва да блокаў

Дапусцім, што ў нас ужо ёсць дызайн, намаляваны на паперы, і ўсе створаныя блокі зместу. Цяпер апошні крок - аб'яднаць яго. Для гэтага мы будзем выкарыстоўваць некалькі інструментаў, каб аб'яднаць усё і адпраўце яго вэб-дызайнеру.

Блокі відэа

Відэа можна перадаць двума спосабамі:

1. У фармаце MP4 відэа праз такі інструмент WeTransfer.
2. ПЕРАДАЧАВАНАЯ ВАРЫАНТА: Загрузка іх на сакавіцкі канал YouTube і перадача на YouTube спасылкі на відэа.

Калі ў макеце ёсць толькі адно відэа, праблем не ўзнікне. Але калі ёсць некалькі відэа, нам давядзецца нейкім чынам звязаць іх з макетам, які мы зрабілі на паперы.

Напрыклад. Уявіце, што ёсць тры відэа. У разметцы будзем намаляваць нумар 1 у першым відэа, нумар 2 у другім відэа і нумар 3 у трэцім відэа. І тады пры адпраўцы ўсёй дакументацыі мы змесцім прыкладна так:

• Відэа 1: Відэа з назвай «Самыя важныя фразы аб ненасіллі»
• Відэа 2: відэа пра колеры сцяга з назвай: «Сцяг ненасілля»
• Відэа 3: Відэа пра групу, якая збіраецца маршыраваць у Аргенціне, пад назвай: «Асноўная каманда Аргенціны»

Гэта дазволіць лёгка даведацца, якое відэа адпавядае кожнаму раздзелу.

Іміджавыя блокі

У гэтым выпадку ўсе выявы павінны быць загружаныя на платформу IMGUR: https://imgur.com/upload

А потым перадайце спасылкі на гэтыя выявы. Ідэал - размясціць выявы гэтак жа, як і відэа, пазначаныя 1, 2, 3 і гэтак далей. Напрыклад, давайце ўявім, што мы маем 4 выявы на ляту ў Паўднёвай Афрыцы. Усе чатыры маюць аднолькавую назву: «sudafrica.jpg». Ну, мы даем ім паслядоўныя імёны ў тым месцы, дзе яны будуць на макеце, і малюем нумар на паперы, якому яны адпавядаюць. прыклад:

• ПАР-1.jpg
• ПАР-2.jpg
• ПАР-3.jpg
• ПАР-4.jpg

Кнопкі, загалоўкі і тэкставыя блокі

І, нарэшце, гэтыя блокі павінны быць запісаны ў дакуменце Word, а лепш у Google Docs.

Фармат вельмі просты: у дакумент Word мы змяшчаем тып блока (загаловак, кнопка ці тэкст), а за ім нумар, у якім ён будзе адпавядаць.

Прыклады:

• Назва 1:….
• Назва 2:…
• Тэкст 1:…
• Тэкст 2:…
• Кнопка 1:…
• Кнопка 2:…

Затым я стаўлю прыклад дакумента з цалкам выпадковымі тэкстамі, каб было відаць, як гэта будзе структуравана, па прыкладзе выявы 4:

Вось як павінен выглядаць макет, як толькі мы паставім лічбы, якія адпавядаюць кожнаму раздзелу:

Крок 4: Адправіць усіх

Пасля таго, як мы ўсё зробім, вам трэба будзе проста адправіць яго чалавеку, які адказвае за макетам

Проста б узяць

1. Эскізы на паперы з разметкай
2. Змест
   • Відэа спасылкі на YouTube ці WeTransfer
   • IMGUR спасылкі на выявы
   • Спасылка на дакумент у дакументах Google альбо ў файле Word

Важны фінал натарыуса

Ідэалам было б уключыць выбітны малюнак, які будзе суправаджаць загаловак старонкі 1 загалоўка. Менавіта таму загаловак 1 заўсёды павінен з'яўляцца ў самым пачатку.

Выява загалоўка павінна мець памер 960 х 540 пікселяў. Выява можа быць адпраўлена IMGUR, як і астатнія выявы

Канчатковы вынік

І, нарэшце, пры ўсёй гэтай інфармацыі старонка будзе наладжана. Далей і для завяршэння гэтага прыкладу, старонка з канчатковым вынікам, якая вынікае ўсім параметрам, якія мы паднялі раней, будзе такой:

Заключная старонка