WARNING! NERD CONTENT LIKELY! I will post a warning, though, whenever it is coming up!
While I will certainly provide a bonkers amount of nerdy content, I will also make sure those of whom aren't as tech - centric, won't get lost.
First, when it comes to websites, the name is the name of the game, and in all things digital, its name, name, name. Professionally speaking, michaeltollestrup.com is much more professional sounding, than texasphotoguy123.com (not an actual website, I checked). I used to use "mjtphotograps.smugmug.com". After a few years, and seeking advice from many photographers at many levels, I determined I should just use my own name. I often provide this advice to many people, regardless of career type, because your name can be a truly powerful branding tool, and asset.
Even if you pick a good name , it may not be available. I got lucky, in that my last name isn't as common as others, and that meant that I could keep michaeltollestrup.com . A friend of mine tried to set up a personal website, but their first and last name are much more common, and the "doppelgänger" for him happens to be a lawyer in London, England!
Once I picked a good name, I needed to pick a service to host my domain name. I had seen several TV ads for GoDaddy, and I didn't really consider other options. My first year, I paid a promotional price of just 1.99, and now I pay just over $40 per year. More specifically, I should mention that SmugMug partnered with GoDaddy and created SmugDomains. That's partially why I chose GoDaddy because they partnered with SmugMug, and I wanted to ensure a seamless integration for me, but more importantly for my visitors and clients.
The Setup
**WARNING! NERD CONTENT AHEAD!**
GoDaddy has a system of networked computers and hard drives, and that's what they use to host my website, amongst many others. You may actually be familiar with the more common term for this "networked computer system," a Server. When a customer requests some amount of information when visiting a website, a server is displaying that information for the customer. The server "serves" the information, which is stored on a bunch of computers.
Briefly speaking, a website, like all digital information, is really just some variation of a visual representation of computer code. For instance, a few lines of computer code that define my website are:
<a
class="hdr-logo header-color7 header-font7"
href="/"
style="position:relative;top:-55px;padding:20px 0px;width:333px;height:100px;background-image:url(https://cdn.zenfolio.net/img/s/v-12/u697154948-o955444234-111.png);background-position: center center;background-size: 333px 100px;"
title="Michael Tollestrup">
</a>
Could you catch what all that code defines? It turns out that's the code for my business logo! All of that code, and in almost every case for websites, is written in a language called, HTML.
HTML (Hyper Text Markup Language) is the basis of my website, and defines all of the objects on my website. Images, text, links and other items are defined, written out and displayed with HTML code.
As for all of the colors, fonts, underlining, shapes and other special styling is done with a different language called, CSS.
CSS (Cascading Style Sheets) is the language that takes the HTML code and styles it with all kinds of variations. If you look back at the HTML code above, you'll see that there actually is some CSS embedded into the HTML.
<a
class="hdr-logo header-color7 header-font7"
href="/"
style="position:relative;top:-55px;padding:20px 0px;width:333px;height:100px;background-image:url(https://cdn.zenfolio.net/img/s/v-12/u697154948-o955444234-111.png);background-position: center center;background-size: 333px 100px;"
title="Michael Tollestrup">
</a>
That styling defines:
Padding: How much of a margin above and below is required
Height & Width: Size of the logo on the screen
Image Link: When you click on the link, it takes you to my homepage
Position: Where on the page is it located: Center, Center.
SUMMARY: Everything on my website (the images, fonts, logos, colors, transitions, shopping cart, buttons & links etc) requires HTML and CSS coding to work. All of that information needs to be stored somewhere, and that is where GoDaddy comes in to play. GoDaddy's computers and hard drives, remember that is also known as their "Servers," store my code, and display it whenever someone wants to visit my website.
The Hosting
So all of the code is all fine and dandy, but where should I build my site? And by build, I mean where should I design, setup, layout and add all of my content. While I know enough HTML and CSS to get me started, I can't do anything too technical. I know surprising right!
Like I previously stated, I originally chose SmugMug, and they were great! Previously though, I decided to switch to Zenfolio, my current website builder. I previously did a write up on my decisions for switching, and some of the philosophy of my choices during that switch — to read all about that, check out my blog post
HERE!
Once I decided to use SmugMug, and also when I transferred my site to Zenfolio, I needed to connect the website builder to the website hoster. When anyone hosts a website, and connects it to a builder, some records are needed to tell the customer's computer what to do, when they request access to a website. Those records are almost always going to be a CNAME record. CNAME records are basically just local guides in a city, that point your computer in the right direction, eventually leading your computer to the server that hosts the website. Imagine a treasure map:
When you want to visit my website, your computer searches the web, and will find that GoDaddy hosts my website. With the CNAME records, GoDaddy will then tell your computer that Zenfolio builds my website, and finally you end up on my homepage. Without the CNAME records, or without GoDaddy, your computer won't be able to find my site. Basically, GoDaddy is the travel agency, and the CNAME records are the local tour guide.
Oh dear. How on earth was I going to transfer more than 52,000 photos. I briefly answered this question on a previous blog post (HERE), but I wanted to go into further detail. Before I go into file sizes, download speeds and other fun nonsense, I will briefly detail what all is going on.
Photos (now) are digital files that contain information about the scene the photographer took a picture of. Every time the photographer takes a picture, the sensor records values for each pixel of the sensor. When light comes into a sensor, if the sensor is excited (receives light), and detects that the light is either red, blue or green, it will record that information as a number value. If it is fully red, it will display RED255. The full brightness for any color is recored as 255. If it is fully Green, it would show GREEN255.
If a sensor has a size of 5568 pixels X 3712 pixels, it would be roughly 20.8 Megapixels in size. The transferring of sizes from Megapixels to Megabytes is way too complicated for this post (comment or message me if you want to learn more!), but just keep in mind that the majority of my photos (43,680) are roughly 20 Megabytes (MB) in size.
 |
| Image courtesy of Apple, Inc. |
As previously stated, each of my photos were roughly 20 Megabytes (20MB) in size. There were some files that were smaller and larger, but roughly 84% of my photos fell within a 2 Megabyte range of the 20 MB average. As a result, my 52,000 photos, videos and panoramas comprised more than 2 Terabytes of total size!
As I stated in my other blog post, I used a service that downloaded all of my photos, videos, panoramas and other content from my SmugMug site. My download speed at my house is not slow by any means, and took roughly 16 hours. I had to connect an external, 8TB hard drive, and download the entire archive onto the drive.
Thankfully, and thoughtfully, I made the decision to not post every photo from the original site. I also decided I would only post a limited number of photos on my site. In total, I have roughly 120 photos publicly available, and several thousand available only to my clients. As a result, I only use a few hundred Gigabytes of data for my new site.
Lastly, Technical Website Stuff!
I'll keep this section shorter than the others. When it came to my new website, I didn't make too many changes from the default for the template, other than the following:
• Logo
• Font Used
• Background
• Theme
The default title for the website, is simply my name, and I decided to change it to my formal business logo. I also added the word "Photography." This formal logo is used on formal business documents (invoices, quotes, terms & conditions etc), and is used for formal settings, i.e. my website.
As for the font, the default used I believe was Rosenvelt, but I changed it to a Google Available Font, "Cormorant." A brief type specimen for Cormorant is displayed here, the weight of the font used for the logo is "Medium."
The background and theme for the website for changed only slightly, and were changed for the purposes of easier, more visually discernible use. A white line is used as the background for the menu bar, and the background for the entire website is set as a light gray (Hex Code: #f4f4f4 | RGB: 244,244,244). The font color was not set to black, and rather as a dark gray, again for the purpose of easier, more visually discernible use.
Hopefully that makes sense, if not of course comment or message me, and I'll try to explain it easier! Most of the changes from my old site to my new site were minor. However, I thought I'd detail the transition, for those of whom are interested.
> LATER THIS MONTH, I'll detail my newly updated branding designs, and I'll also explain how branding can be important for any photographer, or creative designer!
—Michael Tollestrup
Subscribe To Receive Blog Post Notifications HERE!
Check Out My All - New Photography Website HERE!
