Создание сайта за пятнадцать минут

Создание сайта за пятнадцать минут

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

Обещал рассказать, как сделать простой, но функциональный и уникальный сайт на Яндексе — рассказываю. Нам понадобится отличная программка для новичков Web Page Maker (скачать, 4.39 Мб), с ее помощью вы сможете создать свои веб-странички безо всяких знаний HTML или CSS. Сразу замечу, что кроме этой программы, есть множество других.

Создание сайта за пятнадцать минут

Если кто-то не знает, как процитировать пост, не стесняетесь — жмите на эту ссылку. Если оно вам не надо — тоже не стесняйтесь, напишите: «Саша, ты уже достал всех со своими уроками!» Будем совершенствоваться дальше :)

Регистрация аккаунта на Яндекс.Ру

Для начала, регистрируем аккаунт в системе «Яндекс» — ссылка для регистрации (можно, конечно, выбрать любой хостинг, но в данном примере используется именно этот).

Подберите нормальный логин, т.к. он будет не только именем почтового ящика, но и адресом сайта — ИМЯ_САЙТА.NAROD.RU (если marishechka1985 подходит для e-mail, то для сайта — вопрос спорный).

Создание сайта за пятнадцать минут

Заполняем регистрационную информацию. Если вы укажите другой e-mail или мобильный телефон, то для дальнейшей работы сайта необходимо будет их подтвердить (это не больно).

Создание сайта за пятнадцать минут

Проверяем информацию, которую указали, и рассказываем «о себе еще немного» (по желанию).

Создание сайта за пятнадцать минут

В верхнем меню выбираем «еще» — подменю «Народ» для перехода в Мастерскую нового сайта.

Создание сайта за пятнадцать минут

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

Создание сайта за пятнадцать минут

Страничка Мастерской выглядит примерно так, если кто-нибудь не видел. Познакомились? Пока «отставляем» браузер в сторону и запускаем программу Web Page Maker.

Создание сайта за пятнадцать минут

Создание html-страниц и файлов сайта в программе Web Page Maker

Подробную инструкцию-справку по использованию программы (на русском языке) можно прочитать, нажав на кнопку «Справка» в меню или клавишу F1. Но в этом посте я опишу свои действия по созданию простенького сайта — естественно, если постараться, можно всё сделать в тысячу раз красивее.

Создание сайта за пятнадцать минут

В меню «Файл» есть пункт «Новый сайт из шаблона». Т.е средствами программы можно, вообще, просто выбрать подготовленный шаблон сайта.

Создание сайта за пятнадцать минут

Предложенные шаблоны разделены на три раздела по несколько штук в каждом.

Создание сайта за пятнадцать минут

Вот, например, образец одного из них, имеющий три-четыре разные страницы (главную, информацию об авторе, фотоальбом и т.п.).

Создание сайта за пятнадцать минут

Но мы собрались делать уникальный сайт, поэтому будем его создавать сами постепенно. Хочу еще раз обратить внимание, что в этом посте приведен пример простого сайта, созданного на скорую руку — он не будет отличаться ни красотой, ни какими-то дизайнерскими решениями. Вы всего лишь прочитаете об этапах работы с программой. А потом сможете выбрать всё сами: цвета, картинки, размещение элементов и многое другое.

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

Создание сайта за пятнадцать минут

Основные пункты меню, которые будем использовать, это «Вставка» (текст, изображения, фигура, панели, линии, таблицы, формы, объекты, флэшки и так далее)...

Создание сайта за пятнадцать минут

...и «Формат». С него и начнем: в этом меню, первым делом, выбираем «Свойства страницы».

Создание сайта за пятнадцать минут

Тут несколько понятных рисунков без комментариев — переключаясь на разные вкладки окна «Свойства страницы», указываем (или не указываем) разную информацию.

Мета Тэги

Создание сайта за пятнадцать минут

Свойства фона

Создание сайта за пятнадцать минут

Вид страницы

Создание сайта за пятнадцать минут

И так далее.

Создание сайта за пятнадцать минут

Создание сайта за пятнадцать минут

Далее вставляем шапку сайта в виде, например, WordArt («Вставка» — «Изображение» — «WordArt»). Можно в шапку поставить и горизонтальную панель-картинку.

Создание сайта за пятнадцать минут

В галереи выбираем формат надписи.

Создание сайта за пятнадцать минут

Нажимаем OK и вводим наш текст. Его стиль и форма всегда можно поменять.

Создание сайта за пятнадцать минут

Теперь наш будущий сайт «украсила» такая вот надпись.

Создание сайта за пятнадцать минут

Примечание: ВСЕ элементы сайта в программе Web Page Maker можно редактировать, если дважды кликнуть на них. Для перемещения — один клик (появление четырехконечной стрелки).

Далее выбираем в меню «Панель навигации» и один из предложенных шаблонов.

Создание сайта за пятнадцать минут

Панели также можно редактировать, устанавливая различные параметры.

Создание сайта за пятнадцать минут

Теперь продублируем Панель навигации под шапкой сайта. Правой кнопкой на элементе и скопировать.

Создание сайта за пятнадцать минут

Затем вставить копию.

Создание сайта за пятнадцать минут

Редактируем новую панель и указываем «Формат» — «Горизонтальное расположение».

Создание сайта за пятнадцать минут

Теперь на нашем страшненьком сайте две панели: вертикальная и горизонтальная.

Создание сайта за пятнадцать минут

Добавим картинку: кнопка «Изображение» — «Из файла».

Создание сайта за пятнадцать минут

Тянем за уголок вставленной картинки и делаем ее нужного размера. Перемещение картинки (как и других элементов) — активировать ее кликом и тащить.

Создание сайта за пятнадцать минут

Добавим еще какие-нибудь элементы в наш пример. В данном случае, добавлена разделительная линия.

Создание сайта за пятнадцать минут

Теперь добавляем текст (кнопка «Текст»).

Создание сайта за пятнадцать минут

Двойной клик на текстовом блоке позволит нам его отредактировать: вставить буковки, указать их формат и так далее.

Создание сайта за пятнадцать минут

Вот такая страничка получилась в итоге.

Создание сайта за пятнадцать минут

Примечание: чтобы сделать слово ссылкой, нужно его выделить, нажать на кнопку «Ссылка» и указать данные ссылки.

Создание сайта за пятнадцать минут

Одной странички на сайте нам недостаточно, поэтому создадим еще две (пока что такие же, как и главная index.html).

Двойной клик на панели навигации и переименовываем ссылки.

Создание сайта за пятнадцать минут

Теперь правый клик на страничке «index» в панели «Содержание Сайта» — выбрать «Клонировать страницы». Можно просто нажать соответствующую кнопочку.

Создание сайта за пятнадцать минут

Снова переходим к редактированию панели навигации и для каждой ссылки в двух панелях на КАЖДОЙ странице (index, second и third) указываем, куда приведет посетителя нажатие на кнопку.

Создание сайта за пятнадцать минут

Теперь наш тренировочный сайт выглядим в окне программы примерно так.

Создание сайта за пятнадцать минут

После создания сайта, проект через меню «Файл» нужно экспортировать в HTML (выберите или создайте для этого новую папку).

Создание сайта за пятнадцать минут

Загрузка html-страниц и файлов сайта на сервер Яндекса

В выбранной для экспорта папке появятся html-файлы ваших страничек и папка с файлами (изображения и т.п.).

Создание сайта за пятнадцать минут

Всё это богатство теперь нужно загрузить на сервер, чтобы его увидели не только вы, но любой пользователь Интернета. Поэтому возвращаемся в браузер на страничку Мастерской Яндекса. Загрузить файлы на Яндекс.Народ можно по FTP или через панель Менеджера загрузок.

Страница справки по FTP на Яндексе — http://narod.yandex.ru/help/09.yhtml. Загрузить можно как через элементарный Total Commander, так и через специальные FTP-клиенты (мне, например, нравится пользоваться CuteFTP 8 Professional — подробнее о нем).

Создание сайта за пятнадцать минут

Загрузим файлы через браузер: ссылка «Загрузка файлов на сайт» — «Загрузить файлы».

Создание сайта за пятнадцать минут

Пока у нас только одна, корневая папка. В нее загрузим только HTML-файлы (index, second и third).

Создание сайта за пятнадцать минут

Создание сайта за пятнадцать минут

Чтобы загрузить остальные файлы, нужно на сервере создать для них папку — на страничке управления.

Создание сайта за пятнадцать минут

Новая папка должна называться так же, как и созданная программой Web Page Maker — «images».

Создание сайта за пятнадцать минут

Все картинки-файлы из папки images на компьютере загружаем в такую же созданную папку на сервере.

Создание сайта за пятнадцать минут

Вот, в принципе, и всё. Как вы могли заметить, в примере сайт создавался по адресу http://valezsite.narod.ru. Попробуйте перейти по этой ссылке.

Создание сайта за пятнадцать минут

 

Примечание: как изменять загруженные страницы и некоторые другие вопросы в этом посте не поднимались — это другой разговор. Может быть, когда-нибудь...

P.S. Владельцам сайтов на Яндексе может быть интересен пост «Как сделать простую RSS-ленту для простого сайта».

Спасибо за внимание! Пошел разминать затекшие части тела.

Интернет. В порядке бреда ©

Если вы нашли ошибку, пожалуйста, выделите фрагмент текста и нажмите Ctrl+Enter.

У нас еще много очень интересных статей! Вот только несколько из них:

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

14 − 4 =