Blogs

I just added this to JenSocial, and figured it might be a good idea to add here too. When it comes to Graphic and Web Design, there's a ton of room for all types of artistic and creative levels, styles, etc... However, there isn't room for a ton of fonts. Some of the wonderful aspects of the vastness of the Internet are: so much to discover, so much for the eyes to see - - so many different designs, and so many different Designers. But, way too often, there are too many fonts starring you in the face.

Whether you have designed your own website, or hired a Designer, here are a couple of Design Tips that you can take to heart - - seriously. There's no written-in-stone rules, just a few good rules-of-thumb. To new or novice Designers these tips may seem simple and unimportant. But, trust me on this. These 2 small bits of advice are critical for the success of your overall Design.

• Don't Use Too Many Font Types. There is never a need to use more than 2-3 for a logo, header, or special image. And you shouldn't use more than 3-4 for your overall site.
• Be Consistent When Using Fonts and Applying Font Attributes. For example: If you use a different font for every headline, this is confusing, tough on the eyes, and can give your design a busy and unprofessional look. If you apply bold for one type header, apply bold for all headers of the same type. If you use Lucida Grande, and apply bold for a sub-title, do the same for all sub-titles.

Bottom Line: There will be cases where you really need more fonts. If you need more to communicate better, go for it. But, when possible, try to keep those fonts at a minimum.

Happy Designing!

;-)

Jen

I love, love, love the new design tools.

Thank you to all the boys and girls at ning that put this stuff together. I'm a designer but not a programmer and I made our Veloist site look awesome!

The beta 2 column format is exactly what I wanted to do, cleaner lines and bigger ad space--now I just need some advertisers.

Rock on ning, oh and ride safe.

Mike the Veloist

Ning is a great platform that allows organizations and individuals to launch their very own niche social network in only a few minutes time. As a Ning certified partner, over the last few years The Bivings Group has built and designed Ning-based sites for clients such as The Pickens Plan, Iraq & Afghanistan Veterans and America and the National Peace Corps Association. We think Ning is a great solution for organizations looking to launch their very own social network quickly and cost effectively.

As a result of our work with Ning, folks frequently get in touch with us asking for help in setting up and designing their network. Most of the time their needs are pretty modest – they just want someone to help them create a custom design for their network or some initial advice as to how to set up and manage their community. Since our focus is on larger development projects, we typically haven’t been able to help.

As a way of filling this void, today we are pleased to launch a cost-effective new suite of Ning consulting services. For a one-time fee of $2,500, we will create and implement a custom design for your Ning network and provide some initial advice on how to get the most out of your network. If you need help developing your overall strategy, integrating your network with a CRM, managing your network long term or completing custom development work, we can help with that too.

Learn more about our Ning services here.

Welcome to the fourth in a series of Ning Creators blog posts focusing on simple design tricks you can use on your network.

Trick #4: Adding a Two-Column Hero Box

The following code, used on the homepage of Ning Creators, will insert a "hero" module that spans two columns at the top of your network's Main page content area. This area could be used to insert an image, a custom Flash/JavaScript piece or just a simple text introduction.

Welcome to the second in a series of Ning Creators blog posts focusing on simple design tricks you can use on your network.

Trick #2: Centering the Navigation

The following code, used on Carmen Electra's official community, will center your network's navigation area in all web browsers.

To do this, just visit the "Appearance" area inside the "Manage" tab, then paste the following CSS snippet inside the "Advanced" section (underneath any other code that may already be there):

#xg_navigation ul {text-align: center;margin: 0 auto;}#xg_navigation ul li {display: -moz-inline-box; /* inline-block for earlier versions of FF */-moz-box-orient: vertical; /* inline-block for earlier versions of FF */display: inline-block;vertical-align: middle;*display: inline; /* ie7+ hack */*vertical-align: auto; /* ie7+ hack */text-align: left;float: none;}#xg_navigation ul li a {display: inline;}

When you're done, click the "Save" button. Your navigation should now be centered. Enjoy!

Welcome to the first in a series of Ning Creators blog posts focusing on simple design tricks you can use on your network.Trick #1: Adding an Arrow Indicator to Navigation DropdownsThe pulldown menus created by our Tab Manager feature are extremely popular, however some Network Creators have expressed interest in displaying an arrow indicator next to tabs that have a dropdown menu (to make it clear to members that there's more content inside that tab). You can see this in action on Enrique Iglesias' official social network.To achieve this effect, visit the "Manage" tab, then the "Analytics" section. Paste in the following snippet underneath anything else that may already exist (don't delete anything):<script type="text/javascript">if (typeof(x$) != 'undefined') {//Adding "dropdown" class to nav tabs that have subtabsx$("li.xg_subtab[dojotype='SubTabHover']").addClass("dropdown");}</script>Save the changes. Now visit the "Manage" tab again, followed by the "Appearance" section. Click on the "Advanced" tab.If you have a light background color on your network, add the following code underneath anything else that may already exist (don't delete anything):.dropdown {padding-right:5px;background:url(https://static.ning.com/creators/design/black-arrow.png) no-repeat right center;}If you have a dark background color on your network, add the following code underneath anything else that may already exist (don't delete anything):.dropdown {padding-right:5px;background:url(https://static.ning.com/creators/design/white-arrow.png) no-repeat right center;}Save the changes. You're all set. You can adjust the "5px" number above to tweak the spacing that appears to the left of the arrow, and if you want to use a different arrow image or support legacy web browsers, you can create a new image with an image editing program, then swap out the existing black-arrow.png or white-arrow.png URL with your custom image's URL.Note that this technique works best on themes in which tabs don't have a separate background color when selected, though certainly feel free to experiment. Happy dropdowning!