Логические стили определяют текст согласно заданному значению, в то время как физические стили определяют некоторые участки текста.



Введение

 

Целью данной курсовой работы является изучение языка программирования HTML5, PHP, MySQL, и, при их помощи, создание проекта сайта библиотеки.

                              


Глава 1. Основная часть

В основной части моей работы я упомяну основные понятия, используемые при создании веб-страниц, написании кода на языках программирования HTML5, PHP, CSS и MySQL, а также общие концепции интернета и браузеров, работы с программными продуктами и пользовательскому интерфейсу.

 

1.1. Word Wide Web

 

Word Wide Web – интернет или всемирная информационная сеть или «всемирная паутина», согласно данных википедии, возникла в 1962 году. Дпнный ресурс используется для обработки и хранения всей информации, статистических данных, показателей и программ образования для всех категорий населения. Что касается права на доступ и работу вовсемирной информационной сети и создание блог-сайтов и электронных форумов для выражения мнений и точек зрения - существуют тысячи Интернет-порталов.

Первой исследовательской программой в направлении быстрой передачи сообщений руководил Джозеф Ликлайдер (Joseph Carl Robnett Licklider), опубликовавший в 1962 году работу «Galactic Network». Благодаря Ликлайдеру появилась первая детально разработанная концепция компьютерной сети. К 1971 году была разработана первая программа для отправки электронной почты по сети. Эта программа сразу стала очень популярна. В 1988 году был разработан протокол Internet Relay Chat (IRC), благодаря чему в интернете стало возможно общение в реальном времени (чат). В 1989 году в Европе, в стенах Европейского совета по ядерным исследованиям (ЦЕРН) родилась концепция Всемирной паутины. Её предложил знаменитый британский учёный Тим Бернерс-Ли, он же в течение двух лет разработал протокол HTTP, язык HTML и идентификаторы URI.

 

1.1.1 Распространение интернет

 

Начиная с момента повсеместного внедрения средств мировой сети интернет приобрел огромное значение в жизни мирового сообщества. По статистике 4,157 миллиарда - количество пользователей интернета в мире (по данным Internet World Stats), из них 48,7% проживает в странах Азиатского региона. 71% - средний удельный вес времени, проведенном 1 пользователем в мире в мобильном интернете, от всего времени в Сети: 86 минут в день против 36 минут с десктопов и ноутбуков. В России мобильным интернетом пользуются от 56 млн (16+) до 66 млн чел (12 - 64 года).

В сентябре 2018 года компания Netcraft получила ответы от 1,642 миллиарда сайтов и 223 миллиона уникальных доменных имен. Цифровой Архив Интернета (The Wayback Machine - https://www.archive.org/) архивирует сеть с 1996 года. За эти годы Интернет-архив собрал более 510 миллиардов веб-объектов, в том числе 324 миллиарда веб-страниц.

Сейчас 4G-интернет обладает максимальной пропускной способностью 1 Гбит/с (в реальности сигнал намного слабее). Скорость порядка 5 Гбит/с позволит просматривать и скачивать за секунды 3D-фильмы высокого разрешения, прямую трансляцию видео сверхвысокой четкости (разрешение 3840 х 2160 или 7680 х 4320 пикселей).

2128 - такое количество IP адресов поддерживает новый протокол IPv6.

Предыдущий IPv4 протокол адресации каждого компьютера (или иного устройства подключенного к Сети), введённый в 1973 году, мог дать только 232 адресов или 4,3 миллиарда. К 2020 году будет более 20 миллиардов устройств, подключенных к Сети. Адресное пространство IPv4 закончилось еще в 2012 году. Поэтому все операторы связи вынуждены использовать механизм NAT (Network Address Translation), который позволяет одним IP-адресом или пулом адресов пользоваться нескольким десяткам тысяч конечных пользователей одновременно.

На конец 2017 года, согласно данным APNIC, доля IPv6 в общем сетевом трафике составляет лишь 14%, в России - 1,06%. 6,4 миллиарда домашних приборов, гаджетов и других устройств в мире обладают возможностью подключения к Интернету вещей (IoT).

Но развитие интернета не стоит на месте. Разрабатываются не только новые хранилища информации, но и принципиально революционные технологии. Например первая квантовая вычислительная сеть была создана в 2010 году в национальной лаборатории в Лос-Аламосе, штат Нью-Мексико (США). В мае 2013 года она состояла из основного сервера и трех клиентских машин. По этой 48-километровой сети на основе оптоволоконного кабеля можно передавать данные (включая видеофайлы), зашифрованные благодаря некоторым принципам квантовой физики.

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

Китай в августе 2016года года страна успешно отправил на орбиту Земли первый в мире спутник квантовой связи, использующий квантовую криптографию.

 

1.1.2 Концепция WWW

 

Концепцией интернета является создание единого информационного пространства, охватывающего всю планету, образование «паутины», дающей небывалую ранее возможность одномоментно найти и принять информацию из любого уголка мира. Сейчас WWW является основным источником общения между людьми.

На рис.1 показана иллюстрация того, что происходит в мировом Интернете за 1 минуту по данным Visualcapitalist.com в августе 2017

Рис.1. Заполнение 1 минуты времени в интернете

 

 Например вот некоторые данные о наиболее известных и посещаемых мессенджерах:

· в феврале  04.02.2004 в Гарвардском университете 20-тилетний студент Марк Цукерберг и несколько его соседей по комнате запускают сайт TheFacebook.com - справочник с именами, адресами и фотографиями местных студентов. Facebook стал популярен среди студентов в основном из-за удобства. Они могли организоваться по группам, курсам и интересам, которые уже существовали в вузах в оффлайне.

· Instagram был запущен в 2010 году в США. Основатели Инстаграма: Майк Кригер (25 лет, слева) и Кевин Систром (28 лет).
Число пользователей Instagram, по данным на июнь 2018, достигла 1 миллиарда человек, причем каждый день его используют 500 миллионов. Общее число размещённых на сервисе фотографий превысило 30 миллиардов.

· WhatsApp был представлен миру в 2009 году (сооснователь - Брайан Эктон). На январь 2018 года мессенджером пользовались 1,3 миллиардачеловек. Ежедневно в мессенджере пересылается 42 млрд сообщений, 1,6 млрд фотографий и 250 млн видеозаписей.

· Тwitter - создал Джек Дорси в марте 2006 года. В начале 2017 в Twitter было 328 миллионов активных пользователей в месяц.

· YouTube  - самый популярный в мире видеохостинг был создан в США в 2005 .Он создавался как сайт знакомств. Основная причина успеха Ютуб - это сервис, которого не было на других видео-хостингах: загрузка и просмотр видеороликов на сайте, поиск видео по ключевыми словами, систематизация их по разделам. Росту популярности проекта также способствовал вирусный виджет-маркетинг - ролик с Ютуб можно было встроить в свой блог или сайт. Ежемесячная аудитория Ютуб 1,8 миллиарда пользователей. И это только неавторизованные пользователи.
Ежедневно просматриваются более 1 млрд часов видео. Каждую минуту добавляется более 400 часов видео. YouTube локализован в 88 странах на 76 языках. На мобильные устройства приходится больше половины просмотров.

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

24 миллиона человек - аудитория электронной коммерции в России. 36% цифровой экономики РФ составила интернет - торговля товарами и услугами.
3,8% ВВП страны или $48,2 миллиардов составляет мобильная экономика. 50 тысяч - количество интернет-магазинов в Рунете, которых можно считать настоящими магазинами е-commerce (eTarget, март 2015 г.). По данным разных аналитических компаний признаки интернет-магазина имеют до 200 тысяч сайтов.

Интернет вещей (The Internet of Things, IoT) - это компьютерная сеть, соединяющая окружающие вас объекты. Это всевозможные устройства от IP-телевизоров до датчиков артериального давления, подключенных к интернету. Этими объектами могут быть автомобили и одежда, холодильники и зубные щетки, то есть, все вещи могут быть подключены к беспроводной сети.

Концепция IoT была озвучена в 1999 году, а бурное развитие началось в 2008-2009 годах. Сегодня к интернету уже подключено 10 миллиардов устройств. Ожидается, что к 2020 году их количество составит 50 - 60 миллиардов.

 

1.2 Создание Web-страниц с помощью языков HTML, PHP и MySQL

 

В данной курсовой работе я использую такие инструменты как язык HTML  (Hyper Text Markup Language - то есть Язык Разметки ГиперТекста), CSS (Cascading Style Sheets – каскадные таблицы стилей) , PHP (Hypertext Preprocessor - предварительный обработчик гипертекста или более ранняя аббривеатура Personal HomePage – персональны обработчик страниц), MySQL -систему управления информацией, использующую традиционный язык SQL (Structured Query Language, или язык структурированных запросов, целью котрого является определение типов данных, предоставление к ним доступа и их обработка).  

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

Язык HTML хорошо подходит для правильной манеры вёрстки сайтов благодаря своим формальным правилам и жёсткому синтаксису. Однако за почти двадцать лет прошедших со дня выпуска HTML морально устарел и уже не соответствует современным условиям. В частности, нет штатных средств для проигрывания аудио и видеороликов, нет поддержки геолокации, возможности рисовать непосредственно в браузере, не хватает некоторых элементов форм и много другого.

Часть этих проблем давно решается при помощи языка PHP и MySQL. Также повсеместно используется язык программирования JavaScript, который позволяет реализовать недостающий функционал форм и различные эффекты на странице. Но все эти технологии имеют определённые ограничения — плагины нужно устанавливать дополнительно, при этом они могут не работать, как Flash на iPhone и iPad, далеко не всё умеет и JavaScript. Популярность мобильных устройств, развитие каналов связи переместило акцент веб-технологий на мультимедиа, т.е. воспроизведение потокового аудио и видео, а также соответствующих файлов.

 

1.2.1. Язык PHP

 

PHP – язык обработки гипертекста, который сделал интернет таким, каким мы его знаем и любим. Он был разработан в 1994 году и с тех пор адаптировался и видоизменялся с учетом текущих условий и технологических прогрессивных течений. Именно благодаря этому замечательному инструменту сайты выглядят красиво и современно, а также обеспечивается удобство их использования.

Язык HTML просто компонует элементы веб-страницы в удобный для пользователя вариант. Его работа сравнима с тем, что делают текстовые редакторы, но применяя PHP и обращаясь с серверными и облачными данными как с личным хранилищем, мы имеем прекрасный результат взаимодействия больших объемов данных и их мгновенную обработку, не теряя удобства при использовании.  Технологии обработки и хранения данных на внешних серверах и обращение к ним с помощью MySQL дает возможность пользователю найти, просмотреть и запомнить невероятное количество информации в том виде, который ему удобен – тексты, аудио- и видеоматериалы, изображения, мультипликация, чаты в соцсетях и прочие невероятные и ранее недоступные возможности.

Главным отличием от HTML отличием является то, что PHP разделяется на серверный язык, а также на тот, который использует клиент. Серверный язык обрабатывает все программы на сервере, то есть главной, движущей силой этого процесса является именно сервер. Обращение к серверу происходит тогда, когда пользователь хочет зайти на любую страничку того или иного сайта, в результате браузер обрабатывает данные сервера и выдает полный рисунок, другими словами - интерфейс сайта (см.рис.2).

 

Рис.2. Схема работы серверного языка HTML и PHP

Но в отличие от HTML, на страницах которого вся информация встроена внутри страницы, в PHP происходит обращение к внешним данным, то есть информация находится в структурированном виде в базе данных на удаленном сервере, а программа обращается к ним в виде запроса SQL.

При написании программ на PHP (аналогично HTML) для разметки используются теги - специальные команды, описывающие структуру веб-страницы. Они заключены в угловые скобки - <тег>, чтобы браузер мог отличить их от общей массы текста.

HTML и PHP элементы могут иметь атрибуты. Атрибуты предназначены для добавления дополнительной информации об элементе и/или для изменения его стандартного поведения. Атрибуты всегда указываются внутри открывающего тега. В большинстве случаев атрибуты являются необязательными и указываются только при необходимости. Один элемент никогда не должен содержать в себе два и более атрибутов, имеющих одинаковое имя. На рисунке 3 показан пример элемента с атрибутом.

Рис.3 Синтаксис элемента с атрибутом

 

Значение атрибута может состоять из текста, цифр и других символов (единственным исключением является символ амперсанда (&), его использование запрещено).

Например атрибут style используется для стилизации элементов непосредственно в HTML и PHP коде. Цель атрибута style заключается в предоставлении простого способа изменения внешнего вида практически любого элемента. С помощью атрибута style мы задаем CSS стиль внутри элементов, такой способ задания стилей называется встроенным стилем.

Встроенный стиль применяется только к элементу, в котором он был определён, и к его дочерним элементам (если применённые CSS свойства наследуются).

В данной курсовой работе я использую как встроенные стили, так и внешние таблицы *.сss, путь к котрым указан в заголовке документов сайта библиотеки.

 

1.2.2. Структура PHP документа

 

Для успешной работы браузера с HTML и PHP документом он должен иметь строго определенную структуру.

В начале php-программы задаем параметры (см.рис.4) хостинга (БД нашего проекта).

<?php

$mysqli = new mysqli("localhost", "ar", "parol", "_kursovoi");

                                                                                                            // Соединиться с сервером БД

                                                                                                         // проверка соединения

if ($mysqli->connect_errno) {

printf("Не удалось подключиться: %s\n", $mysqli->connect_error);

exit();

}                                                                                                          // задаем кодировку отобрaжения

                                                                                         русского шрифта

mysqli_query ($mysqli, "SET NAMES utf8");

?>

  

Рис.4 Начальный участок php-программы

 

Каждый HTML документ, отвечающий спецификации HTML, обязан начинаться со строки декларации версии HTML, делается это с помощью объявления <!DOCTYPE>.Хотя слово doctype размещается в угловых скобках (< и >), оно не является тегом, это инструкция, предназначенная специально для браузеров, и восклицательный знак (!) в начале отличает ее от остального кода в HTML-документе. Общая структура файла показана на рисунке 5. Далее идут теги <html> и <head>, требующие обязательного закрытия а конце блока. В заголовке <head> обязательным является указание заголовка <title>…</title>, мета-характеристик файла с использованием тега  <meta>. Если используются внешние таблица стилей CSS или подпрограммы на прочих языках программирования, таких как JavaScript,то применяют теги  <link> и <script>.

 

Рис.5 Упрощенная структура HTML документа

 

В моей курсовой работе я использую внешние таблицы стилей и подключение штрифтов для иконок из bootstrapcdn, находящихся на официальном сайте в сети.

Далее в структуре HTML-документа обязателен тег <body>…</body>- - тело страницы, внутри которого как в скобках, размещается текст документа. Элемент <body> является контейнером для всего содержимого веб-страницы В конце расположены закрывающие теги.

Внутри текстовой части HTML-документа применяются разнообразные теги как html-кода, так и программные элементы, написанные на PHP. Они также выглядят как псевдо-теги, но содержат программный код, начинающийся с <?php…текст ?>, вводятся переменные для работы со значениями и строками из подключенной базы данных.

Язык PHP применяется в настоящее время совместно с использованием баз данных. PHP - языком можно создавать изображения, текстовые файлы PDF, а также Flash – анимацию, управлять размещенными на сервере файлами, также данному языку под силу работать со многими другими технологиями за счет объектно-ориентированного подхода.

Внутри заголовка файла мной использован скрипт, использующий вызов внешней функции на php для отображения и скрытия блока, содержащего аннотацию к книге(см. Приложение2 и Приложение3 к данной работе).

В конце php-файла указывается окончание работы с хостингом (см.рис.6) То есть нам для корректной работы серверных приложений необходимо закрыть результирующий поток, т.к. мы не можем вызывать функции, которые взаимодействуют с сервером, пока не закроем результирующий набор. Все подобные вызовы будут вызывать ошибку 'out of sync'. Поэтому необходима очистка результирующего набора.

 

<?php

$rs->close();

              mysqli_close($mysqli);   // Закрыть соединение с БД

?>

  

Рис.6 Финальный участок php-программы

Внутри программы используются участи php-кода и  html-кода в зависимости от удобства и целесообразности написания и отображения текстровых даннях.

 

1.2.3. Форматирование текста

 

В HTML и PHP-документы записываются в ASCII формате и поэтому могут быть созданы и отредактированы в любом текстовом редакторе.

Любой гипертекст похож на книгу и может быть разбит на отдельные структурные элементы: собственно документ, заголовки, главы, параграфы, пункты, подпункты, абзацы.

Для каждого из этих элементов в HTML существуют определенные стили, описывающие - в каком виде пользователь увидит текст на экране.

Если в исходном файле два предложения находятся на двух разных стороках, то Web browser игнорирует это перерывание строки и начинает новый абзац только после знака. Однако, чтобы сохранить удобочитаемость в исходных HTML-файлах, заголовки приходится размещать на отдельных строках, а абзацы отделять пустыми строками (в дополнение к тегу параграфа <P>…</P>…).

Главное преимущество HTML и PHP состоит в его способности связываться с другими документами. Browser выделяет (обычно цветом и/или подчеркиванием) ключевые слова, являющиеся гипертекстовыми ссылками (гиперссылками). Описывается ссылка на другой документ следующим образом: <A href="имя файла"> Текст, который будет служить как обращение к другому документу</A>. Имя файла может быть указано при помощи URL это абревиатура от Uniform Resource Locator. В него входит, кроме названия файла и директории: сетевой адрес машины и метод доступа к файлу. С помощью URL можно запускать удаленные программы, и передавать им значения.

Гиперссылки могут также использоваться для соединения с определенными разделами документов. Предположим, мы хотим соединить документ А с первой главой документа В, для чего нам необходимо создать именнованную гиперссылку в документе B. Здесь вы можете увидеть <A NAME = "Глава 1">Главу 1&lt/a> Текст первой главы.

Кроме простых вариантов структурирования php-документа у них существуют и дополнительные возможности форматирования, например: html и php поддерживает ненумерованные, нумерованные списки и списки определений. Списки могут быть произвольно вложены, хотя разумнее было бы практически ограничиться тремя уровнями вложенных списков. Также существует возможность создать авторский стиль редактирования, избежав игнорирования браузером пробелов и переносов строк. Используя <PRE> можно описать в тексте заданный авторский стиль. (То есть пробелы и пустые строки показаны как пробелы и пустые строки, и строки будут прерываться там же что и в исходном файле.) Это полезно, например, для изображения кодов программ, стихов и прочее.

Но более всего влияние на форматирование текста конечно же оказывают стили. Можно описывать специальными стилями отдельные слова или предложения. Имеются два типа стилей: логический и физический.

Логические стили определяют текст согласно заданному значению, в то время как физические стили определяют некоторые участки текста.

В моей курсовой работе для создания меню сайта были использованы вложенные списки, стили применяются как в основной мексте программы к некоторым тегам, так и вынесены в css-таблица (во внешнем файле).


Дата добавления: 2019-01-14; просмотров: 135; Мы поможем в написании вашей работы!

Поделиться с друзьями:






Мы поможем в написании ваших работ!