Sep 13 2018
Sep 13

on September 13th, 2018

Website redesigns are a common occurrence in growing businesses, but many people get confused as to when they’re supposed to do one. Your website is a window for the world to get a look at your company. It’s a very important part of your business' marketing efforts. It’s critical to get the timing right.

While there’s certainly space between a redesign being a nice “want-to-have” and it being a “need-to-do,” here are some signs that will tell you when it’s time for a refresh.

Mobile Unfriendliness

Over half of all internet traffic is now coming from a mobile device. If your website is not formatted effectively to be viewed and used on a wide variety of screen sizes, then the redesign should come much sooner rather than later. Having a design that makes the content illegible on a mobile device will send your user elsewhere.

Responsive layouts, navigation links that break up into big, tap-friendly menus, data plan-friendly image optimization, and other considerations for mobile users are what constitutes a mobile-friendly design. Google provides a Mobile-Friendly test tool you can use to check your own website.

Mobile Versions or Responsive Design?

One approach to address this is to develop two versions of your website, one for mobile and the other for desktop users. The web server detects the device that your visitor is using and routes them to the correct version. The advantage of this system is that the mobile version can be optimized to be lightweight in data and speedy to load, specifically for mobile users. That means you can sideline any non-applicable considerations in your design. The biggest disadvantage is that you need to then maintain twice as many web pages: your mobile site and your desktop site.

We recommend responsive web design for our clients, instead. It's just more efficient.

Rather than developing both a desktop and a mobile version, you should have one website that will adjust its layout and navigation based on screen size. Skilled web developers can deliver fast websites to both platforms by optimizing and compressing images, using minified code (which means to strip out all unnecessary code), and other speed improvements.

By setting 'breakpoints' in the layouts, you can also have different layouts and navigation for different screen sizes. A giant drop down animated menu that looks great and is super useful on a desktop is gonna drive your mobile users bonkers.

Via breakpoints, you can set the navigation menu to collapse into a simpler menu with big finger-friendly buttons when it's served to someone on a phone.

Unprofessional Design

Your website is the first impression your company makes on a user, and you want that impression to be a good one. Customers are qualifying companies as much as companies are qualifying customers. They use channels like social media, company websites, and online reputation platforms to see if the company is a good fit for their needs. Compare your website to that of your competitors. Have coworkers critique the website. Look at websites in your industry that you enjoy visiting. Does your website stack up?

Trends shift in web design, as they do in fashion - what looked great in the past can be jarring or cringe-inducing now. Showing up to a pitch meeting in dated business attire projects the impression that you either don’t care about or are ignorant of modern clothing trends. When a visitor lands on your website, dated design projects that same impression.

Web design can look unprofessional if its inconsistent with your brand. Your website needs to clearly call out your company's value statements to your visitors. Unappealing fonts, low-quality icons, slapdash layouts, and thoughtless color palettes confuse and build mistrust in your visitors

User Experience and Design

Good design is about more than just the visuals of your website. It considers the users' needs and their experience while navigating and using your site.

Intuitive navigation needs to tell the user where they are, how they got there, how near their destination is, and how they get there. Thoughtful categorization of content complements your design. By grouping things in a way that makes sense to your visitor, you make it easy for them to solve their problems or satisfy their needs. 

High Bounce Rate

Bounce rate is a metric describing the percentage of your visitors that leave your website within moments of arriving from a search results page. Either they were sent away by a technical problem or something about your website compelled them to leave of their own volition.  You can see your bounce rate in analytics suites, like Google Analytics, assuming you have the code installed.

If you DON’T have this software installed, you have no way of knowing how effective or ineffective your website is. Bounce rates are considered to be great if they're in the 20's to the 30's (percentage-wise) and acceptable in the 40's and mid-50's. Upper 50's and up, is considered to be a high bounce rate.

There are two important things to note here. First is that these classifications are generalizations across a broad swathe of industries. Websites in some industries have a lower bounce rate since their content is more engaging. Second is that you should only be worried about human visitors to your website when it comes to bounce rate.

In your web analytics software, it's important to filter out bots and crawlers from your data. Moz has a great explanation and guide to filter out bots from Google Analytics

A high bounce rate means that your website is not serving its basic function in some fundamental way. This is a major problem that needs to be addressed as soon as possible. There are a number of reasons that visitors could be bouncing from your website, but some major ones are:

Slow loading pages

When a visitor arrives on your site, they expect the content to load nearly instantly. High load times (or latency) could be caused by bloated code (an inexperienced developer used way more code to achieve a result that a more experienced developer could have done with less). It could also be due to an inefficient system of fetching and displaying content or it might simply be large images that aren't optimized for the web.

The longer the loading time, the greater the chance that your visitor is going to head back to the search results and try the next option. Since your site likely appeared in their search results because you offer something they were looking for, this means your visitors went to a competitor.

Confusing Titles or Meta Descriptions

The page title (as denoted in your website by the <title> tag) appears in search results. It's read by search engine robots and used to categorize your website in their indexes. Meta descriptions (which appear in <meta> tags) are brief summaries of the content of the page (By default, this will be filled with the first few lines of text if you leave it blank). 

While search robots don't pay much attention to meta descriptions, visitors do. They read it and the title tag to decide if the answer to their problems lie on your page. If they arrive on your page and the content doesn't match the title or meta descriptions, they're really likely to head back and try another result.

Technical Errors

For some visitors, they could land on your website and not find the content they're looking for. The URL they clicked on leads to a page that does not exist. There's no reason to stay, so the visitor heads back to the search results. Or they arrive and are redirected to a redirect in a  permanent loop until they give up and try a different result.

Errors like 404 (Page not Found) or 301 (Permanent Redirect) loops are a very poor experience for the visitor and they can contribute to a high bounce rate.

Frustrating Content Administrator Experience

Administrator experience is a term that describes the ease of use of the website for normal operations. Updating copy, adding new articles, adding products to an online store are some everyday tasks for your webmasters and content editors. They need to be straightforward and simple to accomplish. If you need a professional web developer to make content changes or updates, you’re in dire need of a redesign. A good solution might be switching to a content management system like Drupal or WordPress. They excel at making life easier for website administrators who are not developers. This is particularly true if you have multiple people adding content to the website.

One of the simplest ways to improve an administrator experience is to review permissions for each user and limit them based on needs. A content administrator can focus on just the tasks they need to accomplish, making it easier to familiarize themselves with the interface.

Drupal has pretty granular permission systems in place right out of the box, letting you choose what each user can do. WordPress' permissions are role-based, meaning you assign a person to a category (Administrator, Editor, Author, etc) and they inherit all the permissions of that role. WordPress can be extended with plugins to grant more permission setting ability.

benefits of a content management system

Outdated Code

Even the best website will eventually need to be refreshed. Web technology evolves and improves constantly. New versions of programming languages like PHP, Ruby on Rails, and Java (to name a few) are released in updates. Eventually, much older versions of software stop being regularly updated.

This is a problem. The outdated code is a big security weakness, making it one of the first targets for malicious hackers. When support ends for older versions of software, it becomes more difficult and more expensive to maintain that website (since any fixes and updates have to be custom development). This becomes even more of a problem when the outdated software has dependencies or other software that requires it.

A redesign can be a good opportunity to refresh all of the software at once, bringing your site’s code up to the latest versions in one fell swoop.

Is it time to redesign your website?

Trends in web design, user experience, and digital marketing shift relatively rapidly. You can expect to redesign your website every 3-5 years if you want to stay current. For companies, this means that what visitors to your site will both expect and accept also changes. If your site doesn't meet the expectations of your customers, they'll leave. On the Internet, they're not starved for choice.

Send us a message if you'd like to talk about redesigning your website. We'd be happy to do a free site review!

Jul 23 2018
Jul 23

on July 23rd, 2018

Here’s the threat delivered to your email: They've infected your system with remote computer control malware. Pay a ransom in bitcoin or they’ll release evidence of you watching adult material. They show your password, or part of it, to prove their case.

Is this threat credible? No, it’s a scam. The bad guys got your information from a breach and are using it to shake you down. The evidence is manyfold:

It’s an untargeted, mass email scam

The scammers are not targeting specific individuals. Your inbox is one of thousands in a database. They’re only hoping to capitalize on panic and embarrassment to force some small number of people to pay the ransom. Their goal is making fast cash from the volume of people who give in, they’re not interested in running high effort blackmail. We know this because the content of the email is nearly identical in many, many reports.

Not only is there no concrete proof offered, the scammers actively dissuade the would-be victim from looking for evidence. There’s no mention of which adult website you had visited. Your full name often does not appear in the email. There are no images or videos of you attached or linked to.

No malware detected

The emails also claim to have installed malware through which they gathered this incriminating material - yet, malware scans reveal no threats. True, malware scanners vary in accuracy when it comes to more subtle infections. Software capable of remotely accessing your system is not one of those.

Nothing new under the sun

The history of this threat is also a clue to it being a scam. These reports have been floating around since the end of 2017. The nature of their threat, the amount of money they’re demanding and the method of ‘evidence’ collection has changed but it is essentially the same scam. A stranger threatens to reveal embarrassing information about you and will remain silent in exchange for a ransom.

So, what should you do?

You should not pay this ransom, but you should definitely see this as a big wake up call about your data security. This data was pulled from one of the many data breaches that’ve been popping up in the last several years. That means that your email and password has been compromised.

Next, act:

  • Whichever password appeared in the email: change it, everywhere and never use it again. You can check if your password has ever appeared in a breach. If it has, never use it again.

  • Adhere to good password practices when creating new passwords.

  • Run a malware scan on your system - (Malware Bytes)

  • Consider cloud-based password vaults like 1Password or LastPass.

  • Create long and high-strength passwords by forming a memorable phrase, then adding capitalization and punctuation.

Concerned about keeping your website more secure? Learn about our on-going website maintenance services.

May 11 2018
May 11

on May 11th, 2018

We are proud to be recognized for our commitment to our clients!

We are now featured on Clutch.co with an overall 5-star rating from our clients and on Clutch’s sister website, The Manifest, as one of the top web developers in Chicago. We work to build strategic relationships, not just accounts. We listen to what our clients want to achieve and produce websites to meet those goals. A running theme to the client reviews has been our commitment and open communication.

Thumbnail

Clutch is a B2B ratings and reviews platform that connects small and medium-sized businesses with the developer or software solution that best fits their needs. The Manifest is a research platform meant to aid buyers in the awareness, discovery, and decision-making process of selecting an agency to hire for a project. We are thrilled to be a part of both websites, demonstrating our expertise in web development and design services.

Thumbnail

Clutch reviews are unique in that they are verified and independent. Their analysts personally interview our clients to understand what it is truly like to partner with Xeno Media. See what some of them had to say:

“I’ve worked with a variety of outside vendors, and Xeno Media stood out in every aspect of the engagement. I would recommend them to anyone without hesitation.”

“Xeno Media doesn’t just service us—they take care of us. They actually care about and understand us as a client. The level of trust between us is something that is very rare in a client relationship, but they have ours and we have theirs.”

“They're always on top of all aspects of the project. If I ask them to do something, it's done immediately. They're really quick.”

“This was one of the best experiences I’ve ever had working with an outside vendor.”

Special thanks to our clients for taking the time to share their candid comments with the Clutch analysts. It has been our pleasure working with you! We would also like to thank Clutch for including us in their research. We are looking forward to maintaining our rank as a leading web developer and reading more great reviews soon.

See full reviews on our Clutch profile!

Apr 13 2018
Apr 13

Website maintenance is needed to address any vulnerabilities identified in software over time.

Thanks to the collaborative nature of the open source communities of Drupal and WordPress, we get a heads up when new vulnerabilities are identified (Read more about why open source is great for business). When the fixes and security updates for those vulnerabilities are released, they need to get installed and tested as soon as possible.

There are benefits and drawbacks to fully automated website maintenance, just as there are for fully manual website maintenance. The best path is to do both.

A machine never forgets a step in a process. It just gets confused when it's presented with the unexpected. A person can introduce human error, but can create novel solutions to unexpected problems.

Benefits of Automation

Fast

Machines are much faster than people at reading code. Computers are fast and they can apply steps in a process much quicker than we can. They can also run multiple tests simultaneously, leading to even more time savings. There is an inherent, upfront time investment to program the scripts, but once that time investment is made, all subsequent processes are significantly faster.

Accurate

A machine can repeat the exact same process, in the exact same way, thousands of times. It can also log processes, errors and results at every step, every time. A person couldn’t log the results of every single step, or, if they did, they would take significantly longer than usual to finish each test and there’d be many more opportunities for human error. This accuracy in repetition and recording means that we have a clearer picture of the test and its results available to us.

Thorough

A machine checks everything within the scope you set for it and nothing outside of it. It doesn’t care if “this little change isn’t going to mess anything up”. It checks everything you set it to. That total adherence to process is key when testing a system with multiple, related, and moving parts, like a website.

The Human Advantage

We’re innovative

A machine never forgets a step, ever. It just gets confused when presented with the unexpected. People are needed to create novel solutions to those unexpected problems. A developer can invent new processes, fixes, and features and create new applications for existing ones. 

We can give human feedback

A machine won’t tell you if the final result looks professional and aesthetically appealing. It can only check if objects are rendered in specific predefined colors, object types appear in the correct spot on the screen and so on.  A person can see if everything comes together and looks good. They can provide feedback on the branding of your site, give you unquantifiable assessments of how your site makes them feel as a person.

We can do ad-hoc testing

Automated tests have to be developed, programmed and tested themselves before they can begin to test new features for your site. A person can run through some manual tests very quickly when there isn’t a need to develop a deeper test.

How we put it into practice

Our system automatically creates a cloned copy of our clients' sites and applies updates. It then runs a battery of automated tests on the patched clone sites, out of public view, before notifying our developers to review the results. 

Once the updates are confirmed to be working properly and that nothing untoward is going on, the developer pushes the site to live. If anything is off, the developer can dive right in and make any needed adjustments, again, behind the scenes. For anyone visiting a site during this process, it's business as usual.

Website maintenance solutions like this are critical to any business. Gone are the days (if ever they existed) of launch and forget websites. Websites vulnerabilities are identified over time as intruders' techniques become more sophisticated. You can't prevent 100% of all data breaches, just like you can't prevent every burglar from trying to break into your house. But you can fix the porch light when it gets broken, and tighten up the deadbolt if it gets loose. So long as you've got someone checking the lights and testing the doors.

Keep up your Website's Performance with Website Maintenance!

Mar 26 2018
Mar 26

Open source software is a great choice for businesses.

As developers, we use open source software for a number of reasons.

  • With the source code being openly available, we can modify, improve or build on it as we need. 
  • Updates and patches are actively developed and released in a collaborative community.
  • Open source software is well documented so we can always orient ourselves when we run into something new.

But most people that need a website built aren't developers. They need to know why they should go with open source from the perspective of a business decision. There are 4 key reasons that open source is a great choice:

Longevity

You can easily see how active the development team behind a given piece of software is by checking how frequently it’s been updated. This lets you make more informed decisions about which software to use. You can avoid sinking your time into something that’s gonna wither on the vine. Even if something IS abandoned, since the source code is freely available and made to open standards, another developer can pick it up and continue working on it. You’re not automatically beholden to the initial creator for support. 

Technical Quality

The open source solutions we build for businesses are of high quality. How do you defend that claim? By testing it! Open source solutions are free to be reviewed by anyone, at any time. With 10,000 eyes on your source code, any mistakes or problems will quickly be revealed and pointed out. More often than not, they’ll also be fixed and contributed back. This is Linus’ Law in effect. Named after Linus Torvald, the inventor of Linux, it states:

“Given enough eyeballs, all bugs are shallow”

This also makes the security of open source platforms more verifiable, since the source code of Drupal, WordPress and other open source platforms is publicly reviewable.

Flexibility

When we make something using an open source platform like Drupal, or Wordpress, we are making something that our client OWNS. They are free to take that thing to another developer, work on it themselves, or whatever they'd like. With a proprietary system, you have to to go to the original creator for any changes or additions to your software. The original creator then has to decide if adding your feature (which will change the software for all current and future users) is cost-effective for them. With open source, you have complete flexibility and customizability. You’re not locked into using us as you would be with proprietary systems. We let our expertise and experience convince our clients to stick around, not vendor-lock.

Cost

Open source solutions also cost much less than proprietary systems. In fact, they're often flat out free. Without licensing fees, which can be a percentage of the initial cost paid every year, you’re free to go further and get more out of your site or use that budget elsewhere. You're also free to try out the software however and wherever you'd like. From a small microsite spun up to try a new layout to a full implementation, you're free to have whatever you want built. In proprietary systems, you're limited by a free trial (assuming one is even available) with a short time span and restricted features to decide if you want to shell out for the full version.

Some of our own contributions to open source

We’re very active in the Drupal community and have organized and sponsored coding events like MidCamp, had our folks speak at Drupalcons and more. Here are some of the modules we’ve developed and contributed back to the open source community:

Contact Formatter

Drupal’s core software already had a system in place for adding a contact form so visitors could send you messages through your website. But, a client wanted to give their visitors the ability to reach out to them from a  form that appeared at the bottom of their blog posts - the core Drupal contact system was through a dedicated contact page. Albert, one of our developers, got to work on creating Contact Field Formatter, a module that lets you put that form anywhere you please. 

Easy Zoom

A client of ours has a site that really needs to showcase their beautiful, high-resolution images. Visitors to their site were going to want to see details on each of the images, so we put in a mouseover zoom function. Since we wanted to make sure their mobile-friendly site STAYED mobile friendly, we also wanted that functionality for visitors on their phones or tablets as well as desktops. We created a module that added this zoom function on touch to partially zoom images with panning, to better highlight photo heavy product pages, then contributed the module back to the Drupal community.

Bootstrap Paragraphs

Our Web Strategist, Jim Birch, created a module that merged bundles of Paragraphs functions into the Bootstrap framework. This improved page builder lets content managers very easily build pages with columns, images with parallax effects, accordions, popup modals, image carousels and more without coding a single thing. You can get more details from Jim's presentation.

See what we've built in open source!

Mar 23 2018
Mar 23

on March 23rd, 2018

We at Xeno Media are proud to have received the Model Workplace Award for Smaller Businesses by The Greater Oak Brook Chamber of Commerce at their Annual Meeting on March 20th, 2018. 

Our office culture focuses on work-life balance through two of the core company values: diversity and fairness. Staff work with principals and create a schedule of work that strikes a good balance between their personal and family life and the needs of our clients, colleagues, and partners. Staff are fairly compensated and represent a wide diversity of backgrounds and life experiences.

Men and women are evenly represented at all levels of the company org chart. In the male-dominated industry of web development, this is a point of pride for us.

On Fridays, we have a family style lunch around the conference table. During that weekly company lunch, we play some fast rounds of Texas Hold ‘em, tracking our stats for bragging rights. The conversation naturally flows from a kid's spelling bee, through national news, to Star Wars, and how dorky someone is for playing Dungeons and Dragons as a full grown adult (your jealousy is palpable). That can only happen with a positive office culture built on trust. I trust my coworkers not to tell anyone that I'm a huge D&D nerd. And they have been very discreet.

Having a positive work culture invests us in the work that we do.

We care about each other. This attitude flows into our relationships with clients. When we tell clients that we're open and communicative, that you call our office and you get a person, we're saying that from a position of authentic relationship-building.

Through this approach, Xeno Media attracts great talent and achieves a retention rate much higher than the industry average. We develop a deep institutional memory that benefits our many long-term clients. We respect and support the needs of the people here with families, be they moms or dads, and those without. Staff can raise kids, pursue their passions and interests, volunteer in local organizations, and advocate for important causes and issues.

We lean on each other and support each other. Those bonds are created by knowing that our colleagues care about our lives. We know when someone’s kid has strep and whose teen is stressing out over a dance recital. We laugh at the photoshop battles over a coworker’s epic snowsuit. We help out when it’s all-hands-on-deck because that's what we do.

Mar 12 2018
Mar 12

The benefits of a website are what drive your business goals.

"We need a website for our business, because our organization needs an online presence."

That's not a web strategy, it's a tautology, or saying the same thing in different ways. It's not advancing your business plans, it's doing something, just to do it. You don't need a website, you need the BENEFITS of a website. Increased leads, increased sales, wider reach; THESE are the things you need. We see too many prospective clients get caught up in the details of their new website, without considering what the site is supposed to be doing for them.

Pantheon’s Dwayne McDaniel gives a great talk about giving the client what they want, even when they’re not really sure what it is. It’s our job as web designers to help them articulate what their business goals are for the website. We understand the technical side of the web, and how it can drive business goals. We have to be interpreters, listening to what the client is trying to accomplish and translating it into web design and development that accomplishes those goals.

"We are not designing a chair, we are designing a human suspension system." - Kandace Brigleb at WooConference 2017

Quality, professional websites provide very real benefits to your business. But you need to pull relevant and concrete benefits from the website. In initial discovery meetings, it's important to nail down what specific benefits you're looking to get. What need does this new site need to fulfill for you? Do you need an increase in sales? Is lead generation the focus? This applies to non-profits and organizations as well! Converting potential funders or donors? Are you growing an email list to amplify your voice? We ask a lot of questions in discovery, but that's because we want to help you define what concrete and measurable goals are. If you, as the client, walk into that meeting with a clear idea of what benefits you're looking to get from the site, success is not far away. If you walk in with a head full of features and no goals, it's going to be a long discovery meeting.

What's the difference? Think of it as cause and effect. Features cause benefits. If the good thing you're looking at is caused by something else, it's a benefit.

  • Web Accessibility is a feature. It's proper markup of the website’s code that makes the site behave in a way that is predictable for people using assistive technology. (You can read about accessibility here, as well)
    • Increased audience share is a benefit of accessibility. 
    • Increased exposure to your brand is a benefit of accessibility
  • Search Engine Optimized content is a feature. It’s a bundle of tactics that make your website show up higher in search results when people search for a particular keyword or keyword phrase.
    • Increased organic search traffic to your site is a benefit of SEO content.
    • Increased lead generation is a benefit of SEO content.
  • UX-focused design (User eXperience) is a feature. It's keeping the ease of use, the pleasure of usage and the usefulness of your site to the visitor at the forefront of your decision making when building a site.
    • Increased visitor loyalty is a benefit of UX-focused design.
    • Improved conversion rates are a benefit of UX-focused design.

So you've decided on the benefits you're looking to get out of your site and set goals to define them. How do you know if you’re hitting those goals? Set KPIs, of course! Key Performance Indicators. These are concrete, measurable things you can use to track progress towards your goals.

Social media referral traffic, email signups, abandoned cart conversions are all great KPIs. If it’s a real goal, a true benefit, it needs to be something measurable. And with a bit of work, you can find a way to measure nearly anything. You take the benefit that you've identified and set a quantifiable metric based on data. It should be countable so that you can measure progress and see trends.

Nobody wants a website, they want to hit a KPI.

KPIs are mile markers on your journey towards your website's business goal. Regularly check your website's KPIs and see if you're advancing towards your goal. If you are, then your website is delivering the benefits that you defined. That's great! Look for ways to support or amplify your efforts. If not, dig into your KPI and think about which specific, actionable things you could be doing to turn that trend around. By identifying and tracking your KPIs, you have a specific area of your strategy to focus your attention, instead of "The website's not performing".

Check out Dwayne's full presentation at MidCamp (it's well worth the listen). If you're considering a new content management system for your website, learn why open source is great for business.

Get more for your business out of your website.

Jan 29 2018
Jan 29

Xeno Media can finally order a drink in a bar.

 

We can smoke in Chicago, we can gamble in Iowa, and even get a license to fly a plane in England. That’s because Xeno Media has turned 21 years old this January.

 

We’ve been around since before Google launched in September of 1998, back when people still hung up their phones and rewound movies. The Internet (or “World Wide Web,” if you will) has changed quite a bit since then.

 

When we opened our doors in '97 people were taking a huge leap forward in connectivity. Blisteringly fast 56k modems had arrived. Finally, humanity could leave the binding shackles of 28.8 behind and step into the future. Unfortunately, they wouldn't be widely available until '98. At those speeds, you could get a gigabyte (approximately 5 minutes) of HD content after an hour of downloading. What a rush! You also got treated to a wonderful dial tone noise that I will very ineffectually try to replicate here:

 

"BUZZZZZZZZZZZZZ-KACHOW-SQUELCH-baDOING-baDOING-baDOING-BUUZZZZZZZZ!"

 

It was the sound of humanity joining in global communication and harmony - Until someone called your house and the connection was broken.

 

We also broadened our perspective and adopted crisp 800x600 screen resolutions, leaving 640x480 in the digital dust (or the cathode ray tube dust?). If you wanted to, you could even shoot off an email while simultaneously watching the latest episode of Xena: Warrior Princess (or Hercules: The Legendary Journeys if that was more your thing) thanks to the wonders of WebTV.

 

We were still de-gaussing our screens then. Magnetic fields picked up by the metal plate at the front of CRT monitors (called a shadow mask) would cause discoloration in the screen. These magnetic fields deflected the electron beams and distorted the color, so you had a handy button on your monitor to send a rush of magnetized electrons through a coil wrapped around the screen. This field oscillated rapidly and spread the magnetic field randomly and evenly around the screen. As the field diminished, it removed the distortion (and made an extremely satisfying “Snap!” noise in the bargain).

 

Speaking of technology which would surely stand the test of time, IoMega's Zip disks were embroiled in a war with SyQuest's Ez135 disks for dominance of the storage media market (and the bizarrely capitalized name market). We had to decide if we wanted the truly voluminous 135 MB of storage offered by SyQuest, or the far more affordable 100 MB storage of IoMega's option. Thankfully, CD-RW technology came along not long after to settle the issue.

 

Netscape Navigator was the browser of choice, trailed by Internet Explorer. Though Internet Explorer eventually beat Netscape Navigator, NN still has a record that Internet Explorer still hasn’t shaken. Netscape Navigator’s original “Welcome to Netscape” web page is STILL up, enlightening people about “hyperlinks,” and inviting them to check out the Internet White Pages in order to connect with someone else who is “on the Internet”. You can learn about this exciting new information superhighway right here!

 

There were about 1.1 million websites live at the time, compared to today’s approximately 1.3 billion. If you didn’t know the exact URL, you had a plethora of search engines to choose from: There was a dog, a spider and some guy named Jerry (Or Lycos, Web Crawler and what had been renamed Yahoo), as well as Altavista, Excite! and others. Google came along the following year.

 

Things have changed quite a bit since we got started and we've changed right along with them. So here's to a happy birthday, and many more!

Jan 10 2018
Jan 10

In this installment of our series, we’re going to be looking at techniques, tools, and tips to ensure that your website is accessible to everyone that needs it. Accessibility isn’t easy, but it’s worth doing. The World Health Organization estimates that there are over 253 million people living with blindness or vision impairment in the world as of October 2017. If your website isn’t built to web accessibility standards, these folks won’t be able to use it. Thankfully, there are a number of resources to help your efforts:

WAVE

The WAVE validation tool is an invaluable piece of software from Web Accessibility In Mind (WAIM) that runs through your site and kicks back a report highlighting areas of concern. The report is broken up into Errors, Alerts, Features and ARIA flags.

Anything marked as an error needs to be taken care of immediately. These are things like missing alt-text, skipped headings, non-functional forms and the like. These accessibility errors will frustrate your users, or make it impossible for them to fully interact with your site. Alerts should be cleaned up as time allows and include things like redundant link names, skipped heading levels, or very small text. These are aggravating, but don't completely prevent a person from fully using your site.

Features and ARIA flags are a good "thumb's up" for accessibility. Features are things like an image with alt-text or including a skip link to allow screen readers to jump around your content as the user desires. 

ARIA (or Accessible Rich Internet Application) flags are markups in the HTML code that tells a screen reader how to navigate or use your more complicated website elements. These are your widgets like buttons, drop-down lists and so on. including these greatly improves the user's ability to use your site's widgets.

There are Chrome and Firefox extensions that make it really easy to scan through your site looking for any glaring errors to resolve

Google Lighthouse

Google Chrome has a built-in auditing function called Lighthouse. To access Lighthouse, you can open the Google Console with Ctrl+Shft+J (Windows) or Cmd+Opt+J (Mac) and then click on Audits (if it’s not visible, try clicking the two arrows to the right of Network, Performance, etc).

In Lighthouse you’ll have the option to run a variety of audits of your site. Make sure “Accessibility” is checked and click “Run Audit” to get a breakdown of issues. Lighthouse will run through your website, and present 8 different tests and their results, as well as an accessibility score from 0-100.

Apple OS - Voiceover

Voiceover is a feature built into MacOS that reads aloud the text and other elements on your screen. It comes pre-configured to be compatible with refreshable braille displays and is developed to be built into all of Apple’s apps and services. VoiceOver also features a virtual control called the Rotor. It's  accessed through rotating two fingers on the Macbook trackpad (as if you were turning a dial) and lets a user navigate directly to elements like headings, images and forms. 

JAWS

JAWS (or Job Access With Speech), is Windows-based screen reader software for people that have lost their sight. Developed by Freedom Scientific, it reads text and other elements aloud, while also sending the same information to a user’s refreshable braille display without requiring the use of a mouse. Since it uses the HTML markup language to navigate the user through the content on your page, it’s important to make sure you’re following proper standards. Otherwise, your page is going to confuse and disorient the user.

At $900, it’s quite expensive, but feature-rich. JAWS has been the premiere screen reading software for decades.

NVDA

Non-Visual Desktop Access (NVDA) is similar to JAWS, though it’s not as feature rich. Fortunately, it’s also completely free and can be run from a USB stick for portability. Developed by two blind men, Michael and James, the screen reader was born out of a desire to make computer access affordable to the blind.

The A11Y Project

The A11Y Project is a collaborative effort of developers working to support and encourage accessibility efforts. Their name is a numeronym for "Accessibility", where numbers are used to replace letters in a word. So “Accessibility” becomes both “A + 11 characters removed + Y” and “Ally”. They did that to save space on social media platforms like Twitter, so that the saved characters could be used for an extra word or two on accessibility.

The Project maintains a website of resources for developers looking to make their sites more accessible. This includes a checklist to help map out what might be missing on your site. There's also a style guide that is a very useful reference for building code to meet accessibility standards. It’s broken up into sections for the varied components of websites. Each section contains sample markup and outlines the relevant sections of the Web Content Accessibility Guidelines. It’s well put together and worth looking at.

 

You can check out the beginning of our series if you missed it, and learn about what's guiding accessibility efforts.

Dec 22 2017
Dec 22

What guidance is there for accessibility?

There are a couple of things that are driving accessibility efforts. The first effort is centered around developing standards for sites to conform to so assistive technologies can make sense of websites. The second revolves around federal laws to keep things equitable for people with disabilities.

W3C - World Wide Web Consortium

The World Wide Web Consortium or W3C (an international community of developers, organizations, businesses, and the public), works to develop standards for the Web. They believe that the Web is a great connector of humanity (as do we). Anything that prevents people from participating in that global connection lessens the Web as a whole. They kicked off the Web Accessibility Initiative (WAI) to gather a task force to develop standards and practices for web developers to follow. 

WCAG2.0 - Web Content Accessibility Guidelines 2.0

The fruit of that groups labor is in the Web Content Accessibility Guidelines (WCAG). These guidelines map out what your site needs in order to be accessible to a wide audience of people with disabilities. If you want your site to be useful to everyone that needs it, you need to be thinking about and implementing these guidelines.

The 12 guidelines, organized around 4 principles, lay out what your website needs. Your site needs to be:

  • Perceivable - Information and user interface components must be presentable to users in ways they can perceive.

  • Operable - User interface components and navigation must be operable.

  • Understandable - Information and the operation of user interface must be understandable.

    • The site needs to be readable, it should be presented in a predictable way, and the user should be able to see and correct mistakes

  • Robust - Content must be robust enough that it can be interpreted reliably by a wide variety of user agents, including assistive technologies.

The WCAG2.0 guidelines lay out specific criteria for satisfying each principle and even have samples and suggestions. Some criteria satisfy the principles more than others and are given a special ranking like A (The videos on your site have pre-recorded captions), AA (they have an audio-only alternative that the user can choose), and AAA (the videos include a sign language interpreter as an option). Websites can strive towards reaching a specific "level of compliance," like Level AA compliance across all principles.

These guidelines are also on the verge of being updated with an upcoming dot release, WCAG2.1. The newer version will include a renewed focus on accessibility for persons with low vision and people with cognitive or learning disabilities. It’s also going to be looking at accessibility issues for touchscreen and small screen mobile devices. The new guidelines are set to be finalized by the end of this year and will be adding 3 new success criteria.

Rehabilitation Act of 1973 - Section 508

Section 508 of the Rehabilitation Act basically says that federal government agencies, including the Postal Service, have to make their electronic and information technology accessible to people with disabilities. This access needs to be comparable to what people without disabilities are getting. With the newest refresh of Section 508, the Act is requiring these organizations to meet Level AA compliance of the WCAG2.0 principles.

As of January 18th, organizations have to comply with web accessibility requirements or become vulnerable to Rehabilitation Act lawsuits from private citizens. These are in addition to vulnerability to lawsuits under the Americans with Disabilities Act.

The Americans with Disabilities Act of 1990

The Americans with Disabilities Act (ADA) was put in place to protect people with disabilities from discrimination in the workplace, to ensure that they are able to participate in American life at the same level as everyone else. It’s broken up into three major sections: employment (Title I), Regulations for state and federal agencies and facilities (Title II), and regulations for non-profits and businesses (Title III). In essence, the law states that people with disabilities should enjoy the same opportunities for employment, the same ability to purchase goods and services, and the same ability to participate in state and federal programs and services.

What’s this mean for your website?

Well, a lot, it turns out. More and more courts are finding that Titles II and III of the ADA apply to websites, particularly if you’re in the retail, restaurant , or hospitality industries. Lawsuits under Titles I & II of the ADA have been rising steadily. In 2015, there were at least 57 lawsuits filed, with 262 in 2016 and 432 as of August 2017 according to the law firm Seyfarth & Shaw.

These lawsuits have targeted companies like Bank of America, Charles Schwab and Safeway in the early 2000’s. More recently, Target paid $10 million to settle an accessibility lawsuit and cover plaintiff court costs according to the LA Times. These lawsuits were brought to bear because the companies involved had websites that couldn’t be properly used by assistive technology for the disabled. And they haven’t all been settled out of court. In June of 2017, a Florida judge ruled in favor of a blind defendant that the grocery store chain Winn-Dixie’s site was in violation of the Americans with Disabilities Act and ordered the company to revamp their website to get in compliance (check out the Forbes article).

Web accessibility is a serious issue and an important one if you want your website to be useful to everyone.

About Drupal Sun

Drupal Sun is an Evolving Web project. It allows you to:

  • Do full-text search on all the articles in Drupal Planet (thanks to Apache Solr)
  • Facet based on tags, author, or feed
  • Flip through articles quickly (with j/k or arrow keys) to find what you're interested in
  • View the entire article text inline, or in the context of the site where it was created

See the blog post at Evolving Web

Evolving Web