Posts Tagged ‘Tips & Tricks’

Gothic Makeup Tips

Sunday, June 7th, 2009

The term ‘Gothic’ is associated with dark and gloom. Actually, a group of Eastern Germanic tribes responsible for the destruction of the Western Roman Empire were known as Goths. Later, during the Edwardian era, the Gothic culture was created in literature where the whole concept was given a dark and bleak look. The Gothic culture not only included Gothic architecture and literature but also a unique dressing style. Goths have a particular style of clothing which is rich and stylish. Gothic attire includes corsets, laces, gowns and jackets made of velvet and velor, and are available in a wide variety of colors including black, gray, green, blue, etc. However, no attire is complete without makeup and Gothic makeup is no different.

Gothic makeup constitutes of a very light and pale skin, dark eyes and lips. People generally associate black with goth and believe that black is the only color to be used for Gothic makeup. However, this is not true and Gothic makeup can include other dark colors too. While doing Gothic makeup, it is extremely important to have lots of time and patience. One wrong move can ruin the entire look.

1. Skin Care

The most important thing before starting any makeup is to clean up the face. Gothic makeup is very heavy and may harm the skin if it is applied on an unclean face. Clean your face thoroughly and apply a moisturizer.

2. Foundation

The foundation has to be chosen carefully. As Gothic makeup constitutes of a light skin, you should go for a foundation that is two times lighter than your original skin tone. Applying the foundation properly is also very important. It is necessary that you spread the foundation evenly all over your face, and also on the neck and hands.

3. Eye Makeup

Eyes are the main highlight in Gothic makeup and should be done with utmost care. The eyes should be done in such a way that it accentuates the effect of the whole face. First, one should apply a dark eye shadow using colors like burgundy, deep blue, brown, dark green, purple, etc. Apply the same eye shadow to the lower eye lid and a lighter shade of the same color on the inner corner of the eye.

The eye makeup cannot be complete without applying eyeliner. The most common color used in Gothic makeup is black. You can either use a liquid eyeliner or a dark pencil liner and draw a thin, sharp and straight line to define the shape of your eye. You can also use an eyeliner that is available in colors like white, red, blue, green, purple, etc. If you do not want to go with the conventional style, you can be creative and make a design on your eyes that gives a dramatic effect to your Gothic look. It is also necessary to have well-groomed and neat brows. Darken it with a black eyebrow pencil and do not forget to apply mascara on the upper and lower eyelids.

4. Lip Makeup

The makeup of the lips, just like the eyes should be elaborate. Choose a dark lipstick and a matching lip liner. Carefully outline the lips with the lip liner and fill the inside with lipstick, preferably with a brush. Colors like blood red, burgundy or wine colors are normally used in Gothic makeup. One should never use black color on the lips.

5. Blush

Blush should be avoided in Gothic make up as it would negate the pale effect of the skin. However, there are people who use beige or rouge blush shades to enhance the cheekbones.

It is important to remember that practice is essential for a person to become a master in Gothic makeup. These tips are not specific rules that one has to follow while doing Gothic makeup. But one can definitely experiment with colors and styles, and can be quite innovative to create a Gothic effect.

Tags: ,
Posted in LifeStyle | No Comments »

Javascript Comment Smilies

Sunday, June 7th, 2009

As you can see in the bottom of this page, smilies can be inserted easyly using Javascript into my comment’s textarea. This only a simple Javascript feature using simple function. Before we start, i recommend you to use these plugins: Smilies Themer. Download and install the plugin.

I consider you already done that. So we go to the next step. Go to your admin panel, and open the Appearance Editor to edit your page. Open/click Comments (comments.php) to edit comment php file. Find this tag:

<form action="<?php echo get_option('siteurl'); ?>/wp-comments-post.php" method="post" id="commentform">

Put a name of the form so the function will work, it look like this:

<form action="<?php echo get_option('siteurl'); ?>/wp-comments-post.php" method="post" id="commentform" name="chat">

Skip it for a while, open notepad or any text aditor the copy this codes:

<div id="smilies" width="90%">
<a href="javascript:DoSmilie(' smilies_code1 ')"><img src="smilies_url1"></a>
<a href="javascript:DoSmilie(' smilies_code2 ')"><img src="smilies_url2"></a>
<a href="javascript:DoSmilie(' smilies_code3 ')"><img src="smilies_url3"></a>
</div>

Legend:

  • red = codes that used for smilies to appear. (ex: ‘ :D ‘ ) This symbol will becomes  when you post a comment.
  • blue = visitor/poster can select the smilies based on the preview.

How to find two of them? Remember you already installing the recomended plugins? Open it from your setting. You’ll see something like this:

smilies_option

Select one of available smilies and click Update Options. Click on the Preview link to preview the selected smilies. You’ll see the popup windows like this:

smilies_preview1

Copy the symbol and insert into the red, then right click at the image preview and copy the image location and paste into the blue. Repeat this step for more smilies.

When you are done in notepad, copy the wole codes, open the comment.php file we skipped before, paste before <textarea> tag.

For the final step, add some javascript to make it work, copy this javascript codes and insert on the bottom or comment.php file.

<script type="text/javascript">
function x(){
return;
}
function DoSmilie(addSmilie, messageDef){
var addSmilie, messageDef, revisedMessage;
var currentMessage = document.chat.comment.value;

if(currentMessage==messageDef){currentMessage='';}
revisedMessage = currentMessage+addSmilie;
document.chat.comment.value=revisedMessage;
document.chat.comment.focus();
return;
}
</script>

What are you waiting for?? Save it quickly and see the live preview.. ;)

Tags: , , ,
Posted in Design | 4 Comments »

Cascading Style Sheet (CSS) Basic Knowledge

Saturday, May 30th, 2009

You can find many tutorial and explanation regarding CSS in the entire world wide web. And this post is one of them. But this is only the basic knowledge.

What is CSS?

  • CSS stands for Cascading Style Sheets
  • Styles define how to display HTML elements
  • Styles are normally stored in Style Sheets
  • Styles were added to HTML 4.0 to solve a problem
  • External Style Sheets can save a lot of work
  • External Style Sheets are stored in CSS files
  • Multiple style definitions will cascade into one

Cascading order – What style will be used when there is more than one style specified for an HTML element?

Generally speaking we can say that all the styles will “cascade” into a new “virtual” style sheet by the following rules, where number four has the highest priority:

  1. Browser default
  2. External style sheet
  3. Internal style sheet (in the head section)
  4. Inline style (inside an HTML element)

So, an inline style (inside an HTML element) has the highest priority, which means that it will override a style defined inside the <head> tag, or in an external style sheet, or in a browser (a default value). (Source: w3schools)

Allright, i already made a HTML page to displaying the explanation about CSS in a simple way. Just click this link:

 CSS Cheat Sheet

If you still feelin hard to understand, dont mind to post your question here. I will try to answer it quickly.

Tags: , , , ,
Posted in Design | No Comments »

43 Web Design Mistakes

Friday, May 29th, 2009

There are several lists of web design mistakes around the Internet. Most of them, however, are the “Most common” or “Top 10” mistakes. Every time I crossed one of those lists I would think to myself: “Come on, there must be more than 10 mistakes…”. Then I decided to write down all the web design mistakes that would come into my head; within half an hour I had over thirty of them listed. Afterwards I did some research around the web and the list grew to 43 points.

The next step was to write a short description for each one, and the result is the collection of mistakes that you will find below. Some of the points are common sense, others are quite polemic. Most of them apply to any website though, whether we talk about a business entity or a blog. Enjoy!

1. The user must know what the site is about in seconds

Attention is one the most valuable currencies on the Internet. If a visitor can not figure what your site is about in a couple of seconds, he will probably just go somewhere else. Your site must communicate why I should spend my time there, and FAST!

2. Make the content scannable

This is the Internet, not a book, so forget large blocks of text. Probably I will be visiting your site while I work on other stuff so make sure that I can scan through the entire content. Bullet points, headers, subheaders, lists. Anything that will help the reader filter what he is looking for.

3. Do not use fancy fonts that are unreadable

Sure there are some fonts that will give a sophisticated look to your website. But are they readable? If your main objective is to deliver a message and get the visitors reading your stuff, then you should make the process comfortable for them.

4. Do not use tiny fonts

The previous point applies here, you want to make sure that readers are comfortable reading your content. My Firefox does have a zooming feature, but if I need to use on your website it will probably be the last time I visit it.

5. Do not open new browser windows

I used to do that on my first websites. The logic was simple, if I open new browser windows for external links the user will never leave my site. WRONG! Let the user control where he wants the links to open. There is a reason why browsers have a huge “Back” button. Do not worry about sending the visitor to another website, he will get back if he wants to (even porn sites are starting to get conscious regarding this point lately…).

6. Do not resize the user’s browser windows

The user should be in control of his browser. If you resize it you will risk to mess things up on his side, and what is worse you might lose your credibility in front of him.

7. Do not require a registration unless it is necessary

Lets put this straight, when I browse around the Internet I want to get information, not the other way around. Do not force me to register up and leave my email address and other details unless it is absolutely necessary (i.e. unless what you offer is so good that I will bear with the registration).

8. Never subscribe the visitor for something without his consent

Do not automatically subscribe a visitor to newsletters when he registers up on your site. Sending unsolicited emails around is not the best way to make friends.

9. Do not overuse Flash

Apart from increasing the load time of your website, excessive usage of Flash might also annoy the visitors. Use it only if you must offer features that are not supported by static pages.

10. Do not play music

On the early years of the Internet web developers always tried to successfully integrate music into websites. Guess what, they failed miserably. Do not use music, period.

11. If you MUST play an audio file let the user start it

Some situations might require an audio file. You might need to deliver a speech to the user or your guided tour might have an audio component. That is fine. Just make sure that the user is in control, let him push the “Play” button as opposed to jamming the music on his face right after he enters the website.

12. Do not clutter your website with badges

First of all, badges of networks and communities make a site look very unprofessional. Even if we are talking about awards and recognition badges you should place them on the “About Us” page.

13. Do not use a homepage that just launches the “real” website

The smaller the number of steps required for the user to access your content, the better.

14. Make sure to include contact details

There is nothing worse than a website that has no contact details. This is not bad only for the visitors, but also for yourself. You might lose important feedback along the way.

15. Do not break the “Back” button

This is a very basic principle of usability. Do not break the “Back” button under any circumstance. Opening new browser windows will break it, for instance, and some Javascript links might also break them.

16. Do not use blinking text

Unless your visitors are coming straight from 1996, that is.

17. Avoid complex URL structures

A simple, keyword-based URL structure will not only improve your search engine rankings, but it will also make it easier for the reader to identify the content of your pages before visiting them.

18. Use CSS over HTML tables

HTML tables were used to create page layouts. With the advent of CSS, however, there is no reason to stick to them. CSS is faster, more reliable and it offers many more features.

19. Make sure users can search the whole website

There is a reason why search engines revolutionized the Internet. You probably guessed it, because they make it very easy to find the information we are looking for. Do not neglect this on your site.

20. Avoid “drop down” menus

The user should be able to see all the navigation options straight way. Using “drop down” menus might confuse things and hide the information the reader was actually looking for.

21. Use text navigation

Text navigation is not only faster but it is also more reliable. Some users, for instance, browse the Internet with images turned off.

22. If you are linking to PDF files disclose it

Ever clicked on a link only to see your browser freezing while Acrobat Reader launches to open that (unrequested) PDF file? That is pretty annoying so make sure to explicit links pointing to PDF files so that users can handle them properly.

23. Do not confuse the visitor with many versions

Avoid confusing the visitor with too many versions of your website. What bandwidth do I prefer? 56Kbps? 128Kbps? Flash or HTML? Man, just give me the content!

24. Do not blend advertising inside the content

Blending advertising like Adsense units inside your content might increase your click-through rate on the short term. Over the long run, however, this will reduce your readership base. An annoyed visitor is a lost visitor.

25. Use a simple navigation structure

Sometimes less is more. This rule usually applies to people and choices. Make sure that your website has a single, clear navigation structure. The last thing you want is to confuse the reader regarding where he should go to find the information he is looking for.

26. Avoid “intros”

Do not force the user to watch or read something before he can access to the real content. This is plain annoying, and he will stay only if what you have to offer is really unique.

27. Do not use FrontPage

This point extends to other cheap HTML editors. While they appear to make web design easier, the output will be a poorly crafted code, incompatible with different browsers and with several bugs.

28. Make sure your website is cross-browser compatible

Not all browsers are created equal, and not all of them interpret CSS and other languages on the same way. Like it or not, you will need to make your website compatible with the most used browsers on the market, else you will lose readers over the long term.

29. Make sure to include anchor text on links

I confess I used to do that mistake until some time ago. It is easier to tell people to “click here”. But this is not efficient. Make sure to include a relevant anchor text on your links. It will ensure that the reader knows where he is going to if he clicks the link, and it will also create SEO benefits for the external site where the link is pointing.

30. Do not cloak links

Apart from having a clear anchor text, the user must also be able to see where the link is pointing on the status bar of his browser. If you cloak your links (either because they are affiliate ones or due to other reasons) your site will lose credibility.

31. Make links visible

The visitor should be able to recognize what is clickable and what is not, easily. Make sure that your links have a contrasting color (the standard blue color is the optimal most of the times). Possibly also make them underlined.

32. Do not underline or color normal text

Do not underline normal text unless absolutely necessary. Just as users need to recognize links easily, they should not get the idea that something is clickable when in reality it is not.

33. Make clicked links change color

This point is very important for the usability of your website. Clicked links that change color help the user to locate himself more easily around your site, making sure that he will not end up visiting the same pages unintentionally.

34. Do not use animated GIFs

Unless you have advertising banners that require animation, avoid animated GIFs. They make a site look unprofessional and detract the attention from the content.

35. Make sure to use the ALT and TITLE attributes for images

Apart from having SEO benefits the ALT and TITLE attributes for images will play an important role for blind users.

36. Do not use harsh colors

If the user is getting a headache after visiting your site for 10 consecutive minutes, you probably should pick a better color scheme. Design the color palette around your objectives (i.e. deliver a mood, let the user focus on the content, etc.).

37. Do not use pop ups

This point refers to pop ups of any kind. Even user requested pop ups are a bad idea given the increasing amount of pop blockers out there.

38. Avoid Javascript links

Those links execute a small Javascript when the user clicks on them. Stay away from them since they often create problems for the user.

39. Include functional links on your footer

People are used to scrolling down to the footer of a website if they are not finding a specific information. At the very least you want to include a link to the Homepage and possibly a link to the “Contact Us” page.

40. Avoid long pages

Guess what, if the user needs to scroll down forever in order to read your content he will probably just skip it altogether. If that is the case with your website make it shorter and improve the navigation structure.

41. No horizontal scrolling

While some vertical scrolling is tolerable, the same can not be said about horizontal scrolling. The most used screen resolution nowadays is 1024 x 768 pixels, so make sure that your website fits inside it.

42. No spelling or grammatical mistakes

This is not a web design mistake, but it is one of the most important factors affecting the overall quality of a website. Make sure that your links and texts do not contain spelling or grammatical mistakes.

43. If you use CAPTCHA make sure the letters are readable

Several sites use CAPTCHA filters as a method of reducing spam on comments or on registration forms. There is just one problem with it, most of the times the user needs to call his whole family to decipher the letters.

Tags: , , ,
Posted in Design | 3 Comments »

Firefox 3 Tweaks

Thursday, May 28th, 2009

Firefox 3 one of the maximum downloaded open source browser which has set a Guinness world record. Their were Over 8,000,000 downloads in 24 hours!. Along with Firefox 3 Spreadfirefox also got new cool look.

Firefox 3 about:config file is the core configuration file of Firefox. By editing about:config file we can get amazing hacks for Firefox 3. Firefox allows the users to change many preferences in the about:config file so it’s totally ethical to do it.Here is list of 21 Firefox 3 hacks & tweaks.

To get the Firefox 3 configuration file type “about:config” at the address bar.

aboutconfig1

Here is List of about:config hacks for Firefox 3 :

1) Disable Extension Compatibility Checks

extensions.checkCompatibility = False


extensions.checkUpdateSecurity = False

2) Location Bar (Set number Auto Complete URL at Address Bar)

This is a good hack to trim down that huge auto-complete list on your URL bar. By default it displays maximum 12 URL

browser.urlbar.maxRichResults = #

Enter Number at # (3,10,12 etc)

3) Stop Displaying Website Icon (Favicon) in Address bar & On Tab

browser.chrome.site_icons = False

4) Disable Prefetch (Helpful for frequent Google searcher, low-speed internet connection or low RAM)

network.prefetch-next = False

5) Extend Spell check to forms

layout.spellcheckDefault = 2

Change Value from 1 to 2

6) Disable Blinking Text

browser.blink_allowed = False

7) Speed Tweaks

network.http.pipelining false to true
network.http.pipelining.maxrequests 30 to 8
network.http.max-connections 30 to 96
network.http.max-connections-per-server 15 to 32
network.http.max-persistent-connections-per-server 6 to 8
network.http.pipelining.ssl false to true
network.http.proxy.pipelining false to true

8 ) Disable Annoying Browser Behavior

dom.disable_window_open_feature.menubar
dom.disable_window_move_resize
dom.disable_window_open_feature.titlebar
dom.disable_window_open_feature.toolbar

Set all of above to value False

9) Remove Tab Close Button from all Tab and set A single Close Button at Right

browser.tabs.closeButtons = 3

10) Disabler Browser Toolbar Tip

browser.chrome.toolbar_tips = False

11) Show More Tabs on Single Firefox Window before Scrolling

browser.tabs.tabMinWidth = 75

Setting lesser value with reduce Tab width

12) Past Copy Content with Middlemouse Click

middlemouse.paste = True

13) Scroll webpage in One Go

mousewheel.withaltkey.action=1

14) Disable Delay Time While Installing Firefox Add-on 

security.dialog_enable_delay = 0

(Zero is number of seconds Firefox should wait while installing Add-on)

15) Increase History Undo Close Tab Limit ( Recently Closed Tabs )

browser.sessionstore.max_tabs_undo=15

By default you can undo 10 recently closed tabs inorder to increase your history closed tabs. Change number 13 to as per your choice.

16) Open Firefox Default Search Bar Result in New Tab 

browser.search.openintab=True

17) Right Click View Source in Your Favorite Editor 

view_source.editor.external=True
view_source.editor.path= Path of Editor

(e.g. path C:\Program Files\npp.4.8.2.bin\notepad++.exe)

18) Enable/Disable Single Click to Select Whole URL in Address bar

To Enable Single Click Select URL of address bar use the below about:config Tweak 

browser.urlbar.clickSelectsAll = True

To disable Single Click Select 

browser.urlbar.clickSelectsAll = False

19) Emule/ed2k link association (Linux users)

network.protocol-handler.app.ed2k= /usr/bin/ed2k
network.protocol-handler.external.ed2k = true

20) Fast Scrolling Across Tabs

toolkit.scrollbox.scrollIncrement =75

( 75 is number of pixels to scroll at a time when scrolling the tab strip’s scrollbox. (Default: 20)

21) Auto Complete URL while You type at address Bar

browser.urlbar.autoFill=True

Many of above about:config hacks are available in Older Firefox Version, at the end if some thing goes wrong then feel free to restore your about:config to older setting see the below image of how to restore about:config

restore-about-config

Hope you guys like this Firefox 3 hacks, If you have any tips or hacks related to Firefox 3 about:config, hacks, tweaks do let me know I will include it in above list.

Tags: , ,
Posted in Computer & IT | 1 Comment »