Как сделать страничку для сайта
Техподдержка
Мы в соц. сетях
Добавление страницы к проекту сайта
В руководстве на данной странице мы рассмотрим добавление страницы к проекту, наполняемому в Конструкторе сайтов E-Publish.
Сайты обычно состоят из десятков, а то и сотен взаимосвязанных страниц.
В руководстве на данной странице мы рассмотрим добавление страницы к проекту, наполняемому в Конструкторе сайтов E-Publish.
или кликните по кнопке » Добавить страницу «.
1. Выбор типа страницы.
В Конструкторе присутствуют различные типовые (специализированные) страницы.
1. Выбор типа страницы.
В Конструкторе присутствуют различные типовые (специализированные) страницы.
Важно:
Выбирать тип страницы следует при добавлении страницы к проекту,
так как в дальнейшем изменить тип уже добавленной к проекту страницы будет не возможно.
2. Титул страницы.
Титулом страницы является отображаемое в поисковых системах и во вкладке браузера название страницы.
По умолчанию титул страницы установлен в соответствии с названием выбранной типовой страницы.
Но Вы можете задать желаемый титул страницы.
Ознакомиться с типами страниц Вы можете в подразделе «Типы страниц сайта», пройдя по ссылкам на описания типовых страниц.
Важно:
Выбирать тип страницы следует при добавлении страницы к проекту,
так как в дальнейшем изменить тип уже добавленной к проекту страницы будет не возможно.
2. Титул страницы.
Титулом страницы является отображаемое в поисковых системах и во вкладке браузера название страницы.
По умолчанию титул страницы установлен в соответствии с названием выбранной типовой страницы.
Но Вы можете задать желаемый титул страницы.
При желании Вы всегда можете изменить как титул, так и названия страницы и пункта меню.
С руководством по смене титула Вы можете ознакомиться на странице «Титул».
С руководством по смене названия пункта меню Вы можете ознакомиться в пункте 2 на странице «Редактор меню».
Название страницы Вы всегда можете изменить простой правкой в поле названия страницы (между шапкой сайта и основным полем страницы).
3. Не отображать меню сайта на странице
Установив отметку на данном пункте,
Титул, заданный при добавлении страницы к проекту, будет отображен не только как титул, но и как:
При желании Вы всегда можете изменить как титул, так и названия страницы и пункта меню.
С руководством по смене титула Вы можете ознакомиться на странице «Титул».
С руководством по смене названия пункта меню Вы можете ознакомиться в пункте 2 на странице «Редактор меню».
Название страницы Вы всегда можете изменить простой правкой в поле названия страницы (между шапкой сайта и основным полем страницы).
3. Не отображать меню сайта на странице
Установив отметку на данном пункте,
То есть после публикации на странице не будет отображаться меню.
Это в основном используется для страниц, на которых размещается какая-то одна конкретная информация.
Чтоб задать странице более целостный вид.
Но, как Вы понимаете, вернуться с такой страницы в основное меню сайта будет проблематично.
В таком случае поможет только возврат на предыдущую страницу в браузере.
Потому желательно переход на страницы, на которых закрыто отображение меню, делать ссылками на других страницах.
С открытием ссылки в новой вкладке.
4. Добавить модуль «Комментарии» внизу страницы
Вы укажете программе, что меню сайта на данной странице отображать не нужно.
То есть после публикации на странице не будет отображаться меню.
Это в основном используется для страниц, на которых размещается какая-то одна конкретная информация.
Чтоб задать странице более целостный вид.
Но, как Вы понимаете, вернуться с такой страницы в основное меню сайта будет проблематично.
В таком случае поможет только возврат на предыдущую страницу в браузере.
Потому желательно переход на страницы, на которых закрыто отображение меню, делать ссылками на других страницах.
С открытием ссылки в новой вкладке.
4. Добавить модуль «Комментарии» внизу страницы
Помимо активации модуля «Комментарии» в свойствах страницы, данный модуль необходимо активировать и в Вашем виртуальном кабинете.
С руководством по размещению модуля «Комментарии» на странице сайта Вы можете ознакомиться на странице «Комментарии к странице Вашего сайта»
Вы можете запаролировать страницу.
5. Закрыть страницу паролем
Вы можете запаролировать страницу.
С подробным руководством по защите страницы паролем Вы можете ознакомиться на странице «Защитить страницу паролем».
6. Отключить страницу от пролистывания на сайте
Если на Вашем сайте активированы кнопки перехода по карте проекта (кнопки «Вперед» и «Назад» ),
то Вы можете исключить страницу из просмотра сайта посредством данных кнопок.
Для этого в свойствах страницу установите, пожалуйста, отметку на пункте «Не включать в пролистывание страниц»
В таком случае страница будет доступна только тем, кому Вы предоставите данные для посещения страницы.
С подробным руководством по защите страницы паролем Вы можете ознакомиться на странице «Защитить страницу паролем».
6. Отключить страницу от пролистывания на сайте
Если на Вашем сайте активированы кнопки перехода по карте проекта (кнопки «Вперед» и «Назад» ),
то Вы можете исключить страницу из просмотра сайта посредством данных кнопок.
Для этого в свойствах страницу установите, пожалуйста, отметку на пункте «Не включать в пролистывание страниц»
7. Закрыть возможность копирования наполнения страницы
Вы можете установить защиту от копирования на странице.
Как части наполнения, так и страницы целиком.
Для этого установите, пожалуйста, в свойствах страницы отметку на пункте «Закрыть возможность копирования страницы»
Более детально о кнопках просмотра проекта «Вперед» и «Назад» Вы можете узнать на странице «Дополнительные средства навигации (кнопки)»
7. Закрыть возможность копирования наполнения страницы
Вы можете установить защиту от копирования на странице.
Как части наполнения, так и страницы целиком.
Для этого установите, пожалуйста, в свойствах страницы отметку на пункте «Закрыть возможность копирования страницы»
Важно:
Только учитывайте, пожалуйста, что этим блокируются любые действия на странице.
То есть страница станет недоступна не только для копирования, но и для работы некоторых модулей.
8. Задать фоны
С руководством по добавлению фонов Вы можете ознакомиться на странице: «Фон (на странице, под страницей, в заголовке сайта) добавить/сменить»
9. Задать ключевые слова для страницы (для раскрутки страницы в поисковых системах).
Вкладка «Описания» позволяет вставить ключевые слова и фразы с которыми будет ассоциироваться данная страница в поисковых системах (Google, Яндекс и т.п.).
С руководством по ключевым словам Вы можете ознакомиться на странице: «Ключевые слова»
Важно:
Только учитывайте, пожалуйста, что этим блокируются любые действия на странице.
То есть страница станет недоступна не только для копирования, но и для работы некоторых модулей.
8. Задать фоны
С руководством по добавлению фонов Вы можете ознакомиться на странице: «Фон (на странице, под страницей, в заголовке сайта) добавить/сменить»
9. Задать ключевые слова для страницы (для раскрутки страницы в поисковых системах).
Вкладка «Описания» позволяет вставить ключевые слова и фразы с которыми будет ассоциироваться данная страница в поисковых системах (Google, Яндекс и т.п.).
С руководством по ключевым словам Вы можете ознакомиться на странице: «Ключевые слова»
Позвольте обратить Ваше внимание на то, что в полях ввода описания и ключевых слов нежелательно писать слишком много.
Достаточно около 7-и ключевых слов, записанных через запятую и одной фразы описания.
Старайтесь подбирать специфические слова.
К примеру, если речь идет о странице фотоальбома 8-го А класса, в ключевые слова лучше написать:
«8А класс, гимназия N1 г. Новые Васюки, 2014 год».
В описании: «Фотоальбом 8А класса гимназии №1 г. Новые Васюки 5 марта 2014 г.»
С руководством по ключевым словам Вы можете ознакомиться на странице: «Ключевые слова»
Как создать страницу на сайте
Чтобы создать новую страницу на сайте, войдите в админку и выберите в меню управления (слева) раздел «Страницы».
Следующий шаг зависит от того, в какой части сайта Вы хотите разместить новую страницу. Допустим, меню Вашего сайта содержит пять разделов: «Новости», «Галерея», «Коллектив», «Контакты» и «Отзывы». Это разделы первого уровня. Но некоторые из них могут содержать в себе другие разделы, более мелкие: например, внутрь общего раздела «Контакты» можно поместить страницы «Директор», «Зам. директора», «Секретарь». Это — вложенные страницы, или подразделы. Для подразделов также можно создавать вложенные страницы еще более низкого порядка.
Таким образом, при создании новой страницы стоит обдумать, станет ли она новым элементом основного меню сайта или войдет в структуру уже существующих его разделов. Не рекомендуется перегружать сайт большим количеством страниц первого уровня: возникнет путаница в категориях, основное меню будет громоздким и неудобным в использовании.
Создание страницы первого уровня
Итак, вы решили создать новую страницу первого уровня. В разделе «Страницы сайта» кликните по кнопке с раскрывающимся меню: конструктор предложит Вам выбрать тип страницы.
После выбора нужного пункта меню у Вас откроются поля для занесения информации на страницу. Заполните те из них, которые сочтете нужными. Помните, что если рядом с полем стоит красная звездочка, то его заполнение обязательно — без этого вы не сможете сохранить созданную страницу.
При наполнении страницы вы можете добавлять блоки с текстом, фото, видео, картами и т.д., а также управлять их порядком и способами отображения в различных версиях сайта (об этом читайте подробнее в отдельной статье).
Нас часто спрашивают, что писать в поле «Имя для построения URL». Туда пишется адрес страницы для адресной строки браузера.
Заполнять поле «Имя для построения URL» можно только латинскими буквами, цифрами и символами. Желательно, чтобы имя, внесенное в это поле, отражало тематику страницы: например, для страницы-каталога подойдет «catalog», для новостной ленты — «news». Вы также можете оставить имя, присвоенное по умолчанию: в таком случае это будет цифровой код.
Обратите внимание: Вы можете не только изменять основные параметры страницы (заголовок, текст, блоки и т.д.), но и работать со вкладками «Навигация» и «SEO».
В меню «Навигация» Вы можете изменять параметры отображения страницы, например, спрятать страницу из основного меню: страница будет опубликована на сайте и доступна по прямой ссылке, но не видна в основном меню сайта.
Когда все нужные поля заполнены, нажмите кнопку сохранить. Новая страница будет добавлена на сайт.
Создание вложенной страницы
Для создания подраздела найдите в структуре сайта тот раздел, внутрь которого хотите поместить будущую страницу. Зайдите внутрь раздела, кликнув по синей папке слева от его названия.
И уже внутри нужного раздела создайте новую страницу по алгоритму, приведенному выше.
Если синей папки рядом с названием раздела нет, значит, для этого раздела нельзя создать вложенную страницу.
Видео: как добавить страницу на сайт
Также Вы можете изучить самое наглядное пособие по добавлению страниц на сайт: оно представлено в нашем видеоролике.
Поздравляем! Вы добавили на свой сайт новую страницу. Если потребуется что-нибудь на ней поменять, Вам пригодится статья о том, как отредактировать страницу, которая уже существует на сайте.
Как сделать дизайн сайта, если вы новичок
Рассказываем, как сделать сайт красиво, если у вас нет опыта в веб-дизайне. Главные принципы и общие рекомендации.
Многие новоиспечённые фрилансеры думают о том, как получить заказ и сделать хороший дизайн. Тоже из их числа? На практике всё не так страшно, как кажется на первый взгляд. Первое, что нужно сделать, — начать действовать.
А если знаний пока маловато, то запишитесь на курс «Веб-дизайн с нуля до PRO», где из новичка вас переведут в профессионалы. В университет ходить не придётся. Всё обучение онлайн.
Пишет про дизайн в Skillbox. Работает директором по маркетинговым коммуникациям, изучает рекламную графику и 3D.
Определитесь с целью
Для начала поймите, зачем вашему клиенту нужен сайт. Пусть он ответит на несколько простых вопросов:
Чем подробнее клиент ответит, тем понятнее станет, каким должен быть результат. Лучший вариант — это предложить заполнить бриф одной из ведущих дизайн-студий.
Каким бы странным, длинным и подробным он вам ни показался, заполнение брифа — один из важнейших этапов создания сайта, так как помогает понять и специфику, и сложность проекта. Есть десятки брифов на создание сайтов, но я рекомендую бриф от CreativePeople.
Определитесь с типом сайта
Следующий шаг — понять, какой именно сайт необходим. Типов сайтов очень много, но чаще всего требуется лендинг, корпоративный сайт или интернет-магазин.
Лендинг
Цель одностраничного сайта — быстро и эффективно продать товар или услугу. Как правило, лендинги отличаются ярким оформлением и наличием одного или нескольких блоков, в которых пользователю предлагается оставить контакты для связи.
Корпоративный сайт
Отличается размером и возможностями — и зачастую содержит непростые для дизайна и технической реализации инструменты. По сложности корпоративные сайты могут быть самыми разными, всё зависит от требований заказчика и размера бизнеса.
Сайты банков — классический пример корпоративных сайтов
Интернет-магазины
Эти сайты знакомы каждому: AliExpress, OZON, «М.Видео» и десятки других аналогичных. Главный вызов дизайнеру здесь — в объёмах информации и товаров, а также в проектировании страницы заказа.
Изучите конкурентов
Когда определились с тематикой, типом и целью сайта, самое время внимательно изучить конкурентов. Каждый из них в своё время размышлял, как сделать сайт, и смог попасть в топ поисковой выдачи.
Изучая сайты конкурентов, уделите внимание тому, где и как расположена информация, какая у сайта структура и какие возможности реализованы. Проанализировав пару десятков сайтов, вы наверняка увидите общие черты и закономерности.
Даже если в вашей нише по каким-то причинам нет конкурентов, не пропускайте этот шаг. Попробуйте изучить сайты смежной ниши, составьте майндмэп в программе XMind или сервисе MindMeister, сделайте зарисовки будущего интерфейса и не забывайте анализировать каждый свой шаг, ведь любой элемент интерфейса должен отвечать какой-либо цели.
Найдите референсы
Визуальная часть сайта — одна из важнейших задач дизайнера, ведь сайт должен быть не только удобным, но и красивым. Нужно подобрать шрифты, главные цвета, подумать над оформлением блоков, организацией информации на странице.
Если вы новичок в дизайне, делать это в одиночку — сомнительное решение. Лучше найти примеры сайтов, которые вам нравятся, и перенять некоторые идеи. Только не перерисовывайте их от шапки до футера — это уже откровенный плагиат.
Рекомендуем сделать подборку из пары десятков сайтов смежных тематик, оформление которых вам понравилось, и приглядеться к деталям, разобрав макеты на составные части.
Подборку референсов вы можете смело показать заказчику. Так вы вместе выберете подходящий стиль, что избавит от ненужных правок в дальнейшем. Найти множество хороших примеров можно на Behance, Awwwards и Pinterest.
Как создать свой сайт бесплатно своими руками – пошаговая инструкция
Как создать сайт бесплатно и самостоятельно с полного нуля не имея технических знаний? Что такое «домен» и «хостинг» и зачем они нужны?
Что такое «HTML-сайт», «CMS-система» и «конструктор сайтов» и в чем их ключевые отличия друг от друга?
Если вам близки вышеперечисленные вопросы, просим устроиться поудобнее, а мы попробуем подробно ответить на них в этой инструкции. Мы понимаем всю важность, ведь научившись создавать современные и функциональные сайты, вы сможете построить интернет-представительство не только для себя или своей компании, но и предложить подобные услуги другим заинтересованным людям. На сегодняшний день это один из наиболее перспективных и стабильных видов интернет-заработка.
Технические аспекты создания сайта
Технические аспекты создания собственного сайта во многом зависят от правильного выбора необходимых инструментов. Прежде всего, стоит понимать, что на сегодняшний день существует три основных способа самостоятельного создания сайта:
Давайте рассмотрим каждый из этих способов более подробно. Начнем с того, который, на наш взгляд лучше других подходит для новичков.
Конструкторы сайтов
Мы убеждены, что, если у вас ограничено время или желание разбираться, то оптимальным способом будет создание сайта в конструкторе. Мы выбрали самые эффективные и простые в использовании, что для создания сайта не потребуется каких-либо знаний в области верстки, программирования и веб-дизайна.
Итак, конструктор сайта — это специализированный онлайн-сервис, включающий в себя готовые варианты графического оформления для создаваемых сайтов, а также имеющий удобный и интуитивно понятный пользовательский интерфейс.
В идеале современный конструктор сайтов должен позволить любому человеку создать свой собственный интернет-ресурс без необходимости получения знаний в области веб-программирования и дизайна.
Наиболее популярные конструкторы сайтов
Кроме того, специально для читателей нашего сайта мы составили рейтинг лучших конструкторов сайтов. Обязательно обратите на него внимание, чтобы проанализировать все возможные варианты!
Простой пример создания сайта
Сам процесс состоит из нескольких понятных и простых шагов, о которых чуть ниже!
Шаг первый – регистрация в конструкторе и вход в аккаунт.
Проходим простую процедуру регистрации, заполнив данные формы либо просто авторизовавшись в одной из популярных соц.сетей.
Шаг второй – выбираем базовый шаблон дизайна для будущего сайта.
Конструктор предоставляет в распоряжение пользователей коллекцию из более 500 уникальных бесплатных шаблонов! Такого выбора нет нигде!
Ваша задача будет выбрать наиболее подходящий по функционалу и визуальному оформлению шаблон, после чего можно приступать к его настройке и наполнению.
Визуальный редактор с простотой MS PowerPoint, позволяет изменять любой элемент создаваемого сайта, а также без каких-либо проблем добавлять или удалять самые разнообразные блоки и модули.
Шаг четвертый – финальные штрихи и запуск.
В результате вы получаете высококачественный сайт с удобной мобильной версией и совсем без технических знаний. Если у вас остались вопросы по конструктору, то вы сможете найти ответ на них в нашей подробной пошаговой инструкции.
CMS-системы
Термин CMS происходит от английского выражения Content Management System и используется для обозначения так называемых « систем управления контентом » ( сайтом ).
Эти же системы зачастую называют « движками » для сайтов. На сегодняшний день любая CMS-система позволяет управлять всем содержимым сайта с помощью простого и наглядного интерфейса.
Вполне естественно, что выбор CMS-системы зависит от цели создания конкретного сайта. Каждый движок для сайта имеет свои особенности, преимущества и недостатки. Кроме того, стоит учитывать, что все CMS-системы делятся на две большие группы: бесплатные и платные движки.
Топ бесплатных CMS-систем
Топ платных CMS-систем
Самостоятельное создание сайта
Специально для тех, кто хочет научиться самостоятельно писать исходный код создаваемого сайта, мы подготовили пошаговую инструкцию по созданию простого сайта на HTML. Поехали!
Внимание! Если вы абсолютный новичок или просто не хотите погружаться в работу с кодом и другие технические моменты, можете смело переходить к разделу «Создать сайт с нуля или на конструкторе сайтов? »
Создание HTML-сайта
Ниже приводится исходный код простейшей HTML-страницы :
Ключевые этапы создания сайта
Самостоятельное создание сайта с нуля состоит из трех основных этапов:
Давайте разберемся со всеми этими этапами более подробно.
Создание макета сайта
Выбираем разрешение 1000 на 1000 пикселей. Оно гарантирует корректное отображение у любого пользователя, размер по вертикали в дальнейшем можно будет увеличить.
Затем устанавливаем цвет фона F7F7C5 в шестнадцатеричном формате или выбираем его с помощью палитры цветов.
После этого выбираем пункт меню « Просмотр » – « Направляющие » и активируем отображение линеек и направляющих.
В пункте меню « Просмотр » — « Привязка к » необходимо проверить, что включена привязка к направляющим и границам документа.
Слева от логотипа и справа от контактного номера телефона проводим направляющие, которые позволят обозначить рамки по ширине сайта.
Затем с помощью инструмента « Формы » создаем прямоугольник с закруглёнными краями ( радиус – 8 точек ) и с его помощью обозначаем место под изображение, которое будет располагаться в шапке сайта.
Теперь пришло время вставить изображение в шапку сайта.
Для заголовка в тексте используем черный шрифт. Для навигационного меню – белый.
Перемещая правую границу основного текстового блока, вставляем изображение в текст страницы ( справа от текста ).
C помощью инструмента « Текст » ( шрифт Arial ) размещаем копирайт в подвале страницы ( под линией ).
Нарезаем необходимые для вёрстки сайта фрагменты изображений с помощью инструмента « Раскройка » ( мы выделили основную картинку в шапке и картинку в тексте страницы ).
В результате этого мы получим множество графических фрагментов для нашего будущего шаблона. В папке, где был сохранен сам шаблон, появится папка с изображениями ( images ). Отбираем нужные и переименовываем.
Макет страницы создан, необходимые фрагменты получены, можно переходить к верстке.
Верстка сайта
Первая строка этого файла должна выглядеть следующим образом:
Она сообщит браузеру, как именно обрабатывать содержимое страницы. Далее следует набор тегов:
Внутри … располагаются теги, которые не отображаются в окне браузера пользователя. Как правило, они начинаются со слова meta, и называются мета-тегами, а вот тег … отображается в качестве заголовка окна браузера и анализируется поисковыми системами.