Где размещать вызов css и js?
Можно и в шапке но с атрибутом async или defer.
А вообще, вот вам результаты PageSpeed самого developers.google.com
Но так не часто делают. Представьте, когда используются, скажем гугловские иконки. Они сделаны как <i class="material-icons">icon_name</i>. И если отложить загрузку, пользователь может увидеть вместо иконки текст и вообще побитую вёрстку.
Поэтому необходимые стили и шрифты стараются загрузить сразу. Можно просто их сжимать, минифицировать и т.п., для ускорения загрузки. Скрипты тоже есть разные. Скажем, аналитика или реклама могут загружаться "потом", а необходимые - сразу.
css будет работать где угодно, при парсинге страницы блокирует вывод только то что в хеде, если посередине body вы захотите вставить css то он спокойно себе загрузится, но тогда когда парсер дойдёт до этого места.