Архив рубрики: Сайт

Сводка последних новостей

На сегодняшний день, есть некоторые вещи которыми я готов поделиться.

1. Тебе хочется больше друзей в вк, подпищиков инстаграмм, или лайков на facebook?
Просто скачай прогу, подключи аккаунты желательно левые от соцсеток, и в перёд к звёздам.
Крутая прога посидит за тебя, заработает тебе очков, которые ты потратишь на лайки или друзей, всё очень просто.

Суть проги раскрутка сообществ ВК, групп Одноклассники или Страничек в instagramm.

Пользуюсь постоянно, за 1 день работы программы более 100 друзей на страницу в facebook.

Качнуть!

Внимание, пока тугая поддержка ask.fm, а так-же в версии 3.0.4 программы, может вызывать лаги если количество аккаунтов для заработка более 10.

2. Перевод сайта на material design
Сайт притерпел косметическую доводку, я переработал его по канонам от компании google в стиле material design, упростил цветовую гамму, добавил щепотку glass effect и оптимизировал адаптивную вёрстку под мобильные устройства, можно сказать что сайт готов на 85% от задуманного.

3. Изменение цвета радужки глаз с любого на любой методами биопрограммирования эвристиками НЛП.
Будет завтра в отдельной статье.

двойной хэштэг в адресной строке?

Сегодня писал скрипт для работы раздела услуги.
Возникла дилемма, на этой странице моего сайта используется хэштэг при смене разделов например #1 означает первый раздел — Съёмка, #2 означает к примеру второй раздел — Обработка, и т.д.

Переключатся между разделами страницы услуги можно введя прямой адрес, например чтобы дать пользователю страницу разработки сайтов я просто пишу protasov.by/service/#3

Но на странице съёмка, у меня есть отдельное меню так-же включающее свои разделы, это категории съёмки, такие как студийная, свадебная, уличная, и д.р.

Как мне например дать прямую ссылку на страницу услуг конкретно свадебной съёмки?
Если сделать двойной хэштэг например protasov.by/service/#1#wedding смотрится немного странно, дезориентирует скрипты и прочее.
Например скрипт отвечающий за разделы страницы услуги использует hash.split( «#», 2 ); или подобные функции, и добавление лишних решёток может его подломать и вызвать непредсказуемое поведение.

Тут я припомнил что в php есть ссылки вроде mypage?mytopic. и решил просто добавить знак ? т.е. внутренние хэштэги, например #wedding менять в строке адреса на ? и так-же их обрабатывать.
Написав небольшой обрабочик событий.

Теперь я могу без проблем использовать разделы страниц и разные подразделы если понадобится, например ссылку на свадебную съёмку я дам так: protasov.by/service/#1?wedding

Поправьте ваш сайт правильным DOCTYPE!

Предположим вы написали правильную XHTML разметку, CSS в ней тоже написан по стандартам. Например W3C standard Document Object Model (DOM). Но вот проблема, оно канает только в браузерах которые поддерживают такие стандарты, однако где-то сайт валится и работает не верно. Виной всему DOCTYPE.

Эта статья объяснит  DOCTYPE’ы которые катят, и покажет реальное применение этих абстрактных тэгов.

Почему DOCTYPE?

В HTML и XHTML стандартах, DOCTYPE (сокращение от “document type declaration”) — объявление типа документа, оно информирует валидатор браузера какой (X)HTML стандарт используется, и должен располагаться точно самым первым в теле документа. DOCTYPE’ы компонент правльных веб страниц, и без него css тоже не будет прочитан верно.

Стоит так-же упомянуть что  DOCTYP’ы важны для старых версий браузеров типа: Mozilla, IE5/Mac, и IE6/Win.

DOCTYPE который включает полный URI (ссылку на файл стандарта) говорит таким браузерам в каком именно стандарте обрабатывать поведение страниц и распознавать код HTML и CSS так как было задумано автором.

Использование неполного или устаревшего DOCTYPE— или неиспользование DOCTYPE совсем —переводит эти браузеры в режим рендеринга “Quirks”, где они думают, что страницы написаны не по канонам WC3, в стиле угнетающих 1990ых.

В таком режиме, браузер будет пытаться запуститься в режиме обратной совместимости устаревших стандартов, и ваш css будет распознан и показан так, как это было например в IE4, и построит соответствующий таким стандартам DOM. (IE рендерит в стандарте IE DOM; Mozilla и Netscape 6 рендерит вообще неизвестно в каком стандарте.)

На самом деле нам это не упало. Но обычно это то что и получается, и всё из за неверного или неполного DOCTYPE.

(Внимание: Браузер Opera играет по другим правилам; она всегда пытается срендерить страницу в режиме совместимости со стандартами. Ставь Opera! Но с другой стороны, Opera не предлагает полной совместимости со стандартом W3C DOM. Но они постоянно над этим работают.)

Куда делись все Доктайпы?

Так как DOCTYPES жизненно важны для надлежащего функционирования паутины и режимов работы браузеров которые стремятся работать в режиме W3C это кстати главный стандартизатор паутины, можно полагать что W3C’ский вебсайт предоставит списочек DOCTYPE’ов, и полагается, что такую информацию у них в талмутах найти очень просто, оказывается до недавнего времени это было нетак, но они поправили ситуацию.

W3.org не исключение, WebReference, или Webmonkey. тоже не намереваются помогать веб разработчикам писать быстрый и технологичный код. Это не их работа.
W3C публикует серии  уроков, которые большинство разработчиков просто избегают. В основном, W3C’шный сайтец  содержит кусочки, примеры и рекомендации написанные от ботанов к ботанам, и говоря о ботанах я не имею ввиду профессионального веб разработчика умудрённого опытом, я имею ввиду таких ботанов на фоне которых мы выглядим как пробабушка которая первый раз получила письмо по электронке.

можно всё время пытаться найти DOCTYPEs на w3.org но там нет страницы с полным их перечнем, всё вразнобой. И когда где-то вы и найдёте какой-то рекомендованный к использованию DOCTYPE врядли он верно заработает на вашем сайте.

Рассеянные повсюду на сайте W3C’s Доктайпы с неработающими прописанными в них URI’ами, и DOCTYPE’ы с относительными URI’ами которые ведут к внутренним документам комитета W3C’s. Сразу как будут скопированы с сайта W3C и вставленны к вам на сайт, эти URI’ы будут указывать на несуществующие документы, делая все усилия как ваши так и браузера напрастными.

Например многие сайты используют такой DOCTYPE, скопированный прямо с w3.org:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "DTD/xhtml1-strict.dtd">

Если посмотреть на последнюю част DOCTYPE’а там идёт строка (“DTD/xhtml1-strict.dtd”), сразу видно что это не прямая, а относительная ссылка, которая использует файл находящийся на сайте W3C. Ну и раз файл там, а не на вашем сайте, эта часть с URI бесполезна для браузера.

Правильным будет использовать такой DOCTYPE:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

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

Доктайпы которые работают

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

<!DOCTYPE HTML>

не панацея, т.к. он ещё в обкатке и не прошёл стандартизацию в комитетах, хотя если вам плевать на всё и вы ориентируетесь на пользователей которые использую последние версии браузеров, можно использовать его, но вот актуальные на 2016 год доктайпы:

HTML 4.01 STRICT, TRANSITIONAL, FRAMESET

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">

XHTML 1.0 STRICT, TRANSITIONAL, FRAMESET

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">

XHTML 1.1 DTD

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" 
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

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

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML Basic 1.1//EN"
    "http://www.w3.org/TR/xhtml-basic/xhtml-basic11.dtd">
<!DOCTYPE math PUBLIC "-//W3C//DTD MathML 2.0//EN"	
	"http://www.w3.org/Math/DTD/mathml2/mathml2.dtd">
<!DOCTYPE math SYSTEM 
	"http://www.w3.org/Math/DTD/mathml1/mathml.dtd">
<!DOCTYPE html PUBLIC
    "-//W3C//DTD XHTML 1.1 plus MathML 2.0 plus SVG 1.1//EN"
    "http://www.w3.org/2002/04/xhtml-math-svg/xhtml-math-svg.dtd">

Опциональные доктайпы:

<!DOCTYPE html PUBLIC
    "-//W3C//DTD XHTML 1.1 plus MathML 2.0 plus SVG 1.1//EN"
    "http://www.w3.org/2002/04/xhtml-math-svg/xhtml-math-svg.dtd">
<!DOCTYPE svg:svg PUBLIC
    "-//W3C//DTD XHTML 1.1 plus MathML 2.0 plus SVG 1.1//EN"
    "http://www.w3.org/2002/04/xhtml-math-svg/xhtml-math-svg.dtd">
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
	"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN"
	"http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1 Basic//EN"
	"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11-basic.dtd">
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1 Tiny//EN"
	"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11-tiny.dtd">

Исторические:

<!DOCTYPE html PUBLIC "-//IETF//DTD HTML 2.0//EN">
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML Basic 1.0//EN"
    "http://www.w3.org/TR/xhtml-basic/xhtml-basic10.dtd">

добавлен раздел команда

Сегодня разобрался с оформлением дизайна странички Команда protasov.by/team

Надеюсь дизайн вам понравится, пока не придумал что будет по действию нажатия на кнопку «открыть»
Может быть открываться будет страничка в Вк для начала.

В портфолио в альбом studio добавлены 2 фотографии 🙂

Вот их миниатюры, полноразмерные варианты в формате 5×7 смотрите в разделе портфолио.
CT2B1629-thumb
CT2B1464-thumb

Добавлен раздел услуги

Дизайн раздела услуги ещё не закончен, но с перечнем предлагаемых мной услуг уже можно ознакомиться и даже заказать желаемую 🙂
Стоимость самих услуг я указывал среднюю, так что договориться всегда можно.
protasov.by/service

Исправлены последние ошибки :)

Сегодня всё утро ковырял галерею сайта.
Оказалось что в инструментарии jQuery есть полезные функции show hide и д.р.
Итого чтобы привести полноэкранный режим отображение фото к нормальному виду потребовалось
около 2 часов чтобы разобраться в документации, 20 минут подробного изучения кода галереи,
2 минуты чтобы написать что скрыть а что показать в полноэкранном варианте.

Теперь можно спокойно смотреть фото во весь экран и противное меню сайта не будет прорисовываться поверх.
В блоге для себя исправил ошибку с загрузкой изображений 🙂

Добавил новый цветной логотип на сайтец:
logo-2016

Осталось добавить страницы Команда и Услуги 😀 думаю к вечеру они будут работать, но сначала окончательно перепишу всё ядро сайта чтобы было удобно дублировать общие элементы на страницу 😛

Следом займусь внедрением своего блога в тело сайта, дело будет не простое, но я попробую 😀

Съёмка для сайта: часть 2

Продолжаем работать над материалами после прошедшей съёмки с нашей Creative Group 🙂
Кирилл и Кристина а так-же я, делали всё чтобы снять меня максимально хорошо 😀
Ну в процессе я и сам поснимал, а пока делается видео, немного фоточек 😛

2sHlhKY_BtU

2V26c12qnl8

5eRA4J_g4r0

mDmDFjH3QTg

G3FvLYRrkyI

T1afmq0xMRU

SyxugxPRo7M

NXIofQ0Dkfc

Старт Сайта

11 Марта Родился этот сайт 🙂

Это было долгое приключение по вытаскиванию дизайна из головы и реализации в виде того что вы видите буквально за пол дня 🙂

Вдохновлялся при наведении последнего лоска так скажем вот этим офигительным клипом.