Развитието на уеб технологиите в днешни дни е силно повлияно от постоянно растящите изисквания и очаквания на потребителите. Притежаването на интерактивен, въздействащ и модерен сайт вече се приема като задължително условие за успешно онлайн присъствие.

В първите години на Уеб информацията е представяна предимно като текст. Днес обаче потребителите искат повече - изображения, анимации, аудио, видео клипове, онлайн чатове, инфографики, слайдове и други.

Една от уеб технологиите, с които можете да направите вашия сайт модерен и да създадете изключително потребителско изживяване, е JavaScript библиотеката jQuery.

Смисълът на jQuery е да се пише по-малко JavaScript код, но и да се постигат по-добри резултати. jQuery добавя нови възможности към JavaScript. С jQuery се създават лесно ефектни навигационни менюта, слайдери, галерии и други.

Ако приемем, че представянето на онлайн информацията е танцьор, то в първите му години е било достатъчно да може право хоро, за да впечатли публиката. Днес от него се изисква да може еленино хоро с елементи на шопска ръченица под съпровода на гъдулка и тъпан. 🙂

Какво е JavaScript?

JavaScript е скриптов език за програмиране, чрез който статичната уеб страница може да се "раздвижи". Динамичният елемент в даден сайт може да бъде в промяна на съдържанието, което се визуализира на уеб страницата при действие от страна на потребителя. Чрез JavaScript може да се влияе на DOM дървото на съдържанието в уеб страницата.

JavaScript се използва, освен за създаване на интерактивни уеб страници, но и за разработка на игри, мобилни приложения и уеб приложения, които работят и се изпълняват от страна на сървъра. Една такава технология, позволяваща изпълнението на JavaScript код директно на сървъра е Node.js. Едно примерно приложение, създадено изцяло на JavaScript и работещо на сървъра е блог платформата Ghost.

Създателят на JavaScript е Брендан Ейч. Той е съосновател и на проекта Mozilla като до скоро е негов главен изпълнителен директор.

През 1995 година JavaScript уеб технологията се появява за първи път в уеб браузъра Netscape Navigator 2.0.

С добавянето на JavaScript в уеб браузъра, вече е възможно статичният HTML код в уеб страницата да се променя динамично.

JavaScript кодът се изпълнява в уеб браузъра с помощта на специален JavaScript интерпретатор/двигател (JavaScript engine). Фаловете, в които се съдържа JavaScript код са с разширение .js.

Съществуват и други уеб технологии като Flash, Silverlight и други, които се използват за добавяне на динамичност в сайта, но JavaScript изпъква и продължава да бъде предпочитана от разработчиците.

Около 87% от най-популярните 10 милиона уебсайта в Уеб ползват JavaScript.

Библиотеки на JavaScript

JavaScript библиотеката представлява предварително написан JavaScript код. Библиотеката може да се ползва, когато е необходимо да се включи някаква функционалност в уебсайта. Вместо да се изгражда от нулата, се ползва вече създадена библиотека, която предлага точно тази функционалност.

Библиотеките подобряват и намаляват времето за разработка на уеб проекта.

Какво е jQuery?

jQuery е една от най-известните и най-използваните библиотеки на JavaScript. Нейният създател е Джон Резиг, а през 2006 година е пусната официално в Интернет.

Библиотеката е проектирана да улесни и опрости писането на JavaScript код, като едновременно с това е гъвкава и може да се надгражда с допълнителни плъгини.

Библиотеката се поддържа от всички съвременни версии на уеб браузърите.

За разработването на приложения и уеб сайтове, които ще се ползват през мобилни устройства, може да се ползва jQuery Mobile . Мобилната версия на jQuery се поддържа от множество мобилни платформи.

За мобилната версия на уебмейл клиента Horde също е ползван jQuery Mobile.

Някои от плюсовете на специално създадената мобилна версия на jQuery:

• Широка поддръжка от мобилни устройства и уеб браузъри. С jQuery Mobile е почти сигурно, че всеки ще може да достъпи сайта ви през мобилно устройство. Благодарение на някои от подобренията в jQuery Mobile, вече може да се предостави уеб документ с най-основни HTML елементи, на мобилно устройство, което не може да обработи CSS и Ajax.
• Елементите от уеб страницата като форми за попълване, радио бутони, слайдери и други, са по-достъпни за устройствата с тъч скрийн. С jQuery Mobile е възможно съвсем лесно да маркирате един единствен чекбокс, без да е необходимо да увеличавате страницата.
• Responsive (адаптивен) дизайн. Всички елементи на уеб сайта като таблици, текст и други, са проектирани с гъвкав дизайн, така че да се визуализират перфектно при различните резолюции на мобилните устройства.

Примери за елементи на jQuery Moblie:

• Преминаване от един елемент към друг, с ефекти
  http://view.jquerymobile.com/master/demos/transitions
• Форми: полета, менюта, радио бутони и други
  http://view.jquerymobile.com/master/demos/forms-gallery
• Теми за мобилния дизайн
  http://view.jquerymobile.com/master/demos/theme-classic

jQuery и другите JavaScript библиотеки

Освен jQuery съществуват и много други библиотеки като MooTools, Prototype, Ext Core, jsPHP, WinJS.

Сравнена с други уеб технологии и множеството други библиотеки на JavaScript, jQuery се отличава с голям интерес при разработката на уеб сайтове. Голям е и процента на сайтовете, които ползват точно тази библиотека.

Според статистиките jQuery е предпочитаната библиотека спрямо други при голям брой уеб сайтове.

Големи сайтове използващи jQuery: Microsoft.com, Amazon.com, Mail.ru, Tumblr.com, Yandex.ru, MediaWiki.org.

Някои от предимствата на jQuery пред останалите JavaScript библиотеки: лесна за използване, постигане на повече функционалност с писане на по-малко код, голяма библиотека и голям брой функции, хиляди готови плъгини, богата помощна информация, поддръжка на Ajax и други.

Как се използва jQuery?

Библиотеката представлява един .js файл, който може да се свали от сайта на jQuery http://jquery.com и да се запише в папката на уеб проекта. След това е необходимо да се вмъкне в кода на сайта:

<head>
<script type="text/javascript" src="jquery.min.js"></script>
</head>

Може да се включи към уебсайта директно чрез линк към .js файла. Какъв е линкът можете да видите на следния адрес: https://developers.google.com/speed/libraries/devguide#jquery

<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
</head>

Как работи jQuery: http://learn.jquery.com/about-jquery/how-jquery-works

Плъгини за jQuery

С плъгините се разширяват възможностите на jQuery библиотеката. Съществуват плъгини написани от екипа на jQuery или от независими разработчици.

С плъгините на jQuery можете да добавите различни функционалности и екстри към сайта и елементите в него. Някои от най-търсените функционалности са: форми, анимация, картинни слайдери, адаптивен дизайн и други.

Официалната колекция от плъгини: http://plugins.jquery.com

При избора на подходящ плъгин обърнете внимание на това, дали има богата помощна информация и дали се предлага поддръжка или контакт с разработчика.

Плъгините се включват в сайта както библиотеката jQuery. Първо се сваля файлът, записва се в папка и след това се включва в сайта. Например:

<head>
<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript" src="plugins.jquery.js"></script>
</head>

Няколко ефектни плъгина:

• Slick - слайдер
  http://plugins.jquery.com/slick (http://kenwheeler.github.io/slick)
• Избор на цвят от цветова палитра
  http://www.virtuosoft.eu/code/jquery-colorpickersliders
• Подреждане, филтриране, категоризиране на елементи и др.
  http://vestride.github.io/Shuffle
• Слайдери за изображения
  http://wowslider.com/demo.html
• Функционални подсказки
  http://amsul.ca/shadow-ui/demos/tooltip