The Problem

Everything went well with YAPB until I decided to upload my first photo to my blog. I created a new post, added a title, image, and description, and pressed submit. Then I waited. And waited. And waited. After quite a while, the web page decided to load for me and it spewed a rather cryptic error that went along the lines of “Warning: unlink() [function.unlink]: No such file or directory”. Below that it simply said “Error: file does not exist!” My super-geeky brain didn’t seem to be working well that day, so I couldn’t seem to decipher the error until I turned to my extra-super-geeky friend Google and asked him what I should do.

A quick search showed that many other people seemed to be having the same problem, and when I searched a bit deeper, I managed to trace the solution.

The Solution

It’s quite simple, really:

1. Login to your WordPress admin area.
2. Navigate to Settings > Miscellaneous.
3. In the Store uploads in this folder text box, enter “wp-content/uploads”.
4. Click the Save Changes button.

That’s it! For some reason, when WordPress says that the default upload folder is wp-content/uploads, it’s really lying. Either that, or YAPB is holding a knife to its back and making it lie. Either way, the above steps should solve your problem once and for all. You can now upload photos to your photoblog happily ever after.

Let me know in the comments if this solution works for you!

This can be extremely hard to do, especially if you have a lot of things to say, and a lot of people don’t even bother to sign up because of it.  Don’t give up on Twitter yet, however.  Though it may be hard to sum up your thoughts in 140 characters, there are ways that you slim them down without really removing any content.  I like to call it “making the most of your 140 characters”, and below I have listed a few of the ways you can do just that.

1. Shorten URLs

If you’re posting a URL in your tweet, then the best way you can cut down space is by using a URL shortening service.  Basically, you type your long URL into one of these services, and out pops a tiny URL that you can use in your tweets.  Here are a few of my favorite shorteners and why I like them:

• u.nu
  • It is the absolute shortest URL possible.  No url can be shorter than three characters, and that is exactly what u.nu is.  If you’re looking to make your URLs as short as you can, then this is the service for you.
  • After you shorten a URL, it gives you the shortened link, HTML code for the link, and even BBCODE for the link so you can use it on a website of forum without typing code.
  • To see information about a URL shortened with u.nu, simply put a question mark, “?”, at the end of it.  This shows you where the URL redirects to, when it was shortened, and how many people have clicked on it.
• tr.im
  • It has lots of extensions that let you access it from FireFox, your Mac dashboard, or any other browser.
  • It is very fast, which means you can shorten URLs with lightning speed.
  • After you shorten and post a URL to Twitter, you can see statistics on how many people clicked the link, where they are from, and more.
  • You can customize it so that it works just like you need it to.
• is.gd
  • It also has lots of extensions like a FireFox plugin, bookmarklet, Dashboard widget, and Mac app.
  • You can preview a shortened URL (see where it redirects to without actually going there) by putting a hyphen, ‘-’, at the end of the is.gd URL.
• bit.ly
  • Just like the two mentioned above, it gives you extensions like a FireFox plugin, bookmarklet, sidebar, and even a Gmail gadget.
  • You can see real-time analytics of how your links are doing, like how many people are clicking on them.
  • You can save your preferences and always use it the way you want.

Though those shorteners have extremely short domain names,

Note: If you’re looking for some good Twitter apps for your Mac, you should read another post here at TutWow named 7 Free Twitter Apps for Your Mac.

2. Remove multiple RT sources

In Twitter, when someone else tweets something cool and you want to tweet the same thing, you use something called a “Retweet”.  This is how it works: your friend Joe (username joe987) posts a link to an amazing portfolio, and you want to spread it around among your followers.  To do this, you copy his tweet, post it into a new tweet, and add “RT @joe987″ to the front of it.  This not only shows the cool tweet, but it also gives credit to the original tweeter.

Sometimes you see a retweet, or a tweet that already has a “RT @username” on it, but you want to share the tweet with your friends as well.  Most people just add another RT onto the front of the tweet (“RT @one RT @two tweet“), but this adds a bunch of extra characters that aren’t really necessary.  The important thing is that you give credit to the original tweeter, so to make the most of your tweet space, you should remove the first RT.  So if you had “RT @secondary RT @original tweet“, you would change it to just “RT @original tweet“.

3. Use one space at the end of sentences

As your grammar teacher used to tell you, “always use two spaces at the end of your sentences”.  This is great, if you’re writing articles or papers, but for Twitter, it just grows your tweets.  Though this may not save tons of space, it can help if you’re really pressed for characters.  For example, take a look at this tweet:

Hey tweeple!  How’s your day going?  I’m feeling great today, and I hope you are too.  I’m working on a new article for my blog.  How about you?

If you put that into Twitter, you’ll see that it’s four characters too long.  But if you remove the extra space between the sentences, you come out with an even 140 characters.  Not huge, but useful!

4. Use Contractions

Often, when tweeting, you talk about yourself, saying things like “I am eating spaghetti” or “I will go for a walk tomorrow”.  To save extra space, use contractions as often as possible.  So instead of the previous tweets, you would say “I’m eating spaghetti” or “I’ll go for a walk tomorrow”.

5. Substitute Letters for Words

Though I don’t recommend it since it looks rather unprofessional, you can replace words like “you” and “are” with their sound-alike letters “U” and “R”.  This saves lots of space, but as I said, you shouldn’t do it if you’re trying to sound professional.

One thing you can do that doesn’t look as unprofessional is use the “&” and “@” signs in place of “and” and “at”.  Since most people are used to reading these symbols every day, they won’t notice the difference as easily. (thanks Chris and Malcolm Coles for sharing this tip in the comments!)

A good website that does this for you automatically is Twonvert.  You just type in your original, long tweet, and Twonvert converts it to SMS shorthand on the fly.

6. Use multiple tweets

Ok, this might not be a way to make the most of your 140 characters, but the fact is, if you have something great on your mind and you can’t possibly let it out in 140 characters, then you’re going to need multiple tweets to convey your message clearly.  To do this, post the first half of your thought in the first tweet and the second half in the second.  True, this makes people read bottom up, but sometimes it’s necessary.

7. Remove unnecessary words

When we write, we often use words that aren’t really necessary or could be removed without taking away from our meaning.  As I said above, this can be good if you’re writing articles or a paper, but it doesn’t make sense for Twitter.  When tweeting, you should remove your flowery language and post just the basic meaning of what you’re trying to say.

For example, instead of writing “I am being filled with such an awesome sensation of joy and gratefulness that I can barely portray it with mere words”, you could just say “I’m happy”, or “I’m so happy I can’t describe it”.  See the difference in length?

Note: Thanks to Jaremy in the comments for this tip.

More?

There are many ways to shorten your tweets, as you can see.  Did I miss one of your favorite techniques?  Let me know in the comments below, and I’ll add it to the list.

Though most of the shortcut commands are documented in the Photoshop “Keyboard Shortcuts” dialog (see below), there are some “secret shortcuts” that aren’t documented anywhere.  Many of these shortcuts have already been found, and there are articles about them on Web Designer Wall and 11AM Design, to name a few.  However, I’m sure there are many other shortcuts that we haven’t found out about yet (and Adobe keeps adding more in each release).  I found a new one today, and I call it the “secret layer styles shortcut”.

Switching Between Style Dialogs

Here’s how you can use the new shortcut:  In Photoshop, double-click on a layer that you want to add styles to.  This will bring up the

When in the Photoshop layer styles dialog, you can press Cmd (Ctrl) + 0-9 and it will switch to the style corresponding with that number.  For example, if I have some text that I want to add an Outer Glow to, I would double-click on the text layer to open up the Blending Options dialog, press Cmd + 3 to switch to the Outer Glow tab, and enter the settings I want.

Sure, it might not be the most revolutionary shortcut in the world, but it can help to speed up your projects a bit, which is always great.

(thank you Everaldo for the key icon)

Now, a new age has arisen, the age of the blog.  Everyone seems to have one – may it be from WordPress, Blogger, Drupal, LiveJournal, or countless others – and they use it to talk about whatever they feel like – politics, entertainment, education, or that wonderful tortellini they had last night.  With the millions of blogs on the internet, many people wonder how they can give their blog a boost in traffic, get a good page ranking in search engines, or simply spread the word about it.

Below, I’ve put together 10 ways that you can get more traffic to and spread the news about your blog.  Enjoy!

1. Have Good and Relevant Content

The number one thing that you can do to ensure that visitors come to your blog, stay on your blog, and tell their friends about your blog, is to have good, relevant content.  No matter how good your design is, how much you tell other people about it, or even how high your page rank is, no one will come back to a blog that has junky content.  Notice that I also said relevant content, which is just as important.  If someone comes to your blog expecting to read about art, and they find themselves reading about your latest get-rich-quick scheme, they aren’t very likely to come back again.

2. Optimize for Search Engines

Search engine optimization (SEO) is a hot topic among web designers today.  Basically, it is a way to give your blog a higher rank on search engines such as Google, Yahoo!, Live, and Ask.  This is accomplished by doing things such as placing meta information at the top of your HTML files, not using too much Flash, and, as I said before, writing relevant content.  Here are a few articles to help you learn more about this interesting subject:

http://lorelle.wordpress.com/2006/01/15/dyi-search-engine-optimization/

http://www.webdesignerwall.com/general/seo-guide-for-designers/

http://www.cssnewbie.com/4-ways-css-can-improve-your-seo/

3. Set Up an RSS Feed for Your Posts

People are busy – they might love your blog and plan on coming back, but most likely they will forget.  So you need a way to remind them about it.  Meet the RSS feed.  If someone “subscribes” to your RSS feed, then whenever you post new content to your blog, they will either get an email about it, or they will see the new content in a feed reader.

There are many different ways to set up an RSS feed for your blog, but my favorite is FeedBurner because it is extremely easy to use and set up.  Most of the blogging platforms mentioned earlier (WordPress, Blogger, etc.) come built in with RSS feeds set up, but they give you very limited customization and analytics.  Feedburner, on the other hand, takes those bland feeds, and spices them up with lots of different options like email subscription, social bookmarking, ad imbedding, and many, many more.

4. Write Articles for Other Sites

Although this might be taking away content from your own site, if you write articles for other websites, then that will generate more traffic to your own website.  Make sure that the websites that you write for are big and get a lot of traffic; otherwise, you will just be taking away good content from your own blog.

5. Add Social Bookmarking Links to Your Posts

At the bottom of all of your posts, you should add links that “push” your article to the top of some of the most popular social bookmarking sites.  This way, if someone likes your post and “diggs” it, then it has more of a chance of being at the top of Digg (or whatever site), and more chance of generating traffic.  Here are the most popular social bookmarking sites:

Digg

Del.icio.us

Reddit

Stumbleupon

Design Float (if your blog has design-related content)

6. Submit Your Blog to a CSS Gallery

A CSS gallery is a website that showcases great use of CSS in design.  Of course, before you can submit your blog to one of these galleries, you will have to have a good CSS design, but if you do, then you will get a lot of traffic.  Here are some of my favorite galleries:

CSS Loaf

Best Web Gallery

CSS Drive

CSS Beauty

CSS Vault

7. Submit Your Tutorials to a Tutorial Listing Site

Do you write tutorials on your blog?  If so, there are a lot of sites that will list them for you, giving you some extra traffic.  Here are some of the major ones:

Pixel2Life

Good-Tutorials

Tutorialized

Tutcity

8. Start an Email Newsletter

As I said before, many people might love your blog’s content, but forget about it after a few weeks.  Another way to stop this from happening is to start a monthly email newsletter that gives news about the site, new articles, freebies, or whatever else you think might interest the readers.  Granted, some people might not actually read the entire newsletter, but they will be reminded of your blog, and hopefully come back.

9. Get Your Link in Anywhere

Put your blog’s link in your email signature, in your forum signature, in your forum “bios”, in the comments that you write for other blogs (in the text box that says “URL”, not the actual comment, or your comment might get marked as spam), in your IM status messages, on your t-shirt along with a funny quote, or anywhere else that you (legally) can.  True, some of these things might not generate that much traffic, but anything helps.

10. Tell Your Friends!

As simple as it may seem, telling your friends about your “cool new site” could actually rake in some more traffic.  If you tell your friends, and they tell their friends, etc., then this could be a great option.  Of course, it depends on if your blog has good content, if your friends are interested in the topics, and if your friends have a lot of friends.

Up till now, I always got frustrated over the Outer and Inner Glow styles not working the way I wanted them to.  I would create some random shape, and then set the outer and inner glow styles so that the shape would look something like a lightsaber, but it never worked quite how I wanted it.  Take, for example, the shape below:

As you can see, it has some tight angles, and if I put these styles onto it:

Blending Options

Outer Glow

Inner Glow

But that gives us the image below.  As you can see, there are white points poking out at almost all the corners.

So how do we fix this?  Well, as I found out, all you have to do is go into the Outer and Inner Glow options, and change the Technique from Softer to Precise.  That’s it!  So if we change the glow settings to this:

Outer Glow

Inner Glow

After we change those two settings, we get this:

And it’s fixed!  Now our shape is a nice glowing lightsaber, with no white corners poking out anywhere.

Say you have coded an HTML file like this:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />

<title>CSS 100% Height</title>
<link rel="stylesheet" type="text/css" href="style.css" />
</head>

<body>
<div id="content">
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
</div>
</body>
</html>

And you have a CSS file like this:

body {
	margin: 0;
	padding: 0;
}
#content {
	background: #EEE;
	border-left: 1px solid #000;
	border-right: 1px solid #000;
	padding: 0 20px 0 20px;
	margin: auto;
	font: 1.5em arial, verdana, sans-serif;
	width: 960px;
	height: 100%;
}

That gives you this example file.  As you can see, the content box on that page doesn’t stretch to the whole height of the page, even though we added the “height: 100%;” line to the CSS file.  Why is that?

Let me give you a different way of thinking about HTML.  HTML is pretty much just a bunch of containers stacked inside each other.  So in our page, first we have the <html> container, then the <body> container inside of that, and finally the <div id=”content”> container inside of that.  When we put content into one of those boxes, it stretches that box and all the boxes containing that box so that they can hold the new content.  So when we put our text into the <div id=”content”> box, that box streches, which in turn stretches all of the boxes that it is in (in our case the <body> and <html> boxes).

When we put the “height: 100%;” style onto the <div id=”content”> box, what we are doing is telling it to stretch to the full height of the box that it is in.  In this example, the box that it is in is the <body> box.  So the <div id=”content”> box is 100% of the height of the <body> box.  Well, how tall is the <body> box?  It’s just as tall as the <div id=”content”> box, because we never told it how tall it should be!  So when we put the “height: 100%;” style onto the <div id=”content”> box, we are just telling it to be as tall as itself!

To fix this, we need to tell the <body> box to get bigger.  But then we run into the same problem with the <html> box – it is only as big as the <body> box!  So to fix our problem (to get the <div id=”content”> box to stretch the whole height of the page), we need to tell the <html> and <body> boxes to be the full height of the page.

So if we change our CSS file to this:

html {
	height: 100%;
}
body {
	margin: 0;
	padding: 0;
	height: 100%;
}
#content {
	background: #EEE;
	border-left: 1px solid #000;
	border-right: 1px solid #000;
	padding: 0 20px 0 20px;
	margin: auto;
	font: 1.5em arial, verdana, sans-serif;
	width: 960px;
	height: 100%;
}

And that’s it!  This is what we have now.  The content box is now stretched to the full height of the page!

1. Indenting Two Spaces

One of the most obvious ways to make your code more readable is to indent all of your lines to the correct width. I usually use two spaces for my tabs, an option you can specify in most text editors.

2. Code Bracket Placement

As I said before, it’s always nice to keep your code style the same throughout all of your code. One of the things I am a little “finicky” about is the placement of the code brackets that surround my code blocks (if statements, while loops, etc.).

I place my beginning bracket one space after the ending parenthesis of the code block header.  Take a look at this image to see what I mean:

3. Comment, Comment, Comment

Alright, I admit it, I’m a comment freak.  I go wild with comments all over the place, and I have descriptions of almost every line of code in my files.  I find that if I stick to one format for all of my comments, it makes the overall readability a whole lot better.

When I comment whole sections of code, using the comment as a sort of “header”, I put my header text inside a multi-line comment, and place this right before the beginning of the section of code that I’m describing.

When describing just a single line, I use a single-line comment, and tab it one or two tabs from the line I’m describing – like this:

4. Parenthesis and Brace Padding

To make my code more readable, I add spaces inside all of my parentheses and square braces as a kind of “padding” for them.  This can look strange at first, but if you get used to it, you’ll see how much more readable it can make things.

Conclusion

I hope that everyone who reads this post gets something out of it, and applies it to their own coding.  Now don’t misunderstand me – this is not the only way to format your code – there are so many different ways you can do this, and the important thing is that you find the style that you’re comfortable with and stick with it.

Until next time, happy coding!