Recently, got myself into Usability fighting with the redesign of some web applications. The more advanced the project is becoming, the harder it comes to handle usability issues. Finally, it ended up with the full re-design having in mind key concepts from different web sources.
1. Proper Search
If the navigation sucks, it might be the only way how the user can find the required content. Statistically, the user uses search maximum twice, then he leaves the site if he didn’t find anything.
2.Design your Links
It’s quite hard to navigate over the complex website and afterword find yourself on the main page without a guess where you’ve been. So, do mark links as visited!
3. Banner site
With overwhelming number of banners, or any image/text advertisement of different features of the site/sites, do keep “an air” between the blocks, if you want to have lots of info on the front page, otherwise – think again about your content placement. It’s really hard to read something when the rest of the content blinks/flashes/jumps/etc. However, if you have to keep these jumping/flashing block – try to keep them far away from the content and each other.
4. Image data over Text and vice versa
The link is worth of a thousand words
5. And finally, don’t do this!
Yeah, this!
Andrey Vystavkin Design Design, Usability
CakePHP session flash messages is one of the most useful things for usability, and user notification. Trying to make it more fancy, I came to jQuery framework with its HighlightFade plugin.
Adding just a couple of lines, we can get nice effects, looking the same as Wordpress messages in Posting/Editing:
var $j =
jQuery.
noConflict();
//I’m using Prototype as well, so we don’t need conflicts
$j
(document
).
ready(function() {
if( $j
("#flashMessage") ){
$j
("#flashMessage").
highlightFade({color:
‘#24F273′,speed:
2000, iterator:
‘exponential’});
}
});
Thus, next time you will pass
$this->Session->setFlash(‘Foo’);
, your flash message with default
<div id=
"flashMessage"><?
php $session->
flash();?></div>
will be used with above HighLight effect.
Andrey Vystavkin etc, php cakephp, Design, effects, jquery
Quite interesting article from Stroustrup (unfortunately dated by 1999), however still topical. Here is a small list of concepts a person should be considered. The the approach to a new language, which:
– proceeds from the concrete to the abstract,
– presents language features in the context of the programming and design techniques that they exist
to support,
– presents code relying on relatively high-level libraries before going into the lower-level details (nec-
essary to build those libraries),
– avoids techniques that do not scale to real-world applications,
– presents common and useful techniques and features before details, and
– focus on concepts and techniques (rather than language features).
As well, as some interesting comparisons of C and C++ languages in his article.
Andrey Vystavkin Programming c++, Programming, Tips
Playing around with CakePHP parameters passing through URL, I’ve noticed that using Paginator helper for listing entities mixes up named and url params in the URL.
For instance, classical paginator URL is:
http://domain.com/controller/action/page:number
which looks like:
Array(
[named
] =>Array
(
[page
] => number
)
)
Any parameter used in the Paginator goes inside of the URL and doesn’t affect the behaviour (in my case, URL param is used for language switching), i.e.
http://domain.com/controller/action/?param=foo/page:number
No matter what your
$this->params[‘url’][‘param’]
contains – it won’t reflect on the logic.
Thus, if we use another variable
$this->params['named']['foo']
, we can always access it in our viewers and utilize it in the $paginator variable, so our URL will look like:
http://domain.com/controller/action/page:number/foo:bar
Useful links:
Additional parameters in $paginator
Andrey Vystavkin php cakephp, pagination, php
Nowadays, I was forced to work at the office doing Web Dev using Windows machine. It caused real headaches to setup some of the things from scratch to make in work like on my old Linux machine.
I haven’t thought that vim’ll look so weird from the Windows side, however gVim alternative seemed more adecvate, but the problem got me googling at the point of setting up correct fonts for the themes.
An old fonts vim plugin cause lots of errors, so I had to use SVN to get latest fixes for the Fonts.vim plugin. You can check it in the trunk of the repository; it worked perfectly for me, just copy-paste it to your \plugins\ directory, and play around the font-size.
Andrey Vystavkin Links, Linux Fonts, gvim, LAMP, Tips, Windows
As the project grows I had to work on some more complex queries to provide users with better searching facilities.
In this case, you might use two options:
- Straightforward find() function from App::Model (where you’ll have to handle the outpu of data yourself, and trying to fit the search results in your websites layout)
- Use Pagination functionality (which is designed for handling big chunks of data for you)
A simple example: from a small search menu, I need to get the data about item’s price, its type etc, so at this point, find() solution would look like:
$condition =
array(‘OR’ =>
array(
‘Item.type’ =>
$this->
data[‘Item’][‘type’],
‘Item.qty’ =>
$this->
data[‘Item’][‘qty’],
),
array(‘Item.price BETWEEN ? AND ?’ =>
array($start_price,
$end_price))
);
$this->
(‘results’,
$this->
Item->
find(‘all’,
$condition));
Once you set results array in the view template, it will cause you few hours on how to rearrange data presentation, meanwhile you can use Pagination:
/*
* I’m going to use the same $condition
* the difference will be at the view level and the way of setting the data "results"
*/
$this->set(‘results’, $this->paginate(‘Item’, $condition);
And in the view you might add some code like:
<?
echo $paginator->
counter(array(
‘format’ => __
(‘%page% of %pages%, showing %current%
records out of %count% total, starting on record %start%, ending on %end%’,
true)
));
foreach($results as $i => $item):
/*
* Items output
*/
endforeach;
?>
<?php echo $paginator->prev(‘<< ‘.__(‘Previous Page’, true),
array(), null, array(‘class’=>‘disabled’));?>
| <?php echo $paginator->numbers();?>
<?php echo $paginator->next(__(‘Next Page’, true).‘ >>’,
array(), null, array(‘class’=>‘disabled’));?>
Last lines of the code would manage the results listing for you, which has to be defined in your Controller:
var $paginate =
array(
‘Item’ =>
array(
‘limit’ =>
5,
‘order’=>
array(‘Item.added’ =>
‘ASC’)
)
)
Done, now you can easily handle your search outputs.
Andrey Vystavkin Linux, etc cakephp, IT, pagination, Tips