Презентация JS, or not JS, вот в чем вопрос Фитискин Александр веб-технолог студия «Dominion» онлайн
На нашем сайте вы можете скачать и просмотреть онлайн доклад-презентацию на тему JS, or not JS, вот в чем вопрос Фитискин Александр веб-технолог студия «Dominion» абсолютно бесплатно. Урок-презентация на эту тему содержит всего 18 слайдов. Все материалы созданы в программе PowerPoint и имеют формат ppt или же pptx. Материалы и темы для презентаций взяты из открытых источников и загружены их авторами, за качество и достоверность информации в них администрация сайта не отвечает, все права принадлежат их создателям. Если вы нашли то, что искали, отблагодарите авторов - поделитесь ссылкой в социальных сетях, а наш сайт добавьте в закладки.
Оцените презентацию от 1 до 5 баллов!
- Тип файла:ppt / pptx (powerpoint)
- Всего слайдов:18 слайдов
- Для класса:1,2,3,4,5,6,7,8,9,10,11
- Размер файла:153.50 kB
- Просмотров:43
- Скачиваний:0
- Автор:неизвестен
Слайды и текст к этой презентации:
№1 слайд
Содержание слайда: JS, or not JS, вот в чем вопрос
Фитискин Александр
веб-технолог
студия «Dominion»
№2 слайд
Содержание слайда: Проблемы, связанные с отсутствием версии без JS
Недоступны важные функции сервиса
Недоступна важная информация
Возможности браузера используются
неполностью (версия для печати, ссылка другу)
Сайт индексируется не полностью
№3 слайд
Содержание слайда: Причины отсутствия JS
JS отключен специально
Проблемы с сервером
Файл «недокачан» или случайно удален
JS-ошибка
Старый браузер
Другие причины
№4 слайд
Содержание слайда: Задача от менеджера
Нужно реализовать вкладки, которые будут переключаться:
№5 слайд
Содержание слайда: Как это может работать без JS
Предлагаем менеджеру варианты:
Разбить контент на 2 страницы
Разместить все на одной странице в виде подзаголовков с якорями
№6 слайд
Содержание слайда: Первый шаг
Реализуем статическую версию (без JS)
№7 слайд
Содержание слайда: Второй шаг
Реализовываем скрипт, который «подготавливает» контент к реализации вкладок:
добавляем недостающие элементы
перегруппировываем текущие
скрываем лишние
№8 слайд
Содержание слайда: Третий шаг
Реализовываем скрипт, который переключает вкладки:
ищем активные элементы
добавляем обработчики событий
№9 слайд
Содержание слайда: Результат
С JavaScript
№10 слайд
Содержание слайда: Всегда нужно учитывать
У любого контента должен быть свой уникальный URL
У любого действия всегда должен быть альтернативный обработчик
Дополнительные «фишки» базируются на стандартной реализации, но существуют отдельно
№11 слайд
Содержание слайда: Отвыкаем от «плохого»
Не нужно писать тонны CSS-кода (и HTML)
в JS-скрипте:
newElem.style.display = 'block';
newElem.style.borderBottom = '1px dashed';
newElem.style.color = '#ccc';
oldElem.style.display = 'none';
№12 слайд
Содержание слайда: Привыкаем к «хорошему»
Большую часть щепетильной настройки внешнего вида можно вынести в CSS и поручить верстальщику:
newElem.className = 'visible';
oldElem.className = 'hidden';
№13 слайд
Содержание слайда: Загрузи версталу по полной!
Чтобы не выискивать все элементы, которые
должны изменяться, при подготовке контента,
переложи и эту задачу на верстальщика:
document.body.className = 'javascript_enabled';
№14 слайд
Содержание слайда: Как быть с анимацией?
Анимация подразумевает постоянное изменение каких-либо CSS свойств, и здесь все классами предусмотреть нельзя.
№15 слайд
Содержание слайда: Решение — есть!
CSS может нам помочь, предоставив базовые параметры, к примеру:
начальное положение
конечное положение
Получив эти параметры из CSS мы делаем JS более независимым
№16 слайд
Содержание слайда: Изгоняем HTML из скрипта
Выносим новый HTML-кусок в отдельный файл
и получаем его с помощью Ajax
Находим нужные элементы по:
Идентификатору (id="headerPlace")
Имени класса (class="headerPlace")
№17 слайд
Содержание слайда: Результат
Прозрачный и понятный скрипт, минимально завязанный на верстку
Удобство редактирования HTML и CSS
Работоспособность, как с JS так и без JS
№18 слайд
Содержание слайда: Спасибо за внимание
Меня можно найти в интернетах:
alexfitiskin.ya.ru
alexfitiskin.moikrug.ru
twitter.com/afitiskin
frienfeed.com/afitiskin
alexfitiskin@gmail.com
afitiskin@dominion.ru
Скачать все slide презентации JS, or not JS, вот в чем вопрос Фитискин Александр веб-технолог студия «Dominion» одним архивом:
