That Final Touch: The Favicon

After writing my last blog entry here, I looked at the image I uploaded.  After doing a little extra work, by the time I actually had a good screen capture shot cropped and saved, the Chrome tabs didn’t even display any letters.

Chrome is only showing the favicon (the website’s favorites icon), in the tab for each open page. The browser tab for each page shrinks as we more web pages available, and there is no room for an actual title.  FireFox (the second browser app which is overlaid underneath Chrome’s tabs) also showcases the favicon, even though it displays a word or two of the title. So, your favicon is the final means of leveraging your brand and identity with a tiny rendition of your logo or some other iconic image.

Take a gander at how the favicon for each site listed in Chrome (and FireFox) is still listed. In Chrome, it will be the very last thing displayed as you increase tabs, until the tabs are so small that even the favicon won’t display.

But, when we get to that point, all those open tabs will become a giant resource hog. Yet, any modern computer with a decent amount of memory is capable of doing this, and we usually take advantage of this capability.  The point I am trying to make here is that the favicon is that one lasting image distinguishing your brand from all the others.

Even though FireFox protects the tab size at some minimal size by introducing a means to scroll through the different tabs, the title of the page is reduced to a word or two and the favicon, if available, remains your website or blog’s brand showcase.

So, if you don’t already have a favicon on your website, I have a great tool for you! 😉 You can easily create one by using my online faviconvert utility!

For your absolute best results, I recommend coming up with your best 32 pixel by 32 pixel reduced size image using a quality program such as Photoshop (use the “Bicubic Sharper (best for reduction)” option to resample the image in the Image Size dialog window).  Then, reduce that again to 16 by 16 for the final favicon image.

Favicon will resize your image for you if you don’t have Photoshop.  But its hard to beat the impressive power of such a professional image manipulation software application if you have it available, even if you only have the consumer version (it will use the same reduction resampling engine).

The faviconvert.com utility doesn’t actually convert your image into an icon, but it uses your image (gif, jpg, png or a 24 bit transparent png file format) to convert the data into a favicon and provide it in a few formats that you can download together in a zip archive.

Faviconvert.com

Web Page Titles/Names

If you are using one of the latest browsers on your PC, or browse the web on a mobile device, it is very likely that you don’t even see the name of the page your current browser window is displaying.

Why?

Web page titles and even their filenames are important assists in helping your site’s web pages search. By providing a unique title and name that reflects the content found on that particular document, you are providing more meta data to the search engines. If your title/name meta data are accurate for each page, this optimizes search. And we optimize the ability for searching the page, we optimize search for the entire website.

I would think that by optimizing search, the search engines might even be more likely to rank your site’s page higher in the search results. This is the general idea behind Search Engine Optimization (SEO), providing optimized data to enhance your listing’s rankings in the search engine results (often referred to as SERP for your ‘Search Engine Ranking Position’ or ‘Search Engine Results Positioning’).

Yet as I surf the web, it seems to me that more and more I am running across pages that are completely untitled, or all the pages in a website share the company name, or are simply titled and named inappropriately (home, page 1, page 2, page 3…). I have even seen many that are labelled “Untitled”, which seems to be the default name that WYSIWYG web page editors use.

But if you look at how we use the web nowadays, it doesn’t seem unrealistic that this is so unimportant to so many. People in the know understand fully how important these names and titles can be when it comes to optimizing search, because these particular fields, even the filename, are concise representations of what might be found on that page, and therefore, words that appear there, as well as are repeated elsewhere throughout the description, headings, content and image descriptions (maybe even in the image file names), are given more importance in search.

Because the title and name of a page usually use concise wording, even most of the very basic search algorithms place even more importance on the few words found here. And when there are fewer words used, their importance is greater for each word there, because importance is less spread-out when they are concise, as opposed to a certain importance spread between more of them.

That, by the way, is how some SEO professionals think, and I completely disagree, that using more key search words is good.  It is much better to be concise and concentrate on the keywords and terms that are your focus.  These can be underlined with synonyms and such in the content, but to stuff keywords in a title or filename, even in a description or keywords list (within meta tags) is just not a good idea.  But that is a different subject, overusing names and titles.  I just want to encourage their practical use, and even all of the major search engines like to see this, too.  It’s called paying attention to the details.

Of course, any modern advanced search technology uses much more refined algorithms, but it always starts right there, with each page’s own name and title. Why do so many overlook them and their importance to search?

My answer is that the new modern web browsers are making it less important.

When I am browsing the web on my PC these days, I am in productivity/creativity mode, and I usually only have a single web browser window open. But that one browser window is full of tabs showing all sorts of different webpages for all the different online projects I am working on.

Often, I have a tab open for the font creation tool I am currently utilizing. Another for each of my different hosting accounts I manage. Another for my WordPress blog, one tab for Blogger and yet another for Tumblr. I usually always have my Twitter and Facebook accounts readily available, as well.

On top of that I will have the websites open that I am working on, and the next ones I want to touch-up, as well. Because we can do that with modern browsers on a fairly recent machine that has some processing power and enough memory.

So, what do I see as the title of each page in these tabbed windows? Well, since the current open tab is not enhanced above the individual tabs (as it should be) in Chrome or FireFox, I see:

[In] [In] [W] [S-] [Pr] [H] [H] [Sh] [D] [g] [W] [Bl] [T]…

Reduced size screen snapshot of my browser tabs. Chrome shows a letter, maybe 2. FireFox shows a word, maybe 2 short ones. But both are ignoring the current active title, as well as all the others.

It is the modern web browser that is masking how important those Titles are!

If the title of the page isn’t even displayed in the current active browser window, this is a huge burden in educating users the importance of the proper use of the HTML title tag. Especially when Google is declaring that what is the most important thing to it is that their search results are reflecting what the visitor actually sees and is presented with upon arrival to that document.

Isn’t Google itself devaluating these titles in Chrome?

Interestingly enough, your PC or Mac web browser’s address bar is still there by default and yet most users and even many webmasters are ignoring its importance. Site administrators, owners and webmasters ignore it with non-related domain name choices and even more poorly thought-out directory organization and file naming conventions.

However, the issue does not stop there. Because screen space is so important on smart phones and handheld devices, the page title doesn’t appear unless we are switching between different page views. In fact, the web browser’s address bar disappears as soon as we scroll down the page a little. That said, as soon as we start scrolling up, it will reappear, reaffirming its importance to navigation. But I honestly don’t think that anyone understands that importance, because I find myself frustrated not having a gadget that represents the browser bar there for me to tap and access.

My differences in UI (user interface) design vary greatly from the mobile plaftform, though. I believe in visual clues that allow navigation. Unfortunately, the mobile UI is very unfriendly in this respect. So although you do have elderly people adopting smart phones, I find them even more frustrated with the expected UI experience because they are expecting a GUI and not the touch motion technology that mobile users have to learn.

Nevertheless, despite the challenges of humans interacting with mobile device interfaces, it remains clear that Google’s Chrome and Mozilla’s FireFox are abandoning the display of the all important web page title unless you actually look for it. So now is it becoming just meta data?

I have to ask myself why, and I really do think that they too, are sick of seeing unused or inappropriate HTML document titles. Since the webmastering public at large doesn’t use the title tags correctly, why should they even display them, I suppose?

But doesn’t this start down a new slippery slope where we don’t even worry about our page titles because they are so out-of-sight and therefore out-of-mind?

Or are they actually going to give SEO professionals a reason to stick around because as always, all they have ever done is tackle the obvious that a newbie webmaster or newbie web designer without a clue would miss?

Nevertheless, despite their somewhat inappropriate disappearing act from the full view of the global world wide web community, web page titles and names do have a proven impact on assisting search. So it is then obvious that these things really do require your attention when designing a website, setting up a new page, posting a new blog entry, etc…

Just remember that each name and title reinforces the key search words/terms, advertising copy and even the brands themselves that are represented on these pages and it all makes common sense, doesn’t it?

In example…   If you are creating a page about the different kinds of rodent traps, you might want to name your web page HTML file as “rodent-traps.html” and title it “Rodent Traps for the Home”.  Then, on that page you would discuss the different kind of traps available for different kinds of rodents.  Use head tags to identify different kinds of content.  Then, you will link to pages about particular traps or brands… so maybe you have another page discussing Rat Traps at “rat-traps.html” and it may discuss the differences between poison traps, concussion traps and sticky traps, then each of those may point to reviews on particular brands of traps at other pages showcasing those brands or products.

I can go into more detail, but to me this is all common sense.  Of course, I am a well educated web designer, as well as an artist.  I’m supposed to understand this stuff.  But not all webmasters do, and so that’s why I want to reintroduce some of these common sense practices to the world, because when a page title or name disappears, we think about these little beginning design touches a lot less, and yet they are very important to the grand scheme of search.

I don’t preach Search Engine Optimization (SEO), I preach search optimization (which has a better effect on SERP because you eliminate the worry).

Progress for the sake of Progress?

WordPress is certainly changing…  and just like with Blogger I am not happy with the changes.  

It isn’t a big deal, I can still find myself around the interface and all, but it’s all very unfamiliar and unfriendly to me.  I liked things as they were and moving the OS all around and putting the same options in different places just is not even intuitive.

Don’t get me wrong, as a designer I recognize that we should push the boundries of design.  But when you have spent some time away from the blog and return and everything is different and you have to look around and think when everything was second hand, and you posted freely before, you get a little put-off by all this user interface magic.

There is nothing new here, it is all just changed around.  WTF?  How is that beneficial?

Then, because I am so miffed and disturbed by all these changes on what was a friendly place to go post on my blog…. I left for a while, again.  But wanting to revisit and update My blog I return and everything is different in the blog dashboard/control-panel YET AGAIN?  It hadn’t really been all that long?  

I’m starting to get dizzy with these non-improvements.  The new blog entry editor pops ABOVE the blog?  Ad you only have a tiny window in the editor, with no chance to update the text field window gadget?  That seems a bit backward to me.  Everyone uses text fields that you can drag around and make larger, now.  And if you “pop-out” the editor window, it is still the same size.  You can make the window itself larger, but the text field size won’t budge!?  WTF?

C’MON MAN!

This is a joke.  Stop trying to be pretty, WordPress, I want functionality.  I just so happen to hate tiny little text field windows unless I can drag them farther open.  But look, this is not a step forward, it is a step back.  

Why do I even bother?

Why FF4 is so Slow

After Twittering that FireFox 4 was incredibly slow I was met with disbelief on Twitter and elsewhere that I mentioned it.  I was told how fast FF4 is, now.

I seriously do not like FireFox because it was so pathetically slow and because it ignores good user interface experience strategies.  I was actually baffled how anyone would think that the thing was any faster, as it was so slow that it nearly crashed my Asus EeePC netbook.

Well, I finally fired-up that little Windows 7 netbook again yesterday and discovered what the problem is.  FF4 is allowing multiple and simultaneous video streams to run all at once.  What?  C’MON MAN!  Who the hell designs anything with multiple active video streams on the same page?

To further complicate this issue, FireFox 4 is allowing these simultaneous video streams to run even though the page it is loading isn’t active.  Huh?  C’MON MAN!  That is uncalled for.

Why would anyone want to load multiple pages at the same time, you may ask?  Why not?  If you are loading a page from an African web host (which have notoriously slow connections), you may load another website in another tab while you are waiting for the African website to load over seemingly slow dial-up speeds.

This isn’t even close to being every case.  I am a webmaster, a hostmaster and a web designer.  As a part of my daily duties I like to insure that my sites, as well as my client’s sites, are loading as expected each day.  So my “Home” page button is a collection of all the sites I have to check.  I need to ensure that the various hosting solutions I am offering are performing well, that my websites are loading quickly and correctly, that my sites have not been hacked, that the system is working correctly for myself & my clientel.

As it happens, a variety of those websites each have video on them, and as a part of the marketing it loads and plays by default.  Anyone may pause the play.  And until FF4, only one of these sites were streaming video when the web page they reside on wasn’t active (in focus).

But FireFox 4 has changed all that.  And because FF4 is loading all these different video streams in the background, the browser slows to a crawl.  As I press buttons, maybe something will happen, eventually.  The user interface is nearly useless.  The multiple videos that are playing are completely broken-up as the system races to deliver all the data, including those out-of-focus video streams on tabs that aren’t even viewable.  And it runs every single video stream as if they all needed to be run at the same time.

C’MON MAN!

As designers we can do much better jobs of designing apps that work.  The user is robbed of any ability to navigate.  The video stream is corrupted, the user experience is destroyed through excessive stupidity in implementation.

C’MON MOZILLA!  Get your head out of its ass.

FireFox 4 First Impression: It Sucks

I downloaded the new version 4 of FireFox and installed it on my 1 GHz Asus Eee PC Netbook.  I have to tell you that I am extremely alarmed by what I see.  The very first thing that caught my eye was that although FireFox was describing this version as faster, it was noticeably slower on my lil’ netbook.  That does NOT bode well for me.  On top of this, I just plain hate deceitful advertising.  My web pages were loading at least 1/2 speed.

What struck me next was the new interface.  Why is it that developer’s ignore design?  Why is it that when guy does one thing another guy has to follow suit? Since when does Mozilla jump into a “Monkey see, monkey do.” attitude.  This is pure idiocy!

When Microsoft’s IE8 came out and misplaced the refresh/reload page button to the right side of the browser address bar, it was Internet Explorer’s death knell.  This was such a huge user interface navigation mistake that it helped usher in a new age where FireFox became the predominant browser of choice because so many people were absolutely frustrated with the IE8 interface that moved everything around where no one was used to them.

Guess what?  Mozilla does not want FireFox 4 to be a familar tool that works well, anymore.  They have decided to follow suit and copy IE8’s pathetic user interface by hiding all the most often used controls in plain sight.  Once again, the page reload button is relocated to the right of the browser’s URL address bar.  This gives me great pause, to realize that corporations are so secure in their knowledge of what is best for us in terms of the human interface experience.  So I wonder whether it will be Google Chrome or Opera that we migrate to?

Safari has already made the jump to a right side refresh/reload button, so I don’t think that they will ever be a factor in the browser wars until the iPhone becomes a significant web browsing platform.  And it just may, they already dominate the smartphone market.  Furthermore, I think that the impact of small device web browsing has not yet been felt.  Mobile device web browsing is, afterall, not yet in the hands of everyone.  Nor is anyone making it affordable for everyone, yet.  But once someone realizes its potential, we will all be jumping on it because it is so convenient, in order to accommodate our growing digital lifestyle.

Why is placing the refresh/reload button on the other side of the address bar such a navigation nightmare?  This practice is breaking simple user interface friendliness guidelines.   The issue is not that the button has been moved to the other side of the browser bar, the issue is that the user interface has not been moved to the other side of the browser bar with it.  The forward, back and reload buttons offer the most used rudimentary control over surfing.  To separate any of these navigation devices simply decreases their convenience.  To not understand this one aspect of the user’s navigation interface experience is quite simply shamefully stupid.

There will be those who will take issue with the last three lines in that last paragraph.  Their argument will be that all a user has to do is type a return in the browser bar.  But what they fail to realize is that not everyone is like them.  Not everyone thinks or does everything the same way and the complete failure to either understand or provide for these alternate minded people is complete insanity.

Let’s face it, we have been doing things certain ways for years.  People are accustomed to them.  They are used to clicking buttons, they are used to finding all their navigation in the same area.  It makes no matter that “Instead you can…” that is not an argument, that is an excuse.  Navigation, whether on a web page interface, or in a software interface, should never be separated.  Especially when it all performs a simple derivative of the same function (GOTO: back a page, same page or next page).

Developers are thinking logically while creative types are thinking creatively.  For an anal mind to dictate how a user interface is setup without consulting a creative mind shows true lack of vision for the big picture.  Straight out of the box, FireFox 4 not only fails to impress, it offends me.  Don’t get me wrong, I am only speaking for me.  But it does.  It fails to take into consideration any alternate view of navigation or user friendliness.  It separates the navigation buttons and discombobulates the system, completely.  I, as a designer of friendly interactive web page navigation systems myself, consider this UI a sinful, evil thing.  It amazes me that they would ever allow this interface to ship as it is.

OK, there it is, my first impression after downloading, installing and running the new version 4 of Mozilla’s FireFox.  It just plain sucks.  It looks like crap and it scares me because it makes assumptions on what I need and takes liberties with a user interface that worked.  In my view, it is less useful and extremely unfriendly as a user interface.  My web pages all load slower now, and that also ticks me off. I am not impressed.

That’s my first impression.  FireFox 4 sucks.  I hate it.  But that is only after my first impression.  Mozilla says that it is completely customizable.  That will be my next post, can we fix this piece of crap?  All it really needs is a few tweaks.  Or is it completely broken?

Can PSD files be Viewable Thumbnails in Windows Explorer?

I am having a heck of a time locating graphics and organizing images.  I tend to take too many photos because my family almost will never pose for a shot.  Plus, it’s always better to see them with a real actual smile as I catch them laugh at someone else’s joke.  But timing these moments is difficult, everything has to be right and no one can be flinging their head back or rolling on the floor (which my son does for affect).

I also love to take photos of nature and although I do make the attempt, wildlife doesn’t like to cooperate much.  I have never had a pheasant stop for a pose, those birds are actually quite stealthy.  And when the deer do stop out of curiosity, they have already made cover.  Mother nature just doesn’t like to cooperate.

To make matters worse, I am a graphic/web designer by trade.  I design all sorts of web logos for my domains, websites logos and advertisements for others, and I almost exclusively work in the Photoshop Document (*.psd) or Adobe Illustrator (*.ai) file formats until I am ready to publish something.  The  trouble with this is that once saved, I never see a thumbnail when I am browsing the file structure in Windows Explorer.  Instead, I see a worthless advertisement of the logo for whatever the default program is that I use to load for the image even if I am trying to view the thumbnails.

I can see the *.psd thumbnails in Photoshop when I am looking for them, but then I am trying to open them up or save them.  Plus, this is an extremely limited browser.  Adobe does offer Bridge with my Master Creative Suite, but Bridge suffers from the same drawbacks as Photoshop, it has a high memory requirement and it is an extremely poor replacement for the OS’s file/directory structure explorer (AKA: “Explorer” or “Windows Explorer”).

Bridge is a good gallery program, but when I am trying to find something somewhere on my hard drive and I need a visual cue, it sucks because it is so proprietary, lacks decent search features, drains the memory from other programs, and since I use a lot of other programs (except when in Photoshop), this thereby makes my system unstable.

In order to accomplish what I need to do, I need to be able to see .psd files in the OS while I am searching through my archives normally, anyway.

Shortly after I got this computer (which is a 64-bit Vista based machine), I installed the Photoshop CS3 Master collection and I thought for a little while that I could actually see my PSD files.  I was so happy.  Since then, I have installed all sorts of other graphics tools, utilities and picture viewers.  I kind of have to, Adobe no longer supports every new format in the world, especially since my Photoshop is a couple versions old, now.  And not everything new asks for permission before taking over the default file loading stations upon installation.

Installers and updaters are also notorious for leaving icons on my desktop, which is another pet peeve of mine.  But even if I haven’t given explicit instructions to any program not to install shortcuts or not to change my file extension default loading applications because it hasn’t asked, it should always default to “No” unless it asks.  They don’t.  And these companies will continue to piss me off (Microsoft, Apple, Google, Broadcom, DivX) by littering my desktop with crap without permission on every single update.  So, since the big guys don’t follow the common sense rules of file installation and updating, all these little guys think that they have to get their brand out there are well, and the way they do it is by not asking for permission to change your default application settings, and doing it anyway.

Why aren’t Adobe format files showing a preview thumbnail when I am saving a preview thumbnail with each and every save?  I can’t say that they are making everyone buy another product just to see PSD and AI thumbnails since I am actually sure that I used to see such thumbnails.  But how to I get things back to that state?

It is just plain impossible to reorganize my photos and images without being able to view them because when I need to do it is when I come across them and see they are out of place through my normal day as I am using the OS.  When I try to do it on purpose, I am systematically going through folders and never run into anything out of place.

Let’s face it, if Adobe is offering anything less than what Microsoft is designed to be (to say, sell another product), they would actually be corrupting the OS.  Even though everyone else does it, Adobe usually takes the high road in this case.  So, I don’t think they are the culprit.

Argh.

How do I take my OS back?

Adding Your Favorite Links to Your Windows Explorer Menu

I am sure someone else has figured this out long ago and its probably common knowledge among geeks, but I am happy to report that I finally figured out how to customize Windows Explorer with your favorite shortcuts (in Windows Vista or 7).

While I was tooling around the directory structure, trying to figure out where I had last saved some graphics that are still hidden away from my view.  I stopped in my user’s folder that is often refused to as “Libraries” and I noticed that there was a “Favorites” folder and a “Links” folder.  I thought, why would there be two?  I knew the “Favorites” folder is where my internet shortcuts are saved, but why was there a “Links” folder, which is exactly what I would’ve called it in the first place.  So on a hunch, I placed a couple extra shortcuts in the “Links” folder I had just discovered and walla, they showed-up in Windows Explorer (the file explorer, not internet explorer).

I’m so proud of myself.  😉  It really helps out, having all your most often traveled destinations in there ready-to-click and send you exactly where you want to go, under the “Favorite Links” column.

So now anyone can add their favorite directory destinations in the “Links” folder (found within the “Users” folder bearing your user log-in name on the computer) as shortcuts, and then your shortcuts will appear in the “Favorite Links” column of Explorer anytime you open the “Computer”, “Documents” or any other directory.

Cool.