Deprecated: mysql_escape_string(): This function is deprecated; use mysql_real_escape_string() instead. in /var/www/satuser3/data/www/ubuntumaster.ru/engine/classes/mysqli.class.php on line 162 Deprecated: preg_replace(): The /e modifier is deprecated, use preg_replace_callback instead in /var/www/satuser3/data/www/ubuntumaster.ru/engine/modules/static.php on line 143 Deprecated: preg_replace(): The /e modifier is deprecated, use preg_replace_callback instead in /var/www/satuser3/data/www/ubuntumaster.ru/engine/classes/templates.class.php on line 60 Deprecated: preg_replace(): The /e modifier is deprecated, use preg_replace_callback instead in /var/www/satuser3/data/www/ubuntumaster.ru/engine/classes/templates.class.php on line 64 Deprecated: preg_replace(): The /e modifier is deprecated, use preg_replace_callback instead in /var/www/satuser3/data/www/ubuntumaster.ru/engine/classes/templates.class.php on line 72 Создание веб-сайта в ubuntu
Введение в ubuntu
  • Философия ubuntu
  • История GNU/Linux
  • Безопасность linux
  • Приход Ubuntu
  • Идеалогия Ubuntu
  • Цикл выпусков Ubuntu
  • Сообщество Ubuntu
  • Вклад
  • Помощь и информация
  • Структура сообщества
  • Появление ubuntu
  • Знакомство с интерфейсом ubuntu
  • Получение копии Ubuntu
  • Загрузка Ubuntu
  • Запись Ubuntu на диск
  • Запуск Ubuntu с Live CD
  • Графический интерфейс Ubuntu
  • Изменение фона рабочего стола
  • Установка новых обоев
  • GNOME Art Manager
  • Изменение темы в Ubuntu
  • Размещение значков на рабочем столе
  • Установка новой заставки
  • Изменение экрана входа в систему
  • Изменение эффектов рабочего стола
  • Управление ubuntu
  • Обновление и безопасность
  • Как обновить ubuntu
  • Папки и файлы в ubuntu
  • Установка периферии на Ubuntu
  • Поиск драйверов для Ubuntu
  • Установка устройств на Ubuntu
  • Установка дополнительных программ
  • Synaptic Package Manager
  • Установка аппаратного обеспечения
  • Безопасность Ubuntu
  • Установка Firestarter
  • Установка антивируса в Ubuntu
  • Резервное копирование
  • Восстановление данных
  • Программы в ubuntu
  • Openoffice в Ubuntu
  • Выполнение расчетов в calc
  • Презентации в Ubuntu
  • Вся ваша база в Ubuntu
  • Нарисовано в open source
  • Сеть в ubuntu
  • Настройка Ethernet
  • Знакомство с Samba
  • Решение сетевых проблем
  • Общение в интернете
  • Электронная почта Evolution
  • Мгновенные сообщения
  • Создание веб-сайта в ubuntu
  • Хорошо уживаться с windows
  • Виртуальные машины
  • Wine в ubuntu
  • Игры в ubuntu
  • Игры и развлечения в Ubuntu
  • Многопользовательские игры
  • Запуск windows игр в ubuntu
  • Игры для GNU/Linux
  • Установка игр от сторонних разработчиков
  • Мультимедиа в ubuntu
  • Воспроизведение музыки в Ubuntu
  • Просмотр видео в Ubuntu
  • Просмотр и редактирование рисунков
  • Работа с iPod в Ubuntu
  • Образовательные программы
  • Edubuntu
  • Продвинутым пользователям
  • Команды оболочки в ubuntu
  • Инструменты системного администратора
  • Текстовый редактор emacs
  • Установка ubuntu
  • Скачать Ubuntu

    Создание веб-сайта в ubuntu

    В предыдущем разделе вы увидели, как просматривать веб-сайты в браузере Firefox, поставляемом с Ubuntu.

    В этом разделе сайта вы узнаете, как создавать собственные веб-сайты. Зачем это может понадобиться? Простейший ответ — чтобы сообщить другим какую-то информацию. Предприятия создают веб-сайты, чтобы предоставить клиентам самую свежую информацию. Люди также создают личные веб-сайты.
    Возможно, вы захотите поделиться новостями с членами семьи, живущими далеко от вас, или у вас есть хобби и вы хотите найти единомышленников и поделиться с ними своими мыслями. Веб-сайт позволяет обмениваться информацией независимо от того, зачем вам это может понадобиться.
    Решив создать собственный сайт, стоит сначала спланировать его. Определите, из скольких страниц он будет состоять и что будет написано на каждой странице.
    Чем больше времени вы потратите на планирование, тем лучше сайт будет выглядеть и тем легче будет перемещаться по страницам.
    В Сети есть много ресурсов с советами о планировании веб-сайтов. Стоит прочитать информацию по этой теме — вы ведь читаете инструкцию перед тем как начать устанавливать домашний кинотеатр.

    Хороший дизайн сайта

    Есть целые сайты, посвященные исключительно ссылкам на веб-сайты с плохим дизайном. Неудачные цветовые схемы, чрезмерное количество рисунков, беспорядочные страницы, ведущие в никуда ссылки и многие другие факторы могут привести к тому, что страница попадет в список «как не надо делать». Чтобы не повторять ошибок, стоит поискать в Интернете статьи об удобстве использования.
    Удобство использования веб-сайта обозначает то, насколько сайт дружественен к пользователю по своей навигации, дизайну и функциональности. В Интернете есть очень много ресурсов, которые могут посвятить вас в тонкости этого дела.

    Поиск сервера
    Если только вы не сделали свой компьютер сервером, нужно найти компьютер, на котором будет находиться ваш веб-сайт. Есть компании, предоставляющие услуги но размещению информации (hosting): они позволяют загрузить файлы веб-сайта на свой сервер, предоставляя вам возможность заниматься собственным сайтом и гарантируя необходимое аппаратное обеспечение.
    Вы можете выбрать один из двух видов услуг по размещению информации: бесплатный и платный.
    Очевидное преимущество бесплатных услуг в том, что они ничего не стоят. Большинство таких компаний чрезвычайно надежны, предлагают достаточно места для хранения файлов и множество дополнительных услуг, позволяющих увеличить функциональность сайта.
    Недостатки бесплатного размещения сайта в том, что такие компании часто размещают на сайте рекламу, от которой вы не сможете избавиться, и практически не предоставляют техническом поддержки.
    Платные услуги по размещению информации обычно стоят не слишком дорого. Можно разместить сайт примерно за 5-10 долларов в месяц. В счет обычно входит техническая поддержка. У большинства компаний, предоставляющих такие услуги, есть скидки при оплате сразу за год пли за два.

    Ваше доменное имя
    У веб-сайта должно быть имя. Имя, под которым вы зарегистрируете сайт, называется доменным именем. Зарегистрированное имя станет частью вашего доменного адреса. Например, Ubuntu зарегистрировала доменное имя Ubuntu.com. Поэтому адрес их сайта — www.ubuntu.com. Вам также предоставят доменное имя, которое будет адресом вашего веб-сайта.
     Некоторые компании по размещению информации взимают за это дополнительную плату и даже соблазняют вас использовать свои услуги, регистрируя доменное имя самостоятельно. Если таких скидок нет, ожидайте, что доменное имя будет стоить 10-15 долларов в год. Бесплатные компании, предоставляющие услуги по размещению сайта, могут предлагать и бесплатное доменное имя, но обычно это поддомен. Например, у вашей компании может быть доменное имя jeffsfreesites.com. Тогда поддоменом будет http://#oursite.jeffsfreesiter.com.
     К сожалению, многие доменные имена уже заняты, поэтому первый выбранный вариант может быть недоступен. Если это так, проявите творческий подход или просто купите доменное имя в магазине доменов. Зарегистрировав или купив доменное имя и выбрав компанию, предоставляющую место для сайта, вы будете готовы начинать разработку.

    Установка программы для разработки сайта
    В стандартную установку Ubuntu не входит программа для разработки веб-сайтов; однако с помощью инструмента Add/Remove можно установить такую программу, называющуюся Screem. Хотя Screem обладает всеми функциями для создания веб-сайта, я лично отдаю предпочтение KompoZer, но его нужно устанавливать в терминале. Откройте Applications => Accessories => Terminal и введите следующую строку:
    sudo apt-get install kompozer

    Помните, что sudo означает «super user do» (суперпользователю выполнить). Так как вы хотите, чтобы эту программу выполнил суперпользователь, Ubuntu потребует ввести пароль. После успешного ввода пароля начнется процесс установки. Непосредственно перед установкой вас предупредят, что KompoZer займет определенное место на диске.

    Если вы используете Screem, его можно запустить с помощью пункта Applications => Programming => Screem.

    При открытии KompoZer вам сообщат совет. Возможно, стоит прочитать несколько таких советов, для чего есть кнопка Next. Если вы не хотите читать такие советы при открытии KompoZer, уберите галочку возле пункта Show Tips At Startup (Показывать советы при запуске). Запомнив пару советов, щелкните по кнопке Close (Закрыть), чтобы начать работу.

    На заре развития Всемирной паутины каждую веб-страницу приходилось создавать вручную на языке HTML. С ростом популярности Сети многие компании разработали программы, позволяющие создавать веб-страницы людям без или с минимумом понимания HTML, так как подобные программы заботятся о правильности HTML-конструкций самостоятельно. Такие программы стали называться WISYWYG (произносится «визивиг»). WISYWIG — это аббревиатура от What You See Is What You Get (Что видите, то и получите). И Screem, и KompoZer являются WISYWIG-программами для разработки веб-сайтов. Чтобы увидеть, как просто работать в KompoZer, введите в окне сообщение Hello World! Welcome to my first web page! Сохраните этот файл, и вы создадите свою первую веб-страницу. Если вы используете команду File => Browse Page (Файл =^ Просмотреть страницу в браузере), созданный сайт будет открыт в браузере.
     
    Примечание
    Так как обычно веб-сайты состоят из нескольких страниц, браузер вначале должен определить, какую страницу следует открывать первой. Чтобы он смог это сделать, при сохранении первой страницы назовите файл index.html. Браузер найдет файл с таким именем и отобразит его на экране, если в адресной строке будет введено доменное имя вашего сайта.


    Вернитесь и посмотрите на набор вкладок внизу страницы: Normal (Нормальный), HTML Tags (Теги HTML), Source (Исходный код) и Preview (Предварительный просмотр). Normal позволяет работать в среде WYSIWYG. Открыв вкладку HTML Tags, вы увидите теги, с помощью которых определяется содержимое вашей страницы. Перейдя на вкладку Source (Исходный код), вы поймете, как выглядит код вашей страницы на языке HTML. Preview (Предварительный просмотр) позволяет увидеть, как будет выглядеть сама веб-страница.

    Примечание
    Вкладки Normal и Preview выглядят практически идентично.


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

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

    В KompoZer легко вставить изображение. Вначале переместите указатель в то место, где хотите поместить изображение. Затем щелкните по кнопке Image (Изображение) на панели инструментов. После этого появится запрос Image Location (Местонахождение изображения). Если вы не знаете путь к изображению, щелкните по маленькой желтой папке справа, чтобы включить просмотр изображений перед выбором. Указав изображение, нужно будет ввести Alternate Text (Альтернативный текст) для браузеров, которые не могут отображать рисунки. Введите описание используемого изображения, щелкните по кнопке ОК, и изображение появится на странице.

    Как изменить дополнительные настройки изображения
    Кнопка Advanced Edit (Дополнительная правка) в окне Image Properties (Свойства изображения) позволяет изменить такие свойства, как источник изображения, выравнивание и другие атрибуты, доступные в HTML. При щелчке по кнопке появляется Редактор дополнительных свойств Advanced Property Editor, который будет полезен, если вы решите больше узнать о веб-дизайне. Вы также можете добавить к изображению javascript. Щ javascript — это язык программирования, который работает на веб-страницах и позволяет расширять их функциональность.

    В окне Image Properties на вкладке Dimensions (Размеры) вы можете изменить размер изображения, вкладка Appearance (Внешний вид) позволяет поменять атрибуты картинки, а вкладка Link (Ссылка) — создать гиперссылку на другую веб-страницу или веб-сайт.

    Использование таблиц
    Если вы часто использовали такие текстовые редакторы, как Writer или Microsoft Word, то, скорее всего, задействовали таблицы для организации информации в документе. На веб-страницах также можно использовать таблицы. Как и при добавлении изображения, вначале следует переместить курсор в то место, где вы хотите вставить таблицу.

    Решив вставить таблицу, щелкните по значку Table (Таблица) рядом со значком Image на панели задач. Откроется окно Insert Table (Вставка таблицы) и первая его вкладка, Quickly (Быстро), которая позволяет добавить таблицу, выбрав количество строк и столбцов. Если вы хотите ввести число строк и столбцов самостоятельно, воспользуйтесь вкладкой Precisely (Точно). Вкладка Precisely позволяет указать ширину таблиц в пикселях или процентах от размера окна. Вы также можете задать ширину границы (Border) таблицы. Чтобы в таблице не было границ, введите 0.

    Вкладка Cell (Ячейка) позволяет настроить ячейки и их содержимое. Вы можете указать вертикальное или горизонтальное выравнивание содержимого таблицы, отступы в ячейках и перенос строк. Если выбрать значение Wrap (Перенос), при достижении конца ячейки текст будет перенесен на новую строку. Если выбрать Don't Wrap (Без переноса), текст будет шире границ ячейки.
     
    Выбор шрифта
    Простая веб-страница с черным текстом на белом фоне вряд ли привлечет много посетителей. Если кто-то и зайдет на нее, он не останется там надолго. Простой способ улучшить дизайн веб-сайта — изменить шрифт и, возможно, добавить пару гиперссылок. Давайте вначале изменим кегль текста «Hello World!». Выберите этот текст. На панели инструментов Text Formatting (Форматирование текста) три раза щелкните по кнопке Larger Text Font (Больший кегль шрифта). Затем выберите слово Welcome. Щелкните по кнопке Choose Colour for Text (Выбрать цвет текста) и выберите новый цвет.

    Совет
    Старайтесь не использовать синий цвет — он ассоциируется с гиперссылками.


    Гиперссылки на веб-странице позволяют реализовать концепцию Всемирной паутины. Она называется паутиной, так как страницы, связанные между собой, представляют собой, по сути, паутину. При добавлении гиперхгсылки, или ссылки, вы используете данный подход.

    Чтобы создать гиперссылку, поместите курсор под таблицей на вашей странице. Затем выберите Insert => Link (Вставить => Ссылка). Когда вас по-просят ввести отображаемый текст, введите Visit Ubuntu.com.
     
    Затем, когда вас попросят определить местонахождение веб-сайта, введите www.ubuntu.com. В области Target (Цель) окна Link Properties (Свойства ссылки) укажите, будет ли ссылка открыта в новом окне или во фрейме. Если не отметить пункт Link Is То Be Opened (Ссылка должна быть открыта), новая страница заменит старую в окне браузера. Настроив ссылку, щелкните по кнопке ОК.

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

    При создании веб-сайта лучше всего хранить все файлы в одной папке. Тогда легче создавать на них ссылки. В разделе Link Location (Адрес ссылки) в окне Link Properties есть значок с папкой (Folder), который позволяет выбрать другие файлы на диске. Так можно создать ссылки на уже созданные страницы. Некоторые дизайнеры сразу создают все страницы сайта, поэтому таким образом можно организовать систему навигации по сайту. Кроме того, дизайнеры обычно хранят все изображения в одной папке, которая, как правило, называется Images. При вставке изображений они выбирают их непосредственно в папке Images. При загрузке файлов на сайт копируются файлы HTML и папка Images, чтобы путь к изображениям оставался неизменным.

     Вы увидели, как просто создавать веб-страницу в таком WYSIWYG-редакторе, как KompoZer, и у вас может возникнуть вопрос: зачем следует изучать HTML? Ответ зависит от того, хотите ли вы заниматься созданием веб-сайтов. Если вы желаете разместить в сети всего лишь несколько страниц для семьи и друзей, знать HTML вовсе необязательно. Если же вы хотите понять, как настроить мелкие детали и использовать более сложные методы дизайна и программирования, следует разобраться в коде веб-страницы.
     Изучить HTML достаточно просто, и есть много веб-сайтов с информацией для новичков, которые помогают понять основы кода HTML. Посмотрите замечательные обучающие тексты относительно HTML и других аспектов веб-дизайна на сайте www.w3schools.com.

    Публикация веб-сайта
    Вы когда-нибудь задумывались, почему в начале адресов стоит http? HTTP означает Hypertext Transfer Protocol (Протокол передачи гипертекста). Это способ запроса веб-страницы браузером с сервера. При вводе адреса в строку большинства браузеров они делают предположение, что вы используете http.
     Для публикации сайта используется другой протокол передачи данных, который называется FTP (File Transfer Protocol — Протокол передачи файлов). С помощью FTP можно посылать программы, музыку, видео и ДРУгие файлы с какого-то компьютера на сервер FTP, откуда файлы могут быть доступны и на других компьютерах. Некоторые из этих файлов могут составлять ваш веб-сайт.
     Чтобы передать файлы по FTP, нужен FTP-клиент, адрес сервера FTP, имя пользователя и пароль. К счастью, в KompoZer есть инструмент FTP для отправки файлов на сервер. Нужные данные, скорее всего, вы уже получили от компании, предоставляющей услуги по размещению файлов. Если нет, спросите их у специалистов по технической поддержке.

     Следующий шаг при публикации веб-сайта в Интернете — открытие ин-струмента Publish Page (Публикация страницы), для чего следует щелкнуть по значку Publish на панели инструментов KompoZer. В Publish Page надо будет указать название сайта (Site Name). Вы можете ввести любое название. Затем у вас спросят адрес веб-сайта. Введите полный адрес примерно в таком формате: www.yoursite.com. Затем нужно будет ввести адрес публикующего сервера (Publishing Server). Это ваш сервер FTP. Замените http и www на ftp, чтобы адрес выглядел примерно так: ftp://ftp.yoMr5iYe.com. Опция Select Directory (Выбор папки) позволяет указать, в какой папке на FTP-сервере вы хотите разместить файлы.
      После ввода адресов укажите свое пользовательское имя и пароль, а затем щелкните по кнопке Publish. Если ваша домашняя страница называется index.htm или index.html, вы можете набрать алрес вашего вебсайта в браузере и увидеть результаты своего тяжелого труда!
     Если вам не нравится инструмент публикации в KompoZer, посмотрите на других клиентов FTP в реиозиториях Ubuntu, чтобы найти вариант, который подходит вам.

    Сложный дизайн
    Да, созданная вами веб-страница выглядит скромно по сравнению с крупными динамическими страницами. Пусть это вас не останавливает! Если вас интересует веб-дизайн, начните с изучения каскадных таблиц стилей (Cascading Style Sheet, CSS). Они делают жизнь проще и позволяют обновить весь сайт всего несколькими щелчками мыши.

    Если вас действительно интересует веб-разработка, установите в Ubuntu Server Edition среду LAMP для размещения динамических веб-сайтов. LAMP состоит из операционной системы Linux (в вашем случае — Ubuntu); веб-сервера Apache, базы данных MySQL и языков PHP/Perl/ Python для написания сценариев, которые объединяют все в единое целое. Сеть изменила способ общения людей, покупки, развлечения, и, если вы сможете использовать возможности Всемирной паутины, это поможет вам во многих ситуациях.