Half-Elf on Tech

Thoughts From a Professional Lesbian

Tag: browser

  • Every Site should have a Favicon

    wikipedia-favicon Imagine summing up everything a website is about in a 16x16px square. That’s the goal of a favicon (short for favorites icon). Pretty much every site out there has one, and it’s a devil of a task to make one that looks appropriate, identifiable and understandable in such a small space. As much time as I spend tweaking a design I spend on a favicon because they are that important for the look and feel of a site. A site without one is nearly naked.

    Back in the days of IE 4 (yeah, 4, so 1997), Microsoft hit upon a great idea. If you made a teeny picture and saved the file as favicon.ico in your html root, their browser would pick it up and be the icon on your bookmarks menu. It didn’t take long for people to figure out microsoft.com was doing this, and they began implementing it all over for every site they could. As people got smarter, they figured out how to fake it, so you could have a different favicon for every page, just by manipulating the head of your html document.

    Back in the day, you had to use .ico (Microsoft Icon) files as your favicon, but these days most modern browsers pick up .png, .gif and .jpg happily enough. This allows people to make animated favicons, which need to be shot and killed. For maximum compatibility, though, most people still use .ico, since IE doesn’t like the others. Or it didn’t. Someone on IE 8 will have to check.

    The real problem boils down to size, for most people. At 16x16px, you don’t have a lot of room. This site actually has a non-recognizable icon (it’s the Xena/Gabby picture). Technically you can go up to 32×32 for an image, and I have one that’s 240×240, but in the end, they all render at 16×16 on 99.999% of browsers, so looking good at that size is your goal.

    If you think I’m being silly, about a year ago, Google changed their favicon and admitted that it wasn’t final. Right away they basically started open submissions for a better one. When they changed it in January, it became the favicon heard ’round the world. Eventually, Google stepped up to explain the change. It’s important to have an icon that matches your site, as Google explains, as well as a unified look for all aspects of your design. Should you have a different look for each app on your site, or an all in one? How does it affect the other aspects of your site, like the iPhone’s new icons for saved webpages?

    These aren’t simple answers, but to explain how I go about it, here are some favicons that I have made and use out there in the world. Not this site’s though. I need to come up with something better for it.

    jfo When I moved JFO from orange to green a year or so ago, I made a new favicon to reflect the design. The image is a cropped shot from the original header (which is now a full color photo, but still), and is a close up of Jorja’s face. It’s JUST recognizable as Jorja, I think.

    jfo2 Alternately, I came up with this image, which is a copy of the shot used on the header currently, done in greens to match the site. In a way, it’s both more and less recognizable, as the image is harder to make out (it’s a head and shoulders) but as it’s the same used in the header, people might make the connection. I’ve yet to use this on a live site, but it shows up on my test sites right now.

    For the website ‘SCA Jews’, I had gone with a slightly eastern feel of a website, that evoked both the idea of camping with the concept of days gone by. Evening Sun came from spectacu.la, and took minimal editing to fit my plan. The problem was I had no favicon. Originally I put a little sun up there, but then it struck me that the ‘meaning’ of the site was to promote the meal plan “Meals on Camels”. What better way to express this than with … a camel.

    yeast I also helped design (or rather optimize the design for) my friend’s site, The Yeast I Could Do. She had no favicon and I spent a couple hours scrounging for something bread-ish, and eventually picked this one, even though it’s questionable. It does look a bit like a loaf of bread, and she recognized it, so I think it went okay. In it’s .ico format, it has a transparent background.

    ponywars Finally there’s this one. Pony Wars is a joke site I made up with a friend for a “My Little/Pretty Pony RPG”. I mocked up the site because I was bored one day and finding an icon for it has been a bear. In the end, I went with this 33×33 (yes I know) icon of a pink pony. It doesn’t scale very well and looks weird on the site itself, but it’s a hard icon to shrink.

    If, in the end, you’re stumped at making one, there are a lot of favicon collections out there to help you. Be warned, they can take a LONG time to load:

    What are your favorite favicons?

  • Cross Compatible

    One of the things about the net that I love and hate is the development of freedom of expression. Don’t get me wrong, I’m a socialist at heart, and I love the fact that people can say what they want, how the want, in the USA. Well, mostly. Illegality being what it is.

    But I digress!

    The Browser Wars ended with a weird stalemate, and it wasn’t by choice of the users. The World Wide Web Consortium (W3C) and their modifications of what was and was not okay in the Web (yes, there are guidelines to web design) managed to reward early adopters for things like HTML 2 and XHTML. They, without ever enforcing rules, and without ever making a browser of their own, managed to finagle enough ‘power’ such that website developers wanted to proudly display their compatibility. No longer did we create sites like ‘Best viewed on IE’, but we aimed for these standards, and coerced our websites to look ‘Okay’ on IE and Firefox, Windows XP and Mac OS X.
    IE 7 looks pretty good!
    But unless you have three computers with multiple boot sectors and multiple browser versions, either physically or virtually, how do you know what your site looks like?

    My personal website I know is ‘okay’ on most browsers. It looks perfect, just as I want, on OS X in Safari and Firefox. It looks good on Windows in Firefox. And then there’s IE. I hate it. I hate it. It’s not safe, it ignores the W3C, and it just doesn’t do what I think it should. Browse Happy is a site dedicated to reminding people about the alternatives. Like Firefox, yes, which is my Windows XP browser of choice. But I can’t just ignore IE, even if I hate it. Oh, I ignore IE 6 and older, but 7 and 8 I need to pay attention to. So what do I do?

    I hit up sites like BrowserShots, where they will go and snag a screenshot of what my site looks like in a freakishly vast array of browser/OS combinations. It’s not perfect, sometimes it hits weird errors where things I know look fine suddenly don’t. But if you want a quick shot to see what CSS stupidity certain browsers entertain, well, it’s good and free.

  • Surfin’ Safari

    Safari 3 beta came out for Mac and Windows. Naturally I download Safari 3 for Mac last night and test it out, planning to pick it up on Windows when at work.

    On a Macintosh, things are like a pleasing mix of Firefox and Safari. There are a couple bugs I dislike (like Firefox’s ‘Allow Popups from…’), but I adore that it now alerts me ‘Dude! You’re closing multiple tabs!’ if I quit, and ‘Hey, you’re entering text in this window, you sure you want to close it?’ if I close this tab. So on that note, yay.

    On Windows it sucks balls. Oh, it’s fine on my XP home edition, but as soon as you add in Windows wackiness of Roaming Profiles, and proxies, and it dies.

    Mac makes two critical errors:

    1) Not letting you manually adjust proxies. Picking it up from IE seems sensible, but having used IE and multiple other browsers, I can tell you it’s a bad idea. IE settings work for IE. Firefox has to be different, slightly, and so does Safari. So instead, they should default to IE, but allow you edit access.

    2) Preferences don’t grok roaming profiles. There’s no way around how huge this is. If you want Safari to be used in corporate America, you must allow for roaming profiles. This means either you let relative pathing do it’s job, or you allow the users to manually set profile locations. The latter plan isn’t really going to work, since Mac lives by the ‘Do everything simply and have the user do nothing.’

    My solutions are simple sounding, and they won’t fix everything, but it’ll get them started.

    Hey, Mac, I used to build MSIs!

  • Are we getting smarter?

    A recent study said that 81% of computer users had changed their web surfing habits in order to avoid spyware and malware. My buddy, Beebear replied ‘And the other 19% are AOL users.’

    Taken at face value, that number seems to be a little too high. I agree, that just about everyone I know has changed their browsing habits to avoid spyware. All the Mac users I know told me ‘I haven’t touched IE since OS 10.2.’ I suspect Ipstenit was a bit of hold out, but when I upgraded her to OS 10.3, I took IE off her computer. She was a Netscape Fan, and never liked IE in the first place.

    The browser wars, though, really are a peculiar place. Here’s IE, the most prolific browser known to man (that works better if you say it in a booming ‘g-d’ voice), and it sucks donkey balls. The GUI is acceptable. It loads pages, it makes HTML look decent. What more could a person want? Well, let’s look at Safari, which is my Macintosh browser of choice.

    1. Spell Check.

    I have an already included spell check tool, so when I post my blog, I can right-click and correct typos. Also, the tool is tied into my system wide dictionary, so everything that uses it knows ‘Ipstenu’ and ‘blog’ are real words, thanks. There’s a tool called IE Spell that can do this for IE, but it’s not exactly the same. The Mac one can be set to remain on and it’ll underline in red squiggly lines the unknown/misspelled words. Just like Word. Hmm. And IE is missing this?

    2. Easy Searching

    I have a search field on my menu bar. I can type in ‘The life cycle of documentation,’ hit enter, and away I go. Google has a toolbar you can add in to IE and get this done, but again. It’s built in on the Mac.

    3. Tabbed browsing

    One window, six websites. Thank you and good night. Supposedly IE 7 will include this, but reading the IE blog off MSDN leads me to think it’ll be pretty basic. They suggest a couple third party apps that can put in tabbed browsing on IE 6, but one is $15 and the other is free but appears to be it’s own application (that is, a new browser).

    4. Popup Blocker

    I hate popups. I despise them with the fiery passion of a thousand burning nuns. Okay? Popups, popunders, and similar IN YOUR FACE advert scams piss me off. They need to die. Safari? Menu bar, Safari, Popup Blocker. Click, done. IE? Download something like Google’s toolbar and then you can have it.

    Of course, Microsoft sees all this and says ‘Look at how expandable our browser is!’ To a point they’re right. I like IE because you can add on to it. The problem is the items I want to add on should already be there. Microsoft’s fatal flaw right now is complicity. They assume that people who are using IE aren’t going to be buggered to change their habits and get a new browser.

    Microsoft needs to look at that 81%.

    And before you say Apples/Oranges about the Safari thing, with the exception of the spell check, Firefox does all that too. Firefox also has an easy to implement spell check, and yes, I use Firefox on my Windows PC, and IE only when I have to.

    Is Microsoft going to ‘lose’? Eventually, maybe, possibly. It’s hard to say. Do I care? Not as much as you might think. I love Macintosh because it works for me. It lets me work without muss or fuss and it lets me geek when I want to. That’s really all I want with a computer. I do like certain things about Windows. I like the squareness of it, sometimes. It’s obvious that my Windows Machine is to get the job done. But it’s John Wayne. My Macintosh is ‘How can I help you?’ Polite, well groomed, funny. It’s the Fab 5 from Queer Eye.

    Neither one is better than the other, any more than one cell phone is better than another. They all have different functions, and their form is best suited to the user. I think custom PCs should be the way to go, for the users. Make a PC the way someone wants to use it, and they know where to come for fish! I mean, they’ll be likely to come back.

    As for Apple? Well. I love them, I use them, and my Mac is me beloved. I prefer the way it’s handles pop-up alerts. I like being able to hide the geeky UNIX underpants and I like being able to access said panties. I don’t think it’s perfect. Apple’s making a push against Office, with Pages, but frankly after using Pages for a month, I’ve switched back to Word.

    The perfect world for me is an OS that can run anything I need (preferably made by Mac) and my resultant documents/output is compatible with everyone I need to work with.

    Hey, wait … I have that with my Macintosh.