New Year’s Resolution Ideas to Become Better at Your Career

Can you believe that 2011 is already coming to a close? 2012 is right around the corner. December is always a time for finishing up any work for the year and enjoying the holidays. One thing that separates the best website designers, developers, and writers from the average ones is planning for the coming year. The best process for new year planning is to start with evaluating what worked and what didn’t during the previous year, researching what’s new in your industry, and coming up with a list of ideas for how you can take your website to the next level. In this article we will provide a list of 20 new year resolution ideas for becoming a better website designer, developer, or writer.

1. Collect Feedback

Find someone who you respect and trust within your field and ask him/her to review a few examples of your work and provide you with feedback on how you can take your craft to the next level.

2. Develop a Marketing Plan

Marketing is critical to having success as a website owner. Most website owners don’t spend enough time thinking about how they can better market their website. The beginning of the year is as good a time as any to take a few hours to come up with some creative marketing tactics to try during 2012.

3. Create and Analyze Reports on Website Traffic

Even though reporting tools have become more robust and easier to use over the years, many of us don’t like to take the time to use the tools on a regular basis. We can learn a lot from analyzing our website data. Take some time to think through what data would be helpful for your website, create some reports around that data, and analyze the reports to learn how you can attract even more visitors.

4. Buy Software

Sometimes it takes spending a little money in order to provide a better quality product to your website visitors. Is there software out there that you know can help you improve your website? Save up and buy it. Spending a little money can go a long way.

5. Evaluate Your Website

Take some time to go through every section within every page of your website. Make sure everything is still relevant and up-to-date. Have things changed within your industry? Are you noticing any trends with your visitors? Be honest with your evaluation and come up with a list of things that you can do to improve your site.

Image by Dominik Gwarek

6. Hire an Intern

Are there tasks that you keep putting off because they are lower on your priority list and you just can’t find the time to get to them? How about hiring an intern to help you complete those outstanding tasks? You might be able to find a student who needs to get an internship for school credit, which means you don’t have to spend any money. If not, you can probably find some help for a lower hourly rate than you would if you hired an outside contractor or part-time employee. Interns can be extremely beneficial.

7. Take a Risk

Is there something new that you’ve been looking to try or talk about, but until now you haven’t wanted to “rock the boat”? Now is the time to take a risk. Try something new. Get out of your comfort zone and see what the results are. Who knows, you might find that your audience has been waiting for you to do it for a long time.

8. Survey Your Website Visitors

Without your visitors you have no website. Find what they are looking for. Get feedback on your current website. Ask if there’s anything that you can add that they might find beneficial. People like when someone asks their opinion. Make your readers feel important by asking for their thoughts on your website.

9. Social Media is Your Friend

Social Media sites like Facebook and Twitter have done wonders for website owners. Use social media to share links to your website with your online audience. The more you use social media the more traffic you’ll see to your website.

Nice icons? See more from Plechi

10. Set Up a Partnership

Is there someone in your industry who you think can compliment your website and provide more value to your visitors than you might be able to do alone? Are you a great writer, but your design skills are average? Are your design skills top notch, but writing code isn’t your thing? Perhaps you can find someone who has stronger skills in one area, but is lacking skills in the area that you’re strong in. Reach out to him/her to see if you might be able to collaborate on a project or two.

11. Join Groups

There are groups of people who get together to share ideas and discuss new trends within every industry. Find some local groups that you can join. Sometimes talking with other people within your industry can help you come up with new ideas for your website. Groups are also a way to increase website traffic and collect feedback on your website.

12. Add a Blog or Write More Articles

Blogging is a GREAT way to attract new visitors to your website. Each article can be optimized for search by adding keywords and inbound links. If you don’t already have a blog, add one. If you have one, try to write more articles each week. The more valuable content you produce, the more traffic you will get to your website.

13. Say Thank You

Again, without your regular website visitors you can’t have a successful website. Make sure your visitors know just how much you appreciate them. Post a message to your website. Put together a HTML email saying thank you. If you sell a product or service, give them a ‘Thank You’ discount. Let your visitors know just how much they mean to you.

14. Do More

Have you ever found yourself saying, “I know I can take this website to the next level if I just had a little more time to spend on it”? If so, then start spending more time on it. Get up a little earlier. Stay up a little later. FIND THE TIME to do more with your website.

15. Take a Class

Even the best designers, developers, and writers can improve. In today’s world things are constantly changing. Search class listings from local community colleges or search for online classes that cover a topic that you think can help you improve your skills.

Image Courtesy of Mediacampus.ie.edu

16. Use Video

The costs and time associated with creating online video are both coming down. New technologies are allowing more people to create informative videos about any topic. Videos are more engaging than text. Websites that incorporate video into their structure usually do better than ones that neglect online video.

17. Teach a Class

Is there a community college in your local area? If so, you should sign-up to teach a class about website designing, website development, or writing. Teaching can be an extremely fulfilling service. It may even help you improve your craft. As you create lesson plans and think through different areas of your craft it may spark new ideas for how you do what you do.

Image Courtesy of Hugohouse.org

18. Write an Ebook

Ebooks are great for positioning yourself as an expert in your industry. They are also great for SEO. Think about a topic that you can provide new insight on and start writing. It doesn’t have to be 100 pages. It might only be 5 or 6. What’s important is providing a new or different take on the topic that you choose. Once it’s written then make it downloadable from your website. Collect personal information from those who download it, so that you can contact them in future.

19. Create a Mobile Website

With more and more people using smart phones it’s critical that you have a mobile version of your website. Take some time to create a mobile version of your site. Your website visitors will really appreciate it.

20. Get Started

Don’t put this off any longer. Start coming up with your own list of new year resolution ideas. Once you have a list created, prioritize each item on the list and then start working down the list. By this time next year you will be amazed at how much you accomplished!
Have you started putting together a list of new year resolutions? What’s on your list? Leave a comment below.

Create a Web Hosting Landing Page in Adobe Photoshop

In this week’s tutorial we are going to create a Web Hosting Landing Page layout for Besthost as an example. The template will have a simple logo, navigation, slider gallery, package, about us, services, testimonials and footer. Let’s combine these all together to make an awesome template. I will try my best to make it easy for you to follow this tutorial.
So let’s get started!


Here is what we will be making, click on the image for full preview:

Resources for this tutorial

• Social Icons
• Wefunction Icons

Step 1: Setting up the Document

Start by creating a 1400px x 1470px document in Photoshop.

Ruler Tool is very useful for this tutorial make sure that rulers and guides is turned on.

• Rulers: Ctrl + R
• Guides: Ctrl + ;

Also one important thing when using Ruler Tool is the Info(Information) Panel. Use this when you are measuring using the ruler, the information will be shown in the information panel. Make sure that this is shown in your panels at the right. If it is not shown you can access this by going to Windows – Info.

The total width of this site will be 960px. So, let’s create our first guide by going to View – New Guide, set the value to 220px. Create another guide and change the value to 1180px, this will make a total of 960px in the center of our canvas.

Step 2: Working on Background

Header and Slider

Starting at the top of the canvas select Rectangle Tool(U) and create a 100% by 470px fill it with #1560d5.
Based on the screenshot, our background will contain grid patterns, so let’s create that. Open up a new window and create a 100px by 100px with a Transparent background. Select Pencil Tool(B) and set the size to 1px then, create an L shape as shown in the screenshot below. Then go to Edit – Define Pattern

Create another pattern using the L shape, but this time make it 20px by 20px.
Now that we have our pattern, create two new layers. For the first layer fill it with the Big Pattern using Paint Bucket Tool(G) and from the drop down list on the options panel set it to Pattern then select the Big Pattern. Then set the Layer Mode – Softlight 50%. On the second layer fill it with the smaller pattern, Softlight 20%.
Result.

Newsletter

Using Rectangle Tool(U) create a 100% by 100px fill it with #111111.

Content & Copyright

Just fill the background layer with #ededed.

Footer

Using Rectangle Tool(U) create a 100% by 260px fill it with #1560d5. Place it 60px upwards starting from the bottom of the canvas.

Step 3: Working on Logo and Navigation

Create a 906px by 60px shape using Rounded Rectangle Tool(U), Radius 3px and fill it with #111111. Place it 50px starting from the top.

Apply This Blending Option

• Drop Shadow:

• Inner Shadow:

• Gradient Overlay:

• Stroke:

Result!

Logo

We will make a temporary logo. Using Text Tool(T) put up the site name. For this example just use Arial 24pt.

• Drop Shadow:

• Bevel and Emboss:

Result!

Add a slogan using the same tool. Font will be Museo 12pt color #777777.
Result!

Navigation

Using Text Tool(T) add your links. Use Arial 14pt color #777777, the active link color will be #ffffff. Each link will have 21px distance on the left and right. Measure it using Ruler Tool(I).

Next we will add a divider to make the links separate. Using Line Tool(U) create a 1px black Line. Place it at the center as shown in the screenshot below.

Merge all the shapes and duplicate it. Apply a #393939 Color Overlay. Move the layer 1px from the right. Now apply a Mask by clicking the mask icon at the layers panel. Now using Gradient Tool(G) black and white. Fill the mask starting from the bottom of the shape towards at the middle.

For the hover effect the font will be white, then it will have a bottom border 2px color #d8d50d.

Step 4: Working on Slider

Create a 10px guide to the right. Using Text Tool(T) put up a dummy heading and text. For the heading I used Oswald 30pt color #ffffff and #efef14. For the paragraph I used Arial 12pt color #e2defd.

Select Rounded Rectangle Tool(U) Create a 180px by 50px rounded rectangle set the Radius to 3px and color to #eae70e.
Apply This Blending Option

• Drop Shadow:

• Inner Shadow:

• Gradient Overlay:

Result!

Next we will add the arrow icon and the text. For the text I used Oswald 18pt color #ffffff and color #9a9603 for the bevel look. For the arrow icon find an arrow from the selection using Shape Tool(U).

For the rounded circle just create a 30px by 30px using Ellipse Tool(U) set the Fill to 0% and apply a 3px stroke inside. For the bevel looking look just duplicate the layers and make the original layer color to #9a9603.

Next adding the controls. Just create a 12px by 12px white circle and set the Opacity to 50%. For the active one just leave it white. For the cpu/servers just grab some stockphotos.

Step 5: Working on News Letter Sign Up

Grab a mail icon from wefunction icon set and place it as shown. For the Heading text I used Museo 500 18pt color #ffffff. For the Paragraph I used Arial 14pt color #777777.

Next we will create the news letter input and button. To start create a 300px by 40px shape using Rounded Rectangle Tool(U) Radius 3px, set the fill color to #f2f2f2.
Apply This Blending Option

• Inner Shadow:

Label it with text Arial 12pt color #555555.

Next using Rounded Rectangle Tool(U) with the same radius create a 90px by 40px shape. Fill color will be #1560d5. Once the shape is in place using Direct Selection Tool(U), Delete Anchor Point and Add Anchor Point create a shape as shown in the screenshot below.

Apply This Blending Option

• Inner Shadow:

• Gradient Overlay:

• Stroke: #0341a2, #1560d5

Label the button with “SIGNUP” using Text Tool(T) color white and for the bevel look color will be #0342a3.

To finish this button using 150px Soft Brush color #ffffff. Click once in a separate layer and transform it as shown in the screenshot below. Then, set the Layer Mode – Softlight.

Result

Step 6: Working on Main Content

The main content will contain Package Table & About Us. Let’s work first on Pricing Table.

Pricing Table

Using Rounded Rectangle Tool(U) with the same Radius, create a 690px by 330px shape and add a 1px stroke color #c3c3c3.

Using the same tool create a 690px by 55px shape with a fill color of #1560d5. Make the bottom part not rounded, and also apply the same blending option as we did in our sign up button.

Let’s divide our table into 3 columns 690 / 3 = 230px each column, so go ahead and measure it using Ruler Tool(I) then add a 1px line using Line Tool(U) color will be #c3c3c3.

Now let’s add data in our table. Each table data will have a 40px of height, white for odd and #f5f5f5 for even. For the text I used Arial 12pt color #555555.

Next let’s create a button for each column. Button size will be 100px by 30px, the same font but font size is 13pt. For the styles just copy what we applied on sign up button and add this blending option.

• Drop Shadow:

Apply also the highlights effect that we did previously.

Now let’s work on the header part. Using Line Tool(U) create a 1px line color will be #0341a3. Next, using Text Tool(T) add the heading text as shown in the screenshot below.

Apply the highlights effect.

About Us

Using Text Tool(T) add the heading text and paragraph. For heading font will be Museo 18pt color #2c2c2c, and for the paragraph Arial 12pt color #555555.

Step 7: Working on Sidebar

The sidebar will contain a blocks. Let’s work first on the first block

Services

Using Rounded Rectangle Tool(U) create a 250px by 225px shape. Apply a 1px inside stroke color #c3c3c3.
Next open up wefunction iconset and grab 3 icons resize it and align it as shown in the screenshot below.

Testimonials

Using the same tool create a 250px by 220px shape with a fill color of #111111. Apply a 1px inside stroke color #000000. Refer to the screenshot below for the text format and colors.

Step 8: Working on Footer

The Footer will be divided into 4 columns Quick Links, From the blog, Quick Contact, and Follow us. Each column will have a 20px distance from the right except for the last one.

Quick Links

The width will be 320px. The will contain two column of links each column will have a width of 150px and a distance of 20px.

From The Blog

The width will be 300px. Using Rectangle Tool(U) create a 49px by 49px shape. Beside it 20px from the right will be the post title and date published.

Quick Contact

Width will be 150px, the same text and spacing.

Follow Us

Width will be 130px and place the social icons as shown in the screenshot below.

And lastly add the copyright text on the bottom left part and links on the bottom right part. Font will be Arial 11pt color #555555.

Finally We’re Done!

I hope you learn something from this tutorial and I hope this helps. If you have questions feel free to drop it below. Happy Holidays everyone. Godbless!