Как известно, чудеса иногда случаются. Так вышло и под этот Новый год, когда я сумел преодолеть все круги Ада и восстановил доступ к админке моего старого сайта. Это был мой школьный проект, который я делал в рамках экзамена по информатике.
Я верстал сайт в блокноте, потому что программ вроде Dreamweaver у меня тогда не было, как, впрочем, и глубоких знаний HTML. Учебником служил сборник статей, который кто-то любезно прислал в редакцию журнала "Игромания", а они выложили на диск-приложение к журналу.
Вёрстка в блокноте казалась мне тогда чем-то невероятно крутым, хотя это был и остаётся весьма корявый способ создания web-страниц. Основные проблемы возникали из-за невозможности визуализации таблиц - всё приходилось подбирать методом проб и ошибок.
Итак, сайт был сделан, размещён на Народ.ру, и заслуженная пятёрка по предмету была у меня в кармане. В течение пары следующих лет я добавлял туда кое-какую информацию, хотя, признаться честно, сайт этот был никому не нужен (как и само явление "школьный сайт").
Шли годы, Народ.ру продали Юкозу, и через какое-то время я не смог войти в админку сайта. Меня это не сильно беспокоило, потому что сайт работал, а информация всё равно не требовала обновления.
С годами я становился умнее и получил новые знания в области вёрстки (в том числе сайтов), и как-то раз я осознал, что мой школьный сайт, который казался мне в далёкие годы невероятно крутым, на самом деле очень кривой и страшный. Увы, изменить ничего было нельзя, хотя мысль об этом сидела в моей голове постоянно.
За пару дней до новогодних каникул я всё-таки сумел восстановить доступ к сайту по FTP, доказав сначала Яндексу, а потом Юкозу, что я - это я. Тогда я решил закрыть для себя этот вопрос и переделал сайт заново. Стилистика и вся информация осталась прежней, но добавились детали, и в целом всё стало выглядеть так, как должно было выглядеть изначально в 2005 году.
Моё вступление затянулось, поэтому вот вам
ссылка на мой сайт, а дальше я расскажу вам про него чуть подробнее.
Первое, над чем я основательно поработал - это макет сайта. Его каркас, если хотите. Сайт верстался под разрешение 800х600 точек, потому что оно всё ещё часто использовалось в 2005 году и было минимально необходимым. Я использовал десятиколонную сетку, каждый столбец которой был равен 80 пикселям. Таким образом, я хотел выяснить как я смогу располагать элементы на странице в пределах этих значений. Сколько столбцов отводить под текст, сколько под картинки и как всё это можно чередовать. Каждая страница сайта, по сути, является каким-то шаблоном или комбинацией элементов, из-за чего сайт выглядит разнообразно.
Панель ссылок в верхней части страниц статичная - она не меняет своего положения, поэтому пользователь всегда может найти переход на другие страницы. Сайт в целом текстовый, иногда встречаются иллюстрации, но они не перегружают страницу. Мне хотелось добиться "эффекта журнала", чтобы сайт воспринимался как проекция некой книги или журнала. Отсюда и белый фон.
Кстати, о цветах. Я взял цвета всех текстовых элементов из логотипа - благодаря этому появилась некоторая цветовая рифма, и сайт стал смотреться более органично. Также могу порекомендовать вам сайт
Color Hunt, если вы тоже задумываетесь о цветовых решениях вашего сайта. Там есть подборки удачных цветовых сочетаний на каждый день.
Для визуальных стилей я использовал базовый CSS, в виде отдельных файлов. Каждая страничка подгружает нужный файл. Это удобно и позволяет упорядочить все текстовые стили. Служебные изображения вроде "кавычек" я взял с сайта
flaticon.com, он очень выручает. Жаль, что во времена создания моего сайта его не было.
Скажу пару слов об ограничениях, с которыми я столкнулся. Во-первых, в ширину рабочей области сайта входит вертикальная полоса прокрутки экрана. Поэтому, если сайт выровнен по центру, его элементы могут смещаться в зависимости от того, есть полоса прокрутки или нет. Увы, простыми средствами HTML и базового CSS этот вопрос не решить. Впрочем, на моём ноутбуке с экраном 1024х768 точек полоса прокрутки есть всегда, поэтому меня это не беспокоит.
Во-вторых, я отказался от поддержки Internet Explorer, потому что он как-то странно работает с таблицами и их границами и текст всё время съезжает. Firefox и Хромоподобные браузеры ведут себя нормально. Шанс, что кто-то сегодня будет смотреть этот сайт через IE очень маленький, а я просто устал бороться с его движком.
Вот такая получилась история. Переделка сайта заняла примерно неделю новогодних каникул - работал я не спеша и в удовольствие. Вновь вспомнил свои школьные годы и получил массу удовольствия в процессе.
P.S. Юкоз вставляет свою дурацкую рекламу, которая перекрывает контент, поэтому если у вас нет блокировщика, то подождите пару секунд и она пропадёт.