arsenty

Тут для скроллинга не нужен GSAP, используйте CSS scroll-snap-*.

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

<meta name="viewport" content="width=device-width">

Если бы попробовали проверить на чистой странице без анимаций, скриптов и прочего, ну и в чистом браузере без настроек и расширений, то узнали бы, что это стандартное поведение.

Если вам нужно, чтобы checkbox при перезагрузке страницы сбрасывался, то вы выбрали не самый подходящий html-элемент. Если вам нужен checkbox только для визуала, лучше использовать button.

h1, p { letter-spacing: calc(1em / 5); } /* letter-spacing: 20% от размера шрифта */
h1 { font-size: 3em; }
p { font-size: 1em; }

Передайте своим разработчикам.

Если количество контента по высоте в рамках экрана или если нагородить костылей с медиа-запросами, то можно (если очень хочется): https://jsfiddle.net/arsenty/L67cmxtz/

Делаете SVG (эскпортируете из макета или рисуете сами) и используете CSS-свойство mask-image.

Это стандартное поведение.
Чтобы контент не перекрывался фиксированными блоками, добавьте ему отступы размером в высоту фиксированных блоков.

clip-path: https://developer.mozilla.org/en-US/docs/Web/CSS/c...

Если эти блоки на каждой странице (если правильно понял), указывайте только якорь:
href="#block"

Либо JS, либо CSS вида padding-top/bottom. Изначально vh/vw это видимая часть экрана без учёта всяких перекрывающих поверх панелей навигации (тогда их ещё не изобрели).

Если просто, то как уже написали, получать один и тот же кусок кода не набирая его заново, но тут выручит и копипаст. Главное достоинство сниппетов в современных редакторах — возможность получить такой же кусок кода, но сразу с некоторыми нужными изменениями. Например, вам нужен такой же HTML-шаблон как и раньше, но с другими именами классов: вызываете сниппет, передаёте новые классы в виде параметров и готово.

Реализация на HTML и CSS: https://codepen.io/liptonicetea/pen/ggxREm
Статья автора: https://habrahabr.ru/post/320668/

Использовать только col-xs-* и col-lg-*

Все советуют такие же Фотошопы, но в другой обёртке. Пробуйте Webflow.com, Macaw.co, Pinegrow и др. Это не радикально, радикально — Sublime Text :)