Здравствуйте, сегодня бы я хотел доработать мелочи на блоге, касающихся внешнего вида. Напомню, что блог, который мы создавали с самого первого урока носит название ФанБар.
Перейди на этот блог, Вы ничего особенного не увидите, так как все действия, которые делал там, я показывал и старался подробно объяснять на этом блоге. Как видите, много чего не доделано, даже страницу “О сайте” не успел заполнить. Но обещаю исправиться 🙂
Итак, давайте приступим к “мелким доработкам”.
1. Изменение “шапки”
То, что бросается мне в глаза, это шапка на блоге. Она выглядит следующим образом:
Чтобы ее редактировать я открыл папку темы программой Total Commander, нашел в ней изображение отвечающее за шапку. Навел на нее мышкой и любезно “высветилось” разрешение изображения:
Далее я открываю данный файл графическим редактором (я использую Adobe Photoshop). Создаю новый документ такого же разрешения, как и у стандартной шапки, которая идет вместе с темой.
Далее запускаю программу HTMLCol, чтобы узнать шестнадцатеричный код данного зеленого цвета.
В этой программе нажимаю “Screen” и “тыкаю” на зеленый цвет шапки. Получился код #68B630. Теперь в Фотошопе я пишу нужный мне текст, и ставлю вышеполученный цвет, выбираю схожий шрифт.
Так как мой блог все-таки не про Photoshop, могу порекомендовать скачать бесплатную книгу, почитать в интернете всякие форумы и сайты, посвященные данному графическому редактору или приобрести диск.
Вот такой результат получился у меня:
Если учесть, что я не особо силен в Photoshop, думаю, получилось неплохо. Конечно Вы можете купить шапку, сделать ее текстовой или всячески по-другому “извращаться” над ним.
2. Шрифт
Почти весь блог я привел к единому шрифту. Не знаю как Вам, но я чувствую себя не комфортно, когда на блогах в одном месте один шрифт, в сайдбаре другой и т.п. Как менять шрифт, я рассказывал в уроке про CSS (раздел практики, в конце урока).
3. Цвет
Все мы знаем, что красный, зеленый и т.п. бывают разных оттенков. Жутко не приятно смотрится, когда на блоге кругом разные цвета: в одном месте алый цвет, в другом светлее и т. п.
Как привести к одинаковому цвету? Пусть будет это самостоятельной работой, так как похожее я уже делал на уроках.
Я могу лишь дать маленькую подсказку: Вам придется использовать FireBug для Firefox и программу HTMLCol.
4. Футер.
Также нам нужно будет сделать некоторые изменения в подвале шаблона. Если у Вас футер закодирован, раскодируйте его обязательно, потому что бывают вредоносные коды – вирусы и другие не нужные “штучки”.
Переведите на русский язык, написанное в подвале.
На сегодня все. И вообще, как я считаю, над блогом нужно работать каждый день. Если даже Вас что-то не устраивает в своем блоге, попробуйте их переделать позже, когда у Вас будет больше опыта и знаний.
P.s. Предлагаю принять в конкурсе “Лучший комментатор месяца”. Пока претендентов всего человек 3-5. Так что, шансы выиграть в конкурсе у каждого велики. Потом будет сложнее, так как участников и комментариев будет больше 🙂
P.s.s. Наверняка, следующий урок будет в виде скринкаста. То есть будет своеобразный видеоурок. Хотелось бы слышать, нужно ли это блогу? Ведь будет шипеть звук, сопровождение некачественной речью (потому что это будет первая моя запись, может с опытом станет лучше)и другие недостатки.
Решался долго, но, думаю, стоит попробовать. Видео для новичков будет удобнее и проще? В общем хотелось бы услышать Ваши рекомендации и советы…
_____________________________
Следующий урок: Урок 43 Как сделать RSS-подписку на блоге.
Петр, а не сделаете ли короткий урок, как сделать кнопку НАВЕРХ. Вот такую, как ваша)
Скачай дизайн Mystique и прибудет тебе счастие.
Но лучше нарисовать дизайн в фотошопе, ведь это уникализирует шаблон сайта.
Спасибо, все укомплектовано и кратко описано.. Иногда забываю это делать.
Очень удобно создавая новый блог, все быстро и оперативно довести до ума, не доходя до всего самому еще раз..
Здравствуйте. Я новичок, пытаюсь изучать HTML и прочие приложения для создания сайтов. Открыла свой блог, а внести туда небольшие изменения не могу. В частности, я хочу убрать ненужные мне тексты, а где и как понять не могу. Не могли бы вы мне помочь или подсказать где о подобном говорится
А что делать если нету файла лого? Но заменить всё же хочется…. 🙁
Файл не обязательно называется logo просто просмотрите изображения в папке темы.
Если у вас нет файла лого и вообще ничего нет, просто сделайте прописав код, либо через стили
Спасибо, Александр, за помощь. 🙂
Далее запускаю программу HTMLCol, чтобы узнать шестнадцатеричный код данного зеленого цвета.
Для определения цвета любого элемента страницы, на мой взгляд удобнее для FireFox использовать плагин ColorZilla. В данном же конкретном случае сразу в Photoshop рисовать новый логотип поверх старого, что позволит и цвет элемента узнать сразу при рисовании и размер сразу будет нужный.
Хм, спасибо большое за ColorZilla. Действительно удобнее пользоваться, чем через отдельную программу.
Я все больше и больше влюбляюсь в Firefox 🙂
Я все больше и больше влюбляюсь в Firefox
он очень удобен благодаря расширяемости, любой может написать собственный плагин
правда из-за плагинов он кушает много памяти, и иногда нестабилен
FireFox — это не просто браузер, я бы назвал его комбайном для вебмастера. Я даже ftp браузером пользуюсь в FF, тоже специальный плагин есть, очень удобно открываешь в соседней вкладке и закачиваешь файло, переходишь в соседнюю вкладку и уже в админке сайта.
Да чем привлекательнее шаблон сайта и дизайн, тем хорошо для сайта, ведь это значит, что посетители придут еще и еще.