1stwebdesigner

Posted by | Posted on 17:46

1stwebdesigner


20+ Awesome Flickr Groups for Logo and Web Design Inspiration

Posted: 01 Sep 2010 02:00 PM PDT

Designers are always attracted towards creative work and new sources for design inspiration. There are plenty of websites for getting inspiration like deviantArt, Behance Network, Flickr and many more. Since Flickr has started, it happens to be one of the biggest source of inspiration, there are also some groups that have been established to showcase the work of designers.

Today we have browsed the most valuable source of inspiration simply known as “Flickr” and extracted a useful list of groups for Logo and Web Design inspiration and displayed two images of sample work by members of these groups for your inspiration.

Logo Designing

1. Design the Logo

Members: 6,762
Items:16,602
"Design the Logo" is Flickr group completely dedicated to graphic designing especially creating logos, having huge amount of creative logos design projects for inspiration and ideas for your projects.

Design the Logo2-flickr-groups-logo-web-design

Design the Logo-flickr-groups-logo-web-design

2. The Brand Identity Design

Members: 1,014
Items: 3,413
“Brand Identity Design” group has huge and increasing collection of logo design and branding for logo and branding lover’s inspiration.

aec

The Brand Identity Design-flickr-groups-logo-web-design

3. Real Graphic Design

Members: 1,382
Items: 1,098
Real Graphic Design is an splendid showcase of web layout, typography, logo creation and branding.

Real Graphic Design-flickr-groups-logo-web-design

Real Graphic Design2-flickr-groups-logo-web-design

4. LOГO

Members: 998
Items: 5,770
LOГO has huge collection of logo designs for your inspiration.

LOГO-flickr-groups-logo-web-design

LOГO2-flickr-groups-logo-web-design

5. Logopond Lillies

Members: 740
Items: 1,584
"Who doesn’t love identity design Logopond brings you the best from around the world, but sometimes you want to check out business cards, websites, and other collateral materials. Here is an opportunity to share your work with a like minded creatives."

Logopond Lillies-flickr-groups-logo-web-design

Logopond Lillies2-flickr-groups-logo-web-design

6. Logo Design Pro

Members: 683
Items: 2,769
Logo Design Pro provides you quality Logo design, Corporate Logo design, Best logos, Brand identity, Brand identity Design and more.

Print

Logo Design Pro2-flickr-groups-logo-web-design

7. Identity + Logo Design

Members: 1,986
Items:4,611
Identity + Logo Design enables you to showcase your own creations as well as you favorites logo designs.

Identity   Logo Design-flickr-groups-logo-web-design

Identity   Logo Design2-flickr-groups-logo-web-design

8. Loco Logos

Members: 470
Items:1,857
Loco Logos provide you quality corporate logo designs majorly submitted by the group users.

loco logos-flickr-groups-logo-web-design

loco logos2-flickr-groups-logo-web-design

9. Logo Design

Members: 435
Items:1,566
In “Logo Design” you can share your logos and identity design packages and discuss topics relating logo designing.

Logo Design2-flickr-groups-logo-web-design

Logo Design-flickr-groups-logo-web-design

10. Logo Design Showcase

Members: 203
Items: 1,009
Logo Design Showcase is another Flickr group exhibiting professional logo designs for you inspiration.

Logo Design Showcase-flickr-groups-logo-web-design

Logo Design Showcase2-flickr-groups-logo-web-design

11. Logo Designer Blog User Submitted Designs

Members: 219
Items: 568
This Flickr group is official Flickr group of Logo Design Blog, all the logo designs are submitted by Logo Design Blog's readers.

Logo Designer Blog User Submitted Designs-flickr-groups-logo-web-design

Logo Designer Blog User Submitted Designs2-flickr-groups-logo-web-design

Web Design

1. Web Design

Members: 7,098
Items: 12,252
“Web Design” Flickr group has massive number of inspirational web designs, which can be used for inspiration as well as you can get constructive idea for your next web designing project.

Web Design-flickr-groups-logo-web-design

Web Design2-flickr-groups-logo-web-design

2. Webdesign Inspiration

Members: 1,881
Items: 3,133
This Flickr group is a showcase for websites, graphics, logos and all things for designer’s inspiration.

Webdesign Inspiration-flickr-groups-logo-web-design

Webdesign Inspiration2-flickr-groups-logo-web-design

3. Web Development

Members: 610
Items: 1,340
This group is dedicated to Web development, scripting and web layouts.

Web Development-flickr-groups-logo-web-design

Web Development2-flickr-groups-logo-web-design

4. Web Design Edge

Members: 380
Items: 1,570
“Are you wondering how to develop that perfect website for you or your business but are concerned about costs? Are you uncertain about how to market yourself online? Are you looking for knowledgeable, reliable support… looking for an Edge? "Web Design Edge" is here to help you achieve your goals and make plain sense out of the world of website development and online marketing."

Web Design Edge-flickr-groups-logo-web-design

Web Design Edge2-flickr-groups-logo-web-design

5. Boagworld: Web Design Inspiration

Members: 977
Items: 1,653
This group is official Flickr group of Boagworld blog run by web strategist Paul Boag, in this group you will find awesome web designs and layout for your web design inspiration.

Boagworld-flickr-groups-logo-web-design

Boagworld2-flickr-groups-logo-web-design

6. Web designs

Members: 489
Items: 1,874
Web designs is another Flickr group where you can find professional web layouts.

Web designs-flickr-groups-logo-web-design

Web designs2-flickr-groups-logo-web-design

7. Web ultimate

Members: 259
Items: 872
Flickr group devoted to provide you quality web-design, web-interface, web 2.0, portals, promo-pages, online-shops and GUI.

Web ultimate2-flickr-groups-logo-web-design

Web ultimate-flickr-groups-logo-web-design

8. Best of Web Design

Members: 186
Items: 653
Best of Web Design, as name signifies, provides you best websites designs ever created. You can add your work as well as your favorite well designed sites.

Best of Web Design-flickr-groups-logo-web-design

Best of Web Design2-flickr-groups-logo-web-design

9. Web2.0 Interface

Members: 250
Items: 284
“Web2.0 Interface” showcases beautiful web2.0 designs and user interfaces.

Web2.0 Interface-flickr-groups-logo-web-design

Web2.0 Interface2-flickr-groups-logo-web-design

10. ChurchDots – Church Web Design

Members: 135
Items: 85
“ChurchDots is a Flickr group dedicated to showcasing beautiful church websites from around the world. The goal of ChurchDots is to inspire the church community to create better websites to effectively communicate with each others.”

ChurchDots-flickr-groups-logo-web-design

ChurchDots2-flickr-groups-logo-web-design

11. WooThemes

Members: 254
Items: 144
WooThemes is one of the leading WordPress premium theme provider. In this Flickr group you can add your own WordPress themes.

WooThemes-flickr-groups-logo-web-design

WooThemes2-flickr-groups-logo-web-design

If you know other informative and useful Flickr groups then please share with us. :)

Performance Optimization: How to Load your javascript faster!

Posted: 01 Sep 2010 03:00 AM PDT

Load your javascript fasterJavascript is now extremely important. Some sites use javascript for a tiny enchantments, many of today’s webapps are depending on it, some of them are even totally written in js. In this article I’ll point out some important rules, how to use your javascript, which tools to use and what benefits you’ll gain from it.

Keep your code at minimum

Keep your code at minimum

Don’t rely on javascript. Don’t duplicate your scripts. Treat it like a candy-tool to make things more pretty. Don’t bloat your site with s**t-loads of javascript. Use it only when necessary. Only when it really improves user experience.

Minimize DOM access

Accessing DOM elements with JavaScript is easy, code is more readable, but it’s slow. Here are some tips: Limit your layout fixing with javascript, cache references to accessed elements. Sometimes when your site is depending so much on DOM modifications you should consider limiting your markup. It’s a good reason to switch to HTML5 and leave those old XHTML, HTML4 behind. You can check the number of your DOM elements by typing in Firebug’s console: document.getElementsByTagName('*').length

Compress your code

The most efficient way to serve compressed JavaScript is to first run your code through a JavaScript compressor that shrinks variable and argument names, and then serve the resulting code using gzip compression.

Well, I don’t compress my main.js, but check if you have any jQuery plugins that are not compressed, do it (remember to keep author’s notes). Below I listed some options for compression.

GZip Compression: Idea behind this is to reduce time of transferring data between browser and server. When it’s done you get your file with Accept-Encoding: gzip,deflate header. It has some disadvantages though. It takes: CPU on both server-side and client side (to compress and uncompress) and disc space.

Avoid eval(): While sometimes it may bring some time efficiency, it’s definitely wrong practice. It makes your code look more dirty and it crashes out most of the compressors.

Tool to speed up javascript loading – Lab.js

There are many awesome tools that could speed up your javascript loading time. One is worth mentioning — Lab.js.

With LAB.js (Loading And Blocking JavaScript) you can load your javascript files in parallel, speeding up the total loading process. What is more you can also set up certain order for scripts to be loaded, so no dependencies are broken. Also, the developer declares a 2x speed improvement on his site.

Using proper CDN

Many webpages now use CDN (Content delivery network). It improves your caching, because everybody can use it. It can also save you some bandwidth. You can easy ping or firebug those servers to check from where you get data faster. Choose CDN by matching your readers localization. Remember to use public repositories when it’s possible.

Some CDN options for jQuery:

  • http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js – Google Ajax, information about more libraries
  • http://ajax.microsoft.com/ajax/jquery/jquery-1.4.2.min.js – Microsoft’s CDN
  • http://code.jquery.com/jquery-1.4.2.min.js – Edgecast (mt)

Load your javascript at the end of page

Load your javascript at the end

Very good practice if you care about user and him/her not leaving your page because of slow internet connection. Usability and user at first, javascript at the end. This may be painful, but you should be prepared for users with disabled javascript. You may put some javascript to be loaded in head section, but only if it’s loading asynchronously.

Load tracking asynchronously

This one is very important. Most of us are using Google Analytics for statistics. It’s good. Now look where you put your tracking code. Is it in head section? Is it using document.write? Then you should blame yourself for not using asynchronous tracking code for Google Analytics.

This is what asynchronous tracking code for Google Analytics looks like. We must acknowledge that it uses DOM instead of document.write, which may be better for you. It detects some of the events before page load which is very important. Now think of all the users closing your page before it even loaded. The cure of missing page views has been found.

  	var _gaq = _gaq || []; 	_gaq.push(['_setAccount', 'UA-XXXXXXX-XX']); 	_gaq.push(['_trackPageview']);  	(function() { 		var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true; 		ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js'; 		var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s); 	})(); 

Don’t using GA? It’s not a problem, most of today’s analytics providers will allow you to use asynchronous tracking.

Ajax Optimization

Ajax Optimization

Ajax request have great impact on your site’s performance. Below I pointed some tips about ajax optimization.

Cache your ajax

Look at your code. Is your ajax cacheable? Well, it depends on data, but mostly your ajax requests should be cacheable. In jQuery your requests are cached by default, not including script and jsonp dataType.

Use GET for Ajax Requests

POST type requests takes two TCP packets to send (headers sent first, data next). GET type request takes only one packet to send (which may depend on your amount of cookies). So while your URL length is less than 2K and you want to request some data use GET.

Use ySlow

Use Free ySlow Tool

It’s both simple and extremely powerful when it comes to performance. It grades your website and shows you what you need to correct, what should be taken care of.

Bonus: Pack your javascript into PNG File

jQuery and Prototype Packed into one image

Imagine adding your JS and CSS to the end of an image and cropping it in CSS to have all the info you need in an app in a single HTTP request.

I have recently found this. What is basically does it packs up your javascript/css data into PNG file. After that you can unpack it by using the canvas API’s getImageData(). What is more it’s very efficient. You can gain about 35% compression without minifying your data. Lossless compression! I must point out that for larger scripts you can feel “some” load time while image is pointed to canvas and pixels are read.

For more information about this one check out this article from 2008.

Final Thoughts

Hope you guys liked this article. If yes, remember to share it and to say hello to me on twitter. Stay in tune for some further posts about serious performance optimization.

Comments (0)

Post a Comment