Jul
6th

Twitter Shorten – Your Guide to Squeezing Tweets

Squeezing Twitter

Squeezing Twitter

One-hundred forty characters.  That’s all you get, 140.  Well, maybe that’s all Twitter will give you, but we can definitely fit more than 140 in there.  The main trick is to use URL shortening services, but that’s rookie stuff.  There are ways to get a lot more into your Twitter posts than just shortening a URL.  Let’s discuss at least two other ways you can use to get more into your Twitter posts… but first, let’s cover the rookie stuff.

Before you can really get the most out of your SEO on Twitter, you have to at least understand URL shorteners.  These are friendly little web applications that allow you to take a really long URL and turn it into a very short one.  For example, I recently used a service called bit.ly to turn this “http://www.christianfinancialblog.com/2009/06/the-value-of-money/” into this “http://bit.ly/3t3qjB“.  Much shorter, right?  This allows you to fit very long URLs into your 140 characters of Twitter.  We’ll write an article on this soon, but for now you can check out a service like bit.ly and see how it works.

Now for the more interesting secrets. Continue reading Twitter Shorten – Your Guide to Squeezing Tweets »

Jul
1st

How to Send E-mail from a Web Form

I can’t tell you how many times I’ve been asked about how to do this.  It makes sense though.  Designers often have small clients that just want a simple web form, but don’t have a database to store the data in.  How do you get information from the website visitors to your client?  The simplest way is probably e-mail.

It’s been said that Dreamweaver has a way to do this, but no one has been able to tell me what that way is.  Frankly, I’m a developer so I don’t really care about what Dreamweaver has or doesn’t have, I just want it to work.  Turns out, there’s a really easy script that you can add to your site (or your client’s) that will allow visitors to fill out a form and then have that data e-mailed to the appropriate recipient.
Continue reading How to Send E-mail from a Web Form »

Jun
26th

Understanding Links – Posting Thumbnails and Text

Using a thumbnail image for attractive links

Use a thumbnail image for attractive links

It’s time for a beginner post. Mostly because my brother has been asking about how to post thumbnails, but also just because it seemed like other people probably had the same questions. There are a lot of things that can be done with links online. In this article, we’re just going to touch on the basics and we can fill in the gaps in a later post.
Links are just a way of referencing material online. In order to do that, you need 2 things: 1) The address of the material you are referencing. 2) The content which will send the user to that material. By content, we refer to either text or a graphic. When you click that text or graphic, you then go to the referring webpage.

So first, let’s look at a simple link:

<a href="http://www.internetstarting.com">Helpful Website</a>

This link starts with a tag, which opens <a.  We must end the tag with a greater than (>), but not until we specify the address to which we link.  That is specified in the href parameter of the a-tag (<a>).  In this case, our address is http://www.internetstarting.com.  Always be sure to enclose the address in quotes.  Then we end the a-tag (which is short for Anchor, BTW).    So far we’ve covered:

<a href="http://www.internetstarting.com">

Next, we have “Helpful Website”.  This is the content of our link, or the anchor text.  In our case it is just text, but we’ll add images later.  This anchor text is what is going to actually be displayed to our user.  Finally, the <a> tag we opened must be closed.  HTML tags are closed with a forward-slash in front of the tag.  Our closing anchor tag would then look like this: </a>.  Now, when shown online, our link will look like the following:
Helpful Website

Now, let’s go about adding an image in there.  To do that, we’ll need to use the image tag, which is simply, <img>.  Similar to the link, we need to supply a parameter to the image tag and that is the location of our image.  This is usually on our site, but it could be anywhere on the web.  In the image tag, that address will be put into the “src” attribute.  So, we’re going to have something that looks like this:

<img src="http://www.csh.rit.edu/~geisel/car/3kgt-md.jpg"

Again, notice that we have to put the parameter to “src” in quotation marks.  Finaly, we’ll close the image tag.  This is a little different than closing the anchor tag because we’re going to use some HTML shorthand.  Because the img doesn’t have any content (only the src attribute here), we can close it immediately.  So, we’re just going to add “/>” instead of our nomal “>” followed by “</img>”.  Our entire image tag now looks like this:

<img src="http://www.csh.rit.edu/~geisel/car/3kgt-md.jpg" />

Now, let’s make that a link.  All we’re going to do, is take our anchor text (which was Helpful Website) and replace it with our image tag.  Now we have:

<a href="http://www.internetstarting.com"> <img src="http://www.csh.rit.edu/~geisel/car/3kgt-md.jpg" /> </a>

or

<a href=”http://www.internetstarting.com”>

<img src=”http://www.csh.rit.edu/~geisel/car/3kgt-md.jpg” />

</a>

Now, we have an image used as the content for our link.  When you click the image, it will still take you to the homepage for InternetStarting.com.  One last thing before we show you the image and link.  It would be a little big to add to this post again, so let’s shrink our image.  We could use photo editing software to shrink the image, or for images that are reasonably small we can just cheat a bit.  We’re going to add two more parameters to the image tag.  They are “height” and “width” and you can probably imagine what they do.  Let’s make our new thumbnail image 80×47 (1/4 the size of the original).  The code would now look like this:

<a href="http://www.internetstarting.com"> <img src="http://www.csh.rit.edu/~geisel/car/3kgt-md.jpg" width="80" height="47" /> </a>

There, now you can see what the thumbnail will look like at 1/4 of its size.  This is not recommended for very large images however as it will slow down your site.  We’re actually using a big image and displaying it as a small image.  For example, if you were to take an image directly from your camera and “cheat” the image tag, it might take 15 or 30 seconds to load this tiny image on your site.  That’s not very efficient and why it would then be better to use some photo editing software to actually save the picture in a smaller format and just use that instead.

One last thing on links for the beginner.  Sometimes you will see a very, very long link.  These especially show up at affiliate sites like Amazon.com.  In fact, you might even see a full web address inside the web address which is in the href.  Don’t let this confuse you!  We’re only concerned with what’s between the quotation marks.  So, <a href=”someReallyReallyLongStringIsOK”> — even if it’s several lines long.  Just look for the closing quotation mark and you will be fine.

For anyone still having trouble with links or who has other questions, use the comment link below.  Let us know what trouble you’re having with links and we’ll see if I, or someone in the community here, can help you out.