Beginner's Guide to Building a Personal Website | Caroline Leland | Skillshare

Beginner's Guide to Building a Personal Website

Caroline Leland, content specialist

Play Speed
  • 0.5x
  • 1x (Normal)
  • 1.25x
  • 1.5x
  • 2x
7 Lessons (28m)
    • 1. Intro: Why Build a Personal Website

      1:59
    • 2. Lesson 1: The Domain Name

      3:15
    • 3. Lesson 2: The Content Management System

      1:12
    • 4. Lesson 3: Using Templates

      4:06
    • 5. Lesson 4: Customizing Your Template

      5:09
    • 6. Lesson 5: Your Content

      11:03
    • 7. Final Thoughts: The Future of Your Site

      1:06

About This Class

a1628ab4

If you want to be a freelancer, the first thing you need is a personal website for keeping your portfolio organized and for maintaining a controlled, highly visible web presence. Potential employers want a quick, easy way to get a feel for your professional style and qualifications, and a personal website is the perfect way. It's like an online resume that shows personality and is always up-to-date, rather than a static and two-dimensional (dare I say obsolete?) piece of paper. 

This 27-minute class will walk you through the easy steps of getting your personal website up and running, from buying the domain name, to choosing the content management system and template, to customizing the content. You don't need any particular prior experience or knowledge to take this class! 

If you want to know more about my credentials, check out my personal website or just watch the intro video for this class! 

Transcripts

1. Intro: Why Build a Personal Website: Hi everyone. My name is Caroline Leland and I am a freelance reporter, writer and content strategist in Nashville, Tennessee. I'm here in my home office where I do most of my work. Then just 18 months I had built up a full-time freelance career for myself, which started when I moved to Nashville with no connections and has snowballed into stories on NPR, a communications retainer at a startup company here in Nashville, and a book deal offered to me by [inaudible] Press. This class is about putting together your personal website, which is a really important first step for any freelancer. Your website is how you are professionally represented on the internet. It has a lot more capacity for creativity, and personality than your linked in page, for example. Plus it has a lot more capacity to show off your portfolio, which is really important if you're going to convince people that you're qualified for the gigs that you want to get hired for. My website is how I introduce myself to editors when I'm sending cold pitches, and how I introduced myself to other writers when I'm networking. It's how I show my credibility to potential connections and employers. It's how the skill-share staff found me to teach this class. It's part of what convinced [inaudible] Press that I was qualified to write a book at age 24. It's easy and fun to make your own website, plus way cheaper than hiring someone else to do it. In this class, I'll walk you through all the steps which include choosing a domain name at a site host, choosing and customizing your template, and deciding on what your content should be, and how to put that together for both written and visual content. Just you know, this class is part one of a series, where I'm going to teach from my experience of what has worked, and what hasn't in launching my personal brand, and freelance business. Future classes will cover networking, generating story ideas and pitching story ideas. I'm going to weave in tips like the importance of having a beat or niche, the importance of having a personal narrative, what that even means, and how to use it. The necessity for equal doses of optimism, and realism. Looking forward to getting to know you through these lessons, and projects. Let's get started. 2. Lesson 1: The Domain Name: Welcome to Lesson One. In this lesson I'm going to go over domain names, which includes what is a domain name and why it matters. What your domain name should be, what to do if the domain name you want isn't available, and how to actually buy or registered domain name. First, what is a domain name and why does it matter? The domain name is what you type into the address bar of a browser to get to a website. So facebook.com, harvard.edu, wikipedia.org, you get the picture. Your personal website could just be a WordPress blog or a site via some other sub-domain like yourname.blogspot.com. I actually have one of those. carolinehleland.blogspot.com. But I think, and many other professionals believe that having your own self-hosted site comes across as a lot more professional and impressive. The independence of a self hosted site strengthens your personal brand and it shows technical competency, which is what you're learning in this class. But if you have no budget to buy a domain name, it's better to have a sub hosted site than none at all. Section two, what your domain name should be. I think the best option for what your domain name should be is first name, last name.com. My website is carolineleland.com. It's easy for other people to remember and it scores high on search engine optimization, which is whether or not your page shows up in a Google search. Or if you have a personal brand that's not your name, for example, a made-up word that represents your business, your business idea, and definitely try to use that. But whatever you do, keep it as simple and short as possible. You want it to be memorable and you want it to be search engine optimized. To check whether your desired domain name is available, you can search it via providers like GoDaddy.com. Section three, what if the domain name I want isn't available? Depending on how unusual or common your name is, your first name, last name.com idea might already be registered. It's actually probably already registered. I got lucky to have carolineleland.com. I only bought it a year ago, but for some reason no one else had claimed it. You can try alternatives like.me. You can try throwing in your middle initial or even your full middle name if it doesn't make the domain name too long over all. If you really, really want whatever domain name you have, you can try contacting the person who registered it and offering to buy it from them. But who is lookup like instantdomainsearch.com, can tell you information about who owns what domain name and when it might expire. But it can get really expensive if someone has already registered the domain name you want, so I would recommend trying your hardest to come up with something that hasn't been registered yet. Part four, how to purchase. The real action step. In addition to your domain name, you also need a hosting account. The hosting account is basically how you pay for the storage of your data, that is, the content information of the website itself. All data on the Internet needs a place to live. The domain name is how Internet users navigate to your site and the host provides the server where the data is physically stored. You don't have to understand the techniques of all of that to use the system. Just do some online research and read reviews of various hosts to find what should work best for you. The thing to Google would be best web hosting services or best web hosting services that include domain name. I use one called Host Gator and I pay only $5 a month, so I definitely recommend that. But do your own research and find out what will work best for you. 3. Lesson 2: The Content Management System: Welcome to Lesson 2. This is a short lesson about your content management system. A content management system is pretty much exactly what it sounds like. It's a system to manage the content on your website. It's often called a CMS for short. There are many different kinds of content management systems. You've probably heard of several ones. One of the most popular one is WordPress, which used to be mostly known for blogging, but now it's widely used for non-blog sites as well. Another super popular one is Squarespace. I went with WordPress because I wanted something well known. In other words, something that could easily get help on because it has so many users and help forums. I wanted something more customizable and than Squarespace. This is another decision that you'll want to research a little bit. But if you really aren't sure what you want or need, WordPress is a really safe bet. It's very user-friendly, highly customizable, and very versatile. So go ahead and do some googling, find out what options are out there. If you're still not sure, I'd recommend WordPress is one that's fairly safe to go with. You'll use your site host to download your content management system. So exactly how you do that is dependent on what site host you use, but you can find instructions for that online. There's going to be plenty of help forums and instruction sites for you to help you with that step. 4. Lesson 3: Using Templates: Welcome to lesson 3, picking a template. In this lesson I will cover what is a template and why you should use one, and factors to consider in picking your template. A template is the rough or basic outline for how you organize the content on your site. When you're choosing a template, you should consider several factors. Things to think about include, what information your site is meant to hold, how user friendly are different templates and how important is the visual appeal. You should spend some time shopping around, browsing different templates and deciding which one will work best for you. All right, so on WordPress, the templates are actually called Themes, and if you just Google WordPress themes or WordPress templates you'll find this page where you can browse various themes that you can use on WordPress, which is, which is the platform that I use on my blog, I mean, on my website. They all have funny names, but your going to get an impression of what the overall visuals and design of the site will look like if you choose each of these themes. Obviously you would input your own personal information and data. You would customize the photo, customize the text. You can play around a little bit with, for example, how many navigation tabs or on a theme like this, how many photos are in this row, that type of thing, but the overall structure of the page is what is represented by the theme. There are many themes you can choose from, it's nice just to browse and figure out what stands out to you. These are featured so you can look at what are the most popular. Choosing a theme is largely based on your personal style and tastes and preferences, but also what information you want to highlight on your website. If you are a photographer and you want to highlight your photographs, then you might look for a theme that has lots of opportunity for great, strong visuals. This one looks like it's a website to sell a product, jewelry or something, so that might have a lot of opportunities for displaying photos, or for example, if you're a painter, you could display photos of your paintings or of your sculptures. Sometimes though, each theme will give you an idea of what it's best used for this one's called magazine point, that might be something that helps display various issues about digital magazine. If you're a writer like me, I want my website to be pretty text heavy. I do some photography, but my focus is text, so if you look over at my website, I've got one cover photo. Then here's my a brief introduction, and then I have a photo of myself and then some logos that represent the publications that I work for. Then if you navigate to some of my little tabs, it's all very simple. My website is not meant to show off that I'm a computer programmer or visual artist, sometimes I work with words and so I want my website to be very visually appealing, which is why I put in these logos to add a pop of color and break up the text, but that's pretty much all there is to my site. I have my CV here using a PDF plug-in, and I imported my Blogger blog here, that's a quick little WordPress plugin you can use as well, and then I have a short contact form. So my website is super simple. Yours can be simple as well or it can be as complex as you want it to be. The theme you choose will really influence what you're able to do and how complex your website navigation options are. The theme that I'm using is called Crawford. You can see what that looks like the basic model represented here. You can see how that looks compared to what I actually have on my own site and then you can see how it compares to other potential templates that I could have used. 5. Lesson 4: Customizing Your Template: This is Lesson 4, Customizing the Template. I'm going to walk you through the customization options in my template and show you some of the tweaks that can be made including layout, number of tabs, drop-down navigation options and more. Once you have chosen your template and you have an idea of what kind of information or data you want to put in to it, the next step would be to customize. So you can see where my cursor is up here at the top of the screen, I'm going to click customize and I'll show you some of the ways that you can customize your template. So at the top of my page, I was able to upload what this template calls a logo. I don't have a personally designed logo, but this is the background image I use for my business cards, it's a photo that I took, so I have permission to use it and I just put my name over the image and that serves as my logo. But if you have your own company logo, then you can design it and upload it here. Then site identity is a little icon that you can see in the tab on your browser. For example, Facebook has a little blue F, Twitter has that blue T or the little bird symbol, and Google Drive has the green, yellow, and blue triangle to represent Google Drive. So for mine, I just chose the letter C. I actually need to update this because this is an image that I pulled from my previous cover photo and so it's green, which is not a color that you see in my current cover photo, so I need to update that. This is where I customize my tagline and you can choose for that to be visual or not. Then colors, like I said before, I wanted my website to be super simple, I didn't want any of the visuals to be distracting from the content itself because I am a very words oriented person. But you can choose what color the links show up. For example, when I hover over this, you can see that it's a link, it turns orange. I like the contrast between that and the blue. But there are plenty of options for what color you want your links to show. Then Menus, this is where it gets a little bit more complex. I get this message here. My theme supports two menus, so depending on what theme you're using, you might have various options here. My primary menu is the one that I only have one menu set up. So about me is actually not visible on the page, but it's this homepage that I can navigate to by clicking on my cover photo. Like I said, my about me is my primary menu, it means that, that's my homepage of the website. I can customize exactly where these navigation links show up but like I said, I wanted mine to be pretty simple, so I didn't play around with this too much. But depending on how you want to organize your data and what template you're using, you might want to customize that a little bit more, just in terms of controlling how people are able to navigate around your site. Widgets are little boxes that show up on the website. So actually the logos at the bottom of my page are widgets. So here in the edit view, they look all out of order but then when I click preview or when I actually view the site full screen, they show up in, in a much more organized fashion. So you definitely have to preview your changes when you're playing around with this type of thing because it doesn't always show up on the edit screen the way it will for a regular viewer. Then I do have a static front page, which means this never changes. I want this to be the same every time someone comes to it and I've chosen for there to be no title to my front page because it's pretty self-evident that your home page is your about me page. Then WordPress, like I said before, is known for hosting blogs. They call that the postpaid and I named it blog. Then if you understand coding, if you're a software engineer, you can also add your own CSS here. That's not something I mess with because I'm just learning how to code and so I just stick with the built-in options on the theme. So that's an example of some of the things you can personalize on your own website in terms of adding more images and just what content goes in these large buckets, that is really easy to do on the edit page option. So that has less to do with the template, you can just add media, add forums, you can add all kinds of plugins that allow you to customize the data in each page. But in terms of the overall format organization of the site, that is the theme. So yeah, play around with it, it's a lot of fun and it all depends on how you want your site to look, but it's really good to be intentional about customizing all that information. 6. Lesson 5: Your Content: This is lesson 5, content. In this lesson, I'm going to help you decide what content should be on your website and how to generate and organize it. This is going to include the things that are on your homepage, your resume, your portfolio, any photos and images, your contact me page and how to double-check for grammar and typos. I'm going to walk you through how I chose what content to put on my site. As I mentioned before, I chose this cover image. I wanted it to be something that I thought represented me, my soul, my spirit. I love being outdoors, I love the sky and the sun and the mountains. This just represents my personality and some of my interests I love exploring and that's part of what drives me to be a journalist. I don't know if the casual viewer really catch all of that. But the idea of adventure, of independent thinking, independent travel. I hope that those impressions are conveyed through this image. You should definitely think pretty intentionally about what image that you choose conveys about you. You definitely want it to be a professional grade photograph as well. Whether it's a logo or an image as long as you're considering what does it say about me, that's the main consideration for something visual. Then in terms of the content that I chose for my website, in my homepages my about me page. My first sentence summarizes what I do for a living. I am a freelance journalist, essayist, and content strategist in Nashville, Tennessee. Those are the three main buckets for how it described the work that I do. Then my next sentence is a little bit more abstract. I love asking questions, seeking answers and turning those answers into stories worth sharing. You can restructure this however you see fit. But I wanted to be really clear right upfront about what I do. Then my next sentence says basically, why I do it, what drives me to pursue that type of work. Then really quickly I move into more specifically, what are some examples of that? I enjoy telling important and compelling stories in the realms of food systems, business innovation, social justice, and environmental sustainability. Those are what I would call my beats. I want someone on my homepage to really quickly grasp generally what I do and then specifically what I'm interested in within those categories. Then I have my top four writing clips or examples here show the caliber of what I do. My highest personal accomplishment in my journalism career is that I had a story on the Here & Now Show NPR, so that was national publication. That's for me go first. I've reported for NPR because I want someone to be really impressed as soon as they get to my site. Then Southern Foodways Alliance is a regional publication that I'm also really proud to be associated with. My podcast episode that I produce for them is going to be the second example that I gave here. Blue Ridge Outdoors is another regional publication that I'm also really proud to be included in. The story that I give an example here with is something that took for me a lot of personal initiative. It was an idea I came up with and pitch to an editor and I was really proud of how it turned out. Actually that's true for all of these, but these are all examples of stories that I'm really proud of and ones that other people are likely to be impressed by as well. Then a little note that I'm also doing content strategy for a startup company, which is a little bit more new for me. That goes underneath all the journalism work. Then because it's my personal website includes some of my hobbies which are travel, backpacking, running, reading, and vermicomposting. Each of these are linked to my own personal writing, which explains or illustrates my interest in each of these topics. Actually, the reading link goes to a spreadsheet where I keep track of all the books I have ever read. I like having that public because then people can get an idea of what I'm thinking about and what I want to learn about. Then I have a photo here of myself. It's actually not an ideal photo because it was taken on a self timer. I think that my face is not completely in-focus. You definitely want a professional portrait to go here. Some currently in the market to get a new professional portrait to go here instead. I want people to very quickly grasp the caliber that type of work that I produce. I have uploaded the logos of various organizations or publications I'm affiliated with so people can just at a glance really quickly see who I write for, who I worked for but that's down here at the bottom of the page because for me, the examples or the details are more important to be portrayed clearly upfront. If someone wants to view pretty much anything I've ever written that I would say I'm proud of, they can navigate to view each of those examples in each of those categories if they're interested in me write reporting a news story for them, they can navigate to this tab and here's a little summary of the type of news I've covered. Then all my best examples listed below, same for feature articles or feature stories, I write at the top of the page or write a little summary of what to expect. Then several examples of features I've written. My PR writing pages organize a little bit differently. I just have the examples categorized social media, email outreach for this organization, SEO blog posts for another organization, newsletters and how many people wrote them. It's always good to include stats for your work as much as possible. Something I try to do, I actually, I'm trying to get better at is including stats for everything that I do. How much the readership was, or the reach of the audience. A couple of different press releases I've written for different organizations and then research projects here at the bottom. Each of these are linked out. There's a setting that you can make sure that your link opens in a new tab. Let see if you click edit page. You want your links to open in a new tab and make sure that they don't take your viewer away from your site or to close the tab on your site. If you click the edit link button here and then link options, you wan to make sure this box is checked "Open link in a new tab" because you don't want someone to to lose this open tab of your website. That is how I display my work. I have logos here on the clips main site to break up the page in a visual way. This is basically my top 10 clips here on what I call the clips homepage and then further examples in the drop-down menu. You would just display your work whatever way makes the most sense, depending on what type of work you do and how you want people to view it. My next tab here's my CV, but can I do more than writing, I also am interested in doing strategic design work and I have a number of volunteer positions and I want people to know about those so I have my CV here. There's actually not an ideal setup because my CV is two pages and someone has to navigate down here to the bottom to view the second page of my CV. I don't like that because it's an extra step for the viewer of a website. Whenever you're designing your website, think about what is the most effective way to make sure that whoever visits it has the highest ease of navigation as few clicks as possible and can view things very quickly and easily. I haven't quite found the ideal way to display my resume. I didn't want to put all of the text directly into the page because I have my email address and phone number here and I didn't want to get a lot of spam calls and emails from people being able to very quickly copy and paste that data. Instead I have a contact page or someone, instead of having to copy and paste my email address into their personal email, they can just drop a quick note right here. I have a list of different types of work that I do and encourage people to reach out to me if they want to ask me to do that type of writing for them. Then because I'm a writer, I have a blog tab. This is actually a blog that I originally set up in Blogger, which is owned by Google. I have had this block since 2012. On my blogger site it's a lot easier to navigate based on the year of when post was published. But here on word press when I imported all of these posts ended up just being one long list of posts. You can see there's 42 pages of posts. I have some two or 300 posts here. Someone can quickly jump to the very first post I ever did on my blog, which was back in 2012 when I launched the blog. But it's a lot harder to get to those middle pages, but I don't think it really that important for someone to know what I was writing about in 2013 or 14 or 15, really, it's the most recent stuff that's most relevant. Then perhaps to navigate to 2012 and see how far I've come and just to know that I have been writing a lot for a very long time. That's the point of me having my blog here is to show that I am devoted to writing and devoted to storytelling and to toning my craft. That's why I have my blog. You don't need to have a blog it might be fun to start one just to give someone an idea of what you think about on a daily basis or what you do with your life. More personal element there, as long as it's appropriate for a potential professional connection to view. But I have my blog there and that's really all I have. I want my website to be very minimalistic. I want it to be quick and easy to navigate around clicking on this logo page, this logo image takes you back to my homepage. That's really all there is to my web, so depending on who you are, what you want to display, what message you want to send to your website visitors, you might have a much more complex site to navigate and a lot more information. You might have a lot less, you might have a lot more visuals, mine is definitely low on the visual end of things but just as long as you're intentional about how you're displaying your information in the most effective way possible to get across the message you want to send, that's all that matters. I've talked to you through how I made my decision for my website and I hope that was helpful for you making your decisions. About this whole process, just really make sure that you double-check everything for grammar accuracy, make sure there are no typos, make sure everything is aligned visually and nothing looks crooked or out of place. For example, having these logos down here at the bottom of my page all lined up in a way that looks visually balanced was really important to me and it's important to your viewers as well. Make sure that even if you're not a super visually oriented person, you want the visuals to be balanced and clean and aligned and not looking random or crazy or out of whack. Make sure that your words are accurate and that your visuals are balanced and symmetrical as much as possible unless you're intentionally trying to create a disruptive look to it. But that is the last tip I would give you is to double-check the overall impression that someone would have, both in the details of the grammar as well as the overall visual balance and design. 7. Final Thoughts: The Future of Your Site: That's pretty much all you need to know to build your own personal website. Remember that it's a constant working progress, take it one step at a time. You can work on it as much as you want before publishing, but it's okay to leave some pages of the website as under construction. Don't be afraid to try a different template if you decide you don't like the one you chose before, or if you find one that you like better. Keep tweaking and customizing as you learn about what's possible and about what you like. Another way to make the website the best it can be as to ask friends and family for feedback. Ask them what their overall impressions are or what kind of person they would think that you were if they saw the website but didn't know you, ask them if they think that it represents you and your work well and take their feedback to heart. Most of all remember to keep the content up to date. This is not a static paper resume that gets printed out and can't change. It should reflect your accomplishments in real time. So whenever you finish a new project, upload it to the site. You can even publish teasers to give people an idea of what you're currently working on even when the project is still underway. Have fun with the website. It's like an extension of yourself, a digital representation that you get to control, dream big and enjoy the process.