Finding a List on Yellow Pages
The very first step in the process of creating a new client list is simple: we’ll just look on up!
We are looking for a list of IT companies in the Los Angeles area. There are plenty of websites that will have a list of companies that fit this description. What we want is a webpage that will show both the name of the company and their contact information, preferably within the same segment (or “div”) of the page.
A good place to get this information is yellowpages.com. In case you’re too young to know what a phone book is (believe me, I wish I was as well), the Yellow Pages were books that anyone could use to get phone numbers of local businesses. This was before the advent of Google, of course.
Nowadays, the Yellow Pages have moved their services to their own website, making the process of searching up phone numbers more convenient. All we have to do is type in the name of the business type that we are looking for, and then specify what area you are interested in.
From there, Yellow Pages will take you to a page that lists the top 30 IT companies in Los Angeles. It’s here that we’ll get to take a deeper look at the site using developer tools. The easiest way of finding the HTML code that we want is to right-click on the element of the page that we are interested in and select “Inspect” from the dropdown menu.
On this page, we are going to want to find the element hosting the first listing and right-click to Inspect the element.
Doing this will bring up the web console developer tool. This console displays the HTML code which makes up the site. If you wanted to, you could play around with this code to make changes towards how the site is displayed during this instance that you have open.
What we want to do is take a look at the highlighted line of code in the console that we just opened up.
From the web console, we can see that this element is within a <div> tag and has a class name of “info-section info-primary”. That is the information that we would need to start our work in Python.
However, if we examine the rest of the elements in that listing, we can see that the element which holds the phone number is actually separate from the one that we have just selected.
If you look at the class of this section, it is called “info-section info-secondary”. Upon further inspection, we can see that this section is actually on the same level as the primary section, rather than being inside of it.
Both of these sections actually belong to the <div> with a class called “v-card”.
As you can see, this section houses all of the information that we need to make our client list. The name of the company is within the <h2> tag with a class called “n”. We already know that the phone number is within a <div> with a class called “phone”.
We can take this information and use it to make our client list within Jupyter Notebook. That will be covered in the following post.