Dealing with UTF-8 Character Encoding In PHP and MySQL
The other week, a colleague of mine sent an interesting article about UTF8 encoding through the web stack. The post talks about how you have to force each part of your web application and software into UTF8 as they fight to default to their own default encodings. Most of the time, we think that setting the charset of our tables to UTF8 in the database and then declaring the HTML document as a ecoded in UTF8 is enough, however you should also specify that data transferred between your application and the database is also encoded as UTF8.
Here’s a summary of the points to be aware of:
1. Code Editor Preferences – Make sure the code editor that you are using is opening and saving your code files in UTF8. A lot of editors default to native Windows or Mac encoding, which can cause characters to appear differently.
2. Create MySQL Tables set to charset=utf8 and to collate=utf8_unicode_ci – MySQL by default collates to Latin1 so you will have to define both the charset and collate when you create your tables.
3. Tell MySQL that .sql File is UTF8 – If you are using the SQL pane in something like PHPMyAdmin, you may not have to worry about this step, however if you are using MySQL’s command line or a different 3rd party MySQL client, you have to tell MySQL that the .sql file is encoded in UTF8. If you don’t tell MySQL the .sql file is UTF8, it will default back to Latin1 and corrupt your data. For a command line example, refer to rentzsch’s post.
4. Exporting Tables – If you’re transferring tables between two databases, make sure to set the default-character-set=utf8 when using mysqldump.
5. Specify the Database Connection in your Application – A lot of developers forget to include a line of code to tell their web application to connect to the database using the UTF8 encoding. In PHP, you can use the mysql_set_charset functions like:
$link = mysql_connect('localhost','username','password',TRUE);
mysql_set_charset('utf8',$link);6. Specify Encoding in HTTP Headers – Include some PHP code at the top of your application to specify the HTTP Headers:
header('Content-Type: text/html; charset=utf-8');7. Specify Encoding in HTML – Include a Meta tag in the <head></head> of your HTML documents that defines the encoding as UTF8:
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
8. Specify Encoding in HTML Forms – If your application is using forms that Insert or Update data in the database, you should also specify accept-charset=”UTF-8” in the form tag:
<form name="webform" method="post" action="formscript.php" accept-charset="UTF-8">
Dealing with character encodings can be a very tricky, especially if your web application uses different languages with different character sets (ie. Japanese), however if you ensure your encoding is set in each step, it can save you a lot of headaches down the road.
Thanks to rentzsch for their informative post on How To Use UTF-8 Throughout Your Web Stack.
Google+ Shows Promise but Where’s the Support for Businesses?
Google rolled out it’s social networking equivalent to Facebook, called Google+, this summer and the initial features look promising. Google+ organizes your Friends into Circles, or custom named groups that you can add your contacts to. Many Facebook users have become Friends with family members, work colleagues, old high school buddies, etc. and find it challenging to update their statuses with personal opinions or photos knowing that they might risk one of their co-workers seeing private messages. Google+’s Circles enables you to organize each of your contacts into a different category and choose which updates and content those people see.
Google+ has done a great job of implementing a system that is easy to use and navigate. Even though the system has nowhere near the number of features that Facebook has, it’s a great start and it seems that updating certain things is easier to find compared to having to dig through menus in Facebook.
Now What?
After experimenting with Google+, the common reaction has been “Now what?”.
The big piece of the puzzle missing from Google+ is the ability for users to setup Pages for their Businesses, Organizations, Bands, Political Groups, etc. and for users to be able to follow those pages that they are interested in. Businesses have been itching to include their brands on Google+ but Google has been slow to respond.
In early July, Google announced that business accounts would be coming soon but then followed up with a message several days later asking businesses to stop making new accounts. This past week, several of the most popular companies who were able to setup Google+ Pages were removed without warning, including Mashable and Sesame Street.
Google should have probably waited in rolling out Google+ until the capabilities to add businesses to the system was ready. We have become so accustom to services on the Internet being accessible immediately and on demand that we don’t have the patience to wait for, what seems like a basic system, to be implemented. Google should have recognized this.
Still, Google will have all of these tools for businesses shortly and will continue to integrate their services with Google+, such as Maps, Places, and Calendars. Most importantly, the features on Google+ will tie back into search results since, after all, Google is all about “Search”!
Font Differences In Browsers
This afternoon, I noticed that one of the fonts was very “bold” in Firefox compared to Chrome. I’ve known that there are differences in how each browser and platform renders fonts on webpages (amongst the many other differences) but I was surprised to see how different a font like Arial looked. Here are the results:
Firefox appears to make the text much bolder than the others even though the code was exactly the same and using the most common font, Arial.
It is important for designers and marketers to keep in mind that web design is different from traditional designs on a canvas and what you might see in a mockup done in Photoshop may be slightly different from what the website displays in different browsers. Several options have been developed to fix many of the display issues but many of these options are often bulky, add load times to your website, and can be detrimental to SEO.
However, as a web developer, it is still surprising to see such a difference in how something as simple as fonts are rendered from browser to browser.
Including Youtube In Your Online Marketing Strategies
Often overlooked by many small to medium sized businesses is the important role that Youtube can play in developing your online marketing strategies. Numbers recently released by Comscore show that Google sites (which includes Youtube) had over 143 unique viewers in the month of March 2011. Consumers are actively using video sites in the process of deciding weather to purchase certain products, services, plan trips, plan events, and much more.
The first thing you should do for your business to create a video presence is setup a Youtube channel. This enables you to group all of your videos together in one place and also provides an area where you can built your brand through Youtube by entering company profile information and customizing some basic design and colour settings.
Once you’ve done this, here are a few additional tips to keep in mind:
Number of Video Views
The element that determines the placement for the relevance of searches of your video is the number of views. This measurement is used over the number of links. What this means is distribution of your video is important in order to increase the number of views. Use outlets such as posting a video to your Facebook page, embedding a video into your website, or encouraging an industry related blog to post your video. By having your video appear on multiple websites with related content, this will inevitably help increase viewership.
Links in the Description
When you add a link to the description field of a Youtube video, it automatically becomes an active, clickable link (must include the http://). However, Youtube adds nofollow to all links in the description field, effectively making the link of no benefit to improving a your site’s search engine ranking. It is still a good strategy though to add links as it does encourage users to click through to your website, especially since the content of the video should be relevant to the content on your website.
Simple Ideas Are Effective
A lot of people think that creating a video for their company is a huge ordeal that involves getting the right lighting, having the right people interviewed, and including the highest quality images and music that enhance their products and services. This does not have to be the case.
As an example, if you are renting out cabins on a lake, how about including a “virtual tour” on your website where you film views of several rooms in the cabin by holding a video camera and slowly rotating around. Embedding a video like this on your website will surely leave a much larger impression about your cabin on potential customers than just a long text description.
Some other examples might be videos that help answer frequently asked questons, like how to start a BBQ, how to setup a tent, or how to change your password on your home security system. Simple videos like these can often be the most effective.
Statistics for your Videos
Youtube provides a whole bunch of statistics on your uploaded videos which they call Insight Statistics. You should monitor these statistics, looking at things like Demographics and Engagements that will help you better understand what your audience is looking for.
With these tips in mind, you will be able to grow your Youtube presence overtime which, in return, will provide a positive benefit for your online marketing strategies as a whole.
WordPress Admin Bar is Blank
When I upgraded to WordPress 3.1, I realized that there was a blank box along the top of my blog. I didn’t realize what this was until installing a new version of WordPress, I saw the Admin Bar and realized that the blank box was a blank Admin Bar. After searching for a solution, I found that I need to include the following function call above the </body> tag:
wp_footer();
Once this was in place, the admin bar appeared as normal.
The WordPress Admin Bar
5 Problems with MySpace
It has been reported today by comScore that MySpace has lost 10 million unique users in January and February alone! What must even be more disturbing to the folks at MySpace is that they have about 63 million users, down from almost 110 million users at this time last year.
I’ve played in bands for years and have used MySpace quite extensively to promote the bands I’ve been in. For a good part of the past decade, MySpace has been THE online site to promote your band. At times, we had thousands of friends, booked many of our gigs through the site’s messaging service, and even coordinated tours with promoters and other bands through the site. It became so important at one point to login the day after a gig and leave comments on other friends profiles, thanking them for coming out to shows, listening to your music, or just being there.
My MySpace Profile
So, what happened to MySpace? The obvious is that the masses are using Facebook and Twitter these days but MySpace should have been years ahead of these other sites. After all, MySpace has be around for many more years than their competition.
I’ve come up with the 5 Problems with MySpace:
1. Usability
For as long as I’ve been a MySpace user, finding what I need to do on the site has been a nightmare. Until recently, there was never a clear administration navigation and if you didn’t have the process memorized, doing something as simple as moderating a comment could take time.
2. Profile Design Randomness
As a developer, it was kinda cool that MySpace allowed you to customize your own profile using CSS codes. The problem was it was difficult for 95% of the world to use and ended up causing a mess of people’s profiles, in some cases so bad, they were unviewable. This inconsistency made it frustrating to look at other band’s profile pages because you had to search for their songs or their Add Friend Button.
A much better option would have been limiting users to update their profile designs through specific form fields that allowed for the changing of backgrounds, font colours, or even better, selecting from a few different themes that you could then customize these elements.
3. Technical Problems
One morning I woke up to find that my band’s profile had songs for sale from another band on it. Looking through the admin pages, there was no options for removing or changing these songs so I contacted MySpace. After dozens of emails back and forth over the next few months, it was finally removed.
This was only one of many issues that I experienced, including pages not loading, not displaying correctly in different browsers, songs not playing in the media player, etc. etc. etc. Even today, a profile loads terribly slow! All of these problems were more than enough reason to seek out other services.
4. Lack of Innovation
With the past few years having been spent fixing all the problems with MySpace and trying to improve the ease of use, it’s no wonder there haven’t been any major functionality additions. MySpace was way behind in offering developers an API to use to customize the function of the site. Even on the mobile side, they missed an opportunity while services like Facebook and Twitter have firmly entrenched themselves into the mobile market.
5. Failed to Expand Audience
All of my friends in bands were on MySpace but very few people I knew who were not musicians ever logged into MySpace. MySpace was a good way to promote the band but most people do not feel they need to promote themselves. People use social media largely to stay in touch, to see the status updates and photos of their friends, and to look up others. MySpace failed to capture this market and hence has largely stayed as a service used to promote yourself in some form.
Is all lost? Not necessarily. With 63 million users still using the site, it is significant enough to make an effort to stop the ship from sinking. But time is running and out fast and the next round of changes must be right to convince users to stay with MySpace.
Optimizing Your Website for Speed: SEO for CSS and Javascript Files
Back in April 2010, Google posted an article to their blog that discussed how speed matters in web search rankings. Programmers have generally been obsessed with load times and efficient code, however the online marketing world has pushed websites to use heavy graphic designs, animations, and programmers have had to create long CSS and Javascript files in order to meet this marketing design demands.
Besides ensuring that all your graphics are optimized and mark-up (HTML) is well structured and minimal, you can speed up the load time of your website by compressing CSS and Javascript files. Since these files are purely text, their compression ratios allow them to be reduced by over 90% in file size, thus speeding up the time it takes to load your website.
I found that FiftyFourEleven had the best tutorial called The Definitive Post on Gzipping Your CSS. Essentially, you use a combination of PHP and an htaccess file to compress your CSS or Javascript files before being downloaded to a site visitor’s browser.
Of course, SEO items such as having relevant keywords in your content, user-friendly URLs, well optimized Page Titles, etc. are much more important at this time, however this might be a good tip for sites looking to get a slight edge and a jump into improving their website’s speed.
