Веб-дизајнер AngularJS веб-развој - Матијас Шутц - 8

Придонесите се наменети за почетници, како и напредни корисници и се наменети да помогнат во секојдневната работа во веб/графички дизајн.

Оптимизација на веб-страница: Фактори и можности

Брзината на веб-страницата е важна точка што придонесува за квалитетот на веб-страницата. Посетителите обично имаат малку време на Интернет и очекуваат страниците да се вчитаат брзо. Поради големиот број на резултати од пребарувањето, бавните страници можат брзо да ослабат, бидејќи корисниците можат едноставно да изберат друга веб-страница. Дали побрза страница обезбедува и подобра содржина е друго прашање. Сепак, оптимизирањето на брзината на веб-страницата станува сè поважно. Постојат многу добри ресурси таму што можат да помогнат во подобрувањето на времето на оптоварување.
На оваа работилница сакам да ги разгледам основните начини на кои веб-страниците можат да се оптимизираат. Поентата е да се добие преглед на техничките аспекти кои се променливи и влијаат на времето на вчитување. Создадов модел со мал слој кој би требало да претставува такви фактори.

веб-развој

Индивидуалните слоеви можат да варираат или да се разменуваат. Моделот е наменет да служи како илустрација и претставува само општа архитектура што обично одговара на нормална веб-страница. Во оваа статија сакам накратко да разговарам за одделните точки.

Фотошоп: Поставете палета на информации за веб дизајн

Во Adobe Photoshop има различни палети (прозорци) кои се наменети за специфични цели. Не сите палети се поставени од самиот почеток на таков начин што тие можат да бидат корисни за веб дизајн/дизајн на екран. Инфо палетата е еден таков случај: таа е една од најкорисните алатки кога станува збор за одредување на растојанија и големини. Сепак, треба да биде оптимизиран и за прикажување на екранот, што не е претходно поставено во Фотошоп.
За да може да ја користите палетата со информации значајно за дизајнирање веб-страници, треба да се направат само три поставки во опциите на палетата. За да го направите ова, прозорецот за информации мора да биде отворен, до кој може да се пристапи преку F8 или изборната ставка "Прозорец -> Информа". Тогаш мора да се повикаат опциите за палета, што може да се отвори преку малото копче во горниот десен агол на прозорецот.

Сега приказите за вредноста на бојата треба да бидат поставени на „RGB“, а покажувачот да ги координира „Pixel“.

Фотошоп: Намалете ја големината на датотеката на PSD-датотеките

Многу луѓе можат да бидат вклучени во дизајнирањето и спроведувањето на веб-страница. Честопати се случува отворените датотеки на веб дизајни (како што се PSD или PNG со слоеви) да бидат испратени за да можат понатаму да се обработуваат. Дури и во време на брзина на ДСЛ, секогаш е предност ако податоците испратени на Интернет се чуваат мали, така што преземањето работи брзо.
Еден стар, но секогаш ефикасен трик за намалување на големината на датотеката на датотеките во Photoshop во PSD формат е да се создаде еден слој во боја. Слојот треба да биде пиксел слој што ја покрива целата работна површина на датотеката.

веб-развој

Овој метод може да заштеди до 20% (или повеќе). Пресметката не може да се генерализира, но тестираните датотеки може да се намалат од 7,7 MB на 6,2 MB или од 11,1 MB на 9,6 MB, на пример. Ако таквите датотеки се испраќаат по е-пошта, малата разлика е сè уште забележлива.

Фотошоп: пополнете ги областите за избор со обрасци

Некои кратенки на тастатурата Adobe Photoshop не се добро познати, иако тие можат да служат добро. Кратенките за тастатура се дефинитивно вредни за подобра работа, бидејќи користењето на менијата сигурно не е најбрзиот метод. Исто така, се препорачува прилагодување на постојните команди на тастатурата, бидејќи програмата за уредување на слики не е прилагодена на одредена цел (на пример, веб дизајн). Затоа, кратенките што се создадени за ретуширање или печатење податоци можат да бидат заменети.
Во Фотошоп, двете најпознати комбинации на копчиња се веројатно оние што се користат за пополнување на област за избор (избор): ALT + BACKSPACE ја исполнува избраната област со бојата на преден план, додека CTRL + BACKSPACE го пополнува изборот со бојата на позадината. Друга кратенка е сега SHIFT + BACKSPACE, со која областите за избор може да се пополнат со постоечка шема.

Патем, областите можат да бидат оцртани со контура користејќи SHIFT + F6.

Категории

  • Adobe
  • AngularJS
  • јаболко
  • Управување со содржината
  • развој
  • боја
  • Firebug
  • Firefox
  • Блесок
  • Гугл
  • HTML/CSS
  • инспирација
  • Практикант
  • Internet Explorer
  • JavaScript
  • jQuery
  • Мобилна мрежа
  • образец
  • Јазол.js
  • OOP/MVC
  • PHP
  • Фотошоп
  • сафари
  • софтвер
  • Текстури
  • Совети
  • Трикови
  • Упатства
  • типографија
  • Употребливост
  • Веб дизајн
  • WebGL
  • Алатки
  • Виндоус

пребарување

За меѓу

За веб-дизајнери и развивачи

Повеќе алатки за веб развивачи

Вести од мрежата

Последен напис - веб дизајн

JavaScript: правилна состојба за глобалните променливи

Во JavaScript, секојпат се среќаваме со особености кои не можат секогаш да бидат оправдани. Како работи толкувачот, не е секогаш очигледно. Една од овие посебни карактеристики е проверка на глобалните променливи. Постојат две за ова.

За мене

Покрај концепцијата и дизајнот на корисничките интерфејси, развојот на динамични онлајн/офлајн апликации во JavaScript, апликации за мобилни уреди (iOS и Android) и системи за управување со содржини (TYPO3, итн.) Се меѓу моите области на експертиза. Друга моја страст е развојот на компјутерски игри и игри со прелистувачи кои се имплементираат со JavaScript/Flash/Objective-C/WebGL. Моите проекти со отворен извор може да се најдат на GitHub: Најновите проекти се Angular 2 Seed и PixelZoomer за Chrome.