Создание сайта с нуля .

Этот способ – наиболее длительный и трудный. Необходимо будет изучить хорошо хотя бы один из распространенных языков веб-программирования, например, HTML, PHP, CSS, а также работу с базами данных, например, MySQL. Этот процесс - длительный.

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

Макет сайта – это набор правил, по которым располагаются элементы страницы сайта. Таким образом, макет - это основа верстки, - тот каркас, на котором собираются элементы дизайна и информационное наполнение страницы.

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

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

сайт TEPKA.ru" целиком создан на одном макете, несмотря на то, что первая страница внешне несколько отличается от всех остальных; в этом случае создание макета для сайта сводиться к планированию одной единственной страницы. Результатом такого планирования, является единый шаблон, по которому создаются все внутренние страницы.

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

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

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

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

Особенности WWW и собственно языка HTML приводят к тому, что вид вашей страницы зависит от используемого монитора и от настроек конкретного компьютера пользователя. Если вы не хотите доставить пользователям неудобство (а горизонтальная прокрутка экрана - это одна из самых неприятных штук), то ограничивайтесь экранным разрешением. Доминирующее сейчас разрешение - 1024х768 точек. Опираясь на эти цифры, вы можете смело рассчитывать на ширину 900 точек - это будет оптимальная ширина вашей таблицы.

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

1.5 Редакторы для создания сайтов

Редакторы HTML

HTML-редактор — компьютерная программа, позволяющая создавать и изменять HTML-страницы. Несмотря на то, что HTML-код может быть написан в простом текстовом редакторе (например, Notepad), специальные редакторы для написания кода HTML предлагают больше удобств и функциональности. По своей функциональности они делятся (часто весьма условно) на две категории:

- редактор, показывающий только исходный код;

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

Многие WYSIWYG-редакторы позволяют одновременно работать и с кодом страницы.

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

- NVU - Визуальный (WYSIWYG) HTML-редактор;

- Web Studio - Пакет программ для создания и поддержки Web-сайтов.

Основой для создания NVU послужил код Mozilla Composer. По сравнению с оригиналом, возможности NVU значительно шире - менеджер сайтов с возможностью редактирования страниц на удаленном сервере, редактор CSS c предварительным просмотром стилей, цветная подсветка синтаксиса в режиме редактирования кода, проверка орфографии, расширение плагинами и многое другое.

Основу составляет довольно мощный "визуальный" редактор, включающий инструменты для работы с HTML/XHTML, JavaScript, CSS, PHP, Perl, SQL и другими современными веб-технологиями. Кроме этого, в пакет включены Tags Designer, Template Editor, средства для проверки правильности HTML-кода, а также простой и в то же время удобный текстовый редактор LightPad. Имеются средства для управления проектом, в том числе встроенный браузер, утилита для загрузки файлов на сервер по FTP-протоколу (допускается автоматизация работы с "зеркалами" сайта), имеется поддержка макросов для автоматизации. Возможно многопользовательское использование.

HTML-редактор NVU

Подробнее рассмотрим редактор NVU. NVU – это небольшой кроссплатформенный визуальный (WYSIWYG) HTML-редактор с открытым исходным кодом. Его основой послужил код, выделенный из Mozilla Composer. Благодаря этому, редактор получился лёгким и удобным в использовании и на настоящий момент по своему функционалу уже далеко обогнал своего "прародителя", вплотную подбираясь к возможностям своих коммерческих "собратьев", таких, как FrontPage и Dreamweaver.

NVU позволяет легко и просто любому новичку, незнакомому с HTML, в визуальном режиме создать качественный сайт или отдельные страницы, отвечающие всем современным веб-стандартам. Продвинутые пользователи при необходимости могут переключиться в режим непосредственной правки кода. Помимо этого в NVU имеются и дополнительные инструменты. Это Менеджер сайтов, позволяющий не только управлять страницами, но и редактировать их прямо на удаленном сервере; встроенный Редактор CSS c предварительным просмотром стилей, цветовая подсветка синтаксиса в режиме редактирования кода, проверка орфографии и многое другое.

NVU поддерживает смену интерфейса с помощью подключения дополнительных тем, а функционал редактора можно значительно расширить за счёт подключения расширений, как написанных специально для NVU, так и некоторых аддонов для Mozilla Firefox.

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

К недостаткам можно отнести отсутствие некоторых профессиональных функций, таких как подсветка синтаксиса, поддержка скриптов и некоторых других.