October 9th, 2009 / No Comments » / by admin
October 6th, 2009 / No Comments » / by admin
For book without a large amount of text
For listening and very poor printing condition
For very small text containing large amounts of information
For signage posters and display
For newspaper and where available space is limited
For Large signage as an all-purpose for print media
For large displays; small text in books
For signage; as an all – purpose font for print media
For large or small text; as an all-purpose type face
for text and numbers, especially corporate communication
For large displays;as an all purpose font for print media
For newspaper, especially classified ads
For packaging signage and textbooks
For instruction manuals and print advertising
For magazines, journals, textbooks, and corporate communication
For textbooks and magazines
For posters, packaging, and textbooks
For headlines, Text, and logos
For dictionaries and headlines
For tabular materials, technical documentation, and word processing
For newsletters, reports, and proposals
For low resolution printing, small point sizes and revered-out halftones
For Limited edition books, newsleters, and packaging
For displays with fine lettering
For books and corporate communication
For displays and fine, legible text type
For newspapers, magazines, and corporate communication
For books magazines, posters and billboards
For magazines, Journals, and corporate communication
October 3rd, 2009 / No Comments » / by admin
Yet it has been proven that the most revisited websites among mobile users are those that automatically redirect them to a dedicated mobile version of the site. This technology, by the way, identifies the device you surf with and if it turns out to an iPhone, Blackberry, etc. it will direct you to a site especially designed to save bandwidth and display the site so that if comfortably fits into the hand-held devices screen.
The times are getting faster and faster and hardly anyone has time to read through tons of website content. All you want is to get the message across with as little text as possible. However, what you don’t want is to leave the interested visitor in the dark about something. So here is how you can serve both interests:
You know that every copy has a bottom line where you sum things up, right?
What you do now is take the bottom line to the top because it expresses all you want to convey in a nutshell. The rest of the text remains hidden with a "read more" button below the bottom – sorry – top-line. The interested visitor to your website is not overwhelmed but has the possibility to read more if they should desire to.
You read through a website, ALL the way down and then you want to contact the owner of the website, jump to another part of the site but you can’t because you have to scroll all the way up again to get to the menu. True, this is nothing dramatic if you have a really interested visitor to your site. But wouldn’t it be nicer to have the whole menu in place and constantly visible to your user so they can – without having to scroll – take direct action?
We have seen everything by now. Or have we? The times of frilly flash based sites are over. So are the times where you’ve had to undergo tremendous investments for video productions. Especially in fast times people want to get to the information fast and independent of any browser issues or missing plug-ins. Your 2010 website should have a clear, transparent design, convey the message of your operation immediately through either pictures or wording and have easy navigation and perhaps a search function. That’s it. Recent surveys have revealed that the more design goes into a site, the bigger the distraction from the core information of a site.
There are those of us that digest information best when reading it. That’s the crowd most websites are created for. The people who have an easier time by getting information presented to them through video or a guided presentation are totally neglected by most online platforms. The production of high class videos is fairly expensive, true. But let’s not forget that all we want to do is to get the point across. The budget you’re going to have to devote to either a mid-class video or a guided presentation with a little bit of voice to it are – in context to the potential ROI increase – fairly small.
Have you ever taken time on how long it took you to find the "contact us" section of a website? And sometimes you end up not finding it at all simply because it’s not there. Recent trends are that we’re getting a lot of users to the web which have tremendous expectations towards customer service. Also on a website, so the logical consequence should be that the website operators react, right? Wrong! And if they do it takes ages and the efforts are half hearted. If you manage to include a live chat function in your online presentation you’re off to a pretty good start. This technology allows a website visitor to click a button and you can chat with them in a dedicated chat room. Cool, ey? Another good tip is to have your "contact us" button visible and easily accessible at all times, allowing the visitor to pick up the phone or write an email immediately. When thinking things through you should also consider moving away from displaying your email address on your website because nothing is worse than sitting at your friends or work computer and having to go through the hassle of opening your webmail program to reach out. So replacing your email address with a webform will make life easier for your visitors – oh yes, and by the way: it may also reduce SPAM to your own inbox as well.
Believe me, there are several things you can do to reduce customer service costs. Why don’t we start with making all your documentation available online? And while we’re at it we of course want to make sure to get updated information about the customer which is the reason why we’ll have the information available but people have to register for an account to access it.
Even though we can extract a significant amount of information out of our website visitors, their true identity and contact information mostly remain a secret to us. So we have to find ways that will want to make them reveal this data to us, right? What you should prefer in the context is a non militant approach, simply because that will scare the people away from your website.
Most important is that the methods you choose are individual and somewhat new. No customer is going to go for "old tricks". Keep in mind: a web form which requires the customer to fill in their contact details actually gives you their details. If you just put up your email address they’ll write you an email which in 90%+ will not even include their real name.
The instruments most people utilize to get a clue about what’s going on on their website are hardly more than good jokes. The website analytics industry is so filled with products which will blow your mind. If you’re the no-budget person you’ll definitely want to have a look at instruments like Google Analytics, a free service which offers you more than enough insight into website visitor’s behavior, their location, allow specific segmentation, give you access to tons of metrics, etc. The next level is instruments which let you monitor your website traffic in real time. And that’s not it. The system will – upon the behavior of the website visitor – calculate the probability whether they are seriously interested or they’re just there to kill time. Should you not be overwhelmed by now: an operator gets this specific visitor indicated on a screen from which the operator can then open a livechat window on the website visitor’s screen, directly engaging in a conversation.
You can use the web to make inter-organizational collaboration more efficient. The secret here is that you store your documents, spreadsheets, presentations, etc. on the web. Probably the niftier phrase to use here is "in the cloud". This way you’ll have your documents readily accessible regardless where you are. Ok, the protesters of you will intervene by bringing up the fact that not everyone is not connected everywhere, which is entirely true. The solution to this is that clever services like Google Docs have tools available that let you work offline by downloading a small plug-in. Your work’s progress is then synchronized the next time you have an online connection. These services allow you to collaboratively work on documents, spreadsheets and presentations through the browser, regardless what computer you’re at in the world and never fear loss of data. Give it a try. It’s going to blow your mind, trust me.
September 22nd, 2009 / No Comments » / by admin
| Normal style | Bold style |
|---|---|
| Arial, Arial, Helvetica, sans-serif | Arial, Arial, Helvetica, sans-serif |
| Arial Black, Arial Black, Gadget, sans-serif | Arial Black, Arial Black, Gadget, sans-serif |
| Comic Sans MS, Comic Sans MS5, cursive | Comic Sans MS, Comic Sans MS5, cursive |
| Courier New, Courier New, Courier6, monospace | Courier New, Courier New, Courier6, monospace |
| Georgia1, Georgia, serif | Georgia1, Georgia, serif |
| Impact, Impact5, Charcoal6, sans-serif | Impact, Impact5, Charcoal6, sans-serif |
| Lucida Console, Monaco5, monospace | Lucida Console, Monaco5, monospace |
| Lucida Sans Unicode, Lucida Grande, sans-serif | Lucida Sans Unicode, Lucida Grande, sans-serif |
| Palatino Linotype, Book Antiqua3, Palatino6, serif | Palatino Linotype, Book Antiqua3, Palatino6, serif |
| Tahoma, Geneva, sans-serif | Tahoma, Geneva, sans-serif |
| Times New Roman, Times, serif | Times New Roman, Times, serif |
| Trebuchet MS1, Helvetica, sans-serif | Trebuchet MS1, Helvetica, sans-serif |
| Verdana, Verdana, Geneva, sans-serif | Verdana, Verdana, Geneva, sans-serif |
| Symbol, Symbol (Symbol2, Symbol2) | Symbol, Symbol (Symbol2, Symbol2) |
| Webdings, Webdings (Webdings2, Webdings2) | Webdings, Webdings (Webdings2, Webdings2) |
| Wingdings, Zapf Dingbats (Wingdings2, Zapf Dingbats2) | Wingdings, Zapf Dingbats (Wingdings2, Zapf Dingbats2) |
| MS Sans Serif4, Geneva, sans-serif | MS Sans Serif4, Geneva, sans-serif |
| MS Serif4, New York6, serif | MS Serif4, New York6, serif |
1 Georgia and Trebuchet MS are bundled with Windows 2000/XP and they are also included in the IE font pack (and bundled with other MS applications), so they are quite common in Windows 98 systems.
2 Symbolic fonts are only displayed in Internet Explorer, in other browsers a font substitute is used instead (although the Symbol font does work in Opera and the Webdings works in Safari).
3 Book Antiqua is almost exactly the same font that Palatino Linotype, Palatino Linotype is included in Windows 2000/XP while Book Antiqua was bundled with Windows 98.
4 These fonts are not TrueType fonts but bitmap fonts, so they won’t look well when using some font sizes (they are designed for 8, 10, 12, 14, 18 and 24 point sizes at 96 DPI).
5 These fonts work in Safari but only when using the normal font style, and not with bold or italic styles. Comic Sans MS works in bold but not in italic. Other Mac browsers seems to emulate properly the styles not provided by the font.
6 These fonts are present in Mac OS X only if Classic is installed.
August 16th, 2009 / No Comments » / by admin
August 16th, 2009 / No Comments » / by admin
.trans_box2 {<br />
font-family:verdana;<br />
font-weight:bold;<br />
padding:40px;<br />
margin:30px;<br />
border:solid 1px #555;<br />
/* Mozilla ignores crazy MS image filters, so it will skip the following */<br />
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale, src=’/75p_honey.png’);<br />
}<br />
/* IE ignores styles with [attributes], so it will skip the following. */<br />
.trans_box2[class] {<br />
background-image:url(/75p_honey.png); 
<div style=”float:left;background-image:url(/flowers.jpg);border:solid 1px #000;padding:10px;” mce_style=”float:left;background-image:url(/flowers.jpg);border:solid 1px #000;padding:10px;”>
<div class=”trans_box1″ style=”float:left;” mce_style=”float:left;”>
I like flowers.
</div>
<div class=”trans_box1″ style=”float:left;” mce_style=”float:left;”>
They smell nice.
</div>
<div class=”trans_box2″ style=”float:left;” mce_style=”float:left;”>
<a href=”http://www.google.com/search?q=flowers+bees+honey” mce_href=”http://www.google.com/search?q=flowers+bees+honey”>When combined with bees, they make honey…></a>
</div>
<p>
August 13th, 2009 / No Comments » / by admin
Content is the king. Search engines love fresh and quality content, since that’s what the users want – more new things to read every day and every hour. When your site changes often – search engine crawlers come back more often as well. Of course by generating new content you raise the chance that more of your pages will be found.
Once you have the content generated, here is what you can do to have your site found more often by new visitors:
rel="nofollow", which tells Google (MSN, Yahoo and other sites) to not count those links to your site’s ranking credit. This is to avoid comment spam. You can find the details here: Official Google Blog: Preventing comment spam. keywords and description. Though it’s been said that the keywords meta entry has little or no weight with Google, but is still useful with other search engines. Also make sure that the title of the document includes the most important keywords and phrases, as Google gives a heavy weight to those. The keywords need to be included in the H1 and H2 header entries, and also once in bold, once in italic and if possible in the URL. link:yoursite.com and you may want to try to get your site listed on those sites. rel="nofollow", which won’t help your site’s ranking. 
consider that as duplicating content.
August 11th, 2009 / No Comments » / by admin
A sitemap is basically a page or pages that serve/s as a directory by listing all the links to all documents and files found in a website. It is not merely a random listing of links, but organized in such a way that it gives the web user an idea of how all the information that can be found in the site fits into an outline or framework. It is like viewing the table of contents of a book, or viewing the “concept map” of the site’s content.
In SEO language, spider is not an animal found in your closet. This electronic search spider is actually a bot which collects data and copies content to be stored in the search engine’s database when keywords are fed into the search dialogue box. The spider reads the content of the site and sends another bot to follow the links and copy the content contained in them.
A sitemap like any other map gives directions to a navigator. It primarily targets search engine spiders so that they are properly directed to your site and to the links where keywords entered in the search dialogue appears. As such, it is actually a useful tool in search engine optimization. A well organized site map would guide the spider to find the information it needs when keywords are entered during a search operation.
As an additional beneficial consequence, sitemaps have proven to be useful even to web users. Since a sitemap displays all the links to information found in a website, it helps the user to search for a particular topic in mind. Many users also use the sitemap to navigate between pages in a site.
1. No page would be left unturned Going back to the purpose of sitemaps, having one would mean faster and easier tracking and crawling of spiders all over your site. As a result, search engines would surely get to the view all the pages of your site and not just the pages containing random keywords.
2. Easier navigation for site visitors Once a web user has accessed your sitemap, they need not go back to the search engine page to look for what they need. If what they are looking for is in your site, then they would have an easier and faster way of locating it.
3. Potential advertising value If it so happens that a relevant product or service company reaches your site, then it would be easier for them to see how best they can position themselves in the different pages of your site as a paid page advertisement.
4. Encourage greater traffic to your site If your company website has a sitemap then potential buyers would have an easier time in accessing your latest products and services. Moreover, they would not miss out on any product that might be off future interest to them since the sitemap would display all information found the site.
There are at least three major types of sitemaps: indexed, full categorical, and restricted categorical. An indexed site map appears as an alphabetical listing or directory. A full categorical map displays all links classified into categories; while a restricted categorical sitemap displays all links listed in a chosen category at a time. The full and restricted sitemaps are very similar except that the former displays all links in all categories all at once in a page, while the latter focuses only the links under the selected category for easier and less eye-straining viewing.
The most widely used format is the full categorical. Based on the results of a 1999 SURL study on sitemap designs, the full categorical format is most preferred by users since it is easier to search for topics within the site and it allows easier comparison between and among categories.
1. Link the sitemap only to your homepage. This is to ensure that the spider starts searching from your homepage down to all the pages listed in your sitemap. In this way, no page would be left unvisited by the spider.
2. Do not go beyond 30 pages for a sitemap. Large websites having 50 or more pages should not go beyond 30 since this adds more pages to the site, and might make search engines think that the sitemap is a link farm. Also, this prevents overcrowding of links which could be tiring to view.
3. Check all the links listed in your sitemap. It can be discouraging when you click on a link only to find out that nothing is displayed. Test your sitemap; click all links in every page to make sure that all links are indeed linked to the right page.
4. Give keyword-rich titles to sitemap links. Keyword-rich titles give your site more advantage in being searched properly under the right category. But be sure to have this sitemap link linked back to the sitemap (e.g. back to sitemap).
5. Provide a short description for the links in the sitemap. Doing so would give readers a better idea of what to find in the link and save them time on surfing.
6. Be consistent in designing your sitemap with the other pages of the site. Employ a recurring design and the same HTML template for all pages to establish identity and build character to your website.
August 11th, 2009 / No Comments » / by admin
August 11th, 2009 / No Comments » / by admin
(SEO) is an essential requirement of websites making constant efforts for high popularity. If you have been ignoring this fact, it is time to bring modification in your thought process. How can you consider it possible for your website to exist in the hard-hitting competition? No matter, how captivating your website is, it has no market value in case you are not able to divert web traffic towards it. As the discussion unfolds, you can introduce yourself to most eligible reasons for opting for SEO practices.
Search engines are in constant process of refining their algorithms, so that web surfers are presented with productive search results. While this can affect your website ranking, you must keep close association with vibrant nature of search engine algorithms and this is possible by following successful SEO strategies. By doing so, you can bait search engine spiders to make frequent visits to your website and index its web pages amongst top search results.
The web traffic takes suggestions from search engines to choose its path leading to various websites. The majority of web surfers use popular search engines for finding top results related to products and services hunted by them. It is also a noteworthy fact that most of search engine users get satisfied with the results offered on the first and second search engine page. Thus, it is very important to let your website find its position amongst top search results. Only search engine optimization techniques can help you in this regard.
There is no better way than SEO to market your products and services on internet. You can extract advantages out of techniques like content development, article distribution, link building, PPC and others to spread the message about your website. Thus by optimizing your website for search engines, you not only make it eligible for higher ranks, but also promote it over vast web space.
SEO can build a bridge for potential buyers of your products and services to reach your website and contribute towards successful sale. Thus, your ultimate aim of getting desired returns on investments can be entertained by allowing your website to be optimized for search engines. Once your website starts selling, you must continuously fuel the performance of search engine optimization practices to take sales program to its peak value.
The websites become popular, when their owners have right skill sets and plenty of time to endorse it over web. Even the capable web designers find themselves incapable of making their website trendy and accepted. This might happen due to scarcity of time and required amount of knowledge to perform these tasks. In such situation, a SEO expert is going to share your burden and make your website scale new heights of popularity.
search engine optimization can’t be neglected, when every website around you is trying to hold its feet on the land of popularity. Thus, make sure you follow the advice and start appreciating the use of SEO tools for the sake of your website.
April 27th, 2009 / No Comments » / by admin
April 27th, 2009 / No Comments » / by admin
March 25th, 2009 / No Comments » / by admin
February 27th, 2009 / No Comments » / by pisakec
<script type="text/javascript" src="/js/jquery.js"></script>
<script type="text/javascript" src="/js/jquery.dimensions.js"></script>
<script type="text/javascript">
$(document).ready(function() {
var $winwidth = $(window).width();
$("img.source-image").attr({
width: $winwidth
});
$(window).bind("resize", function(){
var $winwidth = $(window).width();
$("img.source-image").attr({
width: $winwidth
});
});
});
</script>In order to get this inline image to behave more like a background image, we can use that unique class we applied to apply some absolute positioning.
img.source-image {
position: absolute;
top: 0;
left: 0;
}Because of this absolute positioning, anything that you want to put over it will also need positioning and a higher z-index value. If your source image is particularly tall, or your browser window is particularly wide, the image could easily become taller than your browser window and force a vertical scrollbar. In order to prevent this, simply set the overflow value on your body to hidden:
body {
overflow: hidden;
}Forget this javascript business! Thanks to Anders comment pointing out Stu Nicholls version, here is an even better way to handle this without the need for any javascript at all!
Since we already have a unique class on the image, the image is absolutely positioned, and the scrollbars thing is already taken care of, let’s just set the width using a percentage directly in the CSS:
#img.source-image {
width: 100%;
position: absolute;
top: 0;
left: 0;
}February 26th, 2009 / No Comments » / by pisakec
div.rounded {
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
padding:10px;
border:3px solid #f3ddac;
background: #fff3d8;
}
the html
<div class="rounded"> <h2>The Example</h2> </div>
Certainly, it’s perfectly work on Firfox !
a.blocklink {
display:block;
width:160px;
background:#f0f0f0;
color:#999;
font-family:corbel, verdana, sans-serif;
padding:4px;
text-decoration:none;
font-weight:normal;
font-size:0.72em;
border:1px solid #dadada;
}
a.blocklink strong {
font-family:georgia, helvetica, sans-serif;
display:block;
color:#656565;
font-weight:bold;
font-size:1em;
margin:0 0 3px 0;
font-style:italic;
}
a.blocklink:hover {
background:#dcdcdc;
color:#303030;
border:1px solid #adadad;
}
a.blocklink:hover strong {
color:#cb0000;
}
the html
<a href="#" class="blocklink"> <strong>Link Block Heading</strong> This is the text contained within the link block... </a>
img.demo2 {
padding:1px;
border:2px solid #dcdcdc;
background:#ababab;
}
February 26th, 2009 / No Comments » / by pisakec
Transparency is one of those weird things that is treated completely differently in all browsers. To cover all your bases, you need four separate CSS statements. Fortunately they don’t interfere with each other really, so using them all every time you wish to add transparency is no big hassle and worry-free. Here they are, and are currently set to 50% transparency:
.transparent_class {
filter:alpha(opacity=50);
-moz-opacity:0.5;
-khtml-opacity: 0.5;
opacity: 0.5;
}February 10th, 2009 / No Comments » / by admin
Welcome to WordPress. This is your first post. Edit or delete it, then start blogging!
December 25th, 2008 / No Comments » / by pisakec
reset.css This file sets sensible defaults across all browsers. I’m sure we are all familiar with starting a new project, going to our main CSS file and adding a few default styles to the body selector, such as ‘margin: 0; padding:0; font-family: Helvetica, Arial, sans-serif;’ or something along those lines. This is what reset.css does, and more. It resets default styles for spacing, tables, fonts, etc. so you can work from a clean slate.
typography.css This file sets up some nice default typography. I won’t explain all of the styles but I will say that this is my favourite parts of Blueprint because, to me, there is nothing more discouraging than trying to lay out a page and seeing some black Times New Roman text jammed up into the top left corner of a page. Ugh. Blueprint’s typography.css keeps me from ever seeing that again. The typography.css also sets up some really nice styles around font sizes, line-heights, default styling of tables, etc.
grid.css This file handles the grid layout portion of blueprint. We will have a look at the classes that it uses in a bit. One important thing to note with the grid, by default it uses a width of 950px, with 24 columns each having a width of 30px and a 10px margin between columns. This may sound constrictive, but if this is not the layout you want, you can always use a Blueprint Grid CSS Generator to generate a custom grid layout. If this last paragraph completely confused you, please read on as we will build a layout using a grid in a bit. If you are not familiar with CSS grid layouts and want some background, Raj’s Which CSS Grid Framework Should You Use for Web Design? is a good intro.
ie.css Blueprint supports IE, so of course it needs it’s own specific stylesheet to take care of those little details that makes IE so special 
The nice thing is that Blueprint does handle this for you, so all of its core styles will work in all of the major browsers (I think it even supports IE 5).
print.css This file sets some default print styles, so that printed versions of your site looks better than they usually would. The print.css file also has an option where you can fill in your domain name so that relative links are shown in parentheses behind the text link in the printed version of your page. Without filling in this section only remote links will print properly. Check out the bottom of the print.css src file, linked above.
forms.css This file provides nice looking default forms as well as classes for error notifications or even flash notifications if you are using something like Rails. Since this is the only section I will not cover in more detail, here is some of the default form styles in use:
No. Blueprint comes with three compressed stylesheets for your HTML pages, screen.css which contains #’s 1-3 & 6 from above, print.css, and ie.css. The reason that I outlined the different parts of the framework above is because the framework is modular, each of those pieces works independently of each other. The nice thing about this is that if you decide that one aspect of Blueprint, such as a grid layout, doesn’t fit your project but you still want the benefits of reset.css and typography.css, you don’t have to use the the grid but the other styles will still work.
December 25th, 2008 / No Comments » / by pisakec
Some people might prefer to ignore IE6 all together – as a way of making a statement. I leave it up to you to use your judgment. However, your decision should reflect your audience. If you wish to show an alert to IE6 users, you could use jQuery’s browser() method to detect IE6.
view plaincopy to clipboardprint?
OR, you can drop IE6 off your chart.
December 17th, 2008 / No Comments » / by pisakec
I found this code somewhere over the net while I research on Jquery. you can check it out here
Thomas Cho’s design exploration through digital edge is proudly powered by WordPress | Firebug Theme by Blog Oh! Blog
