Sam
This user hasn't shared any biographical information
Posts by Sam
Final SEO Report
Mar 14th
Final SEO Report
by Samantha Bridgehouse
Problem Description
The problem that needed to be solved with this project was simple: to increase the amount of user traffic visiting the Interactive Design Lab North website. Our group was given a blank website domain where we had to build and maintain a website about the Interactive Design Program. The goal was to generate as much traffic to the website as possible by using Search Engine Optimization (SEO) techniques. Google Analytics was used in order to measure the number of site visitors as well as other site statistics.
SEO/Analytics Strategies and Tactics
Keywords
One of the most involved strategies our group utilized in our SEO was the use of keywords. We aimed to get a keyword density of 2% with keywords related to interactive design, so that the Interactive Design Lab North website would have a higher search engine ranking when those keywords were searched. In order to use as many appropriate keywords as possible without keyword stuffing (spamming), we created over a dozen different pages on the site that offer information about the Interactive Design Program and Capilano University. By creating so many pages, we were able to include a large amount of written content, where we could pack in quite a few keywords without affecting the readability of the writing. Besides the written content, we also added keywords to the Meta and Title HTML tags of the site, as well as to all of the page headers. Our group tried to add images to the pages wherever possible, which allowed us to add additional keywords in the Title attribute of all of the image tags.
Content Freshness
Since websites that are updated frequently have a higher search engine ranking, our group decided to create a blog on the homepage of the Interactive Design Lab North website. By creating new blog posts every day, we ensured that our website maintained freshness. Each group member was assigned a specific day of the week in which they had to write a new blog post. We blogged about topics related to interactive design, offering tutorials and resources, as well as general technology issues and current events. We hoped to build up a number of loyal repeat visitors who would come each day to read the new blog posts.
Link Building and Social Media
Another method our group used in our SEO was link building. Websites that have lots of outgoing and incoming links are considered more popular by search engines and are given a higher ranking. All of our pages and blog posts link to other pages and blog posts on the site, which encourages visitors to explore the site further. This improved our Bounce Rate – the percentage of visitors who leave the site on the same page they entered. We also created many links to other websites wherever possible. One of our strategies for building incoming links to the site was to sign up for Social Media websites, where we were able to advertise and link to the Interactive Design Lab North site. Social Media websites also allowed us to try and create a dialogue about our site among different communities, to spread awareness of the website. We took advantage of the major Social Media websites such as Facebook and Twitter, but we also created accounts with Youtube, DeviantArt, Flickr, Screenshots, and Digg. On Facebook, we created a group for the Interactive Design Lab North website and invited our friends to join it. On Twitter, we frequently made web design and development related Tweets, linking to both our website and other useful websites. We Followed a large number of Twitter users who are a part of the web community in order to gain more Followers of our Twitter feed. On DeviantArt and ScreenShots, we uploaded screenshots of some of our web design work, and on Flickr and Youtube we uploaded photos and videos of the Interactive Design lab and numerous Rich Media projects we had completed. We added all of our blog posts to Digg and encouraged people to also Digg our posts to increase their popularity.
Contest
One of our most unique strategies to build traffic to the Interactive Design Lab North website was to host a Trivia Challenge contest. Over a period of seven days, we posted a new general trivia question each day, and asked users to email their answers to us. Of the people who answered all of the questions correctly, we did a random draw for one winner, who received a $25 giftcard to a store of their choice. This was one of our most effective strategies in increasing visitors to the site. We created a Facebook event for the contest and invited everyone we knew to join in, and we also made several Tweets about the contest on Twitter.
Outcomes
Our group was quite successful in our SEO tactics. In a two-month period, we had 421 unique visitors and 1,595 unique pageviews. On average, users were visiting 4-5 pages of our site each time they visited, and we had a respectably low Bounce Rate of 58%. Most of our website traffic came from referring sites at 58%, with only 5.5% of visitors being directed to our website from search engines. This is a number we may want to work to improve in the future, since a higher percentage of visitors from search engines would be preferred. Overall, the project had a positive outcome.
Lessons Learned
I started out this project with almost no knowledge about SEO, and after completing it, I feel like I have learned a huge amount. One of the tactics I learned, which I would want to implement in the future, is to put a greater importance on quality of visitors rather than quantity. This is important for the Interactive Design Lab North website specifically since the people who would be interested in visiting our website were mostly limited to those in the web or technology community. We tried to add content to our site that would interest the general public as well, but for the most part, people in the web industry are those we wanted to attract to the site. Although we were getting a decent amount of new visitors each day, we did not have a comparatively large number of loyal repeat visitors. We could have gained more repeat visitors by putting more focus on writing insightful and useful blog posts. Many of our blog posts simply paraphrased and linked to other author’s articles, which did not give users enough of a reason to continue visiting our blog on a regular basis. We should have written more of our own articles in order to make our site a dependable and valuable resource for the web community. Part of this limitation was due to time constraints, since everyone in our group also had other important and time-consuming projects going on and did not always have time to write a long blog post. Besides the constraints with our blog, most of the other strategies my group learned and implemented were very effective – using keywords and creating a blog to keep our content fresh for a higher search engine ranking; link building and utilizing Social Media to spread awareness of the site; and hosting a contest to entice more visitors to come to our website. This project has greatly improved my abilities with SEO, and I look forward to applying what I have learned to future projects.
Easy Slider – Powerful and Customizable jQuery Slider Plugin
Mar 1st
Recently, I was working on completing my portfolio website. I wanted a slick and impressive way to display my past portfolio work, and I found this little gem known as Easy Slider while surfing the internet.
Easy Slider saved my life. It’s a jQuery image slider that is highly customizable. I recommend it for anyone who needs to create an image gallery or wants to add an interactive element to their website! It was super easy to put up, even for a JavaScript dummy like me. Check out the newer version for added features.
Easy Slider 1.5 – The Easiest jQuery Plugin For Sliding Images and Content
Easy Slider 1.7 – Numeric Navigation jQuery Slider
Check out how I implemented Easy Slider on my portfolio website! 
If you liked this post, you might also like…
Top 10 Web Design Resources Every Designer Should Know About
Wana Learn jQuery?
Wordpress?
Super Clean and Easy Writing in the Sand Photoshop Tutorial
Feb 22nd
After searching fruitlessly for a good Photoshop tutorial on creating a “writing in the sand” effect, I ended up making up my own way – and now I’ll share it with all of you! It creates a very clean and smooth effect and is super easy and fast to complete.
The first step is to find an appropriate font that will look like someone has written in the sand with their finger. For the tutorial, I chose to use Handwriting – Dakota since I like the rough quality to it.
After you’ve found a suitable font, create a new canvas in Photoshop. You can also use an existing one if you already have a design started.
Since there can be no writing in the sand without the sand, let’s create a sand background for behind our text. Fill your canvas with an appropriate sandy colour – I am using #f0ebdf. Now go to the top menubar and go to Filter – Noise – Add Noise… Check the Monochromatic box and set it to Uniform Distribution. You can fiddle with the Amount, but remember, you want it to look like sand, not a bunch of noise! I used 1.75% and was quite happy with the subtle texture. Click OK.
The great thing about this method is it will create a perfect tiling background – you don’t have to worry about seams showing up if you use it as a repeating page background for your web design! Now we need to add our text. You’ll want to make it a dark brown colour so that it can be read easily against your sand background – I am using #a0894e.
Next, we’re going to use some Blending Options on our text layer to create the illusion of a build-up of sand around our text, and to give our text some depth. In your menubar, go to Layer – Layer Style – Blending Options. To create the sand build-up, let’s add a stroke. The size of the stroke will depend on the size of your text – it should be in proportion to look realistic. Since I have rather large text, I am going to make my stroke 4 pixels. The position should be on the Outside, and change the blend mode to Overlay. Up the Opacity to 100% and change the colour to black (#000000).
If you click OK, your text should now look something like this:
Now, to create some depth, let’s add Bevel and Embossing. We’re going to give our text an Inner Bevel. I changed the depth to 50% and made the size 4 pixels; you can experiment with these values to get your desired effect. The important part is to change the lighting so that the text looks like it is ingrained into the canvas rather than sticking out of it. I changed the Shading Angle to -120 degrees and changed the Altitude to 30 degrees. Change both the Highlight and Shadow Mode to Overlay and lower both Opacity values to 50%. The Highlight colour should be white and the Shadow black. Click OK.
We’re almost done! Your text should now look like it is etched in the sand:
You can stop at this step if you prefer, but I’m going to add the final touch by giving our text a bit more texture. Make sure your text layer is still selected, and again go to your menubar and go to Filter – Noise – Add Noise… Use the same settings as before, but up the Amount a bit: I made mine 3%. Click OK and now you’re done!
The final product should look something like this:
Easy right? I hope you enjoyed my little tutorial. Comment on this post if you have any issues getting things to work, or if you would like to suggest improvements!
If you liked this post, you might also like…
Pillowed Text Photoshop Tutorial
How to Create a Stylish Pair of Headphones
Top 10 Web Design Resources Every Designer Should Know About
Feb 14th
Where would web designers be without the invaluable resources provided on the web for us? Design inspiration, stock photos, tutorials, fonts, freebies, brushes, textures … the list goes on. Take advantage of the resources and expertise other web designers offer for free! Here are 10 of my absolute favourites, in no particular order:
Design Meltdown (design inspiration)
Browse thousands of cataloged sites to get inspiration for your own web designs – invaluable for finding inspiration on specific design elements, styles, themes, or colours.
Scrnshots (design inspiration)
Browse screenshots of inspirational web design uploaded by other users or upload your own favourite designs. Very useful for finding inspiration about specific elements since you browse by tags and keywords.
Designer’s Toolbox (design resources)
Provides many miscellaneous design and print resources, including PSDs of HTML form and browser elements for realistic design mock-ups.
Stock Xchng (stock photos)
One of the best free stock photo sites; Stock Exchange provides thousands of super high-quality stock photos for FREE for both personal and commercial use.
Smashing Magazine (interactive design blog)
The most well-known web design blog out there, Smashing Magazine provides TONS of information, resources, tutorials, and tips from industry professionals. Try to soak up as much of their expertise as you possibly can.
DaFont (free fonts)
Browse their huge selection of free fonts to spice up your design. They make it easy to find a specific type of font since you can browse by theme, name, or search for keywords!
Blind Text Generator (dummy text)
Generates highly-customizable dummy text (lorem ipsum) for use in the text areas of your design.
Type Tester (css font comparison)
Preview different web-safe fonts to see what they will look like on the screen and customize the different CSS font options.
Color Scheme Designer (colour palettes)
Highly-customize colour palette generator which allows you to also preview what the colour scheme could look like on a web page.
Design Resources Search Engine (design search engine)
This search engine has endless usefulness – it allows you to do a Google search but only on the selected design-related websites. Great for finding tutorials, resources, and blogs.
What are YOUR favourite web design resources? Comment and let us know!
If you liked this post, you might also like…
Firebug is Every Web Developer’s Friend
GIMP – The FREE Alternative to Photoshop
GIMP – The FREE Alternative to Photoshop
Feb 8th
Let’s face it: Photoshop is freakin’ EXPENSIVE. At a whopping $700 US for Photoshop CS4, you had better hope your parents decide to spoil you and buy it for you next Christmas. Unfortunately, the high price point makes it difficult for beginners and aspiring web designers to get into the business – you had better be darn sure web design is what you want to do before spending $700 on Photoshop. So what are the alternatives?
GIMP is the best Photoshop alternative out there and it’s completely free. It offers many of the same advanced features as Photoshop – for FREE. While, so far, nothing can replace Photoshop as an industry standard, GIMP is certainly a passable equivalent for beginners.
CNET Download.com reviewed it and gave it 5/5 stars:
“One of the most powerful general-purpose image editors around, the upgrades make the GNU Image Manipulation Program eminently comparable to Photoshop. Older features include channels, layers and masks, filters and effects, tabbed palettes, editable text tools, perspective clone, improved printing, and color operations such as levels. New improvements include GEGL integration for 32-bit color support, dynamic brushes, and more options for the free select tool. It even has regex-based pattern matching for power users.”
So if you’re strapped for cash, give GIMP a go!
Top 10 Best Cheap Web Hosts
Feb 3rd
Trying to find the best web host for your money can be a long and painful process. Many advertise a super cheap price – if you buy three years of hosting. Some advertise unlimited bandwidth and disk space – but then charge you a big chunk of cash to purchase the domain name. Some are just too fishy to even trust with your money! When you choose a web host, it usually means committing for at least a year of hosting, which is why it is such an important decision.
Luckily, Web Hosting Geeks has created a list of the top 10 cheap web hosts based on user reviews. They also offer other “Top 10″ lists of web hosts based on other specifications, like Top 10 Eco-Friendly Web Hosts and Best 10 Dedicated Servers.
Read the reviews, compare prices, and make an informed decision on who gets the privilege of hosting YOUR website.
Oh, and in case you’re wondering – here are the Top 10 Web Hosts:
- Inmotion Hosting
- iPage
- JustHost
- Web Hosting Pad
- Fat Cow
- Green Geeks
- Blue Host
- Host Monster
- GoDaddy
- Yahoo
How to Brand Yourself as a Freelance Interactive Designer
Feb 1st
Creating a memorable and successful brand and marketing yourself is a very important aspect of being an interactive designer. Here is an excellent article by WebDesigner Depot entitled The Art of Branding Yourself and Your Freelancing Business – it covers everything from writing the elevator pitch to defining the target audience to logo and website design.
The Art of Branding Yourself and Your Freelancing Business
Beautify Your Laptop With iStyles Skins
Jan 27th
Tired of your Macbook Pro and other electronics looking just like everyone else’s? Protect it from getting scratched and make it look sexier by flaunting some iStyles skins! You can remove it to swap for a new one as many times as you want because it won’t leave a glue residue and the skin should stay sticky forever.
Loading ...