In this post I will list some of the most important paths a designer should embrace when designing a user interface or optimizing one.

Make your Call to Action buttons visible

I’ve visited many websites with this problem: Inaccessible or low visibility Call-to-Action buttons. When designing a page, a user interface – the first thing you must consider is the placement of your CTA buttons. In this way you will get the right feedback from your CTA buttons. Then, it matters how the buttons look – usually we should make the buttons stand-out and be easy to identify from the content.

Reduce the number of clicks

I’m not that picky regarding this matter, but when I have to click 7-8 times in order to download a file – that poses as a big problem. As a practice, I tend to keep my clicks in the websites I make – around 3-4. In this way you force yourself not only to create a better user experience, but also to have a good architechture behind your site.

Define a goal

Every website should have a goal. By setting that in the beginning you save precious time both from yourself and the user. Also try and lead the user to the same goal through elements in your user interface. This can only mean less wasted time for the user.

Speed-up your website

Another criteria against wasting users’ time is to have a fast site. This means that the user will focus on finding the content instead of waiting for the content to load. There are numerous resources on how to improve your site speed. So please consider speeding-up your site.

Conclusion

Having these ideas in mind, you will achieve a nice user experience which can be translated into less wasted time and productive interaction. Cheers!

A step into FlairBuilder

For users that are familiar with wireframing tools, FlairBuilder will look close to standard from the functionality point of view. It has a simple user interface focused around the canvas, having the main components, interaction and hierarchy displayed in the right side. In this way you can easily drag your desired components onto the canvas and create your wireframes.

For those of you less familiar with this type of applications, FlairBuilder has prepared a startup project that has most of the functionality enabled. In this way you can learn very fast from examples how to create wireframes and prototypes using FlairBuilder.

Interactive Sketches. Usually, with a wireframing tool all you can achieve is a static result, represented by lines and shapes. With FlairBuilder this changes because you have the ability to add events and make your wireframes interactive.

To add interaction to your wireframe and turn it into a prototype, all you have to do is to drag and drop the component on your canvas. With your component selected you can easily add events in the Event section from the right sidebar. Keep in mind that not all components can have events attached.

Working with FlairBuilder

Now that you know a little about the product, I want to share with you some personal thoughts about the application. For other information, please check www.FlairBuilder.com and you might as well try the online demo of the application.

The Good

Productivity. The first thing that I want to mention is the productivity. Being able to choose from a variety of components makes your life a lot easier and you can rapidly turn your ideas into draft demos.

Easy to Use. FlairBuilder has a simple interface and because of that, you don’t have to be a genius to work with this application. As an estimation, I would say that an average user will get used to the application in 2-4 hours.

Great Feedback and Support. Even though FlairBuilder is a young application, the feedback and support is almost beyond reproach. I’m saying “almost” because it is a one-man-show application and not all requests are integrated, but all requests are considered.

The Bad

Inconsistent UI. Although FlairBuilder is an application dedicated primarily to designers, the user interface has some glitches. It has a feeling of inconsistency. Probably in the near future the UI will have a bigger priority since the application is stable and it has a lot of features.

…and the Conclusion

To summarize this review, we can say that FlairBuilder is a good alternative in the wireframing industry and a possible leader in the prototyping area. With constant additions to the functionality, the application can only expect positive reactions from the wireframing and prototyping users.

FlairBuilder Home Page: www.FlairBuilder.com
FlairBuilder Demo: http://www.flairbuilder.com/demo/
FlairBuilder on Twitter: http://www.twitter.com/flairbuilder

I would also like to say Kudos to Cristian Pascu, the creative developer behind FlairBuilder. Make sure to check the website for promotions and giveaways. For December you will get a 20% discount. Cheers!

1. Warcraft 3

You can’t say game trailers without mentioning Blizzard Entertainment. It is the company that practically made the transition from simple announcements to cinematic experiences. And the first trailer that I will always remember is Warcraft 3.

2. Starcraft 2

The second title in is the next Starcraft installment from Blizzard Entertainment. And although there isn’t much action and involved in this trailer, the result was astonishing.

3. Halo 3

Master Chief running and some kind of shield are the main attraction points in this opening clip for Halo 3. Awesome work even with this short trailer.

4. Halo Wars

“This is Spartan Group Omega. If they want war, we’ll give ‘em War”. Great line and also some nice graphics involved in this trailer.

5. Neverwinter Nights 2

Another good action trailer is the Neverwinter Nights 2 trailer. A nice battle between a wizzard and some kind of monster. Very well handled and executed.

6. Warhammer Mark of Chaos

This is another trailer that has a well developed story and also the visual effects are crazy. Watch both movies contained in this video.

7. Assassins Creed 2

Everyone wants great stuff in this second installment of Assassins Creed. And it all starts with a realistic trailer.

8. Hellgate London

Creatures, glowing swords and a lot of action – Hellgate London is a great trailer indeed.

9. World In Conflict

This one is a nice war trailer but it gives me the chills. And the last aerial view is totally apocalyptic.

10. Diablo 3

I couldn’t let Diablo series behind. After all Diablo 2 had some great videos at that time. Diablo 3 follows the same recipe though it has more of a movie feeling.

Not many comments for these clips because each trailer speaks for itself.
Enjoy and Cheers!

1. Gmail

By far this is the first thing that I go to when I open my browser. I think I’m not the only person since checking your mail in our days is crucial to any professional.

2. Google Analytics

Yes, my name is Andy Gongea and I have a stats addiction. So, the next thing that I usually do is to verify Graphic Rating’s stats.

3. Blog Comments

This action is somehow related to the first one, since all comments are sent as an email. But, there are also the tweets that are counted and any activity on Twitter must be supervised.

4. Techmeme

By far the first news stop for me. It has the latest news from the tech world and as far as I know I’m kinda involved in that world.

5. BoxOfficeMojo

As I’ve told you I love stats and I also love movies. And what better destination than a site about new movie earnings. You can pick any one of my favorite movies and I can tell you how much it cost or the entire gross.

6. Smashing Magazine

One of the best web design stops ever. For me it is definitely a source of learning and sharing information.

7. Twitter

What can I say, this “hottie” is not in the first spots on my list. I like to tweet but with moderation. At first I was the excitement but now it is just a simple visit.

8. Techcrunch

I know that Techmeme is listed in the upper side of the post but Techcrunch remains the site for latest news about startups and technology.

9. Wordpress.org

This is somehow related to my projects. Lately I’ve been working with Wordpress a lot. In this case the site has become a constant destination every day.

10. Compete

This proves what I was saying about stats. Daily I’m back to Compete in order to see the stats for a particular website.

Bonus: Bing/Google

In the end, searching for information is a daily vital step. For this last stop Google and Bing are both great destination for reaching the information needed.

Now, it is your turn. What are your top daily web stops?
Cheers!

Sponsors:
- WPBest – The Best Premium Wordpress Themes, Pugins and More
- Wordpress Themes – WPStyles.org

Cheers!

1. Social Network Icon Pack

Designed by Rogie King from Komodo Media, the Social Network Icon Pack contains 80 refined, amazing social networking icons for the top networks around: Twitter, Facebook, Delicious, StumbleUpon etc. I’ve used this pack to create my spreading buttons and so far they’ve achieved their purpose.
Sizes: 16×16 and 32×32
Where to use: Blogging.

2. Function Icon Pack

One of the most comprehensive yet compact icon pack, and definitely one of the most used is Liam McKay’s Function Icon Pack. This guy is brilliant and his work is absolutely awesome. Function Icon Pack contains 128 icons that are suitable for multiple tasks related to blogging and web design.
Sizes: 48×48
Where to use: Web Design, Blogging.

3. Bright! Icon Set

Developed by the guys behind Icon Eden, Bright! is a great set of icons that can be used in various situations since it comes as a vector file. It has nice colors, 148 icons, great perspective and room for your creativity to put the icons at best use.
Sizes: all
Where to use: Web Design, Blogging.

4. 32px Mania

With 179 slick icons, 32px Mania is one of the best icon packs dedicated to user interface designing. All icons have a nice Apple-ish touch and can be easily integrated in designs. Of course you can use this pack not only in UI but in other task that you’ll find it usable.
Sizes: 32px
Where to use: User Interface Design, Blogging

5. Led Icon Set

This pack is the only mega pack presented in this list. I usually don’t like big packs because most of the times they contain duplicate icons. This is not the case with Led Icon Set design by Marcis Gasnus because LED has 512 great icons that will cover all areas without being redundant.
Sizes: 16px
Where to use: User Interface Design

6. Project Icon Set

This one is a small package that contains no more than 18 icons. The main advantage of Project Icon Set is that it can be applied in multiple areas even if it represents project management related icons. Cheers to Deziner Folio for providing this nice icon set.
Sizes: all
Where to use: Web Design, Blogging

Conclusion

I didn’t enter my Quartz Icon Pack here because it isn’t mature enough. Maybe after 100.000 downloads . Kudos for all designers making designing a better activity and cheers to all icon designers!

Tutorial Requirements

1. Launching Pencil

In order to start Pencil Addon, you must start first Mozilla Firefox. After that, you must select from the Menu Bar the Tools section and then find and press Pencil Sketching

2. Setup Page

After you launch Pencil, you will see a blank page with certain width and height that are relative to your screen size. To set your page the way you want you can Right Click on the Untitled Page tab and select Properties. Here you can customize the width, height and title of the page.

3. Analyzing Twitter Layout

Twitter is built onto a 2 columns layout. In the top side of the layout (header) it has a logo and a navigation menu. In the left side it has a big input text element and the tweets, while in the right side (sidebar) it has the mini-profile and different other links.

Our task is to create a simple wireframe with Pencil that will look like Twitter from the structure perspective. So basically we will use only block elements that will represent each of the user interface components. That is the main idea behind wireframing – creating an outline that will be used as guideline in the design process.

4. Creating the 2 Columns

In order to start our wireframe, we will need to drag a rectangle element from the left sidebar onto the canvas (page). In the standard form it has a blue fill color. We will have to Right Click on the rectangle and change the Properties to a white rectangle with a 1 pixel solid black border. Then, we will set its size for the left column and then we will copy&paste it in order to create a smaller column for the sidebar.

After creating these 2 rectangles your canvas should look like this:

5. Creating the Header

Now, we will have to create 2 new elements that will serve as the header: logo and navigation. As I’ve told you, we will use just block elements so the logo will be represented by a rectangle as well. So in this step we will make the same action as in the previous step: copy rectangle elements and shape them and place them properly as logo and navigation.

In addition we will add some text inside the rectangles that will tell us what element is there. For the logo we will use … logo and for the navigation we will actually write similar menu elements as Twitter.

To insert text inside the rectangles we will have to Double Click on them. After we enter the text that we want, we can Right Click on the element and select Properties. From here we can go to the Text tab and change the way the text is displayed – color, font, size.

These elements are common in most pages on Twitter – profile page, reply page, direct message page. So in order to boost our productivity, we will create new pages that will have the background our current page. In this way on the other pages we will add only the particular elements.

6. Creating an Finalizing the Main Page

From the top right side of the canvas we can press New Page button in order to create a new page.

The only difference compared to the first page screen is that now we will set the background as our Twitter page. Now all we have to do is to add the rest of the elements to the stage. Keep in mind that the elements from the background can only be modified inside the background page.

After adding all the other element from the page using rectangle, text and line elements, here the final wireframe of Twitter created using Firefox Pencil Addon.

Conclusion

Overall, this addon is quite useful and after half an hour inside Pencil you will know most of the functionality. Cheers for the developers behind this project and have fun working with Pencil. Cheers!

We will start by saying KUDOS to all web developers that are constantly creating mind blowing Firefox plugins. They are the real force behind the Firefox phenomenon along with the guys from Mozilla Foundation. And now let’s start sharing some information on Bulletproofing your Firefox for Web Design

1. Firebug

Firebug is “the” extension for Firefox. You can easily say that Firebug is one of the sources of popularity for Firefox among web designers and web developers. That’s because it is simply the best web development tool that lets you edit, change and visualize the changes in real time. It has a ton of features and it will save you time on debugging and enhancing your work.

2. Web Development Toolbar

Web Developer Toolbar is the second extension that I always install. It has some very nice features that are complementary to Firebug and some similar but more effective. Together these 2 will make web development painless.

3. YSlow

This addon is actually a plugin for Firebug. It is a tool developed by the guys from Yahoo!. It has very nice features and tips that will tell you how to make your site faster. Also, Smushit is now a part of YSlow, which helps you to compress your site images.

4. Colorzilla

There are numerous times when you want to pick a certain color from a website. Colorzilla takes the pain of editing a screen shot in order to find the code of the color. Now, while you browse you can easily get a color using the eye dropper from Colorzilla addon.

5. Fireshot

Annotation and collaboration on designs are now possible with the help of FireShot. FireShot is not only a Firefox addon but also a standalone product. It is simple to use and very effective. Just add your notes, save the image and send it.

6. Pencil

The wireframing task is now possible inside Firefox. I know that this sounds pretty amazing and it actually is. Firefox is a great platform and now because of that, now you can find multiple addons that are competitors to standalone commercial applications.

7. IE View / Opera View / Safari View Win / Chrome View

These plugins allow you to open the current web site in one of the following browsers: Internet Explorer, Opera, Safari and Chrome. There is one small requirement for these plugins. That is to have all the mentioned browsers installed.

8. CodeBurner

This plugin provides an easy access to HTML and CSS reference information and code samples. It is easy to use and you may gain time by using it instead of surfing randomly the web.

Conclusion

That’s it! You can debug sites, you can make wireframes, you can collaborate, you can test for cross browsing, you have access to quality reference. This is life, from time to time you have to open Photoshop to complete visual tasks. Hopefully this will help you in your web design career. Cheers!

1. Never stop learning new things

Being in a domain where trends are easily becoming past, a web designer should constantly try to keep up with the latest approaches. From logo design up to user interfaces, you should search for various samples and see what is new and what is not. Also even if something is not useful to you, try and replicate it and after that you will definitely remain with some new ideas or skills.

2. Accept a second opinion

By nature, as web designers, we have been blessed with a significant amount of stubbornness. I know because I have plenty of it. And you will see that in the first years of web design, we have the ability to be immune to criticism and second opinions. That is wrong because most of the time we cannot see the forest for the trees.

3. Always take a step back

This idea is pretty simple: from time to time during a project try and relax and detach yourself from the design part. For example you can do that by reading a book, seeing a movie, a walk in the park or any other activity. This will make you see better the current flaws or wrong approaches in your design. Even a simple step back from the computer and a view towards the monitor from 3 feet away will send you informative feedback.

4. The Developer is not always wrong, you know…

Another great ability of a web designer is to be able to discuss in contradiction with somebody … preferably a web developer. And 99.99% of the time we are positive that the web developer is wrong. Believe me, we are so wrong.

5. Follow the news

In any field of activity you must follow the news constantly. This is a verified statement, because in many projects I’ve used some services or information that I’ve read about on a design news channel. So keep reading the news because it can make a difference in the web design industry.

6. Learn to filter

These days there are multiple sources of information, numerous dedicated websites, personal blogs etc. You have to learn how to filter the good stuff from the junk. Scan as much as you can but digest only the good stuff. This thing is critical because it will make you see the good content and it will save time by not reading trash.

7. Always use pen and paper

Even with so many niche applications that are available online, I still use the pen and paper on every project. I do it because the pen is the only item that can render properly what’s in my mind. So using a pen and paper will keep you closer to your ideas. It works for me.

8. Study other designers

Another great thing that you should consider is to study great web designers. Zeldman, Molly, Meyer, Shea, Moll, Croft, Snook should mean something to you not just names. Study their work, follow their activity. These actions will result in valuable web design knowledge.

9. Always buy the photos you use

I know that clients still believe that Google is the biggest provider for images but they are wrong. Not only that this is the thing to do, but by purchasing great pictures you add value to the web design ecosystem. In this way quality content is provided and promoted at the same time.

10. Listen to your mother

I can’t say anything that will link this statement to web design, unless your mom is a great web designer. The idea is simple to listen to your mother cause she wants what’s best for you. So, stop wasting time and do something with your life not web designing. – I think this is my mom talking and not me.

No conclusion for this post. Cheers!

The price should not be the deciding factor

The biggest mistake is also the most common mistake. A lot of people stare themselves blind on the pricing without thinking about what they are getting for their money. Sure, it is possible to find cheap hosting that is qualitative and stable but the price should not be the deciding factor. What should matter the most is what features that are included in the plan, often you will only have to add a couple of dollars to get that extra oomph that you so desperately need.

Are you able to grow with your provider?

One obvious reason for having a website is letting it grow bigger and increase in number of visitors. In the start-up period you will have very limited needs, and hence a regular shared hosting account might be sufficient but as the site grows so will your hosting plan have to do. Make sure that it is easy to upgrade your hosting account. So, if you have big plans for the site – avoid web hosts who specialize in only plan as they can be a hassle when you need to do an upgrade.

Check their reputation

A very easy way to make sure that you pick a great web host is in checking up their reputation beforehand. Browse web hosting forums to see what people think about their web hosts or ask your friends what they think about their hosting plans. Do not believe all the testimonials that you see on the web host’s own page as it is most likely phony testimonials. A good idea is visiting the Better Business Bureau website to get info on anything from the management to the customer complaint history.

Conclusion

It is quite vital to know the reputation, features and diversity in plans before checking the price. So, here you have 3 things to look for before purchasing a hosting plan. Keep in mind that these are not the only things that are important, and we will try to cover the rest in other posts. Cheers!

Things I Love in Web Design:

1. Web Design Community Sites
With sites like A List Apart, Smashing Magazine, Digital Web or Envato Tuts network it is pretty hard not to love web design.

2. Content Management Systems
CMS have been the engine of web design in the last 2 years helping the Internet to evolve rapidly. There are so many that you will for sure find one that is suitable for you.

3. Google Analytics
This is the third most visited site for me after my mail account and my website. I just love the pie-charts and timeline based information.

4. CSS Galleries
Although there are a ton of CSS galleries out there, you can always find good inspiration resources in these sites, especially now when there are many niche ones.

5. Good Freebies
I really enjoy from time to time a good freebie: a Wordpress theme, an icon pack, a CSS template etc. Also from time to time I enjoy creating one and see the feedback.

6. Typography – I love this thing because there are very few designers in the entire world that are extraordinary with web typography.

7. Optimizing for Performance
I really love this area of Web Design because it makes you think of different ways to improve your site speed.

8. Wordpress
Although you may say that Wordpress can be a part of the second love argument I disagree. Wordpress is something apart, beyond the concept of a CMS. Wordpress is pure awesomeness.

Things I Hate in Web Design:

1. Offending Comments
I hate the comments that cross the line of a negative or contradictory comment. Usually comments should stay relative to the article. I know I had a couple of offending comments online so far and for that I’m sorry.

2. Internet Explorer 6
I’ve had my share of pain because of IE6 so I really hate it right now. And based on the latest reactions across the web, I’m sure I’m not the only one.

3. CSS Inconsistency
Even after 10 years – CSS 2 is not rendered the same way in browsers. This says something about the different directions that the major browsers had along the years.

4. Opera Marketing Team
Opera is a great browser but the marketing team assigned to assist Opera is far from creative, competitive or productive.

5. Same Template on Multiple Sites
A template is a starting point for a web site. It helps you get rid of the hard part. Today, templates are a final “starting point” which is why many pages look the same.

6. Lists Articles
I hate the articles that have no original content – just a description from Wikipedia, a link and an image. At least create the description yourself.

7. Plagiarism
Whenever a site gets famous, there are 20 designers ready to clone it. No further comment.

8. SPAM
According to spammers, web designers have a small penis, erection problems and the list can continue. We really have some problems.

9. Google Adsense
Although it is an important source of income for many blogs, those text ads are annoying as hell and they break the user experience on a web site.

Conclusion

In the end every domain has its drawbacks and advantages, but that doesn’t make me love Opera Marketing Team. Cheers!

Shared Hosting – Cheap and Qualitative

The most popular form of web hosting on the market today is shared hosting. The hosting is affordable and if signing up with any of the well-known and trustworthy web hosts you can be sure that it will be of great quality as well. As mentioned is shared hosting very affordable, only setting you back a few dollars per month, and the reason for its low fees is simply that you will share the server with a number of other websites. A couple of things that are good to look up in advance is if you will get enough, disk space, bandwidth, if a user-friendly control panel is included and if their uptime is satisfying. This type of hosting is good for all of you with a private website or if you are running a small online website.

Dedicated Servers – La crème de la crème

If you are looking for hosting that is suitable for a major online website you will have found your match in dedicated servers, aka dedicated web hosting. As its name gives away, you will have a server that is working solely for you and your website. This equals quality, security and a stable website. As the server is stored within the premises of the web host you will not have to bother with any maintenance or giving up any physical space for storing it. Remember that dedicated hosting comes in two different forms: managed and unmanaged. Unmanaged dedicated hosting is the pick for you with a lot of techy experience and want to be in total control; otherwise pick managed dedicated web hosting.

VPS Hosting – Something In-Between

Many people are looking for a web hosting alternative that lays somewhere in-between shared hosting and dedicated hosting. A majority of these people end with a virtual private server, VPS hosting. This type of hosting is great in the way that it splits one single server into multiple virtual servers, making it stronger and more customizable than shared hosting. Many medium-sized businesses use this form of web hosting for their websites.

Cloud Computing – Adaptive Hosting

This is perhaps the trendiest alternative in the web hosting industry at the moment. What really makes cloud computing stand out is in the way that it is elastic. Your website will be backed up by as much hosting as it requires. As a consumer you only have to pay for the amount of web hosting that you have been using, meaning that your bills be higher some months and lower others. It is very easy to use as well; the service is entirely managed by the provider.

Green Hosting – Eco-Friendly

If you want to do something for the environment you should start looking for green hosting for your website. What web hosts offering green hosting do is either purchasing carbon offsets or uses eco-friendly and energy efficient servers. Green hosting is almost exclusively shared hosting which means that it is good for individuals as well as small businesses.

For additional information, drop a comment, a question and we will be happy to help you. Or, you can check the Web Hosting Search site for in-depth information and resources. Cheers!

Validators

1. HTML Validator
http://validator.w3.org/
This HTML Validator – checks the markup validity of Web documents in HTML, XHTML, SMIL, MathML, etc.

2. CSS Validator
http://jigsaw.w3.org/css-validator/
The CSS Validator – validates CSS stylesheets or documents using CSS stylesheets.

3. Links Validator
http://validator.w3.org/checklink
The Link Checker analyzes anchors (hyperlinks) in a HTML/XHTML document. Useful to find broken links.

4. RSS Feed Validator
http://validator.w3.org/feed/
This is the W3C Feed Validation Service, a free service that checks the syntax of Atom or RSS feeds

5. Free Site Validator
http://freesitevalidator.com/
This service scans your entire site for validation errors and dead links and generates report status in real time.

Accessibility

6. WebAIM Wave
http://wave.webaim.org/
Wave is my favorite Accessibility service – it shows you the mistakes and it is quite productive.

7. Functional Accessibility Evaluator
http://fae.cita.uiuc.edu/
Use this tool to evaluate the functional accessibility of your web site.

8. Hera
http://www.sidar.org/hera/
HERA is a tool to check the accessibility of Web pages accoridng to the specification Web Content Accessibility Guidelines(WCAG 1.0).

Cross Browser Testing

9. Xenocode
http://www.xenocode.com/Browsers/
Using Xenocode you can run any browser you want. Yes, even IE6, IE7 and IE8 simultaneous.

10. Browsershots
http://browsershots.org/
A great service for testing your site on all browsers on most operating systems.

11. IeTester
http://www.my-debugbar.com/wiki/IETester/
This is a tool that incorporates all version of IE in one desktop application.

12. Microsoft Expression SuperPreview
http://www.microsoft.com/expression/
The new tool from Microsoft is designed to help you compare your site on different browsers.

Website Performance Testing

13. Pingdom Tools
http://tools.pingdom.com
Analyzing your website speed and breaking down the way elements are loaded.

14. YSlow
http://developer.yahoo.com/yslow/
The authority tool in optimizing your website and gaining additional speed.

15. Web Page Analyzer
http://www.websiteoptimization.com/services/analyze/
A simple yet very useful service that generates a report related to your website performance.
rel=”nofollow”

Conclusion

You can try and run these validators across your site and see what improvements you could add. I bet that everyone will find at least 10 improvements after checking with this services. Enjoy and Cheers!

…The Problem

So what seems to be the problem? The problem is that while these plugins are used in the site, they are useless in the front page. This means that every new user will see a slow webpage at first sight because of these plugins. The way to deal with this problem is to tell the plugins to load their stuff in the footer. In this way, the user will see the entire front page faster, while at the end of the loading time plugins’ stuff will get loaded.

The Solution

For now, the solution is to manually edit your plugins and change their position of rendering from header to footer. This is a tricky move because you must edit the plugins’ files. Another thing that you must consider is that you won’t find the same structure inside the plugins.

Steps to Solve Wordpress’ Speed Problem:

1. Navigate into the Plugins directory ( http://YourSite.com/wp-content/plugins/)
2. Edit the plugin’s .PHP file
3. Search where the fuction add_action is called
4. Change wp_head with wp_footer
5. Save, empty browser cache and reload broser.
7. View source and check

and The Result

After this operation, my footer contains 2 CSS (I coudn’t make the third CSS work ) files that were moved from the header and also 2 Javascript files. Also remember that the rest of the page below a Javascript link is blocked until the js file is loaded. So, as a conclusion, you can achieve better performance by putting the CSS on in the footer instead of the header for the secondary Wordpress elements (NOT the main style).

Cheers!

1. Wordpress

WordPress is a state-of-the-art publishing platform with a focus on aesthetics, web standards, and usability. WordPress is both free and priceless at the same time. – from Wordpress.org

There are 2 versions available for users:
- Wordpress.org (self hosted version) – You can download the package and install it on your hosting account
- Wordpress.com (no hosting needed) – You can create an account on Wordpress.com

2. Wordpress Cheat Sheets

Cheat Sheets are those documents that can help you when you want to save time. These files have all the basic information you need. And there are several good cheat sheets for Wordpress including my own.

1. My Wordpress Cheat Sheet
2. WPCandy Cheat Sheet
3. DBSWebsite Cheat Sheet
4. WPToy Cheat Sheet
5. Bueltge.de Cheat Sheet

3. Installing Wordpress

Although Wordpress is quite easy to install, there are many people that are less technical and that could use some tutorials on this topic. Here is a list with links to help you install your Wordpress instance.

6. Wordpress.org Codex – Installing Wordpress
7. Installing WordPress with FTP
8. HowToInstallWordpress.com
9. Sitground Wordpress Install
10. How to install Wordpress 2.8

4. Wordpress Tutorials

In this section I will list some of the most important tutorials from the blogosphere regarding Wordpress. Just watch some of these tutorials and they will boost your Wordpress skills. We will start with some very comprehensive tutorials on how to create a Wordpress Theme.

4.1 Theme Tutorials

Here you can find basic and some advanced instructions of how to create a Wordpress theme. It will take you some time before you know all the steps, but at the end you will see that the process has an intuitive flow.
11. So you want to create WordPress themes huh?
12. Designing for WordPress: Complete Series & Downloads
13. New WP Video Series
14. How to Create a Wordpress Theme from Scratch
15. Creating a Wordpress Template

4.2 Theme’s Menu Tutorials

Menus can be tricky depending on your needs. Here you have several tutorials about different types of menus. Dropdowns or Rounded Corner Menus are available in this next list, so make sure to check it.
16. Rounded Corner Tab Menu Using CSS
17. Making a Categories Drop-Down Menu
18. Wordpress: “Magazine style” Horizontal dropdown menu
19. WordPress Menu Tricks
20. Creating Two-Tiered Conditional Navigation in Wordpress

4.3 Comments Tutorials

The comments module is a tricky one. You will have to watch several tutorials in order to be familiar with the standard and threaded comments.
21. Separating Trackbacks from Comments
22. Unraveling the Secrets of WordPress’ Comments.php File
23. How to Highlight Author Comments in WordPress
24. Rearrange WordPress Comments (Latest On Top)
25. WordPress 2.7 Comments Enhancements

4.4 Advanced Tutorials

Here are some advanced Wordpress tutorials like: Control Panel for a custom theme, How to Build a Newsletter, Thumbnail Selection. For other advanced tutorial you should search the web because there are tons of tutorials dedicated to Wordpress.
26. How to make a control panel for your Wordpress theme
27. Build a ‘WordBurner’ Email Newsletter Manager using WordPress and FeedBurner
28. Build a Featured Posts Section for WordPress
29. Integrate a slideshow in your wordpress theme
30. Advanced Wordpress Thumbnail Selection

4.5 Plugins Tutorials

At some point in your Wordpress designer/developer timeline, the need for a plugin will come. Here are some introductory tutorials on how to create a plugin.
31. How to Make a Social Bookmarking WordPress Plugin – Step by Step
32. Writing a Plugin
33. How to Write a Wordpress Plugin
34. How to Create a Wordpress Plugin from Scratch
35. How to Create a Simple Wordpress Plugin

5. Wordpress Tips and Hacks

36. Hodgepodge of WordPress Tricks
37. WordPress Theme Hacks
38. 40+ Most Wanted Wordpress Tricks and Hacks
39. 20+ WordPress Recipes (Codes)
40. WpHacks

6. Wordpress Free Themes

41. Gallery

42. Facebook Theme

43. WP Premium

44. Magazeen

45. Modern Clix

46. Irresistible

7. Great Wordpress Books

The next Wordpress Book come from very talented designers and developers. Make sure to check some of these book for advanced topics and information.

47. WordPress for Business Bloggers – by Paul Thewlis
48. Wordpress Plugin Development – by Vladimir Prelovac
49. How To Be a Rockstar WordPress Designer – Collis Ta’eed & Harley Alexander
50. WordPress 2.7 Cookbook – Jean-Baptiste Jung

8. Awesome Wordpress Developers

51. Alex King
52. Chris Wallace
53. Elliot Jay Stocks
54. Adriaan Pienaar – Adii
55. Matt Mullenweg

9. Automattic – Wordpress Products Family

1. Akismet

Akismet, or Automattic Kismet, is a spam filtering service created by Automattic, the corporation which employs most of the main developers of the weblog platform WordPress, and released on October 25, 2005. Akismet attempts to filter link spam from blog comments and spam TrackBack pings.

2. Gravatar

A gravatar is quite simply an image that follows you from site to site appearing beside your name when you do things.

3. IntenseDebate

IntenseDebate is the premier commenting system available on the Internet for blogs and websites. IntenseDebate comments enhances and encourages conversation on your blog or website.

4. PollDaddy

PollDaddy provides polling and survey widgets to over 500,000 users around the world. Launching in October 06, we have gone from strength to strength and have grown to become the number one provider of poll widgets online. Our polls are used on social networks, blogs, corporate websites etc.

5. VideoPress

VideoPress is an upgrade that makes it easy to upload, embed, and share video on your WordPress.com blog or any site around the world, even in full HD.

6. P2

A group blog theme for short update messages, inspired by Twitter. Featuring: Hassle-free posting from the front page. Perfect for group blogging, or as a liveblog theme. Dynamic page updates. Threaded comment display on the front page. In-line editing for posts and comments.

7. BuddyPress

BuddyPress is a suite of WordPress plugins and themes, each adding a distinct new feature. BuddyPress contains all the features you’d expect from WordPress but aims to let members socially interact.

8. bbPress

bbPress is forum software with a twist from the creators of WordPress. bbPress is focused on web standards, ease of use, ease of integration, and speed. We’re keeping things as small and light as possible while still allowing for great add on features through our extensive plugin system.

Conclusion

I know your question: Where are the plugins? The plugins are not listed here because it would’ve made the article impossible to follow. Overall, the basic resources and tutorials from Wordpress were covered in this post. Hopefully this will be useful. Cheers!

July 21, 2009: Angel’s Landing – Zion National Park

- The Virgin River carved this dramatic canyon over 2,000 feet deep into sedimentary rock.
- Located on the Colorado Plateau, this park protects some of the most diverse ecosystems in the state of Utah.
- The trail up to Angel’s Landing is so steep that there is a guide rope for hikers to hold on to.

July 22, 2009: Atlanta Skyline – Corbis/Photolibrary

- Atlanta elected the nation’s first African-American mayor back in 1973
- Civil Rights leader Martin Luther King, Jr. was born and raised here in Atlanta
- Atlanta media mogul Ted Turner outraged movie purists when he started colorizing MGM classic films

July 23, 2009: Green Turtle , Maui, Hawaii – Reinhard Dirscherl/Visuals Unlimited, Inc.

- Hunting, habitat loss and pollution have landed the sea turtles on the endangered species list.
- You can find see turtles, humpback whales and hundreds of other critters right outside your door if you live here.
- Turtles and other sea creatures regularly get tangled up in a gigantic garbage vortex in the Pacific Ocean.

July 24, 2009: Melbourne, Australia – Jose Fuste Raga/Photolibrary

- This first official census (in 1836) reported 142 male citizens and only 35 female.
- The oldest train station in Australia sits here, on the far side of the Yarra River.
- Meet one of the most famous musicians to come from the 1970s Melbourne music scene (Nick Cave).

July 25, 2009: Arenal Volcano, Costa Rica – Radius Images/Photolibrary

- The Arenal Volcano’s most recent eruption wiped out two villages in 1968.
- Molten lava is actually melted rock – temperatures range from about 1,300 to 2,200 degrees Fahrenheit.

July 26, 2009: Rice worker in fields near Ubud, Bali, Indonesia – Sylvain Grandadam/Getty Images

- Bali is a primary destination for thousands of backpackers from countries around the World.
- Artistic expression is at the heart of Balinese culture, from bone carving to silversmithing to painting.
- Gunung Agung, Bali’s highest peak, is locally known as the “navel of the world”.

July 27, 2009: Castellon de la Plana, Spain — Digital Vision/Photolibrary

- The Moors invaded Spain in the year 711 and ruled for the next 500 years.
- James I of Aragon reclaimed Castellon de la Plana from the Moors in 1233.
- The Iberic Peninsula’s distinct culture comes, in part, from its proximity to North Africa.

In the end I want to say that these pictures are absolutely awesome. Kudos for every photographer and thanks Bing’s team for this feature. See ya next week with the second week of Bing’s Weekly Lectures. Cheers!

Cleaner UI 4.5 out of 5 stars

Pros:The new user interface has suffered major changes. The first change when it comes to the visual side is the logo. Not only the color is changed but also the position. In this way the logo has more spaced and it’s emphasized and also the search box is more visible. Overall Good Choice!

The left menu is the same as element but not as content. Now the menu’s elements are displayed in a clearer way, with bigger and more interesting icons. The rest of the UI has about the same structure with minor changes. Also the old right side menu, that had email, horoscope, events, messenger etc is gone.

No Cons for now.

Advanced Customization 4 out of 5 stars

Pros: The new interface has several items that can be customized. This is a great thing from my point of view because, it will keep the user on the site with the help of modules connected to other sites: Gmail, AOL Mail. So instead of having to check your Yahoo! Mail or Gmail account through their own addresses, now you can check your emails inside Yahoo!.

Cons:The downside of customization part is that there are only several sites that are integrated with the new interface. I was really surprised not to see Delicious among preferences and Twitter.

User Experience 4 out of 5 stars

This UX side of the site has been improved a lot. Now the left menu has noticeable visual feedback when you interact with it. Big blocks of the interface appear with a relative high contrast which make you responsive to the change. Good practices that will keep the user alert and interacting with the site.

Performance 3.5 out of 5 stars

Cons: The performance is something that bothers me with the new site. With all these customization and slick left menu, the performance took a hit. I’m quite confident that on slower machines, the site will not work well. But, I guess that with some patches and in time, the new interface will be fully optimized. For example, right now, not all the items from the left menu are part of a sprite image which is the right path.

Overall 4 out of 5 stars

I think this new redesign will make the visitors stay more on the site – increased time on site. Also, because of these customizable items, maybe the bounce rate will decrease and the number of visitors will rise – but this is still conditioned by the content. And as I said earlier – the site needs to improve its speed.

As a conclusion – Yahoo! has my vote. Cheer!

Website Link: White Pages
Techflash Article: WhitePages unveils $2.5 million Web site redesign
Cheer!