Мы создали каркас вашего сайта (его главной, а возможно и второстепенных страничек), стильно оформили, теперь нужно оживить сайт.
Вспомним о том, что мы уже зарегистрировались на freehostia.com и при регистрации выбрали пароль доступа к FTP - серверу. Можно воспользоватся личным кабинетом на хосте, но FTP - сервер удобнее. Зайдём на его страничку и введём необходимые данные в окна запроса. После завершения операции мы попадём в корневой каталог созданного по вашей заявке сайта и обнаружим, что там уже есть какой-то файл. Файл этот называют системным(?) и он такой ядрёный, что ему даже имени не надо, только - расширение. От него лучше держаться подальше ! В верхней панели странички найдём кнопку "новый файл" и нажмём на неё. В небольшое окошко, в верхней части открывшейся странички, впишем имя файла - "index.html", а в расположенное ниже основное поле странички, вставим "мышкой" код с рис.2. Удалим порядковые номера строчек и сохраним код нового файла, нажав на синий "конвертик" , расположенный в левом верхнем углу странички. По стрелочке, расположенной рядом с "конвертиком", вернёмся в корневой каталог и повторим предыдущую операцию. Только в этом случае - дадим новому файлу имя "style.css" и поместим ниже код с рис.3, не забыв удалить номера строк и комментарии.
Если вы сделали всё верно, то войдя на свой сайт, вы увидите расцвеченное окошко с различными надписями. А дальше - всё зависит от вашей фантазии. Комбинируйте с цветом , количеством блоков и информацией в этих блоках. А для удобства дальнейшей работы над сайтом - поместите его адрес и адрес FTP-сервера в панель закладок. Главное о чём необходимо помнить - для успешного просмотра вашей странички посетителями - у всех папок и файлов вашего сайта должен быть уровень доступа не ниже 755. Сделать это не сложно - на страничке каждого каталога - папки, в правом верхнем углу, расположена кнопка Chmod. Пометив в левой колонке файл или папку (а лучше - сразу все) и нажав на вышеупомянутую кнопку, вы получите возможность установки уровня доступа. Проверять уровень доступа к файлу или папке необходимо после каждой редакции !
Стиль можно не выносить в
отдельный файл, если не боишься перегрузить страничку или, если хочешь задать каждой подстраничке свой
стиль. В этом случае -
стиль задаётся при формировании блока и добавляется в открывающий тэг:
<div id="text" style="background-color:#ccc;margin-left:202px; margin-right:202px;text-align:left;padding:10px;font-size:14px;"> содержание контейнера </div> рис.4Другими словами - переносим всё из css-файла на страничку. При заполнении блоков текстом и картинками (фото) не лишним будет помнить о соразмерности вставляемого материала и размеров (в основном - ширины) блока. Если после очередного добавления - страничку будет трудно узнать, не расстраивайтесь, просто уменьшите размеры вставляемого (в пикселях). И ещё - размер шрифта (px) влияет на меж-строчные пробелы. Помни - в создании странички нет мелочей. Даже ширина границы между блоками может на многое повлиять.
Немного об именах созданных файлов. В практике программирования - имя файла - это выбор автора программы, лишь-бы - латинскими буквами и с цифры не начиналось. Однако, имя index, браузер воспринимает, как имя главного файла странички и всегда начинает просмотр именно с этого файла. И не обидится, если вы опустите его в прямой ссылке. Если что-то не будет получатся сразу - не расстраивайтесь .
Не лишним будет помнить, что создавая внешний вид странички (-чек) вашего сайта, браузер должен иметь чёткую инструкцию - что и как он должен сделать, где находится вспомогательный "инструмент", как до него добраться. Путь к тому, чем будет пользоваться браузер - должен быть прописан полностью. Если вас пугают слишком "длинные пути" - копируйте вспомогательные файлы (они, как правило , не очень большие) в тот - же каталог, где находится ваша страничка(-ки). Тогда в ссылке можно будет указать только имя файла, на который вы ссылаетесь.
Возможно, это будет лишним, но я добавлю - прежде чем садится за создание собственного сайта(web-странички), пройдись взглядом по "верхам" HTML и PHP, хуже не будет.