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

Итак:

• меню на css
• css layouts
• умные мысли
• 3 (но хороших) SEO аддона
• навигационное меню без использования JavaScript
• еще одна менюшка

Не обессудьте, что пока мало - список будет пополняться в зависимости от простоя добавления новых заметок

Столкнулся я с такой задачей: необходимо написать тест-кейсы по рабочему проекту. Что это вообще за зверь? Это означает, что нужно пройтись по всему продукту, и прописать по-шагово все возникаюшие ситуации,и что следует ожидать но не так банально, типа, вот если мы нажмем сюда, то увидим это, и то, а если повезет,то еще и вот это….

Тест-кейсы прежде всего, должны быть структуризированы и тщательно продуманы

Приведу пример, чтобы наглядно объяснить:

Шаг1
1. Открыть главную страницу сайта
1.1 Перейти на страницу поста

Ожидаемая реакция:
1. Загрузятся и отобразятся корректно все картинки и текст.
1.1 Откроется пост, корректно отобразятся фон и текст поста

Конечно, если большой по объему проект запущен и успешно работает уже не первый год, сесть и с нуля пройтись полностью по всему функционалу будет очень сложно (а если испытуемый никогда подобного не делал, и подавно…)

Правильней всего, если составлять самому, а не нанимать умного дяденьку-тестера, начинать писать тест-кейсы, имея под рукой (лучше на мониторе) так называемые юз-кейсы (use-cases) - случаи, написанные рядовыми пользователями, теми для кого писался продукт, или кто хорошо знаком с ним не первый год… Хочу знать больше »

Наткнулся в закладках на ссылку, подумал, почему бы не написать об этом?

Сервис немного схож с CSSplay.co.uk, о котором я уже писал, и представляет собой один простой JavaScript файл, немного дополняющий простые действия разработчика с CSS, как бы добавляет немного больше того, что хотелось сделать с контентом но долго возиться… Почему он так называется? ХЗ я ж его не называл, наверное потому что, действия которые он позволяет выполянть вполне можно было бы реализвать и без помощи скриптов, но кому охота лишний раз париться?))

Итак, перейдя сразу к самому вкусному, а именно к примерам, на этой странице, можно вдовол полюбоваться всеми прелестями сервиса, сам же скрипт можно скачать на главной и ознакомится с другими продуками “желто-зеленого” сервиса, но как по мне “morecss” самое интересное, что можно там найти…

Небольшой скрипт, который может кому то понадобиться…

Большим плюсом явлется разнообразие применения, если не ошибаюсь, превоначальное свойство было для организации галереи, но имея богатое воображение его можно подключать чут ли не для адсенса, или просто для рекламы, или разнообразие бегущей строки…Whatever

Рабочий пример можно посмотреть в сайдбаре - переключающиеся категории с архивами

Скачать slider в архиве можно здесь

Вот решил выложить (скорее даже для себя) все хаки в одном месте, чтоб долго потом не искать, и не лазить по букмаркам…

Сразу отмечу, что это не борьба с двойными маргинами или прозрачностью андромеды PNG…это варианты подключения отдельных таблиц стилей и(или) прописывания их inline в CSS

Хочется выразить благодарность Евгению Белоеду за некоторые хаки, освещенные здесь…

Итак….

Google Chrome и Safari 3.1

body:nth-of-type(1) p {
color: #333333;
}

Safari

html[xmlns*=""] body:last-child p {
color: #D50303;
}

Safari 3.0

link rel="stylesheet" media="screen and min-device-pixel-ratio: 0" href="safari3.css"

IE под MAC
/**//*/
селектор {
свойство: значение;
}
/**/

Opera

@media all and (min-width: 0)
{
.style { background: #FF0; }
}

или

html:first-child .style
{
background: #FF0;
}
/* Opera > 9.5 поддерживает не всегда */

Firefox

html:root .style
{
background: #FA0;
/* для Safari тоже сгодится */

или

.style, x:-moz-any-link
{
background: #FA0;
}

IE

IE 6 и ниже
* html {style}
или
_style

IE 7 и ниже
*:first-child+html {} * html {}
или
//style

IE 7 только
*:first-child+html {}

Я постарался осветить все новые и необычные хаки (не брал борьбу с min-width, min-height в IE) а ткаже подключения для него отдельных CSS файлов. По мере поступления, список будет обновляться (хочется собрать по-больше и по-необычней), но не стоит забывать что хороший сайт, этот тот сайт, который сделан без использования каких-либюо хаков. Имеется ввиду что он нормально отображается во всех браузерах))

Приветствую!
Как-то так незаменто прошел аж целый месяй, со времен моей последней записи….постраюсь наверстать упущенное…

Итак, на днях столкнулся с необходимостью утсановить на форум моего тваоища смс замок для регистрации пользователей (форум вырос, на нем много полезных файликов, и его хозяин решил немного подзаработать, адсенса наверное мало))…ну да ладно

Вообщем, накопал я сервис, который помог мне в решении этой супер мега-трудной задачи)

Сервис называется на удивление sms-замок

Можно опустить зачем и почему - и сразу перейти вот к этой странице, на которой прекрасиво расписана инструкция по установке на свой форум этого плагина. Сразу кажу, что я впервые встретил такое подробное описание на вполне понятном и чайнику языке.

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

Тарифы радуют поддержкой почти всех наших Украинских операторов, (и не только, есть даже Израильские!), но разочаровывают тем, что при выборе более дорогого тарифа, отдаешь этому преславутому сервису почти половину заработанного! (Халява,думали?) Забыл сказать - там целая система выбора стоимости каждой смс-ки.

Как бы немного в противовес - нашел похожий плагин (правда только на версию PHPBB3 и выше), на сайте, посвященному заработку при помощи смс на разных платформах. Он напрямую все делает через свой сервис, от вас только нужно ввести имя своего адреса и номер телефона, а там сколько вам перешлют, столько вы и получите)

В заключении, хотел бы высказать ни кого не интересующее свое мнение: я уверен, что 7 из 10-ти пользователей, увидев на портале платную регистрацию, развернутся и будут искать до потери пульса пусть хуже качества, но зато БЕСПЛАТНЫЙ софт, или что они там ищут…

Платная парковка хороша, когда софт действительно уникальный, и форум имеет более-менее приемлемую нишу. Опять же можно заработать на системах storage, типа Depositfiles, но это уже другое русло интернет-заработка, которое надеюсь когда нибудь осветить на страницах этого блога.

Сразу следует отметить, что данный процесс верстки отличается от привычного понятия верстки документа формата (x)HTML. Я на этом съел ни одну собаку, поэтому решил изложить все как можно подробнее.

Начну с того, что все стили необходимо прописывать вручную, т.е inline. Естественно, ни о каких-либо css-файлах не может идти и речи! Все должно быть прописано в теге элемента.

Единственное что, можно использовать - общие стили типа для списков, параграфов, таблиц, но не более. Обо всякого рода примудростях, типа , стоит на время позабыть.
Потому что, если не сущетсвует едиственного формата для верстки под все браузеры, то куда уж говорить про Gmail AOL и прочие почтовые сервисы. Я тестировал 5 популярных почтовиков (среди них Gmail, AOL, Yandex, Outlook и еще какой-то, не помню уже), но так и не добился точного и одинакового отображения инофрмации.

Правило №1: Верстать только в таблицах! Сам я их стараюсь не использовать в повседневной работе, но тут пришлось немного извратиться.

Правило №2: Для отображения фона картинкой лучше использовать свойство таблицы background - не спрашивайте почему. Это касается также и ширины с высотой.

Правило №3: Как не пытайтсесь но всякого рода отрицательные margin‘ы не действуют. По-крайней мере если говорить о “почтовой кроссбраузерности”))

Правило №4: Ссылки на картинки, естественно, не ставятся.

P.S. Если кому-то эти правила кажутся и так понятными, то они просто не сталкивались со всеми макетами для почтовой рассылки!

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

Надеюсь все помнят о мега-важном свойстве таблицы cellpadding=0 cellspacing='0'

Сегодня нашел уникальный способ как можно открыть файлы Adobe Photoshop не из под виндовой среды!

Каждый раз приходилось использовать Gimp, но он не всегда подтягивал все слои, а если и подтягивал, то не всегда отображал их корректно.

Я думаю у всех, у кого стоит Ubuntu имеется офисный пакет OpenOffice. Он то нам и поможет
Вкладка Insert - Picture - From file и вуаля!

Это конечно не полноценный PSD-шник со всеми слоями,но по крайней мере целиком и полностью отображаемый!

Для тех, кто все таки не привык смотреть картинки в текстовых редакторах, в репозитории Ubuntu, я отыскал программку под названием Xara Extreme, которая примерно также показывает эти самые файлы.

Наверняка многим приходилось сталкиваться с аццкими макетами необходимостью завернуть текст в какую нибудь букву “зю”, причем так, чтобы текст оставался текстом.

Сегодня я нашел один из способов, как это можно осуществить!

На сайте csstextwrap.com предлагается поизвращаться с текстом, причем очень даже удобным способом), при помощи удобного визуального редактора.

Две линии по бокам можно крутить как вздумается, тем самым задавая фигуру в которую будет помещен необходимый для обработки текст. Чтобы добавить изгиб, достаточно одной таблетки просто нажать на нужное место один раз левой клавишей мышки.

Когда вы выстроили необходимую геометрическую фигуру - внизу предлагается 3 варианта вставки ее на ваш сайт (инлайн, с помощью CSS и даже JavaScript!)

В добавок показывается размер этой самой фигуры, которе можно задать вручную, после чего нажать “update”.

Важно помнить что DIVы нужно вставить до параграфа с текстом.

Конечно при изменении размеров окна, все ломается, но это легко исправить при помощи min-width

В общем, очень удобный сервис, советую всем начинающим и продолжающим!)

Привет

На днях на мой ящик пришло уведомление о выходе нового аддона для всеми нами горячо любимого браузера

Немного покопавшись хочу поделиться следующим:
ну,во-первых, после таких супер-мега аддонов, как web developer и firebug, врядли что-то можно добавить в улучшение при верстке сайтов, разве что, как в песне Высоцкого “нажал на кнопочку-и человек готов!”)
во-вторых, этот аддон не standalone как мне показалось сразу а дополнение к firebug.

Итак, что же он нам дает:
интегрируется в firebug и при работе с консолью в правом окошке теперь подробно описано про каждой свойство того или иного элемента, хоть садись и учи, что же это за зверь такой DIV)

понравилась система поиска - теперь можно поискать отдельно элементы CSS и аттрибуты и элементы HTML.

как я понял всю иформацию об элементах он берет не из w3c, как может хотелось, а из своей вот этой базы
Еще всякие мелочи, что кому понравится - поделитесь, мы тоже порадуемся

Вот здесь его можно скачать, также страница сдобрена хорошими скриншотами.