Archive for the ‘website design’ Category

Some time back, we decided we needed to update our company website and were smart enough to realize we needed to bring in someone who does it for a living, not just try to get by with doing it ourselves, or having it done by someone who does it on the side in their spare time.
After getting quotes for the design of the new website from a number of local design firms, and then settling on who was going to be working with us in this endeavor, we got into the long process of a new from-the-ground-up website, and let me tell you, its taken longer, and required more effort than I realized it would, but it’s finally getting close to launch.
Here’s a sneak peek of the old… vs the new… I think you should be able to tell which is which…
ie-old-websiteie-new-website

We’re hoping to get it officially launched and go live with it next week, which is probably a good thing since the more I look at it, the more I want to tweak and add things… sometimes you just have to say “its done, quit effing with it” and move on.

Besides, it’s not like I’m short on other things I need to be working on.  No rest for the wicked as they say… and I’m getting the feeling I was very wicked in many past lives and it’s all catching up now.

barkerp

Advertisements

movingblog-01I have mentioned before about moving my blog from a self-hosted one to this WordPress one, and I thought it had gone surprisingly smoothly, except for the loss of all my old followers which is slowly growing back, and also something else I didn’t notice until my old blog was officially taken down, was the links to certain images within blog posts. They are broken. Argh.

I’m reminded of a quote by Robert Bateman “Creation is long and difficult, destruction is quick.”

Yep, couldn’t have said it better myself. It was tough to see years of work destroyed, or at least all screwed up.  What was happening, as i found out, was that for some reason certain images did not get exported from the old site and imported into the new site.  Instead they were just pointed to the old website.  I hadn’t noticed because everything seemed fine while the old blog was still up and running.  I had used the WordPress export plugin, a number of times actually since the blog was basically a backup of my other one.  I would export the entries about once a month or so to keep this one updated.  I mention this because as it will become evident later, tracking down the issues turn out to be different depending upon the entry.

movingblog-02After signing into the dashboard of my new blog and checking the Visual preview of my published posts in edit mode, I could see the images were missing and i was getting that cute little question mark indicating a broken link.  Flipping over to “text” helped me identify the reason pretty quickly.  This is when I figured out my images where pointing to the now defunct website.

the highlighted words points out the problems.

the highlighted words points out the problems.

First off was the link to the image.  Even though the “href” (or hypertext reference) was correct, the “src” (or source), was pointing to the old website to grab the image from.  I wasn’t quite sure what the actual location should be so I just browsed to an image that was working and copy clipped its location from the inspector into the text editing screen.  It didn’t matter what image or where I dropped it, since it was just so I could see what it was supposed to be.  In the end, mostly it meant copy clipping “barkerp.wordpress.com/” and pasting it where “thatcomputerguy.ca/wp-content/uploads” was.  The dates afterward seemed to be the same for the most part, except for a couple of instances.  For some reason a number of images had been imported with a different month number.  Not sure why.

the address of the image

the address of the image

I wondered about using a search and replace editor to substitute the one for the other everywhere, but realized after doing a few that wasn’t the only problem and hand editing each blog seemed to be the only solution. Some images still were not loading.

When I had inserted the image into the original blog post, sometimes I would insert them at one specific size, and then later edit it manually to shrink it down a bit.  For instance, if an image had a suffix of -200×300 and then I manually edited the size, to say 160×240, those are the files it would have trouble with. For some reason, certain images stored the size with the image name as a suffix to it, as seen in the highlighted text in the image above. After the name “…netflix-001” was the suffix “-300×159”  This wasn’t part of the actual image name that was being pointed to in the link for it.  So by deleting that portion of the name, the image would then appear on the blog post as it should. You shouldn’t add an image and give it a size and then change the size manually it seems. Lesson learned.

yeah, thats not how it should look

yeah, that’s not how it should look

Another problem I found seemed to be the way the different image sizes were being handled.  Most of my images were medium or large or thumbnail, for example “…img class=”size-large wp-image-5088″ title=”dlna-mac-04“.  But when I checked the images that were displaying like the above with the image extending thru the text and not wrapping properly around it, I noticed the image was labeled as “full” and not large or medium as most were.

the culprit.  size=full

the culprit: “size-full”

By changing the word “full” to “large” the problem was fixed.  I’m not sure if one of the versions of WordPress I had used over the years had allowed “full” as a size but no longer did, or if it was a throwback to one of the other numerous blogging programs I’d used, but for some reason this version of WordPress didn’t like it.  Again, a simple fix, just had to look at the difference between images that were working and those that weren’t to find the commonality between them.  Another lesson learned.

300 posts (6-1/2 years worth of ramblings), about 8 hours of hand editing and I’m back to where I was prior to the move.  Well, plus one blog post that is.  This one explaining all the trials and tribulations of the move.  If one person reads this post and it stops them from tearing out their hair then its all worth it.

At least that’s what I’m telling myself.

barkerp (the blogger formerly known at tcg)

I was updating my blog and noticed that the comments on a particular post that was fairly current were closed. So I checked a few other posts and these were also closed. This confused me since I don’t close the comments on posts automatically. I know some people set time restrictions on older posts, but I never bother to do that so the note at the bottom saying “comments are closed” baffled me.

caption

First thing I checked was the automatic settings in the comments area of my WordPress Dashboard. I checked in the WP area and the Disqus settings.

First and foremost were the “Discussion Settings” in WP.  Nope, nothing out of whack there. Sometimes updates can cause problems like this and I didn’t remember updating Disqus recently but that doesn’t mean the problem hadn’t been there for a while unnoticed.  As expected, nothing different in there either.

I got thinking about plugins.  They can cause all kinds of conflicts with each other and I had run into this kind of thing before with outdated ones.  The first step is always to ensure they are all updated, which they were.  The next step is to figure out which is causing the conflict, unfortunately the only way to determine which is the trouble-maker is to disable all your plugins and re-activate them one by one until you find the error again.  Being fairly confident of a few of them I disabled most, not all, and sure enough the comment problem disappeared.

caption

Nice thing about WP plugins is the fact there is a “Recently Active” list for plugins as well as the Active and Inactive lists, especially if you are like me and have plugins that are installed but inactive that you are not currently using but may want to turn back on later as opposed to the ones you just turned off.  So I began turning the recently active ones back on a couple at a time for those I was fairly confident were not causing the issue which left me only a couple of potential candidates.  Sure enough it was a recently updated plugin, which meant thankfully I had only not noticed the error for a couple of days.  As it turned out, it was the “Social Plugin for WordPress” plugin that was causing the error.

The trouble is figuring out what in it is causing the conflict with which other plugin.  Since it was the commenting system getting screwed up, Its pretty safe to bet its a conflict with Disqus, but i’m not about to deactivate Disqus so I guess the Social Plugin will stay inactive until it’s next update.  Sometimes you just have to wait for the developers to tweak it again to get it playing nice with the other kids in the plugin yard.

tcg

I recently switched over to DISQUS for my blog commenting, and the first thing that jumped out at me is I seem to be posting/commenting under the wrong name.

I don’t use my given name for much, too many people share my name for one, and its just something I’ve done since I started venturing in this internet thing, as such it bothered me to keep seeing my real name being used instead of my web persona.

If you are not sure what Disqus is, jump over to http://disqus.com/ and check it out.  In a nutshell it is a replacement for your default commenting system that is much more powerful and with better social integration than what most blogging platforms provide out of the box.

never been so happy & confused at the same time

Getting back to my issue, In checking the Disqus help forums I can find the way it is supposed to work, but instead of being able to change my Full Name I get denied with the following message… “You do not have enough clout to change your display name.” Aside from the cuteness of the error message, I was a little confused.  Not one to give up, I searched and searched thru the settings trying to figure out what was stopping me from changing it.  I scoured the forums, help, and even googled the issue.  Nada. Nothing.  I then had a thought, what if I try changing to a different name than the one I actually wanted to use.

So I tried TCG since its the name I write under on my blog and low and behold it allowed me to change it.  Ah-ha, it seemed it didn’t like to have my username and display name the same.  Or so I thought.  I decided to test the theory and tried to change my name again.  Son of a b*****, it let me change it to the name I was previously trying unsuccessfully to change to, “thatcomputerguy”.  Argh.  The old adage of “the definition of insanity is doing the same thing over and over again and expecting a different outcome” was apparently wrong, or at least in this case.

that's better

Importing your old comments from a WordPress blog was dead easy, a couple clicks and you were done.  It seemed to be slow working the other way at first, a slight lag from the time Disqus moderated comments were reviewed to when they eventually showed up in my blog comment dashboard or on the website.  Speaking of which, the moderation of potential comments is relatively easy, not that it wasn’t easy with the out of the box WordPress commenting system though.  The Disqus way is roughly the same.

You get notification of comments depending how you set up the moderation features.  I prefer to see all comments before letting them go live, just because, well, its my blog and I don’t want flamers or spam getting through, so I have email notifications sent to me which can be moderated via email (replying with “Approve” or “Spam“, or typing a reply will also approve the comment and post the reply at the same time) or by logging in and moderating on the WP plugin in my blog’s dashboard.

all the settings you could want... almost

As you can see you can make it as loose or as tight as you’d like.  Even denying links or images but allowing comments if you like.  Now if I can just get it to remember me so I don’t have to log in to Disqus in my WordPress Dashboard every time I want to review comments.

I’m sure that is some sort of security thing on their end, but if i’m already logging into my blog’s WP dashboard with a password, I shouldn’t have to log into the commenting system inside it with a password too.

It needs a toggle of some kind to allow your login to work for both your blog and Disqus at the same time, after all it is a plugin.  That way you can turn off the feature if you like having to type passwords.

I for one, would rather not.

Disqus is free for personal blogs and aside from the comment moderation, also handles your spam if you enable Akismet protection.  You’ll need an Akismet API key, which are also free for personal blogs.  I did it and my spam dropped from the normal 50 to 100 a day down to one or two every few days.  One less thing for me to worry about, which is always a welcome change.

One other little glitch was the conflict with another plug-in I was using: YARPP. (Yet Another Related Posts Plugin).  For some reason right after installing Disqus I started to see the error log in my website growing at a ridiculous rate.  I may not have noticed it had it not been for the fact I backed-up the site before switching to Disqus and then in doing a compare and sync backup after it was set up, noticed the 280 meg error_log file that was only a couple of Kb before switching.  Disabling the plugin stopped that in a hurry.  I deleted the large error file, created a new empty one and it hasn’t grown at all since.

So all in all after a little speed-bump at the beginning, the initial verdict is its a good change, lets hope the new-car smell doesn’t wear off and leave me with a clunker.

tcg

This has to be the coolest collection of sign clip art/symbols i’ve come across in a long time, so much so it inspired me to test the old adage, and I do believe it is true, a picture is worth a thousand words, as long as it is clear that is.

First, check out these symbols.  They are well done, simplistic and FREE.  http://thenounproject.com/

Now let me explain what I am referring to about them being clear.  Clarity in design is one thing that is always very important.  Making sure the message is not distorted or hidden, but also on top of that is the clarity of the image from a visual standpoint.  That is where these images really shine.  The format is “.svg” which stands for Scalable Vector Graphic.  What that means is regardless of the size of the image the edges remain clear and crisp, and all without making the file ridiculously large and this clarity and sharpness can be seen on the screen or when printed.

SVG has been around for a while, late 1990’s actually is when development started, and is an open standard viewable by most web browsers, but really hasn’t seen much use until more recently mostly because of Microsoft’s Internet Explorer’s limitations.  It doesn’t support SVG files without a plug-in, and only depending upon the version of IE you are using.  This is also strange since Microsoft’s own “Visio” has had the ability to “saveas SVG” since 2003.

Now that Google is indexing SVG files and is displaying SVG content in its image search that may be the push needed to make it a more comm0n file format much like the widely used JPG or BMP are currently.

jpg zoomed in.

svg zoomed in

So why use a new file format?  SVG files are smaller and more compressible, scalable and can be printed or viewed with high quality at almost any resolution.  Zooming in on them provides crisp clean lines and edges, unlike the current standard formats JPEG/JPG and GIF.  Also, text inside SVG files is searchable.  Basically all the stuff you can do with Flash but without being proprietary.

When you view the two side by side, it is pretty much a no brainer as to which is better.  Now we just need to wait for M$ to catch up with the rest of the browser world and quit dragging their heels.  Better & smaller is good for everyone when it comes to file sizes nowadays, especially with the way things are going in Canada right now with respect to Usage-Based-Billing, but that is a rant for another day.  Besides, who knows, maybe our government will grow a pair and stand up to Bell and let the CRTC actually do what they were set up to do:  Serve the interests of the people and not the monopoly.

Regardless, smaller file sizes always means they load faster, which is never a bad thing even if you don’t have limitations on your data usage.

tcg