Русский
Русский
English
Статистика
Реклама

Перевод Советы начинающим веб-разработчикам

Я занимаюсь созданием сайтов в том или ином виде с 1995 года. После 25 лет работы, думаю, что накопил опыта и теперь располагаю достаточными знаниями. Ниже в произвольном порядке изложено несколько моментов, о которых я бы хотел, чтобы начинающие разработчики поразмыслили.

  • Порой сайт это всего лишь сайт.
  • Браузер уже является клиентом; HTML это язык, на котором он разговаривает.
  • Веб строится вокруг визуализации на стороне сервера.
  • Вы можете предоставить данные несколькими способами; рассмотрите HTML как один из способов представления данных.
  • Масштабирование на стороне вашего сервера поможет всем, в то время как масштабирование на стороне клиента, помогает только тем, у кого мощное железо и быстрое соединение.
  • Не каждый имеет (или может использовать) мышку.
  • Не каждый имеет (или может использовать) клавиатуру.
  • Не каждый имеет (или может использовать) тачскрин.
  • Не у каждого цвета и картинки отображаются так же, как и у вас.
  • Не каждый имеет такие возможности обработки информации, какие имеете вы.
  • Бесчеловечно перекладывать все на других.
  • Родной для браузера HTML намного быстрее чем все, что бы вы там не написали на JavaScript.
  • HTML уже идеально представляет узлы DOM.
  • HTML полноценный фреймворк.
  • Вы вполне можете менять оформление в CSS.
  • Прежде чем создавать компонент пользовательского интерфейса, проверьте, есть ли он в HTML. Если доступного нет, вероятно, есть тому причина. Добавление DOM к div или span не лучший выход.
  • Не все должно быть одностраничным приложением.
  • Даже если вам нужно сохранить состояние клиента между загрузками страниц (например, для воспроизведения музыки или видео), вы можете доверить браузеру выполнять большую часть тяжелой работы через поиск (fetch)новой страницы, и заменяя контент-контейнер на уровне DOM.
  • Бесконечный скроллинг бесчеловечен. Люди должны быть в состоянии долистать до конца. Описанные в религиозных текстах мучения и то менее жестоки.
  • Если вы должны сделать бесконечный скроллинг (а вы его не делаете), убедитесь, что внизу ничего не понадобится.
  • Дайте людям постоянный, но произвольный стимул, и вы сформируете у них привычку. Подсадить людей на свой продукт может и кажется отличной идеей, но табачные компании идут по этому же пути.
  • Если вы разрабатываете с учетом CDN, то обход сервера не будет медленным.
  • Можно использовать несколько языков одновременно. Главное не делать все изоморфным.
  • Всегда проверяйте свои данные на стороне сервера; все, что приходит от клиента должно вызывать подозрение.
  • Разработчику изоморфный код разрушает барьер между клиентом и сервером. Для вредоносного клиента это означает, что он потенциально может контролировать сервер. Знайте, откуда приходят данные.
  • Браузеры меняются. Полагаться на поведение конкретного браузера означает, что вы полагаетесь на этот, один, браузер в данный момент времени. Кодируйте по стандарту и везде тестируйте.
  • Используйте полифиллы для браузеров, которые еще не поддерживают используемый вами стандарт.
  • Копировать других нормально; так мы учимся. Просто не делайте это бездумно.

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

<html><head><title>Div replacement test</title><script>window.addEventListener('DOMContentLoaded', () => {    [].slice.call(document.getElementsByClassName("replace")).forEach(elem => {        elem.addEventListener('click', event => {            event.preventDefault();            fetch(elem.href)                .then(response => response.text())                .then(text => {                    let parser = new DOMParser();                    var other = parser.parseFromString(text, 'text/html');                    document.title = other.querySelector('title').innerHTML;                    var content = document.getElementById('content')                    content.innerHTML = other.querySelector('#content').innerHTML                })        })    })})</script></head><body><section id="content"><p>Here is the content container. <a class="replace" href="replaced.html">The other document</a></p></section><iframe width="560" height="315" src="http://personeltest.ru/aways/www.youtube.com/embed/DLzxrzFCyOs" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></body></html>


image

Узнайте подробности, как получить востребованную профессию с нуля или Level Up по навыкам и зарплате, пройдя платные онлайн-курсы SkillFactory:



Читать еще


Источник: habr.com
К списку статей
Опубликовано: 20.06.2020 12:14:32
0

Сейчас читают

Комментариев (0)
Имя
Электронная почта

Блог компании skillfactory

Accessibility

Html

Веб-дизайн

Разработка веб-сайтов

Категории

Последние комментарии

© 2006-2020, personeltest.ru