Thursday, April 22, 2010

Latency - more important than bandwidth?

interesting to look into, latency increases with international visitors, also on mobile phones.
latency is number of files the page loads (many external CSS stylesheets a bad idea then??)

but then again this is only important for first uncached visit right...?

reckons unicode bullets are good alternative to using images, has list of all the cool unicode characters

adobe meermeer

http://www.sitepoint.com/blogs/2008/12/04/adobe-meermeer-will-change-the-way-you-test-web-sites/

Dreamweaver will have a browser testing screenshots functionality / service attached. Like browsershots service.
I personally don't see the point, testing dosn't mean LOOKING does it, its a browser looking service, not testing.
With most browsers these days pretty good at CSS and IE6's CSS issues easily predictable, little rendering differences are arguably less important than the AJAX fancy stuff that could get broken. If you can't test full functionalities and navigate around the site in the real browser, you just can't tell if its working.
For example, I visited a company's portfolio site the other day in safari 3, I'm guessing the big white box on homepage was meant to be a fancy slideshow, but all i saw was a big white box. DOH!!! epic fail. White box was only thing on the page!

More and more sites, especially minimal portfolio style sites are reliant on fancy Jquery type galleries and effects, or have fancy menus or popups for essential content. If the gallery script fails or is unbearably slow on a certain browser, its just not acceptable to not know about it. I can handle not knowing exactly what typeface konquerer has rendered my body copy in, but I cant handle that if some random nerd happens to find the site that major parts of content are completely inaccessible. Then again said nerd will hopefully understand and empathise...

Mobile Browser Testing - what browsers to test on?

Great list here:
http://www.quirksmode.org/mobile/browsers.html

also, what phones to buy and setup
http://www.quirksmode.org/blog/archives/2010/04/mobile_browsers.html

i just want some emulators an then look on iphone.

this is a cool opera mini emulator... wonder if i should log into something using it online though, prob not.

its a cool browser, it resizes the columns with text wrapping! no need to make extra stylesheet hurrah!

Sunday, April 18, 2010

learning Jquery and PHP resources

looking for a series of easy lessons and tutorials - like a course, to work through when on public transport or waiting around. best if its podcasts, but also would be great if it was interactive with little quizzes and tests to actually try writing, not just watching. wonder if anyone has done this??

jquery book
http://www.manning.com/bibeault/

cool video tutorial series
http://blog.themeforest.net/tutorials/jquery-for-absolute-beginners-video-series/

jquery series lessons
http://woorkup.com/2009/10/05/jquery-lesson-series-introduction-to-selectors/

Monday, March 29, 2010

Supercheap website solutions for stingey clients

this has great intro presso - build it yourself, $60 per year, includes all that naf stock photog that they seem to love. and apparently spits out code suitable for searching.
http://www.homestead.com/

also, googles online presso about 101 online marketing watch when time, might be good to pass onto clients to help educate them of process

Thinking for stingey clients who want the moon but only have a small budget and don't value branding, typography, usability, good photography, accessibility, load speed, xbrowser, they basically want a online version of a shoddy print shop brochure but it should show up first in google. (but look and function as slick as their competitors $30K websites and have a CMS and the video content must shoot, edit and encode itself... sighhh. slight exageration but its funny.)

Perhaps their entire budget is best spent on hiring a professional web copywriter/SEO dude to rewrite their copy and restructure their sitemap with landing pages, calls to action, all that. (as they think the way it looks is unimportant anyway and 'branding' is just sticking their logo designed in MS Paint in the top corner :)

Then, with that copy and sitemap in hand based on the copywriter/SEO experts advice, they can use a tool like homestead to build a site themselves that dosn't look like anything inparticular but has mad SEO optimisation.

Perhaps they need a building tool completely unfocussed on graphics. Sort of plain text wireframes, with their logo in the corner of course for clear branding.

Not really sure if that would work, the building tool would have to have decent SEO features so it all comes out right in the code. But its an interesting proposition and question, what's most important, rank in google or clear branding, user experience, etc?

For a small biz, they think always rank in google must be highest priority, except what happens when a potential customer gets to their site using IE6 and the main nav is unusable, or worse has the message 'this site may harm your computer', customer thinks hmmm dodgy these people don't seem that trustworthy I cant even find their contact details and whats with the shit logo and I cant read the text it's black on a red background in 9pt comic sans (for example :)

So what is the point of getting first in google if you can't follow through with something that looks professional and trustworthy?
Homestead templates look like a decent stop gap option for initial stages of growth or companies not needing a specific online strategy. Too bad if your competitor chooses the same template...


DIY wordpress themes roundup:

The thesis theme.
Its a commercial theme framework, as well as a WSIWUG theme.

resonable price of $164 plus $40 per client site.

Good for quick setups, looks easy to customise as blogger. Also apparently has an easy to customise menu for wp as a cms. Id have to trial it for real though to test, menus are hard in wordpress!

But with the base price and say 2 days of setting up and customising the colours and options and plugins, that might be adequate for some clients to get them started online.

Id like to also trial if using the DIY controls in this theme is actually faster than doing it in css. since you cant seem to preview the changes LIVE in the same screen like you can with firebug, I'd guess its a slow process to make a change and check it each time. But for someone who dosnt know css it would be really helpful.

Apparently it also has a feature that help you make custom hooks into the theme functions, which is what I'd find really handy, i don't like too much php.

actually, watched some videos, benefits include:
-simple navigation menu addition, renaming and ordering. (looks to be only one level, not child pages but need to check) its good not to need a plugin for this.
-easily add software scripts to header etc (or... you could just add them to your templates but whatever)
-seo options for each post/page without using a plugin, its all there on the page editing. this is good ya.
-updates. someone else updates the base theme with new versions of wp. I dont have to do it. That is a huge bonus really for the future. not my responsibility! and support if it breaks helps to have one other brain on it.
-the code output is really neat when you view source. even when you alter the design in admin panel, it dosnt write any screwy code, it seems to write to the css or swap stylesheets or something.

Still, it is pretty blog centric. Id like to see thesis as a cms specific features and layouts.

Thursday, March 25, 2010

Screen Resolution ultimate 960 grid too big??

researching opinions on what is ultimate screen resolution these days...
- been using the 960 grid vibes and target sizes lately as a default web design standard usually basic mockups are 960 x 600 or so = 1024x768 target.

but future seems SMALLER not larger... uh oh....

eg. eee PC 800x450px resolution - that dosnt account for browser chrome. others are 800 x 400 - not much left vertically at all...doh!!

found this article with a helpful suggestion in comments on approach - js resolution detection

if (screen.width>=1024 && screen.height>=768) {
window.location="highres.html";
} else {
window.location="lowres.html";
}

of just include the right CSS style sheet after the resolution is detected.

But anyway you have to develop multiple websites to serve all the resolutions.

so if hi res, show this, anything smaller, show something else, makes sense so you dont have to design everything really skinny. you could maybe have a 960 grid thing that narrows a certain column like body text column down depending on resolution...

reminds me of a blog i saw recently that was about 450px wide. Think phones etc are 480px wide, so it optimised for phones. anyway it looked cool. maybe my personal portfolio will be optimised for phones...

other opinions

http://www.freshleafmedia.co.uk/blog/vertical-resolution-web-design-and-netbooks/

Well, as with the case of my client, many of the netbooks have quite a decent screen width. Most have a 1024 by 600 resolution – and many of our corporate website designs sit around the 960px width mark, so no need to worry there. What we might need to consider, though, is what sits ‘above the fold’ (i.e. what is visible without scrolling).

some good points listed here too:

from: http://www.awebapart.com/home/faq/Web_Design_Width_and_Web_Screen_Size


cool diagram google!!!!!

http://browsersize.googlelabs.com/

90% users - 960x500 is max.

when you get to 630px high it drops to 50% - pretty drastic.