Creating Modern, Responsive Websites With Web Standards

Website Standards and Clean Code

It isn’t that difficult to create a modern website based on current web standards. If your website was built using the latest technology, your site will be super-fast, modern, clean and responsive.

Everyone wants their website to cost less, work better, and reach more people in today’s browsers, screen readers, and wireless devices. The inescapable technological advancements that are happening as we speak are breaking websites all over the internet. A modern website built using the latest coding practices ensures that your website will function properly across all devices and help individuals with disabilities who are using special devices to access and interact with the internet – and stand the test of time.

You don’t have to spend money on trendy, short-sighted, proprietary solutions that will end in disaster. No one can afford to piecemeal a website that will ultimately break sooner than later.

Coding several different stylesheets might have seemed like a great idea at the time, but it is not a rational solution to problems that are continuing to plague site owners and builders.

FORWARD COMPATIBILITY

WaSP (www.webstandards.org) advocates standards that reduce the cost and complexity of site creation and ensure simple, affordable access for all. Today, every browser supports web standards as a matter of course. They work with the designers of development tools such as Dreamweaver. You can find a myriad of web standards educational tools and this information can be found in most languages today.

Apple’s latest WebKit based Safari browser, which powers the iPhone’s web browser, Mozilla powered Firefox, Opera, the WebKit based Google Chrome, and Microsoft Internet Explorer 7+ understand and correctly support XHTML, CSS3, JavaScript, and the DOM.
*Internet Explorer 6 does not support many of the latest web standards, and we can only hope that everyone has moved passed this version of IE. Developers know that we can fix IE6 to some degree, but there comes a time when you have to move forward and not look back. We’ve stopped overkill fixes because newer phones are equipped with the latest browsers and it just doesn’t warrant the extra time and expense anymore to work out ALL the fixes needed for IE6 to view properly.

WHAT IS WEB STANDARDS COMPLIANT?

javascript

JavaScript creates action.  JavaScript is the bomb. This language has given us the ability to create action!
In a perfect world, browsers perfect their support for every single standard. Considering that most software doesn’t come out bug-free, and standards are sophisticated and complex, cross-browser support is actually pretty solid enough that we do develop using the latest standards. HTML5, more accessibility, CSS3, structured markup and deeper DOM and JavaScript function calls are becoming the progressive-enhancement that is pushing the internet into the future. All the big companies such as Apple, MSN, Wikipedia, and WordPress have embraced web standards. Of course, they don’t always achieve perfect validation or pure semantic markup, but a trained developer can make these markup fixes very quickly, and let’s face it, modern browsers are lenient.

STANDARDS ARE THE TOOLS WITH WHICH ALL OF US CAN DESIGN AND BUILD SOPHISTICATED, BEAUTIFUL SITES THAT WILL WORK TODAY AND TOMORROW.

OLD BROWSERS ARE INCOMPETENT, INCOMPLETE, AND HAZARDOUS TO THE HEALTH OF THE WEB.

GARBAGE IN, GARBAGE OUT.

More than 90% of all websites are obsolete. They might look good on desktop browsers, but outside of that, the symptoms of decay are starting to appear. Carefully constructed layouts have begun to fall apart, and expensively engineered behaviors have stopped working. As browsers evolve, site performance continues to deteriorate.

Modern browsers are not merely newer versions of the same old thing. They differ fundamentally from their predecessors, and in many cases, they’ve been rebuilt from the ground up. They have a new job: to comply as well as possible with the web standards. As the newer browsers comply with web standards, they are becoming increasingly intolerant of broken code and markup.

THE KNOWLEDGE OF WEB STANDARDS IS A NECESSITY FOR ANYONE WHO DESIGNS OR PRODUCES WEBSITES

BEST WEBSITE NOW ENSURES THAT SITES DESIGNED TODAY WILL CONTINUE TO WORK IN TOMORROW’S BROWSERS AND DEVICES – INCLUDING DEVICES NOT EVEN BUILT OR IMAGINED YET

We believe in “write once, publish everywhere”. It isn’t wishful thinking. We are proud of the fact that our mission statement is “Because it matters”. Our mission follows some basic rules:

Control layout, placement, and typography in desktop browsers while allowing users to modify the presentation to suit their needs.
Develop and support sophisticated behaviors that work across multiple browsers and platforms.
Comply with accessibility laws and guidelines without sacrificing beauty, performance, or sophistication.
Redesign quickly – reducing costs and eliminating unnecessary work.
Support emerging devices from wireless gadgets and smart phones to Braille output devices and screen readers used by those with disabilities with one website.
Offer sophisticated printed versions of any web page.
Stay educated and ahead of the curve to always use real semantic markup.

PAGE RANKING AND SEO

iStock_000022200278Large

SEO and Analytics go hand-in-hand.  Believe it or not, companies do not have to spend a lot of money for SEO or Analytics. Well thought out SEO makes your website findable. Content is king. Focus on lean, keyword-rich, buzzword-free content that’s relevant to your customers, and use semantic markup. Copy, CSS layout and HTML5’s latest coding practices are the golden keys to findability.

COMPANIES THAT KNOW THE SIMPLICITY OF GREAT SEO ARE PROSPERING. THOSE THAT DON’T ARE FALLING BEHIND.

ACCESSIBILITY – THE HEART OF WEB STANDARDS…

Accessibility makes sure your content can be read and your site can be used by everyone, no matter what device they browse with, and regardless of physical ability. Innovation is the soul of accessibility. Accessibility is legal standard for judging and enforcing the accessibility of sites. This is great news because the world is being pushed into one single standard.

If you use standards-based designing principles, you not only make your content easy for search engines to find, it will also enable visually disabled people who use screen readers to navigate your websites content.

Screen reader users navigate web pages by tabbing from h2 to h2 and from section to section, just like sighted users navigate by visually scanning. When structuring your site semantically, pay particular attention to forms and tables. Provide keyboard access for those who are unable to use a mouse. Keyboards and assistive devices are the gateway to online user experience.

WELCOME MILLIONS OF VISITORS TO YOUR SITE WHO ARE LOCKED OUT – YES – THERE ARE MILLIONS OF DISABLED PEOPLE IN THE WORLD WHO HAVE ACCESS TO THE INTERNET

iStock_000020458543XSmall
Google web crawlers look for relevancy of content when a user types in an inquiry.
Think of web crawlers as blind users – Google is the biggest blind user on the web. Dish out appropriate content, well written and well structured, and you not only serve the blind folks in your audience, you also attract millions of sighted ones.

It wouldn’t be smart to exclude disabled Americans. This demographic would take up a city the size of Los Angeles or New York City. Millions!

If you think blind people don’t buy products online is missing the point and the boat. Don’t be blind yourself to the true nature of the audience you reject – you are still reaching the non-disabled populace this way by conforming to access guidelines and many others who would have ordered your products over the phone if only your site let them.

Section 508

Section 508 requires all websites under its jurisdiction to provide “equal or equivalent access to everyone” to accommodate the visually impaired, the hearing impaired, the physically disabled, and people who have photosensitive epilepsy and it spells out what accessibility really means. This law covers computers, fax machines, copiers, telephones, transaction machines, and kiosks, as well as other equipment used for transmitting, receiving, or storing information. It also covers many websites. Section 508 became U.S. law in 2001 and applies to the following:

  • Federal departments and agencies (including the U.S. Postal Service)
  • Deliverables from contractors who serve them
  • Activities sponsored or funded by the Federal government
  • Activities sponsored by states that have adopted the regulations
  • This is just skimming the surface and you can find plenty of resources to explain what the exact standards are and how to apply them along with specific things to do to make your site 508 compliant.

The bottom line is that if you design with web standards and follow the guidelines, your site should be accessible to screen readers, Lynx, mobile devices, and old browsers as it is to modern, compliant browsers. Standards and accessibility converge in agreeing that one web document should serve all readers and users. Even Flash and PDF’s can now be made accessible.

MYTH: ACCESSIBILITY IS EXPENSIVE

Most tasks to bring a website to its best take minutes to accomplish. Simple tasks like adding a label to your web form or writing a table summary. Type a brief alt text for each image – which is a no-brainer. High level conformance is going to obviously fall under another category and will cost more. If you want to author closed captions for web videos or to caption live streaming media news feeds in real time see Joe Clark’s “Best Practices in Online Captioning” . (www.joeclark.org/access/captioning/bpoc)

I highly recommend the following cited book for anyone who builds things for the internet. Web Standards is such an exciting concept that ties us all together. Where we go from here who knows, but right now we are accomplishing a great thing using Web Standards, and this book is a must have.

You can find the latest Standards and beta versions of some brilliant new concepts existing on the W3C website. Their HTML5 Validator is a great place to find semantic errors within your page. Go to http://validator.W3.org/ for the latest information.

Jeffrey Zeldman with Ethan Marcotte (2010). Designing with Web Standards, Third Edition. Berkeley, CA. New Riders.

The future of design at IxDA Atlanta

The Future of Design

Future of Design

Future of Design

I had the pleasure of listening to experienced designers speak about their thoughts on the future of web design at an IxDA Atlanta meetup held at Georgia Tech Conference Center, showcasing local design thought leaders giving their take on what the future holds for the role of design in business and our daily lives. Each presenter was given five minutes to convey their design future to the crowd.

The speakers were representatives from interaction design, user experience, information architecture and industrial design. Diane DeSeta – User Experience Strategist; Sean Gerety – Senior Engineer – User Experience Integrator; Kevin Shankwiler – Assistant Professor in Industrial Design/Digital Fabrication Lab, Georgia Tech and Vice Chair, IDSA Atlanta; Wengert Klemens – Senior User Experience Architect, Turner Broadcasting; Adam Bloom – Entrepeneur and Software Product Marketer; Joseph Dickson – User Experience Consultant and Author; Chris Livaudais – Senior Industrial Designer and Chair IDSA Atlanta; Ralph Lord – Senior UX Practitioner; Terry Allen – Director, Marketing and Design and UX Consultant.

Understanding how design works and its impact on people will allow you to think outside the box, if you want. Innovation is born there, at the moment you start thinking about making something. We have at our disposal endless feedback information to be used to better the user experience.

The speakers all had 5 minutes to give their opinion about design and the future of design. They covered such topics as:

Understanding people, understand our users
Design for variability (not just displays)
Businesses are designed
Design applies to everything
Self-expressed, artisanship, DIY – ie, the Harlem Shake
Humanization of things
Big Data, Big Feedback
Convergence of Art and Science
Brain Science and Decisioning
“Do not fear mistakes – there are none”, Miles Davis
Design and gratitude
Innovation
Interaction with computers
We are designing the future
Displays will be everywhere
Bio Printing – Scotland’s stem cell secret and the ability to replicate any cell
How long can we live?
Design for the elderly
What if life was designed so that no one had to work?

It was a quick talk with great insight from professional designers. I hope to see more of this type of get together which allows the experts to offer their thoughts and ideas about the future of web design.

Startup Georgia at Hypepotamus – Jermaine Dupri tells how So So Def got its start…..

Startup Rally 2013

One part startup exposition, one part summer internship fair, and one part launch of Startup Georgia – startup led, statewide initiative to raise the profile of Georgia startups as part of the national network Startup America Partnership.

Featuring – Jermaine Dupri, CEO of So So Def Recordings, Scott Case, co-founder & CTO of Priceline, and over 100 startups exhibiting.

What are the odds that a Georgia street/country kid would use college students from Emory University to start his company?  Although he started his tremendous success story by finding the best party thrower at Emory, he admits it was a lot of hard work, a lot of hit and miss.  The party thrower is now manager to many artists, including, Justin Bieber.

He spoke about his $200,000 website that had a lot of moving parts, but was virtually invisible in search engines.  He started a free blog and received more hits than his official website!  He enjoyed the ability to communicate with his fans, so his new venture, Global 14.com is his personal social networking site.  He is into tech now, and his new site is very nice – another one of his visions.

Jermaine Dupri is celebrating the 20th Anniversary of So So Def Recordings at the Fabulous Fox Theatre in Atlanta.  The All-Star Anniversary concert is on Saturday, February 23, 2013.  Tickets at global14.com.

A number of soon-to-be well known entrepreneurs spoke about their vision.  Students met with startups from multiple sectors and industries to find out about summer internships.  Developers, computer science, designers, business students, and all majors are encouraged to explore the opportunities available to them right here in Atlanta.

Some of these ventures include:

startup-rally_0001_Visual-Art-Werks
startup-rally_0002_viaCycle
startup-rally_0007_MrArlo startup-rally_0006_TripLingostartup-rally_0033_GoLocalstartup-rally_0028_Keep-Dreaminstartup-rally_0019_Pindrop

Check out the lineup of next generation companies blossoming in Atlanta at Hypepotamus Startup Rally.