Box Centered Does Not Equal Visually Centered

A problem that crops up often in web design is centering. No not how to center a div, but how to visually center an element vertically. This is different than merely centering vertically using flex or grid because when you have elements like a top nav that takes up space, the vertically centered element will appear too low on the screen even though it is technically correct (50% of the parent element).

Is there a reliable way to solve this problem without having to remember to offset everything by some amount?