Web development language, and how to understand the technospeak of the Internet.

Whilst swimming these wide waters we call the internet, we come across various codewords, secret-speak, jargon if you will, that can make it feel like you stumbled into the halls of some clandestine coven of need-to-know code speakers, as opposed to a message board devoted to the glory of puppies. More relevantly; if you are building a website, or if you are having someone build you a website, the people developing or using your site will start speaking to you using these words and terms assuming a familiarity you just may not have. 

When he said azimuth, I thought we were talking about a demon.

Fear not intrepid reader of blogs for we have your salvation, what follows is a glossary of the most common web developer and user lingo. So for anyone who ever wondered what the heck a CAPTCHA™ is and why it matters, or what is CSS and why you should never use it in your email blasts, this handy guide shall steer you in the right direction so you will be able to effectively communicate and understand when building or using your and others websites.

Web Design Glossary

White Space in Design (and why it matters.)

White space is the blank space, the empty space, between your content. Many people think this empty space is just a opportunity waiting to be exploited, eagerly awaiting the chance to cram as much content as possible into what’s left.

 

This is not a land to be conquered.

If that is your thought process STOP, back away from the keyboard slowly. White space or "negative space" is actually a tool in the fundamentals of both print and web design and is as easily as important as the content it surrounds.  It’s the space we leave between all of your elements to give a layout elegance and clean form.

The Wild Wild Wonderful World of Tablets!

With more and more people using tablets as their primary window into the internet , it’s critical you understand how your site appears across those platforms, as your sites long-term success rides on this truth.  Responsive design can help your site maintain its look across the various platforms it will be seen on, which will give the end user a cohesive experience. 

This is critical because how users think of your site and how they interact with your content is largely defined by their experience. You can have the best content in the world, but if your end user cant see it or use it, none of that will matter, your sites visitors will dry up, and there will be much weeping and gnashing of teeth. That can further impact how they share you  on social networks and whether they recommend you to others.

Today, many sites sense if the visitor is on a mobile device or tablet will redirect to the mobile version of the site.  The trouble with this is, many of those sites sacrifice some content for a simpler interface.  This can kill your credibility with your audience. On the technical side, it can lead to duplicate URL issues over time, so you want to make sure you account for this when it comes time to redesign your site. So remember keep those sites simple and elegant, the sites purpose before everything else is to deliver your content effectively. Don't be afraid to jump into the world of tablet and mobile optomized web building, its the future and we are all on for the ride.

Web Safe Fonts

Whenever building a site especially your first site its very tempting to head over to your favorite font library and just go nuts. This is a exercise in futility though as almost 99% of those font cant display on the world wide web. Fear not intrepid young developer here is a list of the current fonts (many of them actually aesthetically pleasing) that are completely web safe.

Save for web and Devices!

This is probably one of the most useful functions built into Adobe Photoshop for web developers. One of the biggest issues we will run into when creating content for our websites or mobile devices, is that the assets we create or cultivate are just to big! with this handy function found in the file tab you can keep the quality of the image high but the load times low by dropping the size dramatically. Remember don't just save, save for web and devices.

Codecademy and Learning how to build websites.

In the last couple of years a wealth of web building software has arrived on the market that allows even the most technically challenged to build a pretty sophisticated website. Software like WordPress is even used by professionals to achieve pretty remarkable and sophisticated websites, sometimes though, a person will want more control they will want to start to lean how to actually code.

Years ago, short of going back to school this was a option that was not realistic to the average novice. These days however the game has changed. http://www.codecademy.com/ is a internet learning tool that will guide you step by step through the process of learning how to code almost every major web based language currently in use. I myself have used it to enhance and build upon the skills I already have.  The lessons are easy to follow, dynamic, and well constructed. Best of all they are free!

If you are a up-and-coming web developer and are looking to expand your skills so you can lean how to build your own sites from scratch I recommend this tool wholeheartedly.

Catch common usability problems before user testing.

There is a saying I always liked: "Don't try to say again what has already been said better," With that on my mind, I present to you the following link. http://userium.com/ This a excellent checklist/tool in your web development arsenal that allows you to catch common usability problems before user testing. Enjoy, and happy coding.

Click Me!

CSS Button Generator

Building a website can be a time consuming and stressful task. one of the hardest aspects of design for many people is assets. Something as simple as a button can be a hassle when you don't know where to get the assets to design and eventually code your own. This being the internet some industrious individual has come along and given us a simple CSS Button Generator.

CSS Button Generator will create beautiful  simple CSS buttons for you to use on your web pages without the need for any images. These time saving tricks and tools can turn what was once an arduous task into a painless procedure. remember; work hard, but work smart.

Happy coding.

Choosing the Best Layout for Your Website

You have your domain name and your hosting, but now it's time to get your actual site up and running. Which layout do you choose? There's hundreds if not thousands of layouts to choose from. Does it matter which one you choose? Of course it does.

There are one column, two column, three column websites, and bunches of variations of particular layouts. The simpler your site is, the easier it will be for your consumers to use it. Don't put too much information on the homepage. Homepage space should belong to the absolute most important information on your website.

Favicons are Fun!

Have you ever noticed the cool little icon in the browser bar when you visit a website? Those are called favicons and they show up when browsing a website or adding the site as a bookmark in your browser. They give a website a more legitimate and secure feeling, as well as adding a small branding element to the website.

Any website can have a favicon and they're pretty simple to create. You don't even need editing software to create one! There are bunches of websites out there that will generate the file for you. All you need to do is upload an image.

Favicons are images that are created with an .ico file extension. You place this file in the root of your website, add some small code and it will show up in the browser.

Comparing Web Hosting Options

We realize that choosing a web host can be a difficult decision to make. They all seem like they offer the same products for the same price. We've decided to break down our featured hosting providers so you can get a direct comparison on the features they offer.

eTeamz…an Easy Solution

eTeamz is partnered with Active, so it’s an easy solution for transferring your website. Active will do the site migration for you, so all you have to do is continue maintaining your site the way it is.

eTeamz is a sports website platform that is similar to Clubspaces. They have 75+ site design templates to choose from. All you need to do is drop in your logo. Their editor is simple and easy to use – no more difficult than using Microsoft Word. They offer a scheduler and a soccer statistics tracker module that lets you enter scores for Region games over multiple seasons. There is an integrated email communication module so that Regions can send out communications to parents, coaches, referees or whomever you need to get information to. The calendar feature lets you create a detailed game calendar with dates, times and locations so that parents can keep on top of their child’s schedule. They also have a product called MessageCast which allows the Region to send out text messages to anyone on the recipient list (Similar to Rained Out used at the National Games last year).

Why Choose the Active Youth Network For Hosting

The Active Youth Network offers website and ad hosting for youth sports organizations. The thing that’s emphasized most with their product is their integrated advertising.

Their advertising is completely handled by the company. They choose family-friendly companies to advertise on their websites. By accepting their free website, you agree to have their advertising on your pages. Regions can receive a share (70 percent) of the revenue from these advertisements, which is a great revenue generator for your Region.

They also offer a “QuickAds” solution where your Region can sell ads to local advertisers. These ads can be managed through the Active Youth Network website. By getting local ads, Regions can earn an extra 70 percent commission on top of the 70 percent received from Active Youth Network.

What Blue Sombrero Has to Offer

Blue Sombrero is a web platform that is specially designed for sporting groups. They are owned by Dick’s Sporting Goods, so they already have a foothold in the sports industry.

Their websites come with a content management system (CMS) that allows you to choose a layout and easily edit the content for that layout. They have a wide variety of themes to choose from, which makes each page consistent across the board. All of their templates are designed to work on all browsers, so you don’t need to worry about cross-browser functionality. Their free-flowing design adapts to screen sizes so it works well on mobile platforms also.

If you decide you want something more customized than what they offer, you can ask for a custom design (for a price, of course) and still utilize their site functionality.

Their websites offer some modules that could be useful to a Region, including scheduling and reporting. To utilize the scheduling module, all you need to do is upload your schedule from an excel file. With a few steps, your schedule is available on your website. As for reporting, they have a bunch of stock reports available for whatever kind of data you need, including player stats!

Choosing the Right Images for your Website

Images say a lot about a website and we want to make sure you use the right kind of images to get the mission and vision of AYSO out to your Regions.

Images can be difficult to come across, especially when you have to worry about permissions and copyrights. We discourage using images from google, since you can’t show any sort of ownership or rights for that image. Here are some places to find appropriate images and guidelines to use when choosing photos:

Use Your Own Images

If you’re using your own images, make sure they are lit properly and well composed (meaning that people aren’t cut off in the images, and they aren’t oddly lopsided) and don't have any names or contain anything offensive (ex: no alcohol, tobacco, weapons, etc.). Please try to follow our Safe Haven guidelines to make sure the photos are appropriate for AYSO. If faces appear in the images, make sure that you have a release from each person in the images so you don’t get in trouble for posting their picture on the website. To make this part easier, you could have every parent sign a release form for themselves and their child when they register or before they play their first game. It will assure you that every person in the photos have a release signed.

Planning Social Media Promotions for 2014

As you know, AYSO turns 50 next year, and the National Office is busily getting ready for the celebration and all its festivities. 

Have you started thinking of ways to modify your Region's website and social media presence on our Golden Anniversary? Here a couple easy ideas:

Hop on the “Mobile Friendly” Bandwagon

Many people are short on time these days and tend to do their websurfing on their phones or tablets. You want to make sure that your site looks good and is easily accessible on a mobile phone or tablet, especially with the thousands of young parents in AYSO.

You can easily make a separate style sheet that is mobile friendly for your Region website. This style sheet would reduce the use of images and adjust the width to that of whatever device the user is using to surf your site. If this is the route you’d like to take with your website, you can view a full list of tips here.

Make Your Website the Right Way…and Keep People Coming Back!

People depend on the web today for a fast, simple way to access the most current information on any topic. If a site is designed poorly, or doesn’t contain good information, people will stop coming and you’ll lose your audience. Audience is very important in AYSO because if we lose parents, we lose players. Here are some points to keep in mind when working on your website to ensure that it’s the best it can be:

KISS – Keep It Simple Stupid

This is a mantra used throughout user design. No matter how simple YOU think it is, there are people out there who won’t think it’s so easy to use. Test your designs before implementing them by choosing a few (non-tech) people to test it out. Gather their feedback and design it to fit their needs and not yours. Here are some ways to keep it simple:

• Create a clear visual hierarchy on each page
• Take advantage of conventions
• Break pages into clearly defined areas
• Make links obvious
• Minimize distracting elements
• Use common sense

Keep It Focused and Purposeful

Users have a reason to visit a website and it’s usually to find specific information. Anything that gets in the way of that purpose is counterproductive. Eliminate “landing pages”, including introductory animations/slideshows. People don’t want to sit and wait for something to load just to click through it anyway. Let them get in, get their information and get out. Keep your content up to date. Parents will not continue to visit a website to read the same information as their last visit. That doesn’t help the parents stay informed. Know the purpose of your website and don’t stray away from it.