Wireframes are the skeleton of the website. The emphasis is on what will be included, not on how it will look. The wireframes are deliberately kept black-and-white, devoid of graphics. This is a quick way to envision and discuss the merits of various layouts before a lot of time is invested in building the page. This approach encourages critical feedback and exploration since there is no commitment to a specific layout yet.
Mockups are fleshed out wireframes that show what the user interface will look like. All of the design elements are in place. I create a couple of mockups with different imagery, colors and typography. I present them to the stakeholders. The mockups encourage a dialogue between the designer and the business partners because they can easily be altered thus avoiding wasting development resources.
Shown: Wireframe of a responsive website created in Axure.