Было принято решения для более полной сохранности мыслей на тему подачи информации путём блогописания и другими интересными методами, скопировать в этот блог все предыдущие сообщения, связанные с кухонным делом проекта, а также по мере поступления добавлять сюда новые записи.
Решил внести в блог немного разнообразия :-)
Кроме инструкций, которые стараюсь писать максимально доступным и понятным языком (не упуская при этом полезные и интересные детали освещаемой темы :) ), буду освещать некоторые нюансы создания инструкций и работы над этим блогом (метку назову "кухня", а саму рубрику "
Кухня, или взгляд за кулисы"). Также, кроме основной тематики блога, решил рассказывать об интересных вещах в сети интернет (понимая под вещами - интересные сайты, книги, идеи, творения интересных личностей, в общем, все все, что придет в голову и покажется мне интересным). Начнем повествование :)
Кухня, или взгляд за кулисы
Отображение видео с Youtube по всей ширине блога.
Хотел поделиться инфой о том, как настроить отображение видео с youtube, используя всю доступную ширину Вашего блога. Добавив нужное Вам видео с youtube (кнопка Вставить видеоролик -) с Youtube -) ввести в поле поиска название ролика, или прямую ссылку на него, кликнуть на нужный ролик из списка и нажать на кнопку
Выбрать), Вам нужно будет переключиться на режим просмотра исходного кода Вашего сообщения и изменить параметры, отвечающие за ширину и высоту видео для только что добавленного ролика.
Да, забыл отметить, что рекомендации эти касаются работы с блогами на blogspot.com, с блогами на wordpress я не экспериментировал, но примерные идеи, которые предлагаю здесь, могут сослужить пользу и там :)
После добавления видео с youtube, Вам нужно перейти в режим исходного кода сообщения (Для перехода в режим кода, нажмите кнопку
Изменить HTML, которая находится прямо над панелью визуального редактора. Для возвращения в режим предпросмотра, в котором, при редактировании новой записи, отображается форматирование текста, вставленные изображения и видео, нужно будет нажать кнопку
Создать, которая тоже находится над панелью визуального редактора). Нажав кнопку
Изменить HTML, Вам нужно изменить параметры только что добавленного видеоролика с youtube:
Параметры, которые нужно менять, я обвел рамочками (изначальные цифры там были другие, выше я привел код видеоролика, вставленного в блог, из моей инструкции
Как блокировать надоедливые баннеры в FireFox, Opera и Google Chrome). Для того, чтобы во вставленном Вами в блог ролике с Youtube сверху и снизу не было черных полос (таких, какие Вы можете наблюдать при просмотре широкоформатного видео на неширокоформатном мониторе), нужно указывать значения параметров height и width, которые я отметил (высота и ширина), выбирая их с учетом пропорции изначальных размеров видео (отношение длины к ширине изначального видео, и уменьшенного, которое Вы вставите себе в блог, должны совпадать). Узнать отношение сторон видео с youtube можно, используя программу FastStone Capture, которую описывал
здесь (кнопка
здесь кликабельная :) , чтобы понять, как это сделать, достаточно почитать немного инфы вначале инструкции и посмотреть на вторую картинку), выделяете область, соответствующую видео (не затрагивая темные полосы сверху и снизу или слева и справа) и смотрите на разрешение:
Далее, подбирать разрешение вставленного видео Вы будете, опираясь на ширину, доступную в поле записи блога. Ширину блога Вы также можете подсмотреть, используя программу FastStone Capture. Дальше на примере этого видео, покажу, как посчитать значения width и height, которые Вам нужно будет вставить, в height (высоте) нужно будет учесть поправку на нижнюю панель управления проигрывателя youtube , которая 25 пикселов (height=высота согласно пропорции+25).
Таким образом, по пропорции для моего случая: 480/360=Ваша ширина/Высота согласно пропорции; Высота=Ваша ширина*360/480
(тут Ваша ширина - ширина, которую вы выбрали для видео, значок / означает поделить).
В моем случае для ширины подходит 700 пикселов (идеально помещается в записи моего блога и не вылазит за рамки), таким образом, Высота=700*0.75=525, учитывая поправку:
height=525+25=550, width соответствует ширине:
width=700
Таким образом, если записать в общем виде, параметры width и height для видео с произвольным разрешением:
height=(Высота исходного видео/Ширина исходного видео)*Ваша ширина +25
width=Ваша ширина.
Где
/ - операция деления,
Ваша ширина - любая выбранная Вами ширина, которая не превышает допустимую ширину для записи в блоге.
Парочка коротких кухонных приемов:
-
Стрелочки в инструкциях, по возможности, не должны пересекаться.
-
Видео для видеоинструкций лучше делать в разрешении 1024*768 - размер файла терпимый, а также смотреть инструкцию можно как на широкоформатном, так и на неширокоформатном мониторе.
Интересные вещи в сети интернет
Читал пару любопытных книг на тему развития своего дела, оригинальные фишки предложенные авторами весьма интересные :)
Первая книга -
Rework, написали ее ребята, которые ведут свое дело не шаблонно, плюют на устоявшиеся стереотипы, делают свое дело классно, не тратят свои деньги на рекламу, делают упор на качестве, эффективности и простоте, а не на размерах офисов и количестве сотрудников. В общем мысли предложенные в книге весьма здравые, всем рекомендую к прочтению :)
найти книгу можно в
гугле.
А еще у них любопытный и интересный блог, в котором они охотно делятся своими находками и интересными идеями с пользователями своих программных продуктов:
Смотрел там
список руководства на их сайте, и нашел знакомую фамилию -
Jeff Bezos - талантливый и очень сообразительный человек, основавший громадный интернет магазин
www.amazon.com , пару видео с его участием выложу ниже (с параметрами width=700, height=550 :) ), также хотел отметить участие в проекте
37signals программиста, написавшего очень важный в мире интернета opensource продукт
Ruby on Rails -
David Heinemeier Hansson.
Видео с участием Jeff Bezos:
Во втором видео, Jeff Bezos рассказывает о магазине
www.zappos.com, один из создателей которого -
Tony Hsieh, человек с сильной жизненной позицией, написавший книжку
"Доставляя счастье". Эта книжка мне тоже понравилась, и некоторые идеи возьму себе на заметку, а вот что о ней говорит сам автор:
Как Вы уже заметили, кроме описания способов взаимодействия с разными удобными программками, также проект
Tigrik.org предусматривает
краткие экскурсы на кухню по созданию инструкций с иллюстрациями, а также видеоинструкций. На данный момент уже успел поделиться некоторыми персональными фишками, почитать о которых Вы можете в темах:
-
Первый поход на кухню (Вы сейчас как раз здесь) - подгон ширины отображаемого в блоге видео под ширину блога, пару слов об оформлении иллюстрированных инструкций и выборе параметров видео для видеоинструкций, а также несколько интересных философских вещей, связанных с создателем Amazon.com - Джеффом Бэзосом, командой 37 signals и политикой доставки счастья от Тони Шея:
Заметки на полях.
-
Второй поход на кухню - фишка по удобной записи видео с части экрана, удобный способ отслеживать комментарии в своём блоге с помощью читалки RSS, пару слов о многопоточной подаче информации, а также ссылка на один необычный сайт с приятной и мелодичной музыкой:
3 фишки и один интересный сайт.
-
Третий поход на кухню - отличная фишка по горизонтальной и вертикальной склейке фотографий, которая в самый раз подходит для создания коллажей, а также помогает решать некоторые другие задачи:
XnView - удобная программа для создания коллажей и панорамной склейки фотографий.
-
Четвёртый поход на кухню - цветовое решение в стиле RGB - простое решение как залог успеха, понятность и наглядность видеоинструкций при правильном выборе формы и цвета для отображения левого и правого клика мышки, а также благодарность разработчикам PDF XChange Viewer за шикарный подарок:
Благодарности, пару слов о погоде и краткое описание фишки "Светофор".
-
Пятый поход на кухню - о муках выбора нового стиля для блога, использование фишки "фломастер", а также пару слов об аккуратной склейке блока видеороликов в одну видеоинструкцию:
Новый стиль для блога и некоторые технические нюансы.
Оффлайн-версию этого похода на кухню Tigrik.org
качаем здесь:
Как проверить MD5 с помощью HashTab читаем здесь:
Работаем с программой HashTab!
Источник - Блог полезных и интересных инструкций Tigrik.org
