ContentRobot

No, we’re not depressed - ContentRobot took the next leap in our redesign!

What’s new?

• More Streamlined Copy - We could pare down our copy to focus more on how we can help and less about what blogging is (since lots more people are aware of it).
• Updated Navigation - We simplified the nav to reflect our main offerings: blogs and blog-powered websites, WordPress expertise) along with links to our portfolio and a “hire us” form.
• Home Page Features - Click on any button in the nav to reveal a succinct overview displaying what we are all about and a featured project.  Also, explore our themes & plugins, our new WeFixWP service, and (of course) our blog.
• Interior Pages - Within any feature, click on any link or project to see how we’ve designed our (converted) pages in blue.

What’s next?

• Review Every Page - Ensure that all copy has been reviewed and all pages converted to the “new blue.” Yes, that contact form is ugly still!
• The Blog - The poor blog needs to be integrated into our new look. But we are getting there!

We are excited with our new branding. Hope you like it, too!

Recently we extolled the virtues of WordPress’s Media Manager and its relative ease to add images to your posts. After upgrading several client sites to WP 2.5/2.6, we must say in practice that there is still work to be done here.

Our beef? WordPress relies on Flash to upload media. This means that you get a nice visual or “crunching” status bar, but downright unhelpful error messages. What issues have we encountered?

• Big images - you can’t upload full size images
• Resizing images - sometimes the resizer (placing small and medium images) will be completely ignored
• Image types - doesn’t like PNGs!

What can you do to minimize problems with the media manager? We suggest that you disable Flash with the No Flash Uploader plugin. Since installing it, many errors have been thankfully squelched.

We realize it’s a good start, but we look forward to the continuing evolution of the Media Manager.

Our regular readers might notice that a new look is starting to come to ContentRobot.com.

What’s new?

• the shell is getting poured in
• our tagline was tweaked
• the blue gets darker and more techy
• the navigation buttons are stylized
• a textured background anchors the design

While there is much to be done (the internal pages still look wonky!) we are pleased with this iteration. What do you think?

ContentRobot relaunched InternetGeekGirl.com today!

Once integrated with StephanieAgresta.com, this blog gets its own look and matches the branding set by  Affiliate Karma.

The highlights of IGG include:

• A cool combo of girly-tech with the pinks, oranges, and blacks
• Web 2.0-inspired fonts
• Tons of widgets in the sidebar to highlight events, social marketing, and blog navigation elements
• Follow her twitter feed, popular posts, and comments found in the footer

Congrats, Stephanie, have fun with it!

Are you still writing 2007 on your checks (if you are still writing them)? Even tho we are over two weeks into the new year, are you still struggling to say this is 2008?

Now … what does your blog’s copyright date say? Scroll down to see your footer, do you see © Copyright 2007 Your Blog Name?

While it’s a little mistake, it may be big and glaring in the eyes of any unforgiving readers. Don’t give them any reason to question why they should stay on your blog.

If you are on a PHP-driven blog (such as WordPress), you can fix it now and forever. In your footer, merely put the following code to display the year: <?php echo date(’Y'); ?>

For those of you who want to include your starting the copyright date (example: 1998-2008), just code it as follows: 1998-<?php echo date(’Y'); ?>

Not on WordPress? For hosted solutions and other blog platforms, we suggest that you check out your user guides - but get that timestamp automated.

Now, go out there and show ‘em what year we are living in!

To help spread holiday cheer, ContentRobot has created an animated header with falling snow for the WordPress default (Kubrick) theme. You can easily add this Flash-based header to your site and it will overlay falling snow on top of your existing header graphic. No fiddling with Flash necessary, simply upload a few files to your server and the snow automatically appears!

You can view an animated example here.

The “Snowified” header is easily customized via a simple text file.

• Choose from three different snowflake styles.
• Customizable flake fall speed and rotation amount.
• Choose to display the blog’s title and description within the Flash file (or hide it if your logo is part of your header image).
• Dynamically loads external header JPEG behind falling snow.
• Chose to display snow within the rounded area of the header or have the snow fill the full header.

Read the Entire Post >

In the final post of our Blog Accessibility Series, ContentRobot provides some tips to helping your design your blog for a wider audience.

1. Use Relative Font Sizes
Express font sizes in percentages or ems, rather than absolute font sizes expressed in points or pixels. The allows users to make the text larger or smaller as they wish.

2. Design & Label Your Forms Properly
Lay out your forms logically and consistently, make proper use of labels, and avoid client-side scripts and radio buttons will make your web forms much more accessible to users who are visually impaired.

3. Write Effective Alt-Text
Think about the difference between “Click Here” verses “Download the ContentRobot WordPress Theme” when creating your alt tags. More tips:

• Brief is better.
• Put the most essential information first.
• Meaningless graphics, such as spacers, do not need meaningful text.
• Maintain the alt-text. If your navigation was rearranged, don’t forget to move the alt-text, too. Otherwise, users may get lost.
• Spell words correctly.

4. Test and Validate

• Check out the free W3C Markup Validation Service.
• Validate syntax (e.g., HTML, XML, etc.) and style sheets (e.g., CSS).
• Test using a text-only browser or emulator.
• Test for these conditions: sounds and graphics loaded, graphics not loaded, sounds not loaded, no mouse, frames, scripts, style sheets, and applets not loaded
• View your site in several browsers, old and new, and on different platforms, Mac and PC.
• Use a self-voicing browser, a screen reader, magnification software, a small display, etc.
• Use spell and grammar checkers. A person reading a page with a speech synthesizer may not be able to decipher the synthesizer’s best guess for a word with a spelling error.

5. Invite People with Disabilities to Review Documents
Expert and novice users with disabilities will provide valuable feedback about accessibility or usability problems and their severity.

For More Information About Creating Accessible Web Sites
Explore the Web Accessibility area of the American Foundation for the Blind site, or visit the World Wide Web Consortium’s Web Content Accessibility Guidelines.

Related Posts: Is Your Blog Accessible to People With Disabilities? and Design Your Blog to Be More Accessible to a Wider Audience

The World Web Web Consortium has published guidelines to help designers make their sites more accessible. ContentRobot has summarized some key points below.

• Make multimedia content (images, video, and audio) more accessible to a wide audience. This can be done using text equivalents (often rendered with Alt tags within HTML documents). Text can be rendered in ways that are available to almost all browsing devices and accessible to almost all users.
• Provide non-text equivalents (e.g., pictures, videos, and pre-recorded audio) for text to offer visual cues that convey the same information. This can be beneficial non-readers or people who have difficulty reading.
• Ensure that text and graphics are understandable when viewed without color. Some people cannot differentiate between certain colors and users with devices that have non-color or non-visual displays will not receive the information.
• Separate structure from presentation and content by ensuring that HTML and CSS markup is coded properly. Mark up documents with the proper structural elements and control presentation with style sheets rather than with presentation elements and attributes. Misusing markup for a presentation effect (e.g., using a table for layout or a header to change the font size) makes it difficult for some users to understand the organization of the page or navigate through it.
• Ensure that pages are accessible even when newer technologies (using Flash or Javascript, for example) are not supported or are turned off. Some users still work with older browsers and some choose to turn off newer features. Finally, if the interface of the embedded object cannot be made accessible, an alternative accessible solution must be provided.
• Create documents that do not rely on one type of hardware. Pages should be usable by people without mice, with small screens, low resolution screens, black and white screens, no screens, with only voice or text output, etc.
• Provide a clear and consistent navigation, including orientation information, navigation bars, a site map, etc. This increases the likelihood that a person of any ability will find what they are looking for at a site.
• Provide a consistent page layout, recognizable graphics, and easy-to-understand language benefits all users as it promotes effective communication.

In sum
There are a variety of simple guidelines that designers, developers, and content providers can do to make their blog pages more accessible to persons of all abilities. We’ll even delve deeper with more accessibility tips in our next post.

Related Posts: Is Your Blog Accessible to People With Disabilities? and Tips & Tricks to Improve Blog Accessibility

Blog designers should consider ways to make Web content more available to all users, and help people find information more quickly.

Consider that many users may be operating in contexts very different from your own. Have you thought about these issues while designing your blog?

Web Surfing Devices
Websites can be viewed from a desktop or laptop browser, voice browser, mobile phone, automobile-based personal computer, etc. Can your users connect to your blog using all these devices?

Hardware Constraints
Users may only have access to a text-only screen, a small screen, or even a slow Internet connection. While broadband is more available, there are some users who do not have it.

Browser Versions
Users may have an early version of a browser, a different browser entirely, a voice browser, or a different operating system. Have you designed for the more popular browsers on the Mac, PC, and Linux platforms?

Language Barriers
Users may not speak or understand fluently the language in which the document is written. It may be necessary to consider linking to online translators (like Bablefish).

Environmental Issues
Noisy surroundings, under- or over-illuminated rooms, in a hands-free environment, for example, may all be valid issues for a difficult surfing experience.

Physical or Developmental Disabilities
There are many issues that fall under this category. Some to consider are:

• Users may not be able to see, hear, move.
• They may not be able to process some types of information easily or at all, including difficulty reading or comprehending text.
• Not all users can make use of visual clues such as image maps, proportional scroll bars, side-by-side frames, or graphics that guide sighted users of graphical desktop browsers.
• Users also lose contextual information when they can only view a portion of a page, either because they are accessing the page one word at a time (speech synthesis or braille display), or one section at a time (small display, or a magnified display).
• Without better orientation information, users may not be able to understand very large tables, lists, menus, etc.
• Some users might not have or not be able to use a keyboard or mouse.

Related Posts: Design Your Blog to Be More Accessible to a Wider Audience and Tips & Tricks to Improve Blog Accessibility

One of the cool things about blogging is the ability to include photos within posts. While blog editors are really not that great at image placement and editing, its great when you can put some visual interest into your entries.

Then how do we find inexpensive, but compelling stock photos? Here are some sites that offer some nice royalty free images:

• Fotolia - photos for $1, 2, and $3 each
• iStockphoto - photos for $1, 3, and $5 each
• BigStockPhoto - photos for $1-$2 each
• Cheap Stock Photos - photos for $1, 3, and $5 each
• Dreamstime - photos for $1 each

Hunting for the right photo can be downright addictive. Have fun!
Read the Entire Post >