In this exercise, you'll create a webpage of many embedded
elements. For some of these, you may have to google to figure out how to
get embed codes - some sites make it easier/more obvious than others.
Create a new blank page with just a header (“All About Dogs”).
Take a look at the “NET” tab in Chrome Developer Tools and
write down the loading stats on the page - number of requests, KB
transferred, onload ms, DOMContentLoaded ms.
Add an embedded Google Map that shows dog parks in San Francisco.
Add Facebook comments to your page.
Add a Twitter button to the page.
Add an embedded Flickr slideshow of photos tagged with “dog”.
Create a Google custom search engine that searches across multiple dog sites and embed the search box on the page.
For each of the embeds, add comments around them to show where they start and end, and add an h2 to split the page up into sections.
Take a look at the “NET” tab again and write down the new stats on the page.