Критерии выбора средств разработки web приложений. Языки и средства создания web-приложений. Расширяемая среда проектирования пользовательского интерфейса web-приложения

При подготовке использовались материалы: «HTML Editors and Web Page Editors» , «Best free web development IDE for JavaScript, HTML and CSS» , «Cloud IDEs For Web Developers – Best Of» .

Существует множество способов писать код для веб-приложений: от текстовых редакторов до облачных сред разработки. Трудно сразу решить, какая среда лучше подходит для поставленных задач. Чтобы сэкономить вам время, выбрали наиболее популярные:

В конце каждого раздела размещена сводная таблица, в которой можно наглядно увидеть сравнение функций редакторов для веб-разработки. В статье рассмотрены исключительно бесплатные кроссплатформенные решения, поэтому популярные проприетарные редакторы вроде Sublime Text не вошли в подборку.

Текстовые редакторы для веб-разработки

Komodo Edit

Основные возможности:

  • бесконечная история отмены,
  • обширное количество плагинов,
  • поддержка сотен языков программирования и форматов файлов,
  • мощный поиск и замена,
  • интеграция со сторонними инструментами.

GNU Emacs

Настольные интегрированные среды разработки (IDE)

Eclipse

Облачные IDE

Большинство десктопных приложений перешли в «облако», поэтому нет ничего удивительного, что облачные среды также становятся популярными среди программистов. Не каждый сразу доверяет облачным IDE, но популярные инструменты вроде Github и Pastebin помогают привыкнуть к тому, что исходный код хранится не на локальной машине, а на стороннем сервере.

Cloud9

После нескольких минут работы в Cloud9 создаётся впечатление, что попал в рай для программистов. Интерфейс написан на JavaScript, а серверная часть - на NodeJS. Хотя Cloud9 облюбовали разработчики и дизайнеры интерфейсов, поддерживается подсветка синтаксиса C#, C++, Python, Perl, Ruby, Scala и некоторых других языков.

Встроенный режим Vim - приятный штрих, как и поддержка популярных систем контроля версий вроде Git, Mercurial и SVN. Благодаря наличию CSSLint и JSBeautify это одна из красивейших сред разработки.

Codeanywhere

Ещё один инструмент для создания приложений, который часто возглавляет списки лучших - Codeanywhere. Эта дружественная облачная IDE поддерживает подсветку кода HTML, CSS, JavaScript, PHP, MySQL и других языков. Благодаря наличию приложений для iOS, Android и BlackBerry, с помощью Codeanywhere программисты работают где угодно.

Кроме того, Codeanywhere поддерживает Dropbox и SFTP, которые помогают легко создавать резервные копии файлов проекта и обмениваться ими с коллегами. Это не самая полнофункциональная среда, но свою работу выполняет на отлично.

Система платная, но есть бесплатный тарифный план.

Eclipse Che

Полезные ссылки

А какие редакторы и среды используете вы? Поделитесь своим опытом!

НЕДОСТАТКИ САЙТОВ Несоответствие сайта психофизиологическим требованиям, которое приводит к повышенной утомляемости или отвлечению внимания q увлечение анимацией, графическими изображениями и видео фрагментами, которые не несут смысловой нагрузки q избыточность или недостаток представленной информации q некорректный выбор средств разработки, который влечет за собой необоснованное повышение стоимости готового продукта. q 3

ТРЕБОВАНИЯ К САЙТУ Сайт должен быть удобен в использовании – страницы должны загружаться как можно быстрее, а сам ресурс должен обладать логичной и понятной структурой. Только в таком случае можно рассчитывать на то, что посетитель заинтересуется предоставленной информацией и задержится на сайте. 4

WEB-ПРИЛОЖЕНИЕ Web-приложение это приложение, которое работает с помощью web-браузера по сети Internet или Intranet. Это также компьютерная прикладная программа, пользовательский интерфейс (UI), который кодируется на языках понятных браузерам (HTML, CSS, Java. Script и пр.). 5

WEB-КЛИЕНТ (БРАУЗЕР) Web обозрева тель или браузер (browser) – это программное обеспечение для запроса web -страниц, их обработки, вывода и перехода от одной страницы к другой. 6

WEB-СЕРВЕР (HTTP СЕРВЕР) Компьютерная программа, отвечающая за принятие HTTP запросов от клиента и отправляющая им HTTP ответ некоторым набором данных, которые обычно являются HTML документами или связанными с ними объектами. 7

HTTP ЗАПРОС В HTTP запросе содержится указание на ресурс: HTML страница текстовый файл (txt, doc, pdf) графический файл мультимедиа файл (звук, видео) выполняемый файл (exe или dll) файл со скриптами (asp, aspx, php, jsp и т. д.) 8

ДЕЙСТВИЯ СЕРВЕРА НА ЗАПРОС Отправка файла запуск на выполнение exe-программы или dllмодуля и отправка полученного результата клиенту передача на обработку файла со скриптами программам обработки скриптов на сервере и отправка клиенту полученного результата. 9

КАСКАДНЫЕ ТАБЛИЦЫ СТИЛЕЙ (CASCADING STYLE SHEETS) Таблица стилей это набор правил, который сообщают браузеру, как выполнять отображение документа. Каждое такое правило состоит из двух частей: селектора (selector), который указывает HTML тег, к которому данное правило должно применяться описателя стиля (style declaration), описывающего свойства стиля, который должен присоединяться к указанному в селекторе HTML тегу. 12

КАСКАДНЫЕ ТАБЛИЦЫ СТИЛЕЙ Селекторы – специальные указатели на теги, к которым нужно применить css-правило. В качестве селектора можно использовать имя класса. Удобство таких селекторов в том, что можно присвоить одно имя класса множеству html-тегов в документе и затем управлять их внешним видом, обращаясь к ним по имени класса. К любому HTML-тегу можете применить идентификатор (ID). ID должен быть уникален в рамках html-документа. 14

КАСКАДНЫЕ ТАБЛИЦЫ СТИЛЕЙ strong {font-weight: normal; color: red; } h 1 { font: bold 10 pt verdana; } . my. Class { font: bold 10 pt verdana; } #my. Object { margin: left; } /* изменяем поля для тега, у которого id=”my. Object” */ span#today { margin: left; } /* изменяем поля для тега span, у которого id=”today” */ 15

Понятие и классификация web технологий. Требования к web приложениям. Проведение оценочных работ. ТЕОРЕТИЧЕСКИЕ ОСНОВЫ РАЗРАБОТКИ WEBПРИЛОЖЕНИЙ 16

ОСНОВНЫЕ ПОНЯТИЯ Информация, доступная пользователям Internet, располагается на Web-серверах. Значительная часть этой информации организована в виде Web-сайтов. Каждый из них имеет свое имя (адрес) в Internet. Web-сайт – это информация, представленная в определенном виде, которая располагается на Web-сервере и имеет свое имя. Для просмотра Web-сайтов на компьютере пользователя используются специальные программы, которые называются браузерами. 17

ОСНОВНЫЕ ПОНЯТИЯ Современные web-приложения - это, в основном, порталы, предоставляющие услуги. Одно из неудобств подобных сервисов - сложность обмена информацией между компаниями. 18

КЛАССИФИКАЦИЯ - ПУБЛИЧНЫЕ ПОРТАЛЫ Yahoo, Lycos, Excite, Rambler. Такие порталы нередко являются результатом развития поисковых систем. Предназначены для широкой аудитории. Информация предоставляемая ими носит общий характер, равно как и предоставляемые услуги (электронная почта, новостные рассылки и так далее). 20

КЛАССИФИКАЦИЯ - ВЕРТИКАЛЬНЫЕ ПОРТАЛЫ Предназначены для специфических видов рынка и обслуживает аудиторию, пользующуюся услугами этого рынка или работающую на нем. Примеры таких порталов: туристические агентства, предоставляющие услуги по бронированию мест в гостиницах, заказу и доставке билетов, доступу к картам и сведениям об автомобильных маршрутах порталы типа business-to-business, позволяющие своим клиентам реализовывать совместные бизнес-операции: выбирать поставщиков и осуществлять закупку товаров, проводить аукционы. 21

КЛАССИФИКАЦИЯ - КОРПОРАТИВНЫЕ ПОРТАЛЫ Предназначены для сотрудников, клиентов и партнеров одного предприятия. Пользователи такого портала получают доступ к предназначенным им сервисам и приложениям в зависимости от их роли и персонального профиля. 22

КЛАССИФИКАЦИЯ - ДРУГИЕ WEBПРИЛОЖЕНИЯ Региональные Интернет-порталы. Поисковые системы. Каталог - это коллекция ссылок на сайты. Электронные доски объявлений. Форумы. Чаты. Серверы почтовых рассылок. Интернет-магазины и аукционы. 23

ЭТАПЫ ПРОЕКТА Анализ целей сайта и функций, которые будут предложены пользователю. Построение информационной архитектуры сайта. Дизайн навигации и страниц. 25

КАРТА САЙТА Страница с отображением карты по размеру не должна превышать двух страниц на экране пользователя. Наиболее эффективно использование карты со статическим отображением информационной архитектуры. На карте необходимо отображать не только текущее положение пользователя на сайте, но и те разделы, которые он уже посещал. 26

ГЛАВНАЯ СТРАНИЦА На главной странице чётко прописываются цели компании. Каждый элемент дизайна должен позволять пользователю разобраться с последовательностью действий для решения своих задач. 27

КОНТЕНТ Выделение ключевых слов грамотно составленные заголовки списки с маркерами один абзац на одну идею стиль перевёрнутой пирамиды (статья начинается с заключения) меньшее количество слов, чем в обычной статье минимум мало понятных терминов указание даты создания сообщения контекстную информацию атрибута " ALT 28

ССЫЛКИ Пользователь должен знать, что произойдёт, если он нажмет на ссылку ссылки в тексте должны быть цветными или подчёркнутыми цвет посещённых и не посещённых ссылок должен отличаться не допускать появления ломаных ссылок. 30

ПРОВЕДЕНИЕ ОЦЕНОЧНЫХ РАБОТ Для проведения оценочной работы необходимо привлечь от трёх до пяти участников. Каждый из них производит работу индивидуально. После чего их результаты сравниваются. Тест проводится в два этапа: понимание работы интерфейса концентрация внимания на определённых элементах. 33

HTML (HYPERTEXT MARKUP LANGUAGE) Язык гипертекстовой разметки (Hyper. Text Markup Language) используется для описания содержания web-страницы и ее форматирования. HTML страница состоит из текста и изображений, а также специальных элементов, называемых тегами (tags). Браузер отображает части страницы в соответствии с заданными параметрами или определяет связи элементов содержания с другими страницами. 35

PHP (PERSONAL HYPERTEXT PROCESSOR) Это работающий на стороне сервера встроенный язык сценариев, позволяющий разработчикам быстро и эффективно строить динамические web-приложения. Возможности РНР - поддержка регулярных выражений, средства работы с массивами, объектно-ориентированная методология и поддержка работы с базами данных. Одним из главных достоинств РНР является тот факт, что он интегрируется в HTML, Java. Script, WML, XML и другие языки. 36

JAVASCRIPT Это объектно-ориентированный язык разработки клиентских и серверных приложений. Основные области применения Java. Script: динамическое создание документа с помощью сценария оперативная проверка достоверности заполняемых пользователем полей форм HTML до передачи их на сервер создание динамических HTML-страниц совместно с каскадными таблицами стилей и объектной моделью документа взаимодействие с пользователем при выполнении локальных задач, решаемых приложением Java. Script, встроенном в HTML-страницу. 37

VBSCRIPT Функциональные возможности сценариев, написанных на VBScript, ничем не отличаются от возможностей сценариев Java. Script: динамические создание документа или его частей, перехват и обработка событий и так далее. VBScript используется для написания сценариев клиента (в этом случае браузер должен иметь встроенный интерпретатор этого языка), а также для написания сценариев на сервере (в этом случае сервер должен поддерживать язык VBScript). 38

DREAMWEAVER Поддерживает чистый HTML код, а также последние расширения DHTML и CSS содержит средства автоматического управления связями динамическая проверка для различных браузеров имеет библиотеку элементов, например панель навигации, дескриптор авторского права и др. 39

DREAMWEAVER (2) Применяется для добавления на страницы различных мультимедиа-файлов и интерактивных элементов. Программа Dreamweaver не имеет собственных средств создания изображений. В ней представлены лишь простейшие инструменты их редактирования. 40

FIREWORKS Fireworks это редактор графики с возможностью её дальнейшей оптимизации и размещения в сети. Можно создавать и редактировать как векторную, так и растровую графику в пределах одного файла. Fireworks генерирует HTML - код и Java. Script и может создавать динамические меню и навигационные панели. Имеется возможность редактировать макеты страниц, создавать активную графику, реагирующую на курсор, не зная языка программирования. 41

FLASH Для Flash характерна векторная графика и анимация, хотя можно манипулировать или отображать растровую графику, монтировать видеоматериал и манипулировать звуковыми файлами. В пользу Flash маленький размер получающихся файлов, использование векторного формата изображений, сжатие растровых и звуковых файлов. Мощный событийно-управляемый язык Action. Script это язык программирования с поддержкой условий, циклов, массивов, функций и классов, которые можно наследовать. 43

PHOTOSHOP Самая популярная программа редактирования изображений. С её помощью можно создавать высокохудожественные изображения. Она содержит всё необходимое для создания и редактирования профессиональной графики. 44

CORELDRAW При построении векторных изображений линии и фигуры накладываются, пока не получится окончательное изображение. Каждый объект можно редактировать независимо от остальных - одно из немногочисленных преимуществ объектного подхода. В программе векторные рисунки линий, фигур и текста задаются математическими выражениями, что дает возможность автоматически настраивать их на максимальное разрешение устройства вывода. Еще одно преимущество векторных рисунков состоит в том, что для них не требуется много места на диске. 45

Тенденции развития программного обеспечения требуют, чтобы и отдельно стоящий компьютер был снабжён сетевыми программными средствами (браузерами, программными реализациями протоколов). Особенностью программного обеспечения компьютерных сетей на современном этапе развития является чрезвычайно широкий спектр используемых программных средств и языков программирования. Это обусловлено динамичным развитием и огромным разнообразием компьютерных сетей и связанных с ними технологий. В таких условиях ни одна технология или язык программирования не могут иметь решающего превосходства над другими. Данная ситуация заставляет специалиста, занятого разработкой программного обеспечения, одновременно осваивать и использовать в практической работе большое число средств разработки и языков программирования.

Например, даже для создания обычной интерактивной WEB-страницы, соответствующей современным требованиям, необходимо знание языка гипертекстовой разметки HTML, каскадных таблиц стилей (CSS) и более сложные технологии разработки приложений на стороне сервера как PHP. Кроме того для разработки серверной части программного обеспечения программист должен владеть средствами доступа к базам данных с помощью языка запросов Mysql.

Денвер: автоматизация установки инструментария.

Установка сервера Apache и сопутствующих программ вручную может оказаться довольно утомительным занятием. Дело в том, что придется разбираться с многочисленными параметрами конфигурации Apache, PHP и MySQL, которые никогда вам больше не пригодятся.

Денвер - универсальный инсталлятор, способный упростить установку всех программ, необходимых Web-программисту, это те же самые дистрибутивы Apache, PHP, MySQL, Perl, объединенные в единый архив, снабженные удобным инсталлятором и утилитами настройки под конкретную машину (включая средства автоматического конфигурирования виртуальных хостов).

Денвер представляет собой полностью автоматизированное средство.

Условия использования.

Денвер создавался для того, чтобы упростить настройку и установку свободно

распространяемых программ (Apache, PHP, MySQL и т.д.). Естественно, он может

безвозмездно использоваться любыми Web-программистами и дизайнерами, но только в некоммерческих целях.

Денвер имеет модульную структуру. Его ядро - так называемый «базовый пакет». Все остальные компоненты поставляются в виде автономных пакетов расширений", для работы которых нужен базовый пакет.

Состав базового пакета.

Базовый пакет содержит большинство необходимых Web-программисту программ и утилит:

Apache с поддержкой SSI, mod_rewrite, modphp;

PHP с поддержкой GD и MySQL;

MySQL с поддержкой транзакций (nrysqld-max);

PhpMyAdmin - система управления MySQL через Web-интерфейс; полностью

заменяет командную строку MySQL;

ядро Perl без стандартных библиотек;

эмулятор sendmail;

поддерживается работа совместно с РНР и Perl;

дистрибутив, содержащий все перечисленные выше компоненты, занимает всего около 2 Мбайт.

Дополнительные пакеты расширения

Так же доступно множество пакетов расширений для Денвера, содержащих:

документацию ко всем программам, входящим в комплекс;

полную версию Perl со стандартными библиотеками;

полную версию РНР 5;

Поддержка разработчиков .

По адресу http://forum.dklab.ru/denwer/ действует форум, где вы можете получить консультацию у авторов книги по вопросам, касающимся использования Денвера. Он также содержит обширную базу данных вопросов и ответов, которые задавали пользователи за последние два года. На форуме действует гибкая система поиска.

Установка дистрибутива .

Все дистрибутивы представляют собой архивы в формате 7-Zip (http:// 7-zip.org). Формат был выбран потому, что он дает наилучшую степень сжатия.

После приобретения дистрибутива, вам нужно его запустить. Вначале архив будет распакован во временный каталог (нужно немного подождать), а затем автоматически запустится инсталлятор.

Появится запрос, в какой каталог вы хотели бы установить комплекс (по умолчанию используется C:WebServers, вам нужно лишь нажать клавишу , чтобы согласиться с этим выбором). В указанном каталоге будут расположены абсолютно все компоненты системы, и вне его никакие файлы в дальнейшем не создаются (исключая ярлыки на рабочем столе).

Конфигурационных файлов у Денвера несколько, и расположены они в местах, где их проще всего найти компонентам комплекса. Некоторые файлы по умолчанию не существуют - их необходимо создать перед внесением изменений.

  • * Главный конфигурационный файл: /etc/CONFIGURATION.txt.
  • * Конфигурация Apache httpd.conf: /usr/local/apache/conf/httpd.conf.
  • * Файлы.htaccess с локальными настройками сайтов: в каталогах документов соответствующих сайтов.
  • * Конфигурация PHP: php.ini: /usr/local/php/php.ini.
  • * Конфигурация РНР 3: /usr/local/php3/php3.ini.
  • * Конфигурация MySQL с транзакциями: /usr/local/mysql/my.cnf.
  • * Файл hosts - соответствие имен сайтов их IP-адресам:

для Windows 95/98/ME: C:Windowshosts;

для Windows NT/2000/XP: C:WinNTsystem32driversetchosts.

Начать работу с Денвером .

После завершения установки щелкните по ярлыку Denwer на Рабочем столе.

Откройте в браузере страницу http://localhost (хранится в папке home/localhost/www).

HTML

Обмен информацией в Интернет осуществляется с помощью протоколов прикладного уровня, реализующих тот или иной прикладной сервис (пересылку файлов, гипертекстовой информации, почты и т.д.). Одним из наиболее молодых и популярных сервисов Интернет, развитие которого и привело к всплеску популярности самой Интернет, стала World Wide Web (WWW), основанная на протоколе HTTP (Hyper Text Transfer Protocol - протокол передачи гипертекстовой информации). Гипертекстовые документы, представленные в WWW, имеют одно принципиальное отличие от традиционных гипертекстовых документов - связи, в них использующиеся, не ограничены одним документом, и более того, не ограничены одним компьютером. Для подготовки гипертекстовых документов используется язык HTML (Hyper Text Markup Language - язык разметки гипертекстовых документов), предоставляющий широкие возможности по форматированию и структурной разметке документов, организации связей между различными документами, средства включения графической и мультимедийной информации. HTML-документы просматриваются с помощью специальной программы - браузера. Наибольшее распространение в настоящее время получили браузеры Navigator компании Netscape (NN) и Internet Explorer компании Microsoft (MSIE). Реализации NN доступны практически для всех современных программных и аппаратных платформ, реализации MSIE доступны для всех Windows платформ, Macintosh и некоторых коммерческих Unix-систем.

HTML-документ состоит из текста, представляющего собой содержание документа, и тегов , определяющих его структуру и внешний вид при отображении браузером. Простейший html-документ выглядит следующим образом:

Название

Тело документа

Как видно из примера, тег представляет собой ключевое слово, заключенное в угловые скобки. Различают одинарные теги, как, например,

, и парные, как , в последнем случае действие тега распространяется только на текст между его открывающей и закрывающей скобкой. Теги также могут иметь параметры - например, при описании страницы можно задать цвет фона, цвет шрифта и т.д.: text= «black»> .

Текст всего документа заключается в теги , сам документ разбивается на две части - заголовок и тело. Заголовок описывается тегами , в которые могут быть включены название документа (с помощью тегов </i>) и другие параметры, использующиеся браузером при отображении документа. Тело документа заключено в теги <i><body> </i> и содержит собственно информацию, которую видит пользователь. При отсутствии тегов форматирования весь текст выводится в окно браузера сплошным потоком, переводы строк, пробелы и табуляции рассматриваются как пробельные символы, несколько <a href="/the-security-of-your-computer/defis-html-simvol-probelnye-simvoly-v-html-tabulyaciya-v-html-nerazryvnyi-probel-v-html.html">пробельных символов</a>, идущих подряд, заменяются на один. Для форматирования используются следующие основные теги:</p> <p><p>Начало нового абзаца, может иметь параметр, определяющий выравнивание:</p> <p> <p>Перевод строки в пределах текущего абзаца;</p> <p><u></u> - выделение текста подчеркиванием</p> <p>Ссылка на другой документ устанавливается с помощью тега <i><a href= «URL»>…</a> </i>, где URL - полный или относительный адрес документа. При этом текст, заключенный в тег <a>, обычно выделяется подчеркиванием и цветом, и после щелчка мышью по этой ссылке браузер открывает документ, адрес которого указан в параметре href. Графические изображения вставляются в документ с помощью тега <i><img src='/useful-programs/kriterii-vybora-sredstv-razrabotki-web-prilozhenii-yazyki-i-sredstva.html' loading=lazy> </i>.</p> <p><u><b>PHP </b> </u></p> <p>PHP (англ. PHP: HyperText Preprocessor - «PHP: препроцессор гипертекста», англ. Personal Home Page Tools (устар.) - «Инструменты для создания персональных веб-страниц») - скриптовый язык программирования <a href="/useful-programs/semanticheskii-sposob-izmereniya-informacii-sushchnost-osnovnye-ponyatiya-i.html">общего назначения</a>, интенсивно применяемый для разработки веб-приложений. В настоящее время поддерживается подавляющим большинством хостинг-провайдеров и является одним из лидеров среди языков программирования.</p> <p>РНР - язык, специально нацеленный на работу в Интернете, с универсальным и ясным синтаксисом, сильно похожим на С, сочетающий достоинства Perl и С. Позволяет встраивать программный код в HTML-документы. Мы можем привлекать его для формирования HTML-документов и избавиться от множества вызовов внешних сценариев. Этот язык используется на порядка миллиона серверов по всему миру, и их количество продолжает расти. Новое поколение РНР5 - должно стереть все преимущества Perl перед РНР, как с точки зрения быстродействия обработки программ (а третья и четвертая версии РНР сильно отставали от Perl при обработке <a href="/useful-programs/cikl-bolshego-znacheniya-indeksa-k-menshemu-vba-cikly-vba-cikly-mogut-byt.html">больших циклов</a>), так и с точки зрения синтаксиса. Наконец, большинство PHP-сценариев (особенно не очень больших размеров) работают быстрее аналогичных им программ, написанных на Perl.</p> <p><u><b>РНР версии 5 </b> </u></p> <p>Конечно, прежде всего, еще немного возросла скорость работы. Этим мы обязаны переходу на новое ядро системы - Zend Engine 2. Но главная причина смены номера версии с 4 на 5 - это существенное улучшение объектно-ориентированных возможностей РНР и встраивание в ядро интерпретатора двух мощных библиотек: СУБД SQLite и модуля для работы с XML.</p> <p>РНР версии 5 совместим с РНР 4 значительно лучше, чем РНР 4 с РНР 3. Это значит, что программы, разрабатывающиеся в расчете на РНР версии 4, с высокой вероятностью заработают на РНР 5 без всяких изменений.</p> <p>Популярность в области построения веб-сайтов определяется наличием большого набора встроенных средств для разработки веб-приложений. Основные из них:</p> <ul><li>· автоматическое извлечение POST и GET-параметров, а также переменных окружения веб-сервера в предопределённые массивы;</li> <li>· взаимодействие с большим количеством <a href="/internet-tips/oblachnye-brauzery-fishki-maxthon-browser-zakachka-v-oblako-podderzhka-razlichnyh.html">различных систем</a> управления базами данных (MySQL, Oracle, Microsoft <a href="/solving-problems/sql-server-zapolnenie-tablicy.html">SQL Server</a>, InterBase, Paradox и др.);</li> <li>· автоматизированная отправка HTTP-заголовков;</li> <li>· работа с HTTP-авторизацией;</li> <li>· работа с cookies и сессиями;</li> <li>· работа с локальными и <a href="/computer-literacy/est-li-vyhod-iz-korziny-kak-vosstanovit-udalennye-iz-korziny-faily.html">удалёнными файлами</a>, сокетами;</li> <li>· обработка файлов, загружаемых на сервер;</li> <li>· работа с XForms;</li> </ul><p>В настоящее время PHP используется сотнями тысяч разработчиков. Согласно рейтингу корпорации TIOBE, базирующемся на данных поисковых систем, в апреле 2011 года PHP находился на 5 месте среди языков программирования.</p> <p><u><b>CSS </b> </u></p> <p>CSS (англ. Cascading Style Sheets - каскадные таблицы стилей) - язык описания внешнего вида документа, написанного с использованием языка разметки, мощный механизм управления представлением отдельных документов или их наборов.</p> <p>CSS используется создателями веб-страниц для задания цветов, шрифтов, расположения и других аспектов представления документа. Основной целью разработки CSS являлось разделение содержимого (написанного на HTML или другом языке разметки) и представления документа (написанного на CSS). Это разделение может увеличить доступность документа, предоставить большую гибкость и возможность управления его представлением, а также уменьшить сложность и повторяемость в структурном содержимом. Кроме того, CSS позволяет представлять один и тот же документ в различных стилях или методах вывода.</p> <p>До появления CSS оформление веб-страниц осуществлялось исключительно средствами HTML, непосредственно внутри содержимого документа. Однако с появлением CSS стало возможным принципиальное разделение содержания и представления документа. За счёт этого нововведения стало возможным лёгкое применение единого стиля оформления для массы схожих документов, а также быстрое изменение этого оформления.</p> <p><b>Преимущества: </b></p> <p>Несколько дизайнов страницы для <a href="/the-security-of-your-computer/opisanie-lenovo-tab-2-a10-70l-informaciya-o-razmerah-i-vese-ustroistva.html">разных устройств</a> просмотра. Например, на экране дизайн будет рассчитан на большую ширину, во время печати меню не будет выводиться, а на КПК и <a href="/configuring-wi-fi/kto-izobrel-sotovyi-telefon-gde-i-kogda-poyavilsya-pervyi-sotovyi.html">сотовом телефоне</a> меню будет следовать за содержимым.</p> <p>Уменьшение времени загрузки страниц сайта за счет переноса правил представления данных в отдельный CSS-файл. В этом случае браузер загружает только структуру документа и данные, хранимые на странице, а представление этих данных загружается браузером только один раз и могут быть закешированы.</p> <p>Простота последующего изменения дизайна. Не нужно править каждую страницу, а лишь изменить CSS-файл.</p> <p>Дополнительные возможности оформления. Например, с помощью CSS-вёрстки можно сделать блок текста, который остальной текст будет обтекать (например для меню) или сделать так, чтобы меню было всегда видно при прокрутке страницы.</p> <p><b>Недостатки: </b></p> <p>Различное отображение вёрстки в различных браузерах (особенно устаревших), которые по разному интерпретируют одни и те же данные CSS.</p> <p>Часто встречающаяся необходимость на практике исправлять не только один CSS-файл, но и <a href="/useful-programs/br-html-tag-forced-break-the-main-options-for-solving-the-problem-of-word-transfer-in-css.html">теги HTML</a>, которые сложным и ненаглядным способом связаны с селекторами CSS, что иногда сводит на нет простоту применения единых файлов стилей и значительно удлиняет время редактирования и тестирования.</p> <p><u><b>MySQL </b> </u></p> <p>Сегодня трудно себе представить сколько-нибудь значимую <a href="/hardware-solutions/lyubaya-informacionnaya-sistema-chto-takoe-informacionnaya-sistema.html">информационную систему</a>, которая не имела бы в качестве важной составляющей базу данных. Концепции и технологии баз данных складывались постепенно и всегда были тесно связаны с развитием систем автоматизированной обработки информации.</p> <p>Базы данных создаются для хранения и доступа к данным содержащим сведения о некоторой предметной области, или как в нашем случае прайс-лист, то есть в области человеческой деятельности, что в свою очередь упрощает работу и повышает эффективность труда. Это обусловлено динамичным развитием и разнообразием систем управления базами данных.</p> <p><u>MySQL </u> - свободная система управления базами данных (СУБД). MySQL является собственностью компании Oracle Corporation, получившей её вместе с поглощённой Sun Microsystems, осуществляющей разработку и поддержку приложения.</p> <p>MySQL является решением для малых и средних приложений. Входит в состав серверов WAMP, LAMP и в портативные сборки серверов Денвер, XAMPP. Обычно MySQL используется в качестве сервера, к которому обращаются локальные или удалённые клиенты, однако в дистрибутив входит библиотека внутреннего сервера, позволяющая включать MySQL в автономные программы.</p> <p>Гибкость СУБД MySQL обеспечивается поддержкой большого количества типов таблиц: пользователи могут выбрать как таблицы типа MyISAM, поддерживающие полнотекстовый поиск, так и таблицы InnoDB, поддерживающие транзакции на уровне отдельных записей. Более того, СУБД MySQL поставляется со специальным типом таблиц EXAMPLE, демонстрирующим принципы создания новых типов таблиц. Благодаря открытой архитектуре и GPL-лицензированию, в СУБД MySQL постоянно появляются новые типы таблиц.</p> <p>Версия MySQL 5.1 продолжает путь к стандарту SQL:2003. MySQL 5.1 содержит следующие нововведения.</p> <p>Сегментирование - возможность разбить одну большую таблицу на несколько частей, размещенных в разных <a href="/useful-programs/fleshka-flew-file-system-restoring-the-usbflash-drive-file-system.html">файловых системах</a>, основываясь на определенной пользователем функции. При определенных условиях это может дать серьезное увеличение производительности и, кроме того, облегчает масштабирование таблиц.</p> <p>Изменено поведение ряда операторов, для обеспечения большей совместимости со стандартом SQL2003.</p> <p>Построчная репликация (англ. row-based replication), при которой в бинарный лог будет записываться только информация о реально измененных строках таблицы вместо оригинального (и, возможно, медленного) текста запроса. Построчную репликацию можно использовать только для определенных типов sql-запросов, в терминах MySQL - смешанная репликация (англ. mixed replication).</p> <p>Встроенный планировщик периодически запускаемых работ. По синтаксису добавление задачи похоже на добавление триггера к таблице, по идеологии - на crontab.</p> <p>Дополнительный набор функций для <a href="/configuring-windows/avtomaticheskii-obmen-dannymi-s-pomoshchyu-obrabotki-universalnyi.html">обработки XML</a>, реализация поддержки XPath.</p> <p>Новые средства диагностики проблем и утилиты для анализа производительности. Расширены возможности по управлению содержимым лог-файлов, логи теперь могут быть сохранены и в таблицах general_log и slow_log. Утилита mysqlslap позволяет провести нагрузочное тестирование БД с записью времени реакции на каждый запрос.</p> <p>Для упрощения операции обновления подготовлена утилита mysql_upgrade, которая выполнит проверку всех <a href="/configuring-wi-fi/kak-slaid-vstavit-v-tablicu-izmenenie-tipa-sushchestvuyushchei.html">существующих таблиц</a> на предмет совместимости с <a href="/configuring-windows/license-key-for-the-new-version-of-piriform-ccleaner-download-ccleaner-professional-plus-free-with-key-russian-version.html">новой версией</a>, и при необходимости выполнит надлежащие корректировки.</p> <p>MySQL Cluster отныне выпущен как отдельный продукт, базирующийся на MySQL 5.1 и хранилище NDBCLUSTER.</p> <p>Значительные изменения в работе MySQL Cluster, такие, как, например, возможность хранения табличных данных на диске.</p> <p>Возврат к использованию встроенной библиотеки libmysqld, отсутствовавшей в MySQL 5.0.</p> <p>API для плагинов, которое позволяет загружать сторонние модули, расширяющие функциональность (например, полнотекстовый поиск), без перезапуска сервера.</p> <p>Реализация парсера полнотекстового поиска в виде plug-in.</p> <p>Новый тип таблиц Maria (устойчивый к сбоям клон MyISAM).</p> <p><u><b>Web </b>-<b>сервер Apache </b> </u></p> <p>При выполнении проекта был выбран Web-сервер Apache. Почему именно Apache? Дело в том, что это самый распространенный на <a href="/solving-problems/apple-iphone-se-2017-dizain-harakteristiki-funkcii-i-data-vyhoda-vse-chto-izvestno-na.html">данный момент</a> сервер, и вряд ли в ближайшие несколько лет он потеряет свою популярность. Он установлен у большинства хостинг-провайдеров. Кроме того, что немаловажно, существует его Windows-версия, практически идентичная по функциональности своему Unix-собрату.</p> <p>По данным компании Netcraft, общее число Web-узлов, работающих под его управлением, к концу 1998 г. достигло 2 млн. (55% общего числа узлов) и постоянно растет. Для сравнения: на долю <a href="/useful-programs/pochtovyi-server-na-windows-ustanovka-i-nastroika-pochtovogo-servera.html">серверов Microsoft</a> приходится 25%, Netscape - 7%. Будучи бесплатной <a href="/tips-for-beginners/otkryt-fail-pdf-skachat-programmu-chem-mozhno-otkryt-pdf-faily.html">открытой программой</a>, предназначенной для бесплатных же Unix-систем (FreeBSD, Linux и др.), Apache по <a href="/hardware-solutions/skachat-novyi-akrobat-gde-skachat-i-kak-ustanovit-adobe-reader-na-kompyuter.html">функциональным возможностям</a> и надежности не уступает коммерческим серверам, а широкие возможности конфигурирования позволяют настроить его для работы практически с любой конкретной системой. Существуют локализации сервера для различных языков, в том числе и для русского.</p> <p>Исторически сложилось так, что русские тексты в Internet могут быть представлены в <a href="/solving-problems/yandeks-vebmaster-proverka-indeksacii-stranicy-rabota-s.html">разных кодировках</a>, из которых наиболее распространены koi8-r (или просто koi8) и Windows-1251: с первой работает большинство серверов и рабочих станций под управлением Unix, вторая является стандартной для всех <a href="/windows-10/sozdanie-rezervnoi-kopii-draiverov-windows-sozdaem-rezervnuyu-kopiyu.html">версий Windows</a>. Поскольку кодировка Windows-1251, естественно, применяется на подавляющем большинстве клиентских машин, доля тех, кто путешествует по русской части WWW, используя koi8, не превышает сейчас 5%. Однако в этой кодировке хранятся документы на многих Unix-серверах, в ней чаще всего передаются почтовые сообщения и практически всегда - письма в телеконференции, с ней же работают многие русскоязычные каналы IRC (кстати, аббревиатура КОИ расшифровывается как «код обмена информацией»). Чтобы решить проблемы, возникающие при несовпадении кодировок текста на сервере и клиентской машине, и был создан русский модуль Apache-RUS для Web-сервера Apache.</p> <p>Одним из важных аспектов модернизации производства в России является использование информационно-коммуникационных технологий для создания информационных и <a href="/internet-tips/lokalnye-kompyuternye-seti-osnovnye-ponyatiya-topologiya-lokalnye.html">корпоративных систем</a>. Важное место в этом процессе занимают web-технологии, которые становятся основным инструментом организации единого информационного пространства.</p><p>Современный человек должен уметь использовать web-сайты в своей профессиональной деятельности и в самообразовании. Под использованием здесь понимается не просто поиск, анализ и включение в производственный процесс как средства работы, но и умение <i>создавать </i> web-сайты, предназначенные для решения различных задач.</p><p>Существует множество программных средств и технологий для создания и редактирования web-сайтов.</p><h2>Раздел 1. Общие сведения о www-сервисе Интернет.</h2><p><b>Интернет </b>- всемирная система объединённых компьютерных сетей, построенная на использовании семейства протоколов <b>Т </b><b>CP </b><b>/IP </b> и маршрутизации пакетов данных. В общем случае под протоколом понимается набор инструкций, регламентирующих работу взаимосвязанных систем или объектов в сети. Интернет образует глобальное информационное пространство, не имеет единого центра и единой администрации. Общую координацию его деятельности осуществляют международные организации, членами которых являются наиболее авторитетные эксперты из разных стран.</p><p>Настоящий расцвет Интернета начался в 1992 году, когда была изобретена новая служба, получившая название "<b>Всемирная паутина </b>" (<b>World </b><b>Wide </b><b>Web </b>, или <b>WWW </b>, или просто <b>WEB </b>). WWW позволял любому пользователю Интернета публиковать свои текстовые и графические материалы в привлекательной форме, связывая их с публикациями других авторов и предоставляя удобную систему навигации. Интернет стал превращаться из средства переписки и обмена файлами в гигантское хранилище информации.</p><h2>1.1. Основные понятия.</h2><p>Все компьютеры, подключенные к сети Интернет, имеют свой уникальный <b>IP </b><b>-адрес </b>. Для удобства крупным узлам сети присваивают собственные (доменные) имена (служба <b>DNS </b>). Ресурсы, доступные пользователям Интернет, располагаются на компьютерах <b>серверах </b>, на которых установлено специальное программное обеспечение, обеспечивающее передачу информации. Для работы с ресурсами Интернет, на пользовательских компьютерах устанавливаются <b>программы-клиенты </b>.</p><p>Пара клиент-сервер, обеспечивающая совместный доступ к определенному типу информационных ресурсов называется <b>службой </b> или <b>сервисом </b> (WWW, FTP, E-mail, IRC). Каждая из них использует свой протокол передачи данных из семейства TCP/IP. Т.е. работа пользователя с Интернет может осуществляться разными способами, отличающимися по форме представления ресурсов и средствам (протоколом) доступа к ним. Некоторые из них (наиболее ранние) отмирают, другие находятся в процессе активного развития.</p><p>В основе каждого сервиса лежит свой сетевой протокол семейства TCP/IP- совокупность четко определенных правил: как запрашивать, оформлять и высылать по Сети данную разновидность информации.</p><p>Наиболее популярным в настоящее время является сервис <b>World Wide Web </b> (Всемирная паутина). Он не только удобен в использовании, но и обеспечивает доступ к другим службам Интернет. World Wide Web (уорлд вайд вэб) - это гипертекстовая<i>, </i>гипермедийная, распределенная, интегрирующая, глобальная информационно-поисковая система в Интернет.</p><p>Передача данных во Всемирной паутине осуществляется благодаря протоколу передачи гипертекста - <b>HTTP </b> (HyperText Transmission Protocol). HTTP – протокол прикладного уровня, разработанный для обмена гипертекстовой информацией в сети Интернет. Протокол используется в сети WWW с 1990 года.</p><p>WWW работает по принципу клиент-сервер: существует множество web-серверов, которые по запросу клиента (программа-браузер) возвращают ему гипермедийный документ - документ, состоящий из частей с разнообразным представлением информации (текст, графика, аудио, видео), в котором каждый элемент может являться ссылкой на другой документ или его часть. Каждый информационный web-ресурс в <a href="/computer-literacy/referat-struktura-i-osnovnye-principy-postroeniya-seti-internet-problemy-i.html">глобальной сети</a> Интернет однозначно адресуется, и документ, способен ссылаться как на другие документы на этом же сервере, так и на документы, расположенные на других web-серверах Интернет. Причем пользователь не замечает этого, и работает со всем информационным пространством Интернет как с единым целым. Ссылки WWW указывают не только на документы, специфичные для самой WWW, но и на прочие сервисы и информационные ресурсы Интернет. Более того, большинство программ-клиентов WWW не просто понимают такие ссылки, но и являются программами-клиентами соответствующих сервисов: ftp, gopher, сетевых новостей Usenet, <a href="/tips-for-beginners/kak-sozdat-papku-v-elektronnoi-pochte-kak-sozdat-novuyu-papku-v-yandeks.html">электронной почты</a> и т.д. Таким образом, <a href="/computer-literacy/interaktivnaya-prezentaciya-na-temu-programmirovanie-yazyki.html">программные средства</a> WWW являются универсальными для различных сервисов Интернет, а сама информационная система WWW играет интегрирующую роль.</p><p>За годы развития WWW-сервиса был создан целый ряд программ-браузеров. В российской практике название "браузер" закрепилось достаточно прочно, хотя в некоторых случаях употребляется и прямой перевод на русский язык - "программа-просмотрщик". Также браузер иногда называют обозревателем или навигатором. Сегодня в мире существует не менее десятка различных браузеров. К наиболее распространенным относятся Internet Explorer (компания Microsoft), Netscape Navigator (компания Netscape/AOL), Opera (компания Opera Software) и Mozilla. Все браузеры имеют свои достоинства и недостатки, которые складываются из скорости работы, способности отрывать те или иные приложения, соответствие требованиям безопасности при работе в Сети. Естественно на популярность браузеров накладывает отпечаток и распространенность в мире тех или иных операционных систем.</p><p>Сервис WWW использует <b>U </b><b>R </b><b>L </b> (Uniform Resource Locator, Универсальный локатор ресурсов) для адресации документов, расположенных на информационных web-серверах Интернет. URL-адрес включает в себя название протокола (обычно http), по которому осуществляется доступ к ресурсу, адреса сервера (например: www.tstu.ru), полный путь (например: /win/kultur/museum/chiherin/) и имя (например: 0.htm) хранящегося там файла (получаем url-адрес: http://www.tstu.ru/win/kultur/museum/chiherin/0.htm).</p><p>В основе <a href="/useful-programs/internet-kak-vsemirnaya-pautina-vsemirnaya-pautina-pochemu.html">Всемирной паутины</a> лежит технология <b>гипертекста </b>. Изобретенный в начале 1990 годов язык разметки гипертекста<i> - </i><b>HTML </b> (HyperText Markup Language) позволяет легко включать в WWW-документы, из которых в основном и состоит WWW, самые разные типы объектов и делать ссылки на другие файлы, вне зависимости от того, где они находятся.</p><p>Документы WWW называются <b>web </b><b>-страницами </b> и включают в себя различные информационные элементы (текст, графика, звук, видео), а также <b>гиперссылки </b> на другие ресурсы Интернет. Несколько страниц, объединенных по смыслу, содержанию и оформлению - называются <b>web-сайтом </b>.</p><p>Web-страница представляет собой текстовый файл с расширением htm или html, который содержит текстовую информацию и специальные команды - <b>HTML </b><b>-тэги </b>, определяющие в каком виде эта информация будет отображаться в окне браузера. Вся графическая, аудио- и видео информация непосредственно в web-страницу не входит и представляет собой отдельные файлы с расширениями *.gif, *.jpg (графика), *.mid, *.mp3 (звук), *.avi (видео). В HTML-коде страницы содержатся только указания на такие файлы.</p><p>Переход между страницами web-сайта в браузере осуществляется с помощью гиперссылок. <b>Гиперссылка </b> представляет собой выделенный фрагмент текста или изображения, при наведении на который указатель мыши принимает форму кисти руки с вытянутым пальцем. При нажатии на гиперссылку левой кнопкой мыши осуществляется переход на другой электронный документ, который может находиться как на этом web-сервере, так и на другом. Для организации гиперссылки в содержимое web-страницы вставляется специальный HTML-код, содержащий url-адрес этого <a href="/tips-for-beginners/kipet-otpravit-kopiyu-sebe-kak-otpravit-dokument-po.html">электронного документа</a>. Для организации гиперссылки необходимо знать местоположение информационного ресурса, которое в WWW-сервисе может быть определено в абсолютной и относительной форме.</p><p>Адресация в <i><b>абсолютной форме </b> </i> - универсальный адрес, определяющий местонахождение информационного ресурса, носит название URL (Uniform Resource Locator - унифицированный адрес ресурса). URL состоит из двух частей, разделенных двоеточием. Первая часть указывает на тип сетевого протокола, который зависит от типа ресурса (например, если ресурс располагается на WWW-сервере, это протокол http). Вторая часть включает в себя имя web-сервера в доменной системе имен (например, www.tstu.ru) и, если требуется, путевое имя файла (например, win/kultur/nauka/vernad/vertitul.htm). При записи путевого имени названия каталогов разделяются прямой косой чертой (символ /); в именах файлов и каталогов различаются прописные и строчные буквы.</p><p>Вот пример URL: http://www.tstu.ru/win/kultur/nauka/vernad/vertitul.htm.</p><p>В случае использования адресации в <i><b>относительной форме </b> </i> при записи пути к файлу названия каталогов разделяются прямой косой чертой (/); переход по каталогам компьютера на один уровень вверх обозначается двумя точками (..).</p><p>Если гиперссылка ссылается на документ не являющийся web-страницей, то возможны два варианта его отображения. Если браузер имеет встроенные модули для обработки такого документа, то его содержимое будет отображаться в окне браузера. В противном случае, браузер запустит необходимое внешнее приложение (в Windows, например, они прописаны в реестре), и документ будет отображаться уже не в окне браузера.</p> <br> <br> <script>document.write("<img style='display:none;' src='//counter.yadro.ru/hit;artfast_after?t44.1;r"+ escape(document.referrer)+((typeof(screen)=="undefined")?"": ";s"+screen.width+"*"+screen.height+"*"+(screen.colorDepth? screen.colorDepth:screen.pixelDepth))+";u"+escape(document.URL)+";h"+escape(document.title.substring(0,150))+ ";"+Math.random()+ "border='0' width='1' height='1' loading=lazy>");</script> </div> </article> <div class="entry-footer"> <span class="entry-meta__comments" title="Комментариев"><span class="fa fa-comment-o"></span> </span> <span class="entry-meta__views" title="Просмотров"><span class="fa fa-eye"></span> </span> </div> <div class="b-share b-share--post"> <div class="b-share__title">Понравилась статья? Поделиться с друзьями:</div> <span class="b-share__ico b-share__vk js-share-link" data-uri="http://vk.com/share.php?url=https%3A%2F%2Fcrabo.ru%2Fbeg-na-begovoj-dorozhke%2F"></span><span class="b-share__ico b-share__fb js-share-link" data-uri="http://www.facebook.com/sharer.php?u=https%3A%2F%2Fcrabo.ru%2Fuseful-programs%2Fkriterii-vybora-sredstv-razrabotki-web-prilozhenii-yazyki-i-sredstva.html"></span><span class="b-share__ico b-share__tw js-share-link" data-uri="http://twitter.com/share?text=https%3A%2F%2Fcrabo.ru%2Fuseful-programs%2Fkriterii-vybora-sredstv-razrabotki-web-prilozhenii-yazyki-i-sredstva.html"></span> <span class="b-share__ico b-share__ok js-share-link" data-uri="https://connect.ok.ru/dk?st.cmd=WidgetSharePreview&service=odnoklassniki&st.shareUrl=https%3A%2F%2Fcrabo.ru%2Fuseful-programs%2Fkriterii-vybora-sredstv-razrabotki-web-prilozhenii-yazyki-i-sredstva.html"></span><span class="b-share__ico b-share__gp js-share-link" data-uri="https://plus.google.com/share?url=https%3A%2F%2Fcrabo.ru%2Fuseful-programs%2Fkriterii-vybora-sredstv-razrabotki-web-prilozhenii-yazyki-i-sredstva.html"></span><span class="b-share__ico b-share__whatsapp js-share-link js-share-link-no-window" data-uri="whatsapp://send?text=https%3A%2F%2Fcrabo.ru%2Fuseful-programs%2Fkriterii-vybora-sredstv-razrabotki-web-prilozhenii-yazyki-i-sredstva.html"></span> <span class="b-share__ico b-share__viber js-share-link js-share-link-no-window" data-uri="viber://forward?text=https%3A%2F%2Fcrabo.ru%2Fuseful-programs%2Fkriterii-vybora-sredstv-razrabotki-web-prilozhenii-yazyki-i-sredstva.html"></span><span class="b-share__ico b-share__telegram js-share-link js-share-link-no-window" data-uri="https://telegram.me/share/url?url=https%3A%2F%2Fcrabo.ru%2Fuseful-programs%2Fkriterii-vybora-sredstv-razrabotki-web-prilozhenii-yazyki-i-sredstva.html"></span> </div> <div class="b-related"> <div class="b-related__header"><span>Вам также может быть интересно</span></div> <div class="b-related__items"> <article id="post-313956" class="post-card post-313956 post type-post status-publish format-standard has-post-thumbnail hentry" itemscope itemtype="http://schema.org/BlogPosting"> <div class="post-card__image"> <a href="/computer-literacy/udalenie-modov-wot-kak-udalit-mody-v-world-of-tanks-chistka-sistemy-vruchnuyu.html"> <img width="330" height="140" src="/uploads/07821112ef7d20d52b0b4e82892d4470.jpg" class="attachment-thumb-wide size-thumb-wide wp-post-image" alt="Как удалить моды в World of Tanks?" itemprop="image" sizes="(max-width: 330px) 100vw, 330px" / loading=lazy> <div class="entry-meta"> <span class="entry-category"><span itemprop="articleSection">Компьютерная грамотность</span></span> </div> </a> </div> <header class="entry-header"> <div class="entry-title" itemprop="name"><a href="/computer-literacy/udalenie-modov-wot-kak-udalit-mody-v-world-of-tanks-chistka-sistemy-vruchnuyu.html" rel="bookmark" itemprop="url"><span itemprop="headline">Критерии выбора средств разработки web приложений. Языки и средства создания web-приложений. Расширяемая среда проектирования пользовательского интерфейса web-приложения</span></a></div> </header> <div class="post-card__content" itemprop="articleBody">При подготовке использовались материалы: «HTML Editors and Web Page Editors» , «Best free web development IDE for JavaScript, HTML and CSS» , «Cloud IDEs For Web Developers – Best Of» .Существует...</div> </article> <article id="post-313955" class="post-card post-313955 post type-post status-publish format-standard has-post-thumbnail hentry" itemscope itemtype="http://schema.org/BlogPosting"> <div class="post-card__image"> <a href="/computer-literacy/zakachat-na-mainkraft-mod-po-instrukcii-kak-ustanovit-mody-v.html"> <img width="330" height="140" src="/uploads/25588fd943643de2723bb9f404a92d07.jpg" class="attachment-thumb-wide size-thumb-wide wp-post-image" alt="Как установить моды в Minecraft?" itemprop="image" sizes="(max-width: 330px) 100vw, 330px" / loading=lazy> <div class="entry-meta"> <span class="entry-category"><span itemprop="articleSection">Компьютерная грамотность</span></span> </div> </a> </div> <header class="entry-header"> <div class="entry-title" itemprop="name"><a href="/computer-literacy/zakachat-na-mainkraft-mod-po-instrukcii-kak-ustanovit-mody-v.html" rel="bookmark" itemprop="url"><span itemprop="headline">Критерии выбора средств разработки web приложений. Языки и средства создания web-приложений. Расширяемая среда проектирования пользовательского интерфейса web-приложения</span></a></div> </header> <div class="post-card__content" itemprop="articleBody">При подготовке использовались материалы: «HTML Editors and Web Page Editors» , «Best free web development IDE for JavaScript, HTML and CSS» , «Cloud IDEs For Web Developers – Best Of» .Существует...</div> </article> <article id="post-313952" class="post-card post-313952 post type-post status-publish format-standard has-post-thumbnail hentry" itemscope itemtype="http://schema.org/BlogPosting"> <div class="post-card__image"> <a href="/tips-for-beginners/chto-delat-esli-ne-robit-myshka-prichiny-po-kotorym-ne-rabotaet-myshka.html"> <img width="330" height="140" src="/uploads/4aa3dfc3fd736adefeec1fa8641f4a8d.jpg" class="attachment-thumb-wide size-thumb-wide wp-post-image" alt="Причины по которым не работает мышка" itemprop="image" sizes="(max-width: 330px) 100vw, 330px" / loading=lazy> <div class="entry-meta"> <span class="entry-category"><span itemprop="articleSection">Советы начинающим</span></span> </div> </a> </div> <header class="entry-header"> <div class="entry-title" itemprop="name"><a href="/tips-for-beginners/chto-delat-esli-ne-robit-myshka-prichiny-po-kotorym-ne-rabotaet-myshka.html" rel="bookmark" itemprop="url"><span itemprop="headline">Критерии выбора средств разработки web приложений. Языки и средства создания web-приложений. Расширяемая среда проектирования пользовательского интерфейса web-приложения</span></a></div> </header> <div class="post-card__content" itemprop="articleBody">При подготовке использовались материалы: «HTML Editors and Web Page Editors» , «Best free web development IDE for JavaScript, HTML and CSS» , «Cloud IDEs For Web Developers – Best Of» .Существует...</div> </article> <article id="post-313946" class="post-card post-313946 post type-post status-publish format-standard has-post-thumbnail hentry" itemscope itemtype="http://schema.org/BlogPosting"> <div class="post-card__image"> <a href="/the-security-of-your-computer/vse-chto-nuzhno-znat-o-besprovodnoi-zaryadke-qi-besprovodnye-zaryadki-i.html"> <img width="330" height="140" src="/uploads/b2d5a018f646d978a7ae6190d6290e74.jpg" class="attachment-thumb-wide size-thumb-wide wp-post-image" alt="Qi: беспроводные зарядки и совместимые устройства Ци зарядное устройство" itemprop="image" sizes="(max-width: 330px) 100vw, 330px" / loading=lazy> <div class="entry-meta"> <span class="entry-category"><span itemprop="articleSection">Безопасность компьютера</span></span> </div> </a> </div> <header class="entry-header"> <div class="entry-title" itemprop="name"><a href="/the-security-of-your-computer/vse-chto-nuzhno-znat-o-besprovodnoi-zaryadke-qi-besprovodnye-zaryadki-i.html" rel="bookmark" itemprop="url"><span itemprop="headline">Критерии выбора средств разработки web приложений. Языки и средства создания web-приложений. Расширяемая среда проектирования пользовательского интерфейса web-приложения</span></a></div> </header> <div class="post-card__content" itemprop="articleBody">При подготовке использовались материалы: «HTML Editors and Web Page Editors» , «Best free web development IDE for JavaScript, HTML and CSS» , «Cloud IDEs For Web Developers – Best Of» .Существует...</div> </article> <article id="post-313945" class="post-card post-313945 post type-post status-publish format-standard has-post-thumbnail hentry" itemscope itemtype="http://schema.org/BlogPosting"> <div class="post-card__image"> <a href="/configuring-wi-fi/kak-udalit-avg-s-kompyutera-polnostyu-kak-udalit-avg-antivirus.html"> <img width="330" height="140" src="/uploads/52aab2c713b419525291e3cb647f9d2a.jpg" class="attachment-thumb-wide size-thumb-wide wp-post-image" alt="Как удалить AVG антивирус" itemprop="image" sizes="(max-width: 330px) 100vw, 330px" / loading=lazy> <div class="entry-meta"> <span class="entry-category"><span itemprop="articleSection">Настройка Wi-Fi</span></span> </div> </a> </div> <header class="entry-header"> <div class="entry-title" itemprop="name"><a href="/configuring-wi-fi/kak-udalit-avg-s-kompyutera-polnostyu-kak-udalit-avg-antivirus.html" rel="bookmark" itemprop="url"><span itemprop="headline">Критерии выбора средств разработки web приложений. Языки и средства создания web-приложений. Расширяемая среда проектирования пользовательского интерфейса web-приложения</span></a></div> </header> <div class="post-card__content" itemprop="articleBody">При подготовке использовались материалы: «HTML Editors and Web Page Editors» , «Best free web development IDE for JavaScript, HTML and CSS» , «Cloud IDEs For Web Developers – Best Of» .Существует...</div> </article> <article id="post-313941" class="post-card post-313941 post type-post status-publish format-standard has-post-thumbnail hentry" itemscope itemtype="http://schema.org/BlogPosting"> <div class="post-card__image"> <a href="/useful-programs/kak-nauchit-malysha-polzovatsya-nozhnicami-missiya-vypolnima-kak.html"> <img width="330" height="140" src="/uploads/122ae1bcfd9bb6ab3e9df903e7c56def.jpg" class="attachment-thumb-wide size-thumb-wide wp-post-image" alt="Миссия выполнима: как научить родителей пользоваться смартфоном?" itemprop="image" sizes="(max-width: 330px) 100vw, 330px" / loading=lazy> <div class="entry-meta"> <span class="entry-category"><span itemprop="articleSection">Полезные программы</span></span> </div> </a> </div> <header class="entry-header"> <div class="entry-title" itemprop="name"><a href="/useful-programs/kak-nauchit-malysha-polzovatsya-nozhnicami-missiya-vypolnima-kak.html" rel="bookmark" itemprop="url"><span itemprop="headline">Критерии выбора средств разработки web приложений. Языки и средства создания web-приложений. Расширяемая среда проектирования пользовательского интерфейса web-приложения</span></a></div> </header> <div class="post-card__content" itemprop="articleBody">При подготовке использовались материалы: «HTML Editors and Web Page Editors» , «Best free web development IDE for JavaScript, HTML and CSS» , «Cloud IDEs For Web Developers – Best Of» .Существует...</div> </article> </div> </div> <meta itemscope itemprop="mainEntityOfPage" itemType="https://schema.org/WebPage" itemid="/beg-na-begovoj-dorozhke/" /> <meta itemprop="dateModified" content="2017-05-13" /> <meta itemprop="datePublished" content="2016-10-28T11:16:04+00:00" /> <script> var mt_cid = 43603314 </script> <script async="async" src="https://adcounter14.uptolike.com/counter.js?sid=stf22ceea420b22686332c72fa963f260cb21fbe9e" type="text/javascript"></script> </main> </div> </div> <aside id="secondary" class="widget-area" itemscope itemtype="http://schema.org/WPSideBar"> <div id="search-2" class="widget widget_search"> <form role="search" method="get" id="searchform" action="/" class="search-form"> <label class="screen-reader-text" for="s">Поиск: </label> <input type="text" value="" name="s" id="s" class="search-form__text"> <button type="submit" id="searchsubmit" class="search-form__submit"></button></form> </div> <div id="text-13" class="widget widget_text"> <div class="textwidget"> <div id="luqusa1" style="height:500px;width:300px;" align="center"></div> </div> </div> <div id="wpshop_articles-3" class="widget widget_wpshop_articles"> <div class="widget-header">Популярные материалы</div> <div class="widget-article"> <div class="widget-article__image"><a href="/internet-tips/kak-razmorozit-staruyu-stranicu-vkontakte-kak-razmorozit-stranicu-vk-kak.html"> <img width="330" height="140" src="/uploads/4ce592026afd12f881271436d0442786.jpg" class="attachment-thumb-wide size-thumb-wide wp-post-image" alt="Как разморозить страницу вк" / loading=lazy> </a> </div> <div class="widget-article__body"> <div class="widget-article__title"><a href="/internet-tips/kak-razmorozit-staruyu-stranicu-vkontakte-kak-razmorozit-stranicu-vk-kak.html">Как разморозить страницу вк</a></div> </div> </div> <div class="widget-article"> <div class="widget-article__image"><a href="/windows-10/universalnyi-draiver-adb-na-vindovs-7-ruchnaya-ustanovka-draivera-adb.html"> <img width="330" height="140" src="/uploads/a3a92a93555307fa1628ad808504b541.jpg" class="attachment-thumb-wide size-thumb-wide wp-post-image" alt="Ручная установка драйвера ADB" / loading=lazy> </a> </div> <div class="widget-article__body"> <div class="widget-article__title"><a href="/windows-10/universalnyi-draiver-adb-na-vindovs-7-ruchnaya-ustanovka-draivera-adb.html">Ручная установка драйвера ADB</a></div> </div> </div> <div class="widget-article"> <div class="widget-article__image"><a href="/the-security-of-your-computer/umenshit-skorost-proslushivaniya-v-windows-media-player-kak-izmenit.html"> <img width="330" height="140" src="/uploads/81af9e75603bb8bb4e3e83125498e4d7.jpg" class="attachment-thumb-wide size-thumb-wide wp-post-image" alt="Как изменить скорость воспроизведения видео на YouTube" / loading=lazy> </a> </div> <div class="widget-article__body"> <div class="widget-article__title"><a href="/the-security-of-your-computer/umenshit-skorost-proslushivaniya-v-windows-media-player-kak-izmenit.html">Как изменить скорость воспроизведения видео на YouTube</a></div> </div> </div> <div class="widget-article"> <div class="widget-article__image"><a href="/useful-programs/sony-xperia-tipo-tehnicheskie-harakteristiki-instrukciya-nastroiki-otzyvy.html"> <img width="330" height="140" src="/uploads/1c56f330a465bb1c18788da228856b3a.jpg" class="attachment-thumb-wide size-thumb-wide wp-post-image" alt="Полный обзор Sony Xperia tipo dual: двойственный типаж Wi-Fi - это технология, которая обеспечивает беспроводную связь для передачи данных на близкие расстояния между разли" / loading=lazy> </a> </div> <div class="widget-article__body"> <div class="widget-article__title"><a href="/useful-programs/sony-xperia-tipo-tehnicheskie-harakteristiki-instrukciya-nastroiki-otzyvy.html">Полный обзор Sony Xperia tipo dual: двойственный типаж Wi-Fi - это технология, которая обеспечивает беспроводную связь для передачи данных на близкие расстояния между разли</a></div> </div> </div> <div class="widget-article"> <div class="widget-article__image"><a href="/the-security-of-your-computer/soni-iksperiya-z3-ili-obzor-sravnenie-sony-xperia-z3-i-xperia-z2-mobilnaya.html"> <img width="330" height="140" src="/uploads/5ceadc8028c2cdd9bc8e83c77569b9cb.jpg" class="attachment-thumb-wide size-thumb-wide wp-post-image" alt="Обзор-сравнение Sony Xperia Z3 и Xperia Z2" / loading=lazy> </a> </div> <div class="widget-article__body"> <div class="widget-article__title"><a href="/the-security-of-your-computer/soni-iksperiya-z3-ili-obzor-sravnenie-sony-xperia-z3-i-xperia-z2-mobilnaya.html">Обзор-сравнение Sony Xperia Z3 и Xperia Z2</a></div> </div> </div> </div> <div id="wpshop_articles-2" class="widget widget_wpshop_articles"> <div class="widget-header">Рекомендуем</div> <div class="widget-article"> <div class="widget-article__image"><a href="/configuring-windows/ustanovka-vindovs-s-fleshki-cherez-bios-ustanovka-vindovs-s-fleshki-cherez-bios.html"> <img width="330" height="140" src="/uploads/0665c312e056272551c121ffc9834c73.jpg" class="attachment-thumb-wide size-thumb-wide wp-post-image" alt="Установка виндовс с флешки через биос Настройка и обновления" / loading=lazy> </a> </div> <div class="widget-article__body"> <div class="widget-article__title"><a href="/configuring-windows/ustanovka-vindovs-s-fleshki-cherez-bios-ustanovka-vindovs-s-fleshki-cherez-bios.html">Установка виндовс с флешки через биос Настройка и обновления</a></div> </div> </div> <div class="widget-article"> <div class="widget-article__image"><a href="/windows-10/pravilnyi-perenos-windows-na-hdd-ili-ssd-perenos-sistemy-na-ssd-bez.html"> <img width="330" height="140" src="/uploads/de0e23135ed40763a7da9e5ad8f5381b.jpg" class="attachment-thumb-wide size-thumb-wide wp-post-image" alt="Перенос системы на SSD без переустановки – лучшие способы Клонирование ос windows 10 на чистый диск" / loading=lazy> </a> </div> <div class="widget-article__body"> <div class="widget-article__title"><a href="/windows-10/pravilnyi-perenos-windows-na-hdd-ili-ssd-perenos-sistemy-na-ssd-bez.html">Перенос системы на SSD без переустановки – лучшие способы Клонирование ос windows 10 на чистый диск</a></div> </div> </div> <div class="widget-article"> <div class="widget-article__image"><a href="/configuring-wi-fi/standartnaya-proshivka-nastroika-routera-d-link-bilain.html"> <img width="330" height="140" src="/uploads/f4b77ddc8ccd5144020a3b1f431161ef.jpg" class="attachment-thumb-wide size-thumb-wide wp-post-image" alt="Настройка роутера d link билайн" / loading=lazy> </a> </div> <div class="widget-article__body"> <div class="widget-article__title"><a href="/configuring-wi-fi/standartnaya-proshivka-nastroika-routera-d-link-bilain.html">Настройка роутера d link билайн</a></div> </div> </div> <div class="widget-article"> <div class="widget-article__image"><a href="/solving-problems/ustanovit-yandeks-dlya-linuks-64-bit-brauzery-dlya-linux-luchshie-brauzery-dlya.html"> <img width="330" height="140" src="/uploads/9bf599eab50d18a30245a9b61ab217c8.jpg" class="attachment-thumb-wide size-thumb-wide wp-post-image" alt="Установить яндекс для линукс 64 бит" / loading=lazy> </a> </div> <div class="widget-article__body"> <div class="widget-article__title"><a href="/solving-problems/ustanovit-yandeks-dlya-linuks-64-bit-brauzery-dlya-linux-luchshie-brauzery-dlya.html">Установить яндекс для линукс 64 бит</a></div> </div> </div> </div> <div id="text-11" class="widget widget_text"> <div class="textwidget"> <p></p> <div id="yandex_rtb_R-A-218842-11"></div> <p> </p> </div> </div> <div id="text-12" class="widget widget_text"> <div class="textwidget"> <div id="luqusa2" style="height:500px;width:300px;" align="center"></div> </div> </div> </aside> </div> <div class="footer-navigation container"> <div class="main-navigation-inner "> <div class="menu-menyu-2-container"><ul id="footer_menu" class="menu"> <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item"><a href="/feedback.html">Контакты</a></li> <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item"><a href="">О нас</a></li> <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item"><a href="">Реклама</a></li> </ul></div> </div></div> <footer class="site-footer container" itemscope itemtype="http://schema.org/WPFooter"> <div class="site-footer-inner "> <button type="button" class="scrolltop js-scrolltop"></button> <div class="footer-info"> © 2024 crabo.ru Компьютерный портал </div> <div class="footer-counters"> </div> </div></footer> </div> <script type="text/javascript"> //<![CDATA[ jQuery(document).ready(function() { cli_show_cookiebar({ settings: '{ "animate_speed_hide":"500","animate_speed_show":"500","background":"#fff","border":"#444","border_on":true,"button_1_button_colour":"#1e73be","button_1_button_hover":"#185c98","button_1_link_colour":"#ffffff","button_1_as_button":true,"button_2_button_colour":"#333","button_2_button_hover":"#292929","button_2_link_colour":"#444","button_2_as_button":true,"font_family":"inherit","header_fix":true,"notify_animate_hide":true,"notify_animate_show":false,"notify_div_id":"#cookie-law-info-bar","notify_position_horizontal":"right","notify_position_vertical":"bottom","scroll_close":false,"scroll_close_reload":false,"showagain_tab":false,"showagain_background":"#fff","showagain_border":"#000","showagain_div_id":"#cookie-law-info-again","showagain_x_position":"100px","text":"#000","show_once_yn":false,"show_once":"10000"} ' }); }); //]]> </script> <script type='text/javascript' src='https://crabo.ru/wp-content/plugins/jetpack/modules/photon/photon.js'></script> <script type='text/javascript' src='https://crabo.ru/wp-content/plugins/table-of-contents-plus/front.min.js'></script> <script type='text/javascript' src='https://crabo.ru/wp-content/plugins/wp-polls/polls-js.js'></script> <script type='text/javascript' src='https://crabo.ru/wp-content/plugins/clearfy/components/comments-plus/assets/js/url-span.js'></script> <script type='text/javascript' src='https://crabo.ru/wp-content/themes/root/js/scripts.js'></script> <script type='text/javascript' src='/wp-includes/js/comment-reply.min.js'></script> <script type='text/javascript'> var q2w3_sidebar_options = new Array(); q2w3_sidebar_options[0] = { "sidebar": "sidebar-1", "margin_top": 10, "margin_bottom": 0, "stop_id": "", "screen_max_width": 0, "screen_max_height": 0, "width_inherit": false, "refresh_interval": 1500, "window_load_hook": false, "disable_mo_api": false, "widgets": ['text-11'] }; </script> <script type='text/javascript' src='/wp-includes/js/wp-embed.min.js'></script> <script async="async" type='text/javascript' src='https://crabo.ru/wp-content/plugins/akismet/_inc/form.js'></script> </body> </html>