The basic concept for my current portfolio site layout started simple; navigation on the left, an identifying banner at top, and content on the right side. This then became a basic wireframe.
Refining this led to a higher fidelity wireframe with shapes representing content areas and limited text placement for examples. Note this level of detail includes the addition of the you-are-here indicator arrow on the "Yelp Review" button.
A combination annotated sketch and functional specification for the current site with size and spacing details in red. As an advance consideration of designing to target both desktop and mobile devices, this page elements scale relative to a single value: the base text size of 16 pixels as an advance . This concept also explores how I might display secondary-level navigation.