Talk More

17 Firefox Extensions That Make Blogging Easy

2011-06-21T18:56:00.000+05:30

The great thing about the Firefox browser is when you have a problem, there is usually a solution in the form of an extension. As a blog writer, I’ve been using a few that smooth out the experience and get rid of a few annoyances.

Here are a few suggestions.

Collecting

Google Notebook – Highlight the content you want to save, Note it with this extension. You can organize different ‘notebooks’ with their own sections. Each note will have a link back to the original website.

Session Manager – Great for doing research and rounding up a few sources. Save the session of tabs so you can come back to them later.

coComment – Keep tracks of comments you’ve left on other websites. This is particularly useful if the comment section is providing more resources than the actual post content.

Speak It – Have articles read out to you so you can do the dishes while researching. Not to be used while at the computer – speed reading = productivity. This extension uses the Microsoft TTS Engine.

DocuFarm – This is a cool extension that previews word, PDFs etc within Firefox. It comes with a search, which you can also use to search PDFs!

Writing

Scribefire – Performancing.com’s popular split-browser blog editor. Multiple blog management, categories and simple source editing. FTP Uploads are available but buggy. No good image support.

Deepest Sender – Very similar to ScribeFire, these two extensions lack greater features like image uploading, time-stamp editing and compatible tagging. Both are very easy to set up.

Resizable Text Area – If you stick with your regular blog editor, such as WordPress, this extension comes in handy to resize the text area quickly and freely.

Spellbound & Google Toolbar - Inline spell-check, ala Microsoft Word. Use the extension or Google Toolbar’s built-in spell-checker. Both work great. Superseded by Firefox 2′s built in spell check.

Tabinta – turns the Tab Button to a text editor spacing tab rather than cycling through the web forms. Only interacts with the text area, otherwise does the regular Firefox tabbing.

Split Browser – Great when copy and pasting content and URLs, this extension makes it easy to split any tab any which way. Put your editor in a ‘sidebar’ and continue surfing the other tabs in the other pane.

Copy Plain Text – This is a can’t-live-without extension for me. When I copy text, I don’t want any of the original site’s formating, links or text-link-ads to be copied over as well. Just the text. That’s what this extension does.

Copy As HTML Link - Use this extension in conjunction with Copy Plain Text to create links for your posts. Only make links when you want with the text you want.

Images

Web Developer – Other than View Source and those functions, Web Developer is great for getting image information like size etc. If a site is making it hard to get access to their images, use the View Image Information button to get all the images and their links. Respect copyright.

Snagit – to use with the SnagIt image capture application, this extension just makes it easy to start grabbing screenshots while still in Firefox.

Picnik - this web based app trumps SnagIt in many respects. With the Picnik extension you can grab a screenshot of the visible page, or the entire page, with one click. The same goes with any images on the web, including a button at Flickr.com.

Picnik is also a very good image editor. I don’t use anything else to edit images for articles. You can take any photo, from your computer, Flickr or Picasso account, or anywhere on the web, and start editing without downloading anything to your computer.

Please share any you have to add.

7-Step Process All Designers Should Follow To Complete Every Project

2011-06-21T18:21:00.002+05:30

As a graphic designer, you know your job entails helping your client sell their service or product. Your ultimate goal is to help viewers understand a message and, in turn, reap benefits for your client. Developing a process to follow each time you take on a new project can help tremendously in achieving results you and your client are happy with. Whether you’re a graphic designer, web designer, programmer or otherwise, having a system set up will help you get the work done faster in addition to keeping things organized and the designer/client relationship a positive one.

Project Initiation

One of the most important steps in the design process is accumulating the information you’ll need. This is usually achieved by either a face-to-face meeting with the client, a questionnaire, or even a Skype meeting if you really wish to establish a personal relationship with your client. In gathering this information, you now know your client’s objectives and can focus on the details for inclusion in your brief.

The Brief: Although it may seem like more work than necessary, a design brief has a couple of key benefits, no matter how big or small the project seems to you:

It ensures the client knows what he or she wants from the project
It acts as your point of reference during the project

The more information the client provides initially, the better the result for the both of you (especially the client). Topics for inclusion in the design brief may vary but a few good starting points may be:

Corporate Profile – A summary of the business
Market Position – An evaluation of the company’s service/product in relation to the competition.
Communication Task – What’s the message trying to be conveyed and through what means (e.g. taglines, body copy, photography, etc.)
Target Market – Demographics — the age, gender, income, employment, geography, lifestyle of those the client wants to reach.
Objectives – What quantifiable result does the client want to achieve?
Schedule/Deadline – A realistic schedule of how the project should proceed.

At this stage it’s also a good idea to accept a deposit for the first half of the project.

Research

After you’ve met with the client and have a firm understanding of the task at hand, it’s now time to put your nose to the grindstone. After reviewing the materials given to you you can start research. This phase usually entails taking into account competitors, market trends, product/service differentiators, the history of the business, and the future of it as well.

While this stage isn’t usually going to be your favorite but it’s well worth it in the end. There’s nothing worse than creating a beautiful logo only to discover it’s too similar to a competitor’s. You’ll reap the rewards of the time you put into research, trust me.

Strategy

This step may vary depending on the scale of your project, but generally it’s best to develop a strategy before putting pencil to paper. Through this you analyze the research gathered and decide on design and functionality criteria. This can be as simple as a theme carried across all marketing materials. You can present this strategy to the client to get approval or disapproval before heading on in the hopes of getting more creative direction.

Development

Once you have a clear strategy, the idea is to then create preliminary design concepts based on the strategy you developed. Developing concepts can be done through various means when inspiration strikes, but here are some of the most effective.

Mind Mapping: A diagram that’s used to represent words, ideas, and tasks linked to your central idea. Encourages a brainstorming approach to planning and organizing tasks.
Storyboarding: Meant to pre-visualize a motion picture, animation, etc by organizing illustration in a sequence.
Free Writing: A great way to get your ideas down on paper and later expand on them.

Layout Creation: Sketch layouts from collected inspiration, play around with color schemes and typography until a direction strikes you, and then explore it more.

Develop several different concepts through the above methods. The idea here is to create as many different options before choosing the most viable one. Through the help of the client, these ideas can them be narrowed down to a couple of ideas for further development and refinement.

Presentation/Refinement

Often best presented as a PDF file with the design in context. It’s now the job of the client to review the designs and provide feedback based on their objectives and the needs of their target audience.

At this stage the designer is tasked with making changes to the aesthetic elements based on client’s request or putting the final touches on an agreed upon design.

Production/Launch

With an approved design, the designer is now able to implement the finished piece across all deliverables, which may include both print and web. Depending on the project and/or media, the materials may often be handed off to a third-party, which includes:

Prepress/Printer
Media Outlet
Launched on the Web

If it’s a web project, instructions and documentation may be required for administrative purposes, as well as Search Engine submission.

Completion

There’s nothing more rewarding than turning over a completed project to a satisfied client, so congratulate yourself.

You can now invoice your client the remaining bill for the project. Oftentimes this is best achieved through online invoicing software, which will help save time associated with putting together an invoice. One application that I personally recommend is Freshbooks.

With a solid process in place for completing a design project, you not only establish a closer relationship with your client, but you take a lot of the guesswork away when it comes down to creating something memorable for them. Consider it one less hurdle you have to overcome. Do you have a design process in place that you utilize with each new project? Feel free to share any tips with us that I may have missed.

For Further Reading:

Tips and Considerations for Self-Promotion

Brick and Mortar or Online Business?

5 Tips to Improve Your Home Office Setup

A New and Growing Freelance Industry: Wedding Videographer

jQuery Menu: Dropdown, iPod Drilldown, and Flyout styles with ARIA Support and ThemeRoller Ready

2011-06-21T18:20:00.000+05:30

We got lots of fantastic feedback on our earlier iPod-style menu, and decided to upgrade it for jQuery 1.3. In the process of refining the script, we morphed it into more of a menu system, which can be used to create a simple dropdown menu for a single list of options, a flyout menu for a smaller hierarchical list of options where child menus are displayed next to the parent menu on mouseover, and two variations on the iPod style, one with a back button and another with a linked breadcrumb to let users easily traverse back up the hierarchy.

As noted in our original post, the iPod-style menu provides easy navigation of complex nested structures with any number of levels. The entire menu sits within a fixed-size area, and when a node is selected, by default a "Back" link appears below the menu to allow navigation to previous (parent) menus, or set options to show breadcrumb links above the menu options to both deliver feedback and allow quick access to nodes higher up in the hierarchy. A lateral iPod-style slide transition reinforces the notion that you're moving forward into more granular data, or backward into higher-level data. This menu is specifically useful in traversing deeply nested hierarchies, particularly those more than three levels deep. It also provides a more usable alternative to multi-level fly-out menus, which can present challenges to those with limited manual dexterity.

Much of the functionality that controls the iPod style menu, like positioning and option selection, is shared by dropdown and flyout menus which are better suited for smaller data sets, so we extended the script to include support for these additional menu types.

We also built in the ability to customize a menu's appearance, including active and hover states, by passing in classes as options. In the examples below, we plugged in jQuery UI CSS Framework classes so that the menus can be styled on the fly using ThemeRoller — try changing each menu's theme with the "Switch Theme" button.

By default, the menu script will transform an unordered list of links into a simple dropdown menu:

9 Tips on How To Improve Yourself as a Web Designer

2011-06-21T18:19:00.000+05:30

There are times in life where everything goes well, people like your work and you get more and more clients. But sometimes the “business” stops, work flow decreases, you get bored and uninspired, and you stagnate. The reasons behind this can vary, but mostly it’s just because you’re feeling uninspired and have lost your drive. It’s very easy to lose inspiration, when we are not surrounded by a learning and inspirational community.

You know you love what you do, so don’t quit. In order to counteract the situation, you need to go further, learn new things, and adopt new work methods. You will find out that maybe you just need a push or build your own motivation and energy to go forward, or that maybe you are just afraid to step up.

So grab a pen and get ready for new resolutions.

1. A Tutorial a Day

Tutorials are the best way to improve your skills. Setting this goal for yourself ensures you don’t stagnate and keeps you motivated. Repeating this process every day or at least every week is half-way to success, and it’s also entertaining. If you like several areas, try to invest in a different area each day. 1stwebdesigner, PSDtutsor Photoshop Lady are great examples of free and high-quality tutorial resources. Ten years ago, web designers and developers didn’t have the possibilities you have now, and they still managed to evolve. Those people are now teaching you for free, while you remain in the comfort of your home.

2. Do What They Do

If you have favourite design layouts, icons, effects, etc, you should try to recreate them. Sometimes the best way to learn is finding out how others did it. If you can’t get there, ask for help. There are also plenty of great Photoshop to HTML tutorials out there, which can help you discover how some effects and functionalities are built. As soon as you recreate your favourite work pieces, you reach the same quality level as the author on that moment, and you are ready to the next level.

3. Redecorate Your Workspace

I don’t know about you, but for me redecorating my workspace is a plus for motivation, and helps my creativity. I’m not saying you need to buy new furniture, but move your desk or monitor to a different position, or stick a poster on your wall. The same old workspace layout and routine discourage your will, creativity, and motivation to work. Sometimes, you may realize that having two monitors side-by-side instead of having them apart, or having your desk near your books, will tremendously increase your work efficiency.

4. Read Books, Magazines, and Interviews

There are great books and magazines out there. I personally love magazines like Web Designer andComputer Arts, but you have so many more to choose from. They are inspiring and have plenty of good tutorials and articles. Books are another invaluable source of information, and although I don’t read books very often, they are truly another great addition to your shelf . Reading 15 pages a day is quick, gives you valuable insights, and at the end of the month you realize you have read an entire book. Do the same the next month. I also like to read interviews, I believe it’s a great way to learnnew things from the best in the field.

5. Build Relationships

Having an active online, and if possible offline presence is an important learning and motivational process. Try to be involved in conferences, events, workshops, etc. They are extremely useful to increase your list of contacts and ideas. Also try to talk with everyone and not only designers, since they are not your potential clients.

6. Grab a Moleskine

The first thing you need to do before you start any web design or development project, is to put your ideas on paper. You don’t actually need to use a Moleskine - I’m just a fan. But if you need some motivation to start organizing your ideas, grab a sketchbook and take it everywhere. It can really improve your brainstorming, organization and work process.

7. Read Design Blogs

Books and Magazines are not the only material you should read. Personally I believe blogs should be number one on your list. Reading daily articles gives you good insights, ideas, tutorials, inspiration, and much more, which helps your work tremendously. Do not forget to share your ideas by commenting on other people’s work, and write your questions every time you have them.

8. Plan Your Days

I’ve started to do this recently and I realized it increased my work performance tremendously. I personally love to use http://teuxdeux.com, but it doesn’t really matter which software you use or how you do it. The important thing is to keep your work and life organized. Start your weekend by planning your week, or at least try to plan on a daily basis.

9. Try New Software

One thing I always like to do is to read about new apps, web apps, and software, that can help me improve my work. Woopra is a hosted analytics service which I didn’t know anything about until I searched google for “Web Analytics Tools That Rivals Google”. A great tool doesn’t necessarily need to be immediately known.

Conclusion

Working as a freelancer can be very isolating, and the will and motivation to keep going is what makes the differences between the good and the great. Never forget about the one rule – Don’t stop.

Everyone has strengths, you just need to find yours.

150 Most Wanted WordPress Tips, Tricks, and Hacks

2011-06-21T18:14:00.000+05:30

All the WordPress bloggers already know that there are different themes and default features available while blogging. However these are limited. Yes, you can find an original theme, if you research a lot, but there is a good chance you will see the exact theme somewhere else as well so you can say goodbye to your imagined originality. You can compensate this with a nice content of course, but the design is also really important to make visitors read you.

If you want to go for a new unique look, you will have to get to know the PHP code of your blog and start being creative. Sometimes you just see a blog that has an amazing and creative design and you can’t help it wonder – how did the blogger achieve this? Well there are some tips and tricks that you can learn from the more experienced. Whether it’s about changing the colors, administrating the comments or adding different new unusual features to your interface – you can learn it all step by step.

We found 150 WordPress tips, tricks and hacks that you can definitely find useful and we hope to hear back from you, telling us about the improvements you made or any other suggestions.

1. 11 Ways to Create a Mobile Friendly WordPress Site

2. 25+ Extremely Useful Tricks for the WordPress Functions File

3. 4 Ways to Exclude WordPress Category from RSS Feeds

4. 4 Ways to speed up your wordpress blog

5. 5 Tips for using AJAX in WordPress

6. Add a favicon to your WordPress blog using a hook

7. Add Breadcrumbs to Your WordPress Blog

8. Add Gravatar for post author

9. Add Menus to the Admin Bar of WordPress

10. Add Thumbnails to WordPress with Custom Fields

11. Adding Tabs to Sidebar

12. Advanced Power Tips for WordPress Template Developers