Favicon (сокр. от англ. FAVorites ICON) — значок сайта. Отображается браузером в адресной строке перед URL страницы, а также в качестве иконки к закладке, в табах и в других элементах интерфейса.

Википедия: Favicon

Как-то была у меня необходимость создать иконку для своего первого сайта. В одной из книг по графике, я нашла ссылку на программу IconForge (одна из лучших программ по созданию иконок). К сожалению, IconForge программа не бесплатная, ее цена около 40$. На сайте Вы можете скачать ознакомительную полнофункциональную версию, которая ограничена временем.
Для создания малюсенькой картиночки – 40$, я думаю, многовато будет. Так что пришлось искать альтернативу.
Конечно иконки можно создавать в таких графических редакторах как Fireworks или пресловутом Photoshop’е (кстати, тоже платные!), но если Вам нет необходимости иметь такие тяжеленные программы, то можно воспользоваться онлайн сервисами.
К примеру, мне очень понравились два сайта: www.favicon.ru и www.favicon.cc
Первый – русскоязычный, не требует регистрации, имеется редактор, можно загружать собственные изображения.
Второй (бета)- англоязычный, регистрация не обязательна, но если Вы зарегистрируетесь, то можете участвовать в топах, а также хранить иконки на сервере, публиковать иконки для открытого использования, имеется редактор, возможность загружать собственные изображения и грузится быстрее, чем первый.
Так что пользуйтесь на здоровье!
P.S. А еще хочу предложить скачать плагин для открытия изображений в формате .ico в Adobe Photoshop. Полезная штука!

А теперь мы будем применять эффект Rollover к нашим ссылкам.

1. Нажмите два раза на любом из слое (где Вы собираетесь устанавливать ссылку) и перед Вам откроется окно,

2. Теперь можно выбрать следующие эффекты: Drop Shadow, Outer Glow, Bevel and Emboss, Color Overlay. Поэкспериментируйте с настройками – у меня получилось вот что:

3. Потом сохраните как New Style и примините данный стиль ко остальным ссылкам.

Часть IV. Резка дизайна.

1. Теперь переходим из Photoshop в ImageReady

2. Переключаемся в режим Оптимизации:

3. Поиграясь с настройками, оптимизируйте изображение

4. Выберите инструмент Slice Tool, и теперь Вам следует буквально порезать изображения на части. Делая это интуитивно, попытайтесь внести смысл в резку. К примеру, следует отделить изображение ссылок друг от друга. В самую последнюю очередь отделите главное изображение, где будет текст. Каждой разрезной части присваивается свой номер. Вот что получилось у меня:

Часть V. Эффект Rollover.
1. Выберите инструмент Slice select tool и выделите любое изображение ссылки и она будет активной, ее Вы увидите на панели Web Content. Теперь выделите этот же слой на панели Layers. Убедитесь, что видимость эффектов отключена!

2. А теперь на панели Web Content данного слоя правой клик мышью выберите Add Rollover State => Over. Сделайте Over активным и на панели Layers включите видимость эффектов.

Примените данное действие ко всем ссылкам.

3. А теперь, чтоб по ссылкам можно было куда-то переходить Вам следует заполнить их содержимом, то есть… ссылками.

Часть VI. Оптимизация изображений.
1. Следующее, что Вам следует сделать это оптимизировать каждый отрезанный кусок дизайна (т.е. рисунка). Выделяем и экспериментируем с настройками. Лучше выбирать для маленьких кусков jpg формат, а для больших gif.
2. После этого сохраняем страницу File>Save optimized as. У нас получиться hmtl файл и папка с изображениями.
3. Открываем страницу в Dreamweaver и главное изображение (где будет текстовое содержимое Вашего сайта) объявите фоном. То есть удалите и назначьте (выбирая через Обзор) его же фоном ячейки, где было удалено это изображение.
4. И последнее, что следует сделать – это назначить цвет для фона страницы. У меня он черный, а Вы устанавливайте на свое усмотрение.
Просмотреть что получилось можно тут:
Пример примитивной страницы, при создании которой была применена резка дизайна

Начало урока

полный урок – оригинал

оригинал

1. Создайте холст размером 800х600 пикселей.

2. Протащите несколько направляющих, чтоб все части дизайна были на своих местах.

3. Создайте новый слой.

4. Установите следующие цвета для вашего фона:

5. Примените градиент для вашей странички, удерживая клавишу Shift.

6. Перенесите изображение на рабочий документ и подгоните размер.

7. А теперь сделайте так, чтобы изображение плавно переходило в фон. Кликните на иконку слева, чтобы добавить маску.

8. Выберите кисть (soft!) и установите 100 пикселей.

9. Установите цвет переднего плана черным и начинайте закрашивать края изображения, тем самым как бы сливая фон и само изображение.

10. Закрашивайте до тех пор, пока вы не будете удовлетворены результатом: переход должен выглядеть мягко.
11. Наконец-то переключитесь на screen режим и установите прозрачность до 49% (в моем случае это 95% иначе совсем не будет видно рисунка).

12. Теперь изображение должно максимально слиться с фоном.

оригинал урока

1. 250 Мб места.
2. 10 Ггб трафика.
3. 1 бесплатный домен третьего уровня.
4. Php и Perl .
5. DirectAdmin cpanel, чтоб управлять своим аккаунтом.
6. Никакой рекламы. Ваша реклама разрешается.
7. Безлимитное количество MySQL базы данных.
8. Безлимитное количество субдоменов и фтп аккаунтов для всех Ваших доменов.
9. Безлимитное количество почтовых аккаунтов.
10. Безлимитное количество Ваших доменов.
11. Создание сайтов на любых языках мира.

Вы думаете, что таким бесплатный хостинг может быть только во сне? Вы ошибаетесь! Все, что Вам нужно делать – это оставлять посты на форуме и получать за это баллы(чем длинее пост, тем больше очков), если Вы долго не постили, то баллы могут пойти на минус и тогда после двух предупреждений Ваш аккаунт будет удален. Мне было достаточно оставлять по одному посту в день или один большой пост на неделю .
Чтоб получить этот хостинг (вот его адрес: http://www.frihost.com), Вам следует зарегистрироваться на форуме http://www.frihost.com/forums/ и оставить 5 постов, а потом делаете запрос и в течении 2-ух дней Вам подключают хостинг.
Это единственный бесплатный хостинг с которым у меня НЕ было проблем. Сайты работали отлично!
Единственный минус – это то, что данный хостинг и форум англоязычный. Хотя… может это Ваш минус, если Вы не владеете английским языком?