Проектируйте реализации практически без использования JavaScript.

[olegus214]

Как некоторые из вас, возможно, знают, я пишу на Medium статьи на самые разные темы. На прошлой неделе или две у меня была актуальная тема «делать ___ без JavaScript», а сегодня я выложил тему, требующую минимального написания сценариев.

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

Интерфейсы с вкладками без JavaScript:
https://levelup.gitconnected.com/tabbed-interfaces-without-javascript-661bab1eaec8

Веб-сайты с модальным диалогом без JavaScript
https://levelup.gitconnected.com/modal-dialog-driven-websites-without-javascript-16e858615780

Переключение цвета день/ночь с использованием минимального JavaScript
[URL='https://wmlogs.com/yti/bj55jb21odHRwczovL21lZGl1bS1lG']https://medium.com/@deathshadow/day-night-colour-switching-using-css3-variables-and-minimal-vanilla-javascript-a54fa36c550f[/URL]
Код (разметка): (пришлось пометить последний тег, так как он еще не курировался, а это программное обеспечение форума задыхается от знаков @ в URI)

Удивительно, насколько мощным стал CSS, и насколько плавнее и чище вы можете делать что-то сейчас, чем когда приходилось использовать JavaScript, чтобы ПОПЫТАТЬСЯ выполнить хотя бы половину этой задачи.

Все эти статьи на самом деле направлены на более масштабный проект. Я надеюсь, что к январю я напишу полную бета-версию с выпуском в марте. К сожалению, для стороннего проекта найти время для этого сложно, но я думаю, оно того стоит. Документирование, как всегда, будет «медленной» частью.

 

[imho1]

Да, копия Xenforo от DigitalPoint и это портит, потому что они также отклоняют перенаправления, и это все, что нужно для сокращения ссылок.

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

 

[igorek147]

@deathshadow Приятно видеть тебя здесь... Я снова посетил этот форум спустя несколько лет и рад видеть тебя все еще в отличной форме! Я многому научился у вас и восхищаюсь вашими подходами (минимум кода, ничего особенного, фреймворки — отстой, HTML5 — не гигантский скачок после HTML4 и т. д.).
Однако я не могу представить современный Интернет без таких причудливых вещей, как, например, SPA; Я вижу, вы по-прежнему предпочитаете классические сайты. Опять же, здесь речь не об этом, а скорее о примечании. Возвращаясь к тому, что я хотел сказать: поскольку я восхищаюсь вашей философией «минимум кода и не используйте технологии, которые вам не нужны для выполнения работы», я с нетерпением ждал возможности посмотреть демо-версию из вашей статьи:
https://cutcodedown.com/for_others/medium_articles/modalSite/modalSite.html
Но я не вижу ни модалов, ни Chrome, ни FF. Что мне не хватает?

 

[anset]

Я не должен этого говорить, так как участники, просматривающие мои статьи, за три месяца заплатили больше - на 1/100 трафика - чем за последнее десятилетие на моем аккаунте AdSense, но...

Удалите файлы cookie и локальное хранилище, и вы снова сможете просмотреть.

Тем не менее, «мясо» статьи, сам код, находится здесь:
https://cutcodedown.com/for_others/medium_articles/modalSite/

Продолжение, которое добавляет переключение дня/ночи, находится здесь:
https://cutcodedown.com/for_others/medium_articles/nightAndDay/

В общем, код для любой из моих средних статей, которые «открывают новые горизонты», будет здесь:
https://cutcodedown.com/for_others/medium_articles/

В соответствии с более чем 20-летней традицией этой папки на моем хостинге. Также обратите внимание, что я обязательно поместил туда .rar, чтобы люди могли загрузить весь файл одним щелчком мыши.

 

[oltima]

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

Например изображения в этом каталоге:

https://cutcodedown.com/for_others/medium_articles/modalSite/mobileExampleImages/

Отразите все различные состояния модальной демонстрации в действии на том, что Chrome будет показывать на Galaxy S5, что сопоставимо с тем, что предоставляют мои BluBoo S8 и Ulefone Armor 6.

Благодаря тому, как устроен HTML и его перехватчики, он также удобен для чтения с экрана и чтения Брайля. Все это работает через хеш-ссылки, поэтому, когда CSS неактуален/неприменим, он просто ведет себя как страница, которая ссылается сама на себя.

--edit-- извините за чрезмерное разрешение этих примеров изображений. Workbench сейчас 4к.

 

[WmBoardBaby]

Это также здесь: https://cutcodedown.com/for_others/medium_articles/modalSite/modalSite.html

 

[pacvel]

О, примечание, для тех, кому интересно, что он делает в IE и для чего X-UA устанавливает его в IE9 со всеми этими CC...



Потому что на данный момент я закончил попытки отправить стиль или скрипты в ЛЮБУЮ версию Internet Explorer, если только клиент не готов платить дополнительно. Предлагаю всем остальным сделать то же самое. Между устаревшим/небезопасным/часто полностью отсутствующим современный Поддержка TLS/SSL, а сам движок трезубца слишком далеко от даты «лучшего использования»… Достаточно. На дворе 2020 год... продолжается 1934 год... ХВАТИТ!

Если ванильная семантическая разметка и изящная деградация им не «достаточно хороши», они могут присоединиться к нам и использовать браузеры, созданные в ЭТОМ десятилетии.

Также приятно иметь возможность видеть страницу таким образом в IE, поскольку это, по сути, то, с чем застряли программы чтения с экрана, устройства чтения Брайля и поисковые системы. Никакого CSS, никаких сценариев, только контент и семантика. @JEET, это должно решить проблемы, о которых мы говорили, с вашим «темным режимом» и IE при использовании JAWS. Я говорю всем версиям IE игнорировать этот стиль.

 

[vehicross]

«Подменю», «Поиск» и «Вход» должны открывать модальные диалоговые окна. Точно так же, как если бы вы сделали экран достаточно маленьким для мобильного гамбургера, вы также получите модальные окна.

Моя следующая серия обновлений личного сайта, скорее всего, будет реализовывать все это. Когда/если у меня будет на это время, поскольку перед этим у меня в очереди есть оплачиваемая работа.

 

[ellips2015]

Конечно, просто используйте для всего обычные формы и загрузку страниц. В любом случае это то, что СЛЕДУЕТ сделать в первую очередь, если вас беспокоит удобство использования и доступность.

И именно здесь МНОГО программного обеспечения для электронной коммерции терпят неудачу, поскольку они этого не делают и для работы ТРЕБУЮТ JavaScript.

Я не говорю, что вы не можете УЛУЧШИТЬ уже работающую страницу с помощью сценариев для более удобного взаимодействия с пользователем, но слишком много людей смотрят на JS как на окончательный ответ на любую ужасную проблему. Вот где - по крайней мере, с точки зрения доступности и эффективности - все идет вверх лицом вниз.

Просто посмотрите, как большинство людей собирают страницы, используя angular, vue или React, чтобы получить достаточное доказательство этого.