Терміни веб-дизайну є основним, що повинен знати бізнесмен. Веб-дизайн – це процес створення та організації візуального та функціонального аспектів веб-сайту. Він включає різні терміни і концепції, які описують різні аспекти дизайну і розробки веб-сторінок.

Веб-дизайн існує вже давно, і він не марнує часу даремно на розробку складної мови, наповненої жаргоном. Як тільки ви зробите хоч найменший крок у світ веб-дизайну, ви почнете чути: "Яку CMS ви хочете використовувати?", "Ви хочете, щоб це було вище або нижче за згин?", "Ви хочете фіксований макет?" »,« Який веб-хостинг ви хочете використати? » і ви залишаєтеся здивовані, що все це означає. Ми знаємо, що спроба з'ясувати всі ключові визначення та терміни веб-дизайну може бути досить складною, особливо, якщо все це нове.

Веб-дизайн охоплює великий обсяг роботи: від веб-розробників, які пишуть код, до дизайнерів інтерфейсу користувача і інтерфейсу, які працюють над інтерфейсами, до веб-дизайнерів, які піклуються про зовнішній вигляд вашого сайту. У веб-дизайні задіяно багато людей.

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

 

Визначення і терміни веб-дизайну.

Accessibility .Доступність

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

10 штрафів Google, які можуть вплинути на ваш сайт

Below the fold (and above the fold) .Нижче згину (і вище згину)

Нижче і вище згину знаходяться два терміни, які беруть свій початок у газетах. "Згин" - це місце згину газети. Вгорі та внизу описується, чи відображається інформація у верхній або нижній половині згину. Для веб-сторінок "згин" зазвичай визначається як точка, з якої ви повинні почати прокручування, але принцип той же - інформація, яка знаходиться у верхній частині сторінки (ATF), більш доступна і видна, ніж інформація в нижній частині сторінки (BTF) . .

Elastic (layout). Еластичний (макет). Терміни веб-дизайну

Еластичний макет – це підхід до проектування веб-сторінок, який описує відносини між елементами та їх положенням на сторінці у вигляді відсотків, а не спеціально розроблених відстаней та розмірів. Це означає, що веб-сторінки стають адаптованішими як для переваг, встановлених вашими відвідувачами з точки зору розміру шрифту та відстані між ними, так і для оптимізації сторінки для перегляду на смартфоні чи планшеті.

В даний час еластичні макети є ключовою частиною підходів до адаптивного дизайну, але до того, як з'явилася ідея адаптивного дизайну, еластичні макети забезпечували простий спосіб зробити веб-сайти адаптованими.

Ex. Колишній

Ex — це одиниця виміру, в якій як стандартний захід використовується мала літера «x» у шрифті.

Fixed width (layout). Фіксована ширина (макет). Визначення та терміни веб-дизайну.

Макет з фіксованою шириною – це метод розробки веб-сторінок, при якому дизайнер вказує, наскільки велика веб-сторінка і де саме на ній відображатимуться елементи. Це дає дизайнерам набагато більший контроль над дизайном веб-сторінки, ніж еластичний макет, але робить сторінки менш адаптивними до різним розмірам екрану.

Шістнадцятковий.

Шістнадцяткові числа, також відомі як «шістнадцяткові» числа, є системою числення з основою 16, що означає, що вони використовують 16 символів для визначення кольору. У шістнадцяткових числах використовуються числа від 0 до 9 та літери від A до F. Кожен колір визначається трьома парами шістнадцяткових чисел. Перша пара цифр або літер відноситься до червоного відтінку, друга пара - до зеленого відтінку, а третя пара - до синього відтінку.

Infinite scrolling. Нескінченна прокрутка

Нескінченна прокручування – це коли новий контент завантажується у міру продовження прокручування. Це створює «нескінченний», нескінченний сувій. Деякі популярні приклади цього – хроніки Facebook, Pinterest чи Twitter.

Parallax scrolling. Прокрутка з параллаксом.

Цей метод прокручування створює відчуття глибини в дизайні сайту. Коли користувач прокручує, елементи на веб-сайті будуть перебувати на різних відстанях і переміщатися з різною швидкістю в міру того, як прокручує користувач. Це створює ілюзію глибини та відстаней на плоскому веб-сайті.

політики конфіденційності

Відповідь. Дозвіл. Визначення та терміни веб-дизайну.

Роздільна здатність — це кількість пікселів, що відображаються на екрані. Це стандартний метод, який використовується у веб-дизайні для визначення розміру зображень. Якість зображення зазвичай описується в пікселях на дюйм, при цьому більше пікселів призводить до більш якісного зображення.

Responsive / mobile-friendly / mobile optimized. Адаптивний / зручний для мобільних пристроїв / оптимізований для мобільних пристроїв

Станом на минулий рік більше половини веб-трафіку припадає на смартфони. Це означає, що для веб-сайту стає все більш важливим виглядати краще на мобільних пристроях, а також на комп'ютерах. Зробити веб-сайти адаптивними/мобільними/оптимізованими для мобільних пристроїв — означає спроектувати та розробити веб-сайт, який адаптуватиметься до пристрою або екрана, на якому вони переглядаються.

Usability. Зручність використання.

Юзабіліті — це концепція веб-дизайну, яка описує, наскільки зручним є ваш сайт для відвідувачів, для яких він був розроблений. В ідеалі відвідувач зможе легко використати ваш сайт, коли він вперше зіткнеться з ним, з мінімальними перешкодами, розчаруваннями та необхідністю просити про допомогу. Розуміння принципів юзабіліті – ключовий крок у створенні відмінного веб-сайту.

UX (дослідження користувачів) / UI (призначений для користувача інтерфейс)

UX та UI-дизайн – це робота, яка покращує досвід користувача. Важливо знати відмінності UX та UI, щоб розуміти, як вони працюють разом.

UX, дослідження користувачів, включає всі аспекти взаємодії користувача з веб-сайтом від початку до кінця. Ціль - покращити якість взаємодії користувача із сайтом.

UI, інтерфейс користувача, фокусується на візуальних та інтерактивних елементах веб-сайту, таких як кнопки, значки, типографіка. Мета – покращити зовнішній вигляд та функціональність веб-сайту.

Анатомія фронтенд-сайту. Визначення та терміни веб-дизайну.

-

Breadcrumb. Панірувальні сухарі.

Коли веб-сторінки показують користувачам, як вони переміщалися веб-сторінкою і як повернутися на головну сторінкуЦе часто робиться за допомогою ланцюжка навігації. Зазвичай це відображається як серія вкладених категорій, наприклад «Головна» > «Категорія» > «Рік» > «Місяць» > «Опублікувати».

Favicon. Фавікон.

Фавікон – це крихітний значок, який відображається на панелі вкладок вашого браузера. Зазвичай вони мають розмір 16 × 16 пікселів (що насправді дуже мало) і зберігаються як зображення .ico, .gif чи .png. Ви можете використовувати практично будь-яке зображення як значок, якщо воно правильного розміру та збережено у правильному форматі.

Focal point. Координатор.

Фокус на веб-сторінці — це та частина сторінки, до якої прикута ваша увага. Дизайнери витратить багато часу на те, щоб створити фокус, який дійсно привертає увагу глядача, а потім помістять найважливіше на сторінці у фокус. Це гарантує, що його побачить якнайбільше людей.

Front end. Зовнішній інтерфейс.

Це всі елементи, як-от зображення, текст, сторінки, які люди побачать при першому відвідуванні вашого сайту. По суті, це те, з чим люди взаємодіятимуть і взаємодіятимуть на веб-сайті.

Hamburger значок. Гамбургер значок.

Значок гамбургера відноситься до значка меню, який зазвичай зустрічається у пізніших програмах. Він має три горизонтальні смуги (звідси «гамбургер») та приховує традиційне меню навігації за одним значком.

Landing page. Цільова сторінка.

Це перша сторінка, яку побачать відвідувачі вашого сайту. На багатьох веб-сайтах спеціальна цільова сторінка використовується для того, щоб дізнатися щось від відвідувача (наприклад, поділитись своєю адресою електронної пошти або сторінкою, спеціалізованою для продукту). Ваша цільова сторінка - Одна з найважливіших сторінок вашого веб-сайту, і вам слід витратити багато часу на її оптимізацію.

Navigation. Навігація.

Навігація — це система, яка використовується для переміщення між елементами вашої веб-сторінки та є одним із найважливіших елементів будь-якої веб-сторінки. Ось чому так важливо знати ключові принципи навігації сайтом. Самим яскравим прикладом Навігації є меню, які з'являються на більшості веб-сторінок. Але також зверніть увагу на те, як організовані сторінки і на зв'язку між ними. Вони також можуть значно спростити навігацію веб-сторінкою для відвідувачів.

Анатомія серверної частини веб-сайту. Визначення та терміни веб-дизайну.

-

Back end. Бек-енд.

Це частина вашої системи, яка ефективно управляє вашим сайтом, але прихована від відвідувачів. Доступно безліч різних серверних компонентів, але вони зазвичай містять одні й самі речі — додатки, інформаційну структуру і вашу CMS.

CMS

Система керування контентом - це внутрішній інструмент для керування контентом вашого сайту, додавання користувачів, управління коментарями та, можливо, багато іншого. Якщо ви використовували WordPress для створення веб-сайту, ви використовували CMS. CMS значно спрощує проектування та створення веб-сторінки, оскільки приховує більшу частину необробленого коду, на якому працює веб-сайт.

Ecommerce. Електронна торгівля.

Електронна комерція означає "електронна комерція". так само, як «електронна пошта» означає «електронна пошта». Зазвичай ви додаєте на свій веб-сайт магазин електронної торгівлі, який буде обробляти описи продуктів, купівлі та продажу, а також дані про клієнтів.

HTTP/HTTPS

Це система, яка обробляє обмін даними між браузерами, серверами та веб-додатками. Він визначає, як дані мають бути упаковані та відправлені.

HTTPS – це розширення HTTP, яке може встановлювати з'єднання через SSL (Secure Socket Layer). Це набагато безпечніший спосіб обміну даними в Інтернеті. Багато сучасних веб-браузеров попередять вас, якщо веб-сайт використовує стандартний протокол HTTP, а не HTTPS.

Як власник веб-сайту можна придбати сертифікати SSL, необхідні для використання HTTPS, у різних постачальників. Після додавання це зробить ваш сайт безпечнішим і зміцнить довіру ваших клієнтів.

Плагін. Терміни веб-дизайну

Невелика програма, яка встановлюється поверх основного сайту та забезпечує додаткову безпеку. Плагіни доступні для більшості популярних платформ CMS і можуть використовуватися для багатьох функцій, від автоматизації повідомлень у блогах до управління потенційними клієнтами.

Template. Візерунок.

Шаблони використовуються у веб-дизайні майже так само, як вони використовуються для документів та зображень – для забезпечення одноманітності дизайну на різних сторінках. Більшість платформ CMS надасть вам набір шаблонів для вашого веб-сайту, які допоможуть забезпечити однаковість ваших сторінок та вашого дизайну на них.

Технічні умови для Інтернету. Визначення та терміни веб-дизайну.

-

Anchor text. Якірний текст.

Якірний текст - це фраза або кілька слів, які містять гіперпосилання. Використання правильного якірного тексту може мати велике значення для того, наскільки добре ваша сторінка посідає місце у рейтингу пошукових систем.

Backlink. Зворотне посилання.

Це посилання на ваш сайт із інших сайтів. Коли інший сайт посилається на ваше, наприклад, щоб направити своїх читачів на ресурс, ви отримали зворотне посилання. Зворотні посилання дуже важливі, коли справа доходить до підвищення вашого рейтингу у пошуку, тому що кілька зворотних посилань з надійних сайтів підвищать видимість вашого сайту.

Bandwidth. Пропускна здатність.

Смуга пропускання - це термін, що використовується в багатьох різних контекстах, але по суті він означає обсяг даних, надісланих або отриманих за певний період. Його можна використовувати, наприклад, для опису швидкості вашого інтернету, де вона зазвичай вказується в кілобітах за секунду (кбіт/с). Однак іноді він використовується для опису того, скільки даних ви можете використовувати за місяць як частину вашого пакету веб-хостингу.

Cache. Кеш.

Кеш – це набір даних, який зберігається у веб-браузері. Це означає, що наступного разу, коли користувач відвідає сайт, сторінка завантажуватиметься швидше, тому що вона завантажується з локальної пам'яті.

DNSю Терміни веб-дизайну

DNS розшифровується як служба доменних імен. Це система, за допомогою якої ваш веб-браузер знаходить веб-сторінки. Коли ви azbyka.com.ua  , ваш браузер переглядає «таблицю DNS», яка перетворює цю зручну для людини адресу на зручний для комп'ютера адресу (тобто складається з чисел). Система DNS відстежує, де знаходяться всі веб-сторінки у світі, щоб ваш браузер міг їх знайти.

домен

Це назва вашого сайту. Ви можете придбати домени у багатьох компаній. Вони можуть містити не більше 63 символів. Наприклад,  https://azbyka.com.ua/- Це наше доменне ім'я.

Ftp

FTP означає «протокол передачі файлів» і є системою передачі файлів і даних з локального сховища (скажімо, на вашому комп'ютері) на ваш веб-сервер. Щоб використовувати FTP, вам необхідно завантажити невелику програму, яка називається FTP-клієнтом.

Permalink. Постійне посилання

Постійне посилання, яке дозволяє вам вказати адресу, яка завжди вказуватиме на конкретне повідомлення або сторінку в блозі, незалежно від того, як ви змінюєте структуру свого сайту навколо нього. Це дуже корисно, якщо ви використовуєте повідомлення в блозі для збільшення відвідуваності вашого сайту, тому що вам не потрібно вручну змінювати десятки (або сотні) посилань, якщо ви вирішите змінити дизайн свого сайту або змінити своє доменне ім'я.

URL

Адреса, який вказує, де можна знайти конкретну сторінку або інший ресурс.

Веб хостинг. Визначення і терміни веб-дизайну.

Веб-хостинг - це компанія, яка керує серверами, на яких зберігається ваш веб-сайт. Як ми пояснюємо в нашій статті про веб-хостинг, веб-хости можуть сильно відрізнятися за рівнем послуг, які вони пропонують. Хороший веб-хостинг зможе запевнити вас, що ваш сайт буде доступний 99,9% часу, а також надасть вам інструменти для забезпечення його безпеки та ефективності.

веб сервер

Веб-сервер — це комп'ютер, на якому фактично зберігається веб-сторінка. Швидше за все, він знаходиться в установці сервера, що належить вашому веб-хосту, хоча також можна запускати власні сервери.

Термінологія веб-розробки. Визначення та терміни веб-дизайну.

CSS

CSS означає каскадні таблиці стилів, і поряд з HTML ці таблиці є найбільш основною частиною будь-якої веб-сторінки. Десять років тому форматування веб-сторінки, наприклад розмір заголовків або наявність меж у зображень, визначалося в самому HTML-коді. Це означало, що зміна форматування була трудомісткою процесом проходження кожного елемента сторінки та зміни коду.

З CSS все набагато простіше. Стиль сторінки міститься в одному (або декількох) файлах CSS, які визначають, як виглядають заголовки, як відображаються зображення та багато інших елементів. Вони повідомляють браузеру, як відображати веб-сайт. Таким чином, формат цілих веб-сайтів може бути змінений шляхом перемикання всього лише одного фрагмента коду.

DHTML

DHTML означає динамічний мову гіпертекстової розмітки. Це термін для мови, що поєднує кілька мов веб-дизайну — HTML, JavaScript та CSS — в одну супермову для веб-розробки. Зазвичай це те, що сучасні веб-розробники будуть використовувати для створення веб-сайту для вас.

Doctype. Визначення і терміни веб-дизайну.

У HTML тип документа – це опис того, який тип HTML та яка версія використовується на веб-сторінці. Він використовується браузерами для перевірки цілісності сторінки і може викликати помилки безпеки, якщо він неправильний.

Em. ЕМ. Терміни веб-дизайну

Em використовується для опису розміру шрифту стосовно «батьківського» шрифту, який використовується на сторінці. 1Em означає, що шрифт (або іноді інші елементи) того ж розміру, що і їхній батьківський елемент, 2em означає, що вони вдвічі більші, і так далі.

Embedded style. Вбудований стиль. Терміни веб-дизайну

Хоча CSS (див. Вище) можна використовувати для опису формату цілих сторінок відразу, іноді вам потрібно змінити стиль лише на одній сторінці. Це коли використовується вбудований стиль. Вбудований стиль — це фрагмент коду CSS, записаний у заголовок веб-сторінки, який впливає лише на елементи на цій сторінці, а не на весь веб-сайт.

Font family/style/weight. Сімейство / стиль / вага шрифту

Веб-дизайнери та розробники часто не працюють з певними шрифтами, тому що різні браузери не завжди використовують ті самі шрифти. Ось чому в документі CSS ви побачите, що шрифт, що використовується, визначається як сімейство шрифтів — група шрифтів, які можна використовувати, а не один окремо. Поруч із визначенням документ CSS також визначатиме стиль шрифту (курсив, підкреслення тощо. буд.) і вага (жирний, світлий тощо. буд.).

HTML. Визначення та терміни веб-дизайну.

Мова гіпертекстової розмітки – це основа Інтернету. Всі веб-сторінки написані принаймні деякою мірою на HTML, який був розроблений таким чином, щоб його було максимально легко писати. Насправді це може бути дуже корисно, спробуйте Навчальний посібник по HTML-код, щоб побачити, чи легко його написати - ви будете здивовані тим, чого ви можете досягти протягом кількох годин!

Метадані.

Метадані — це дані, які містяться в заголовку веб-сторінок. Ці дані доступні вашому браузеру, але не відображаються як частина веб-сторінки, що переглядається — вам потрібно буде переглянути вихідний код, щоб отримати до них доступ.

Open Source. Відкритий вихідний код. Терміни веб-дизайну

Програмне забезпечення з відкритим вихідним кодом підтримується користувачами, його можна вільно використовувати та змінювати. Це контрастує з пропрієтарним програмним забезпеченням, яке належить та підтримується певною компанією. Більшість веб-розробників будуть використовувати програмне забезпечення з відкритим вихідним кодом, принаймні іноді, тому що воно не тільки дешевше, але і може бути більш безпечним. В даний час більшість веб-розробників мінімізують порушення безпеки, використовуючи контейнери, написані мовами з відкритим вихідним кодом.

Staging. Постановка. Визначення і терміни веб-дизайну.

Постановка веб-сайту - Це процес створення майже остаточної копії її з подальшим її тестуванням перед розгортанням чинної версії сайту. Більшість веб-розробників «інсценує» веб-сайт перед його випуском, щоб переконатися, що все працює правильно. І часто серйозні зміни на веб-сайті відбуваються на проміжному, а не на сайті, що діє.

Valid. Справжній.

У веб-дизайні допустимі веб-сторінки – це ті, що не містять помилок. На практиці це означає веб-сторінки, які відповідають стандартам, викладеним у специфікаціях HTML, опублікованих W3C, спільнотою, яка встановлює стандарти для веб-розробки.

XML. Терміни веб-дизайну

XML розшифровується як Extensible Markup Language. XML є фундаментальною частиною веб-дизайну, тому що він діє як «метамова», що перекладає елементи однієї мови іншою. Це означає, що веб-сторінки можуть бути створені за допомогою різних мов, кожна з яких спілкується через XML.

Останнє…

Звичайно, не обов'язково знати всі ці визначення та терміни веб-дизайну, щоб приступити до розробці веб-сайту - або самостійно, або за допомогою. Зрештою веб-дизайн — це процес навчання, а найкращий дизайн — це твори мистецтва, що повторюються, які постійно покращуються в міру того, як ви вивчаєте нове.

Тим не менш, може бути дуже корисно мати посібник з іноді складного світу веб-дизайну, особливо коли ви тільки починаєте. Наші професійні веб-дизайнери допоможуть вам розпочати роботу у захоплюючому світі веб-дизайну.

АЗБУКА

 

Анімація логотипу.