28.10.2010

Как работает HTMLColors2000. Чем она может помочь блоггеру

При ведении блога очень часто хочется так подобрать цвет шрифта, чтобы он соответствовал цветовому оформлению блога. Хочется , чтобы твой блог выглядел красиво. Особенно, это, наверное, касается блогов, которые ведут женщины. Но для создания красоты на своем блоге необходимо знать, как же обозначаются эти цвета в языке HTML. Не думаю, что все пишущие на блогах, такие уж «спецы» в этом деле. Оказывается и не надо сильно заморачиваться по этому поводу – все уже придумано до нас. Есть такая небольшая программка (ее программой то, как-то неудобно представлять) называется HTMLColors2000, вот она то и выручит всех начинающих блоггеров. Это программа, которая многое умеет. Она снабжена удобными ползунками для подбора RGB-цвета, стандартной таблицей безопасных цветов и отличным списком «Color». Найти ее очень просто по запросу, например, в Яндексе (HTMLColors2000 скачать).
Попробую немного рассказать об этой программке. Делаю я это в первый раз. Навыков преподавателя у меня нет – не судите, люди, строго!
Когда вы скачаете файл с программой, то просто поместите его в какую-нибудь папочку. У меня она находится прямо на Рабочем столе. Программа не требует установки на компьютер. Она просто открывается, когда вы нажимаете на значок программы правой клавишей и выбираете в выпадающем меню функцию «Открыть».
Выглядит она так:
Вот так выглядит эта программа
Чтобы определить цифровое обозначение цвета необходимо нажать на кнопку «Screen». К этой кнопке на рисунке ведет красная стрелка под номером 1. Затем навести мышку на определенный цвет (на рисунке красная стрелка под номером 2 показывает, куда была наведена мышка) и щелкнуть левой клавишей и цифровое обозначение цвета появится в окошке программы. На него указывает стрелка под номером 3. Это и будет HTML код цвета - #A39EE0.
Вот так выглядит эта программа
Вот сравните с этой картинкой. На ней стрелка мышки наведена на другой участок рисунка.
Вот так выглядит эта программа
Видите, что цифры HTML кода ( #0E23BC) в окошечке изменились. Изменился и цвет в окошечке, которое находится под кнопкой «Copy».
Если же просто подвести мышку к какому-то объекту, чтобы определить его цифровую кодировку, но не щелкать по мышке, то на экране в левом углу наверху появятся цифры и буквы (так правильнее), обозначающие интересующий вас цвет. На них указывает стрелка под номером 2. И под ними будет располагаться небольшой прямоугольничек с образцом цвета. В данном случае это розовый цвет. Стрелка под номером 3 показывает, куда была наведена мышка. И вы видите, что в этом случае цифры, показанные в левом углу, не совпадают с цифрами в окошечке. Да и цвет в окошке под кнопкой «Copy» голубой, а не розовый. Так что будьте внимательны. Следите за собой – щелкнули ли вы мышкой. Если вы щелкните левой клавишей мышки, то цифр в левом верхнем углу, на которые указывает стрелка под номером 2, не будет.
Вот так выглядит эта программа
В этой программе имеется стандартная таблица цветов. Я ее специально на этом рисунке поставила чуть вправо. На нее указывает стрелка под номером 1 на следующем рисунке. Эта таблица появляется при нажатии кнопки, которая находится над кнопкой «Screen». Когда таблица спрятана, на этой кнопке стоит надпись « More ». При видимой таблице надпись на этой кнопке изменяется на «Less ». В надписях на этих кнопках есть еще и угловые скобки, которые я не стала прописывать. Из-за них я полдня думала почему у меня не получается вставить текст в новое сообщение. У меня его так перекосячивало - выдавало такую абракадабру. Я решила, что я совсем перестала соображать и взяла тайм-аут на полдня. Вечером пришла гениальная мысль: "А может эти угловые скобки читаются, как HTML-код, поэтому с текстом происходят такие "дикие" превращения?"  Все так и оказалось. Вот так даются первые потуги стать Гуру!!!:))) Вернемся к программе. Если вы наведете стрелку мыши на один из квадратиков с выбранным цветом (на рисунке стрелка под номером 2) , то вы тут же увидите HTML код этого цвета. На него указывает стрелка под номером 3. Этот HTML код не совпадает в данный момент с кодом в окошечке. Заметили?
Вот так выглядит эта программа
Вы можете в HTML коде не писать цифровое обозначение цвета, а писать его более привычными английскими буквами. Но опять же нужно знать, как точно пишется на английском языке тот или иной цвет. Я, например, учила в школе немецкий. И с английским языком мы находимся не в очень теплых отношениях, хотя и пытаемся дружить. Стрелка номер 1 на следующем рисунке указывает вам на замечательный список Color Name. При нажатии на черный маленький треугольничек, к которому подведена стрелка номер 1, выпадает список с названиями цветов на английском языке, а в окошечке, на которое указывает стрелка номер 3 появиться и сам цвет. Одновременно появиться и HTML код этого цвета. На него показывает стрелка номер 5. А стрелка номер 4 указывает на цветовую модель RGB. Это для тех, кто пользуется такой моделью. Здесь я не буду сильно вторгаться в объяснения по этой модели. Если хотите, поищите о ней информацию в Интернете. Но кто пользуется программой Фотошоп, конечно же, об этом знает. Кстати, блоггеру надо знать о RGB, какой же блог без красиво оформленных в Фотошопе или в другой программе картинок?
Вот так выглядит эта программа
Передвигая ползунки, которые обведены красным квадратиком, вы можете получить разные цвета в окошечке, которое находится под кнопкой «Copy». На этом рисунке окошечко окрашено в салатовый цвет. На следующем рисунке оно окрашено уже в желтый.
Вот так выглядит эта программа
Сравните, как изменились все показатели во всех окошечках, на которые указывают стрелки с такой вот галочкой (V). И посмотрите, как изменилось положение ползунков по сравнению с предыдущим рисунком
Вот так выглядит эта программа
Да вот еще забыла написать, для чего нужна кнопка «Copy». Нажав на нее после того, как вы получили в окошечке HTML код, вы сохраняете его в буфер обмена. И теперь сразу же можете вставлять его в HTML текст (комбинацией клавиш Ctrl+V или же через правую клавишу мышки команда – Вставить). Ну, это и без меня знаете. Чего-то меня просто понесло умничать.
Ну, вот и все, что я знаю об этой замечательной программе. Пользуюсь ею постоянно на еще двух своих блогах Республика Тыква и Капустная Мозаика. Изучила самостоятельно, настолько она проста. Если кому-то пригодится, буду очень рада. Блоггеры, а особенно блоггерши, должны дружить, как вот в этой песенке о дружбе. Я так думаю.

3 комментария:

БабочкаЯночка комментирует...

Петра, поздравляю! вашу статью прочитали и к вам в блог про петрушку пришли многие читатели. Вот и отдача от коллективного блога.

Petra комментирует...

Спасибо!Вместе мы сила!Вот и пришло мое первое боевое крещение...

Лариса Клепачева комментирует...

Отличный пост! Спасибо за полезную программку. Обязательно буду пользоваться.

Это стОит прочитать:

Наши читатели пишут

Новые Друзья Блога

Шпаргалки для чайника

Дорогие читатели коллективного блога,
за полтора года работы с блогами я узнала сама и с помощью других блоггеров много интересного и полезного о продуктах Google.
Все свои открытия, сделанные "методом научного тыка", я для памяти записываю в специальный блог в виде иллюстрированных уроков.
Но не являясь ни профессиональным учителем, ни профессиональным программистом не могу утверждать, что мои записи выдержаны в полном соответствии с официальной териминологией. Поэтому я назвала их "Шпаргалками" .
Осмелюсь предложить их вашему вниманию.
Полезны они только совершенным Чайникам.
Вопросы принимаются в комментариях к постам.
Критика - не принимается: я так делаю, мне это нравится. Если вы делаете по-другому, тоже имеете полное право. Удачи.

Путеводитель по "Блог-о-ведению"

для начинающих блоггеров:

как использовать стандартные функции продуктов Google :

Скачать Picasa бесплатно. По-русски.

Путеводитель по теме "Программа Пикаса" от Гуугля

1. Как я разобралась с хаосом папок.

2. Как я работаю с папками в этой программе.

3. Как я делаю в Пикасе коллажи и подписи к ним:

первая статья

вторая статья

третья статья

четвёртая статья

4. Что мне понравилось в новой версии Программы Пикаса.

5. Как я загружаю картинки из программы Пикаса прямо в свои Блоги.

6. Какие виды коллажей я уже умею делать в программе.

7. Фотографии, внесённые в папку можноразделить на несколько папок.

8. Как c помощью Пикаса я"фотографирую" экран компьютера

9. Как с помощью Пикаса защитить свои Авторские права.

10. Пикаса сама переименовывает файлы, если вам это нужно.

11. Как в Пикаса переносить с одной фотки на другую подписи, которые надо повторить.

12. Как в Пикаса восстановить первоначальную картинку.

13. Как сделать шаблон подписи и установит её на большом количестве картинок.

14. Как улучшить качество снимка

15. Внести изменения в веб-альбомыпрямо из Пикаса за одно движение.

16. Смотрим через Пикаса веб-альбомы других пользователей.

17. Как получать обновления из веб-альбомов своих друзей и коллег по хобби.

19. Если у вас веб-альбомы в разныхаккаунтах.

20. Смежные галереи веб-альбомов - содержат интересные вам материалы.

Путеводитель по Гаждетам и др. темам

А. Что я сама узнала

3. Опция прямая "ссылка на сообщение".

11. Глюки от Гугля. И на солнце есть пятна.

21. Какие разделы есть в Группах Гугль.

22. Опция Gmail : отправить сообщение в Группу и опубликовать комментарий в посте.

23. Форматирование текста - это помогает читать и понимать.

24. Не надо пугаться, если вас заблокировали, как спам-блог.

25. Инструкция для Читателей.

Б. Что мне другие рассказали

1. Гаджет/виджет "Случайные посты"

3. Как поставить переводчик в блог. От Тройки.

3. Как поставить переводчик в блог. От Тройки.

4. Гаджет "выскажи своё мнение" от БП

Браузер Chrome Google

А. Загрузить Хром. - это бесплатно.

1. Что надо знать о браузере Хром.

2. Как копировать текст и картинки из интернета с помоью Хрома

3. Как изменить масштаб отображения страниц блога.

5. Установить Ярлыки блогов и запускать их с рабочего стола.

Проверьте, всё ли вы сделали, чтобы не потерять свой АККАУНТ:

Разные полезности:

Для продвинутых пользователей рекомендую блог:

Всё для Blogger(а) на Blogspot(е)!

и Группу помощи русскоязычным Блоггерам.

Советы Читателю:

Введение. Статьи 1. - 2. - 3.

Posted by Picasa

Всегда ваша

Яна

*****************************************************