Public School Websites Don’t Have to Suck

Oct 30 2010 by Michael Tuck | 57 Comments

Public School Websites Don't Have to Suck

I am a full-time teacher in the US public schools, so I depend on my school’s rather dated website for many of my job functions. My site looks like the other staffers’, down to the identical font and color choices. I am not the school’s web designer, nor would it do any good if I were. I have very, very limited control to my pages. In fact, the school employee in charge of our website has very limited control over the site.

Like many schools in the U.S., my school’s website is strictly controlled by the district’s IT department, which doesn’t (as a rule) employ web designers or developers.

And even our school’s IT department has its hands tied, because the district signed a long-term contract to use a particular CMS that restricts everyone’s ability to go beyond its strictures.

I will give you two phrases that should tell you all you need to know about my school’s site design: "FrontPage" and "HTML 2.0."

Yes, really.

The Suckage

By and large, American public school websites suck. They suck like an Electrolux. They could suck the chrome off a trailer hitch. Getting the picture yet?

Voyaging into the world of public school websites is like taking a trip back in time — and using a smelly school bus to get there.

It’s a world of outdated and massively invalid code. It’s a world whose information is presented in Times New Roman and Comic Sans. It’s decorated with animated clip art. It favors notebook paper backgrounds and chalkboard graphics (yet I haven’t had a chalkboard in my classroom in a decade).

In this world, site accessibility is considered important (Section 508 regulations), but in practice is largely left unaddressed. It’s ruled by Internet Explorer (and all too often, IE6).

Overall, public school websites is a huge section of the World Wide Web that has largely ignored or rejected modern design and coding techniques. It’s an entirely different paradigm than the one that professional designers and developers are used to working in.

Should it be this way? Hell, no.

First, let’s take a look at what’s going on with most public school sites, then let’s focus on how the paradigm can be changed.

Ranting and Finger-Pointing is Simplistic and Unfair

It’s easy to just blame and mock the public school systems for having sadly outdated and poorly designed websites. Whether you want to go after individual schools, IT departments, or the districts themselves is your choice.

But the reality is a bit more complicated. Most school personnel have little or no idea how to construct or maintain a website, nor do they have the time to learn. Their time is spent doing, among other things:

  1. Teaching
  2. Wrangling students and parents
  3. Trying to fulfill an ever-expanding and ever more contradictory set of expectations from communities, districts, states, and federal agencies
  4. Keeping up with a huge amount of paperwork

You can add many, many more duties and tasks to this list.

Designers and developers Ted Adler of Union Street Media, Abi Cushman of Brown Bear Creative, and Tim Dailey of Digital Gibberish, who’ve all worked in the acedemic industry, all agree. Their firms are among the few that has had any involvement at all with public schools.

An individual school’s website needs to be structured so that every staff member — from custodian to principal — can access their pages, input the necessary information, and move on to another task without having to battle with code or access issues.

Most public schools don’t have a staff member who can devote the time, understanding, and effort necessary to maintain a website on their own, so they have to depend on each staffer to handle their own end of things.

Schools also have to choose an approach that can give a reasonable guarantee of privacy and security, in large part because of privacy and safety issues surrounding the children of those schools, and their legal responsibilities in protecting its online information about their students.

And they have to create websites for users with old, obsolete operating systems and the browsers that lurk there — this applies to both school and community computers.

As Ted Adler pointed out, school websites have to appeal to such a broad swath of users — parents, students, staff, community members, and people who might be considering relocating to the particular school district — that another priority of a school website is its information architecture and structure.

Any school’s home page worth its electrons will let the first-time visitor know instantly where all the different information is, and how to get to it.

The Poor IT Guys

All of this gets thrown into the laps of the schools’ IT departments, which are invariably understaffed, underfunded, and manned by people with little or no knowledge of web development. Their jobs are to keep the computers running, maintain security, and install new software, among other tasks.

Those departments often make the sensible choices to:

  1. Implement a system wide CMS
  2. Give each staffer limited access to a small area of the site — usually their own home page or series of pages, and nothing more
  3. Restrict site access to a very small number of trusted (and monitored) staffers in concert with the department

They’re told to get their schools on the Internet, and get it done by tomorrow, regardless of their lack of knowledge or understanding of the nature of the task. Hence the need for quick and often very dirty solutions.

"School Internet Providers"

Then there are the "school Internet providers." There is an entire industry of CMS and "site builder" providers tailoring their products for school use.

Instead of Drupal, Joomla, and Expression Engine, schools are purchasing products from finalsite, CMS4Schools, SchoolCMS, Chancery SMS, and TeacherWeb, among others.

Most of these are standalone, all-in-one CMS and site-builder products developed, not to ensure aesthetically pleasing, standards-compliant and easily configurable websites, but to create sites that are easy for novices to use, specifically configured for school usage, and relatively secure.

CMS4Schools, for example, touts Wisconsin’s Arrowhead Union High School as an exemplar of CMS4Schools’s capabilities. The site is aesthetically satisfactory, more or less, but the site has a table-based layout and boasts 264 validation errors last time I checked. Obviously CMS4Schools’s primary concern is not to provide modern, standards-compliant and valid websites.

Many of these products are attractive for schools because unlike Joomla or Drupal, for example, their systems are "pre-configured" for school use, with sections dedicated to school sites, board and district announcements, school calendars, and the like.

Most IT departments have no one with the skills to configure an off-the-shelf CMS for their district’s needs. Oftentimes, the providers offer "bundled" software to both school districts and town governments, an additional attraction for confused and overworked IT directors.

They All Do It

When Abi Cushman of Brown Bear Creative, a company that has worked on public school websites, was asked why she thought so many schools used a school-oriented CMS and "site builder" providers, she answered simply, "I think because other schools do it."

I think she’s right.

A (Slightly) Better Way

School administrator Robert Kennedy, who has had the experience of bringing computing to schools, advised how websites in schools should be created: "For lots of good reasons, many school websites have been designed by the school’s computer department. I firmly believe that the Public Relations and/or Marketing arm of the school should come up with the design, and that the computer staff implement it. Or have the tagging done professionally if you wish and can afford the cost."

Lack of Modern Resources

The resources specifically targeted for school websites do not approach those made available for commercial or personal designs. Many websites on designing sites for schools themselves are web zombies.

Old School Techniques and Information

One of the first resources to come up on a Google search for "school web site design" is a page called Designing School Web Sites to Deliver. The site itself is sadly designed (using Adobe’s now-discontinued GoLive), lacks a doctype, and sports other fundamental no-nos of web design like table-based layouts and inline CSS style attributes.

Moreover, the site promotes two books from 1997 along with a number of outdated websites as the places for school personnel to go to learn web design.

While the host site, "From Now On" (FNO for short), promotes itself as a go-to source for information on "educational technology" and has published articles dated as recently as September 2010, the technology being used to present the site is outdated and unsatisfactory.

I’m not cracking on the FNO organization per se as much as I’m noting that if this is what comes up as a top result in a Google search, what kind of dearth of resources must exist?

Wigglebits is another prime example of another site purporting to teach modern website design. This site — again, enjoying top ranks on Google — is designed to appeal to kids and teachers alike.

It describes itself as follows:

"Designed for beginners yet precise in its technical content, this guide is a great means for teachers, kids, and individuals to boogie their way across the digital divide — and have a great time doing it."

At any rate, the site attempts to "talk down" to its users by using terms such as "gunk" and "header thing" to describe markup as if saying, "Hey, kids, you can be a professional web designer and work all day with gunk! Don’t forget to wear your overalls!"

It also advises its users to make web graphics in Microsoft Paint and to use deprecated HTML elements such as <center> and <font>, among other recommended stalwarts from the last century’s coding standards.

As far as submitting your site to search engines, Wigglebits advises:

"Yahoo, Google, Alta Vista, Excite, Infoseek, Webcrawler, Hotbot, and Lycos are some of the search engines and catalogs on the Web today."

And you wonder why teachers and schools have trouble finding proper help for their design and development needs?

Kathy Schrock is probably a name that rings no bells with you — but she is to the subject of school and classroom procedures as Eric Meyer is to CSS. Going to Meyer’s site gives you current and reliable information on all things CSS. Going to Schrock’s site might well give you current and useful information on running a classroom.

However, you won’t find that kind of information on her page about school websites. Her site leads you to an "updated" page on evaluating and constructing websites from 2002. The other pages she sends you to are even older.

She does provide a set of useful forms for schools to evaluate their sites — here’s the PDF of the secondary school evaluation form — but there’s no place to evaluate the quality and usability of the design itself.

The Overall Dilemma

All in all, schools have been conditioned since the advent of school-based websites to consider themselves as fundamentally different in needs and approach from commercial or personal websites.

They look for different solutions than your local church, small business, or self-employed entrepreneur might.

They are given information that is outdated, poorly presented, and sometimes just plain wrong, and lulled into using it because "this information is developed specifically for the needs of schools like yours."

They are served by different providers than the design and app firms who service commercial and personal clients, and are often given inferior products.

This is part of the paradigm shift that schools operate under. The general perception seems to be: "School websites just can’t be as good as other sites." I absolutely disagree with this position.

School Site Reviews

Let’s take a look at some of the sites out there and then look at ways this paradigm can be changed for the better.

Before You Read Any Further…

At some point, someone from one of the schools featured below will read this article and see the write-up on their school’s website. They might be angry to see their site criticized, perhaps even embarrassed and hurt.

To those school personnel and community members, let me say this: You have nothing to be ashamed of. You do invaluable work preparing America’s children for their futures.

You are overworked, overstressed, underpaid, and underappreciated. You and your children deserve better tools with which to build your school’s websites, and you’re not given them.

Your school, and its students, deserve to have modern, elegant, beautiful, accessible, and standards-compliant websites that serve as gateways for your students, staff, and community to explore the offerings your school provides its kids and its community on a daily basis.

You create the best resources for your community and students that you can — given the extraordinary restrictions under which you work.

Each year you’re told to achieve a near-impossible task with nowhere near the resources you need, like being told to build the Taj Mahal with popsicle sticks and glue. And when you achieve it, you’re told to do a better job the next year with half the resources ("now build it without the glue!").

School websites are just one part of this model. Whatever onus of "web sites that suck" that may apply to any school’s website is not to be laid at your door.

About the Following Sites

The sites below are somewhat arbitrarily divided into three categories: "good," "mediocre," and "poor". Even the best of the sites below do not meet the standards of a high-grade commercial website, nor those of a top-end personal site.

Professional designers may be tempted to rename the three categories as "mediocre," "poor," and "godawful". It’s easy to do that, but it’s worth remembering that with school websites, the paradigm is much different from what a professional may be used to working with. It’s also worth noting that these are not intended to be full-blown site reviews, but "reviews at a glance."

I’ve also checked the sites’ accessibility using WebAIM’s WAVE tool, which provides assessments of a site’s compliance with WCAG 1.0 and Section 508 guidelines. These kinds of "instant accessibility checks" are simplistic and superficial, but they will at least give us some idea of how accessible these sites are.

Let’s dive in.

Good Sites

We have five sites that fit in this category.

Apex High, Apex NC

  • Generated from a free template.
  • Pros: Stylish use of strong color. Spiffy jQuery-driven navigation menu. Clean design. Coded with XHTML 1.0 Strict doctype. Has a Twitter widget. Good use of progressive CSS3 elements.
  • Cons: Some pages hosted on school district site or other servers. Use of text images limits accessibility and searchability. Serious validation errors.
  • WAVE accessibility assessment: Five errors, mostly related to empty h2 and links.

Arrowhead Union High School, Hartland, WI

Arrowhead Union High School, Hartland, WI

  • Generated using CMS4Schools, featured in CMS4Schools’ online portfolio.
  • Pros: Clean, well-done layout. Search box located in upper right. Event calendar. Large yet easily navigable link scheme. Attractive JS-driven "slideshow" of selected photographs on home page.
  • Cons: Very "template-y." Spartan subsidiary pages. Inexplicable use of internal styling for links. Invalid and deprecated code. Enormous amount of validation errors and warnings.
  • WAVE accessibility assessment: Two errors, related to missing alt attributes for images (not neccesarily a bad thing if it’s within context) and missing form labels.

Central Learning Center, Henderson, KY

Central Learning Center, Henderson, KY

  • Created with DotNetNuke.
  • Pros: Strong color scheme. Easy-to-use dropdown nav menu and sidebar menu. Attractive JS-driven slideshow on home page. News alert box on home page.
  • Cons: "Template-y" in appearance. Odd placement of minimize and print buttons on home page. Staff pages are PDFs. CMS-generated site features lots of extraneous code. Numerous validation errors and warnings.
  • WAVE accessibility assessment: 18 errors, all related to missing alt attributes for images.

Kofa High School, Yuma, AZ

Kofa High School, Yuma, AZ

  • Generated from School Webmasters, featured in School Webmasters’ online portfolio.
  • Pros: Strong red-based design aesthetic. Good drop-down navigation menu. Google Translate function on home page.
  • Cons: Somewhat confusing sidebar navigation, with subsidiary menu choices appearing only on hover. Use of graphics as headings rendering them invisible to search engines. Subsidiary template-driven pages hosted on Quia or other providers. Internal CSS. Table-based layout. Use of deprecated code. Numerous minor validation errors.
  • WAVE accessibility assessment: No accessibility errors.

Mangum Elementary, Bahama, NC

Mangum Elementary, Bahama, NC

  • Created with Joomla, based on a Joomla template.
  • Pros: Strong use of color. Simple, easily navigable structure. Logical placement of information on home page. No major validation errors.
  • Cons: "Template-y" appearance. Little content on some subsidiary pages. Use of tables in layout and presentation.
  • WAVE accessibility assessment: Four errors, all related to missing alt attributes for images.

Mediocre Sites

We have two sites that fit in this category.

Corliss High School, Chicago, IL

Corliss High School, Chicago IL

  • Designed by Sapient, a private design firm (all Chicago Public School, or CPS, sites have the identical design).
  • Pros: Identical design scheme across schools encourages user familiarity.
  • Cons: Busy design scheme, with little negative space and lots of unrelated information packed into one page. Much information on school’s home page pertains to school district and not to individual school. Table-based layout. Many validation errors.
  • WAVE accessibility assessment: 28 errors, all related to missing alt attributes for images.

Juan Seguin High School, Arlington, TX

Juan Seguin High School, Arlington, TX

  • Generated from a Dreamweaver template.
  • Pros: Decent header design, with school logo and photo of school. Clean and simple layout.
  • Cons: Poor choice of "hover" colors in all links. Header typography difficult to read behind background color. Left-sidebar navigation design rather old-fashioned. Unnecessary use of iframes. Inexplicable use of internal styling for links. Invalid and deprecated code.
  • WAVE accessibility assessment: 19 errors, all related to missing alt attributes for images and empty links.

Poor Sites

We have 11 sites that fit in this category.

Cedar Ridge Elementary, Columbia, MO

Cedar Ridge Elementary, Columbia MO

  • Generated via WordPress.
  • Pros: Use of RSS and Atom feeds, though how to obtain feeds not immediately apparent.
  • Cons: Eye-watering colors in header; colors clash with logo colors. Poorly implemented navigation design. Mixed and unmatched use of colors, fonts, and borders in various pages. Poor layout — information and graphics seem strewn about the home page almost at random. Very cluttered code. Unable to validate because of nonstandard code in main page.
  • WAVE accessibility assessment: Three errors, all related to empty links.

Crow Creek Middle School, Stephan, SD

Crow Creek Middle School, Stephan, SD

  • Generated by FrontPage 4.0.
  • Pros: Nice school photo on home page.
  • Cons: Very outdated layout and navigation scheme. "Starry" background image very dated. Red links difficult to read against black background. Subsidiary pages almost unstyled, and what stylings are in place are pre-millennial. No doctype, rendering validation problematic. FrontPage generates lots of unnecessary code and inline stylings. Dated file names (i.e. home page: Default.htm).
  • WAVE accessibility assessment: Three errors, all related to missing alt attributes for images.

Fisher Grade School, Fisher, IL

Fisher Grade School, Fisher, IL

  • Pros: Nice logo. Contact information in header.
  • Cons: Extraordinarily outdated appearance, with tiled background, content scattered almost randomly around the page, and animated cartoon graphics moving across the screen. Important navigational links placed at bottom of page. No doctype, rendering validation problematic. No CSS; page table- and inline-style driven. Subsidiary pages hosted by Webpage4Teachers, using very outdated templates.
  • WAVE accessibility assessment: 15 errors, all related to missing alt attributes for images.

Hillcrest Middle, Simpsonville, SC

Hillcrest Middle, Simpsonville, SC

  • Created by either FrontPage or MS Office.
  • Pros: Attractive header featuring school mascot. Multiple options in dropdown nav menu.
  • Cons: Busy layout, color scheme interferes with scanning for information. No doctype, rendering validation problematic. Table-based layout. Inline styling. Staff pages have different appearance, appear to be generated by different product.
  • WAVE accessibility assessment: 13 errors, related to missing alt attributes, and empty headers and form labels.

Kennedy High School, Waterbury, CT

Kennedy High School, Waterbury, CT

  • Generated via SchoolCMS
  • Pros: Simple, easy-to-use layout. Navigation scheme clear, with simple flyout menu. News block above fold.
  • Cons: Very "template-y." Dated decorative animated graphic on home page. Use of "Impact" font in home page quote renders quote difficult to read. No simple way to see code because CMS blocks access through right-click menu.Table-based layout. Spacer elements. Critical validation errors.
  • WAVE accessibility assessment: Seven errors, related to missing alt attributes for images and links.

Lexington High School, Lexington, OH

Lexington High School, Lexington, OH

  • Generated with MS Office.
  • Pros: Nice logo.
  • Cons: Poor design, color scheme, and layout; very dated appearance. No title attributes. Typical mares’ nest of Office-generated "code soup." Enormous number of validation errors.
  • WAVE accessibility assessment: Four errors, all for missing alt attributes for images.

Loogootee Elementary West, Loogootee, IN

Loogootee Elementary West, Loogootee, IN

  • Generated by FrontPage 5.0.
  • Pros: Relaxing design aesthetic. Colorful design scheme, using freely available Web graphics credited on home page. Simple to use.
  • Cons: Outdated design, with left-side background graphic. Unusual design scheme for an elementary school. Site plays MIDI music file upon loading, with no obvious way to stop music from playing. Subsidiary pages festooned with broken image links. FrontPage has used confusing and repetitive inline styling. Table-based layouts. Many validation errors.
  • WAVE accessibility assessment: 17 errors, related to missing alt attributes for images and links.

Page Middle School, Franklin, TN

Page Middle School, Franklin, TN

  • Created by MS Office.
  • Pros: Simple nav scheme. Attractive color scheme. Subsidiary pages match home page in format and style. Sufficient negative space.
  • Cons: Mismatched items on home page. Doctype in MS Office XML format, rendering validation problematic. Pages are tangles of "code soup" generated by Office. Table-based layout. Inline styling.
  • WAVE accessibility assessment: 11 errors, related to missing alt attributes for images and image maps, and a <marquee> element.

Reagan High School, Houston TX

Reagan High School, Houston TX

  • Generated via FrontPage 6.0.
  • Pros: Simple, strong navigation scheme, repeated as text farther down page.
  • Cons: Rather old-fashioned Flash-driven "splash" page before home page presents, though a "skip intro" link is provided. Very old-fashioned design, with "clip art" like graphics combined with small Flash element showing various views of school. Different pages have dramatically different stylings. No doctype, rendering validation problematic. FrontPage generates lots of unnecessary code and inline stylings.
  • WAVE accessibility assessment: Five errors, all related to missing alt attributes for images.

Tongue River Middle School, Ranchester, WY

Tongue River Middle School, Ranchester, WY

  • Generated by MS Office.
  • Pros: Laudable use of student artwork on home page, link to Spanish translation of site.
  • Cons: Very stodgy, old-fashioned, unappealing and somewhat dysfunctional layout. Navigation scheme clumsy and broken. Confusing use of blue highlights on words that are not links. Horrific "code soup" generated by MS Office. Table-driven layout. Spacer elements. No doctype, rendering validation problematic. Subsidiary pages are hosted on Google Sites, and use very plain templates.
  • WAVE accessibility assessment: Eight errors, all related to missing alt attributes for images.

White Pine Middle School, Saginaw, MI

White Pine Middle School, Saginaw, MI

  • Created with Schoolcenter, now ThinqEd, which at the time the site was designed, appeared to use FrontPage technology.
  • Pros: Well-done header image.
  • Cons: Incomplete items on FrontPage. Color scheme renders links, text difficult to discern. Rather uncontrolled use of color. Flash-driven navigation. Typical FrontPage "code soup." Table-driven layout. Confusing amalgamation of internal and inline CSS. Formidable URL. Large number of validation errors and warnings.
  • WAVE accessibility assessment: Three errors, all related to missing alt attributes for images.

Summary of the Sites

The number of school websites I’ve designated as "poor" far outweighs the numbers in the "good" and "mediocre" categories combined. Most have problematic color schemes (usually because the schools implemented their school colors as the basic scheme regardless of how the colors appear on screen).

The site structures veer from pages packed with too much information to sparse, barely developed sites with little content. The sites tend to handle navigation about as well as they handle anything, but too often, links are hard to discern because of odd color schemes or display methods.

Every site reviewed has validation errors, and all but one has accessibility errors (though it must be noted that these were auto-validated, and there are downsides to auto-validation). Most have table-based layouts, and many use internal or inline CSS.

Interestingly, all but one was designed through a commercially available CMS or site builder program. Only three were designed with a CMS prevalent in commercial and personal sites.

While many sites use "school-based" CMS or site builder programs, many use Microsoft’s outdated FrontPage construction system, probably because FrontPage was integrated into Microsoft Office.

Some schools use Microsoft Office itself (specifically, MS Word) to generate documents that were then saved as web pages. Not surprisingly, all of the Microsoft-generated pages appear in the "poor" category.

Only one site is professionally designed, Chicago’s Corliss High, and that is actually a district page, not an individual school site.

One of the best, Apex High’s site, was generated from a freely available template.

Relatively few feature modern social networking, i.e. Facebook or Twitter links, or RSS/Atom feeds.

Conclusion: A Challenge to Schools and Designers Alike

There are four things that public school websites need above all others:

  1. Data security
  2. Ease of use (including content input) by non-professionals, and of maintenance by IT staffers with limited skill sets
  3. Compatibility with older browsers and operating systems
  4. Low startup costs

Name a CMS worth its salt that doesn’t provide these things. Tell me a decent professional designer/developer, or a design and development firm, can’t handle these requirements.

But, in part for the reasons delineated above, schools seem to have operated for years under the idea that their needs are so different from the rest of the Internet population. That they have to use completely different CMS software, filtering systems, and other tools, often inferior and unnecessarily restrictive in their makeup, to provide for the "different needs" of the school system.

As such, American public schools have generated thousands of websites that fail to implement modern HTML and CSS coding standards, do a poor job of presenting information to their stakeholders, exhibit poor design and construction methods, and ultimately do a disservice to their students, their communities, and themselves.

I believe that some of this has been fostered by companies who have marketed their CMS and "site builder" products directly to schools, promoting their products as being designed specifically for schools and their "unique" needs.

The mandates for schools to develop web presences came quite abruptly for many systems, and they scrambled to find something that would help them get their sites developed and running quickly, cheaply, and effectively.

That’s when I believe they became open to the variety of firms hawking "school-safe" webwares. And, schools are like any other set of organizations: when one or two schools begin using a particular product, other schools gravitate towards using those products as well, or look for competing products that provide much of the same benefits.

I doubt it took long for schools across the country to begin implementing these "site builder" and CMS programs in their systems. This, in essence, sums up the paradigm of American public school websites.

In general, public schools operate in almost an entirely different universe than for-hire Web designers and developers; the two almost never meet. Public school systems rarely consider approaching design/development firms to handle their web needs, and design/development firms rarely consider public school systems as clients.

How Can the Paradigm Change?

It starts with changing the mindsets of educators and school boards — not an easy task or one that will be quickly accomplished.

It’s going to have to be led, I believe, by the American Web design/developer community, and designers and developers from other nations who want to pitch in or perhaps get involved in their home nations’ school sites.

The question is a basic and fundamental one: How can we help the public schools get proper websites? I can’t think of a more deserving community, and one more worthy of help, than schoolchildren.

What can you, or your design and development firm, or you in conjunction with your colleagues, do to convince school systems to move towards implementing powerful commercial or open-source CMS programs proven to support modern, standards-compliant websites?

How can you help schools design and implement beautiful, standards-driven websites that their employees can use without intensive training? How can you help schools afford these solutions?

Can you convince schools to reallocate some of their communications budget from print media to online media?

How can you help your local public schools gain a beautiful, elegant, modern website that will make the kids and the community proud of their Internet presence?

Thanks to the three designers/developers who graciously agreed to be interviewed for this article: Ted Adler of Union Street Media, Abi Cushman of Brown Bear Creative, and Tim Dailey of Digital Gibberish.

Related Content

About the Author

Michael Tuck is an educator, writer, and freelance web designer. He serves as an advisor to the Web Design forum on SitePoint. When he isn’t teaching or designing sites, he is doing research for the History Commons. You can contact him through his website, Black Max Web Design.

57 Comments

Mathew Carpenter

October 30th, 2010

I completely agree with this article. My old high school has one of the worst website designs I’ve ever seen. Making use of things like blinking text, scrolling marquees and a background colour of bright yellow, it’s utterly embarassing. Trying to convince them to change it was just a waste of time. Let’s hope they see this article.

Urszula Ciaputa

October 30th, 2010

In case of my old high school the website wasn’t created using CMS. It was created (at least in the beginning) from scratch by students. The design wasn’t terrible, but it showed its age. There were plans to improve it using kind of student’s designs contest, but failed. In the end the team of graduated students (related to both Computer Science and Art fields) created a new version of the page that was positively received by both faculty and students. It was volunteer work, but we all felt it was worthwhile.

Donovan O'Leary

October 30th, 2010

The websites should reflect the schools “attention to detail”. A well designed and navigable website can, in theory, ease the number of phone calls directed at school staff. Therefore allowing that staff to focus on what’s important, the students. Good Article.

Mr Portman

October 30th, 2010

Michael – I’ve found you! Someone in the US who feels the same way as I do in the UK!

Check out my site (mrportman.co.uk) and you’ll see what I mean…

Melissa

October 30th, 2010

This is one of my favorite school websites: http://paragould.k12.ar.us/

Lars Ebert

October 30th, 2010

I like this article. Especially, as I have designed the Website for my school in Germany (http://www.mgi-iserlohn.de).
But I didn’t have that strict rules with it ;)

So I built a site that even made it to my top 5 works on my website (http://www.advitum.de)

Sean Fisher

October 30th, 2010

As a part of my highschool years, it was a student project to reinvent the school website. I happily moved it to a free and incredible solution, WordPress.

I really think this was a great solution in that it let us express our creativity and also let us add something to our portfolio. The website is located at http://csihighschool.org/

Paul

October 30th, 2010

I went to my old high schools website the other day and established that it is actually a really good example of a modern website.

http://www.oregonsd.org/

Alexander Dawson

October 30th, 2010

Great article Michael! I spent some time helping in a few schools as a teaching assistant while at college (as part of my training) and the state of every one of their “school websites” terrified me. While US education has it’s problems, the problems in the UK are just as bad (if not worse due to the lessened choice). The worst thing about it is, kids these days have to learn about computers and the web, and such hideous layouts and usability won’t help students get to grips with the technologies that will likely dominate their future lives and jobs. Schools need to get their priorities right!

Diz

October 30th, 2010

This is a great read. I am a high school student, who happens to be up to date on web design standards, and it hurts me when at school I run Internet Explorer and the home page is that poorly designed. Of course, it’s nowhere near as bad as some of those sites you mentioned, but it’s still bad. I’m thinking of showing this page to a member of our school’s IT department.

Erica Strahon

October 30th, 2010

I thought my local school district website was the only bad one. Not only is it of horrendous design but extremely difficult to navigate through. I’ve been forced to use it plenty of times when I was in high school myself, or when looking for a preschool for my son. Though the design has changed throughout the years, it hasn’t evolved much. I swear I saw something about Netscape in the coding.

Louis

October 30th, 2010

Continued… Dang iPhone.

My only disappointment is that this article was published on a Saturday on Halloween weekend, where it will probably go unnoticed by anyone that can make a difference.

(Jacob, feel free to combine these two comments. Thanks.)

Caleb Fidecaro

October 30th, 2010

I think a group of like minded people could build quite a robust solution using wordpress 3.1 and an extensible plugin, ala BuddyPress. There is a wealth of freely available templates available, its very easy for novices to use and learn (as opposed to drupal et al) and most of the core components are already there. 

The solution could even have a hosted version at some point, making it a one-click setup. 

I’m quite inspired by this article to be a part of such a group of people. If anyone is interest in discussing further, I am reachable at calebfidecaro [at] gmail [dot] com. Perhaps if there’s interest I’ll set up a google group. 

Catherine Azzarello

October 30th, 2010

Boy, do my school district’s sites suck! One year…in September…the HS still had the prior year’s calendar up.

Trolling for teacher contact info is still a PIA.

And I gave up bothering with the online grade system a couple years ago.

So I wait…in two years my last child will graduate HS. When in college, they’re responsible for interacting with university sites on their own. :)

Michael Tuck

October 30th, 2010

Thanks for the comments, folks. Mathew, I actually got curious and found the site for one of the schools I went to as a youngster. Its site was better than 90% of what I found out there, and so I included it in the article. :) The others were found by near-random searching, as I wanted to do something approaching random sampling. Sad to say, MS Office and Front Page rules in many schools…. Urszula, it’s a great idea to let students design and even code the site, if a school is bold enough to let that happen. Sean, you and your colleagues did a terrific job. Paul, your school has a nice site, but it’s interesting to see that it’s all controlled through the district’s site (no standalone designs). Louis and Alex, I appreciate two people of your talents weighing in. If the situation is going to improve, it’s going to take help from guys like you. Louis, you’re right about the Halloween appearance, but hopefully the article will have enough “legs” to keep going after everybody puts the costumes away.

Jacob Gube

October 30th, 2010

@Louis: I don’t think it won’t go unnoticed. Posts get viewed about the same amount of time regardless of the day it was published, long-term (long-term defined here as “a week”).

This article moved me.

So much so that I would like to offer up pro-bono work to an interested U.S. public school site (excluding colleges, of course).

If you are a decision-maker in your elementary/middle/high school and think that these issues apply to you, I would like to personally work on your site pro-bono.

I will provide the following:

  1. Custom design, W3C-standards-compliant markup
  2. Custom WordPress (as a CMS) deployment with multi-admin/multi-author capabilities (so that each staff member can have their own account)
  3. Free hosting on a VPS that will handle moderate traffic well. For at least five years

The site I would like to build for you will comply with governmental regulations for equal access to technology (Section 508).

If there are many interested schools, I’ll pick the school in most need.

Having worked with IT and education (in a state college level), I know it’s not that easy and there’s a lot of red tape; it’s simply not a matter of “want” but also ability and getting the right people to sign off. However, if you’re a decision-maker, I’d love to chat with you about this (my contact information can be found here).

I’m available to do this between now and January 2011. Afterwards, we may need to push your project further down 2011.

EDIT: I didn’t see Caleb Fidecaro’s comment above. Looks like he’s got the same idea as me. You’ve now got two options.

EDIT 2: I didn’t mean to limit my offer to high schools only. Elementary school and middle school sites welcome as well.

EDIT 3: It might or might not matter depending on your school’s IT policy, but the VPS will be located in the continental U.S.

Michael Tuck

October 30th, 2010

Jacob and Caleb: Make it three options, as I would be willing to do something along the same lines (though I don’t have Jacob’s skills or VPS hosting access). Or we could work through Caleb’s proposed Google group to organize something. Damn, we might be starting something good here.

Jacob Gube

October 30th, 2010

@Michael Tuck: Well, we could all work together.

My idea is to deploy a WP-based site for a public school, see how it works for students, teachers, and the community — iterate as needed — and then since WP 3 has multi-site capabilities because of MU getting integrated to core, we can deploy similar templates (based on the lessons learned from the first deployment) free of charge to other schools that either do not have a web presence or do not have a good site. I particularly like Caleb’s idea of using BuddyPress for community-building. Perhaps a 3rd-party hosted forum integration as well (such as Ninja Post). Oh my, here comes scope creep (developer-driven scope creep)…

I’d like to host it on a neutral, 3rd-party VPS because, like I said, I’ve worked IT and Dev on state-funded colleges (as well as governmental agency/department projects), and I would like to make it easier on myself and instead focus on a quality product rather than spend time dealing with the surrounding issues with IT in these types of environments. That way, we get to control how the server is set up, and we can set it up to spec such that it’s optimized for WP. LAMP optimized for dynamically generated WordPress pages + maybe nginx at the front and to serve cached pages and static assets?

Michael Tuck

October 30th, 2010

I’m game. I know how difficult school IT departments can be, and I’ve also learned how much they are willing to copy from one another. If they see a good solution such as you’re proposing work well for one school, they’ll be far more interested in bandwagoning. Not sure how many IT departments will feel about hosting on a 3d-party VPS, though I understand exactly why you suggest it. It’s a control issue.

kashtam

October 30th, 2010

my college website . one of top 100 engineering college in India
IT SUCKS
http://www.sctce.ac.in

Caleb Fidecaro

October 30th, 2010

I’ve created a Google Group: http://groups.google.com/group/better-school-websites.

Not sure what it is just yet, but I think this is a huge problem that is (relatively) easy to solve.

I don’t necessarily have the skills to build something like this, but I’m enthusiastic :)

Louis

October 31st, 2010

@Jacob:

I hope you’re right. BTW – looks like my first comment got lost — just wanted to reiterate…

@Michael:

This is a fantastic article. One of my all-time favorites. Constructively critical, and potentially revolutionary. Great stuff.

Louis

October 31st, 2010

@Jacob and @Michael:

I don’t think pro bono is necessary here. Schools have budgets, so a reasonable fee (even a small one) should still be involved.

Michael Tuck

October 31st, 2010

Mr. Portman, I wish I had known about your site before I wrote the article, I would have cited it. Interested in getting involved in an effort to improve these lousy school sites?

Jacob Gube

October 31st, 2010

@Louis: Sorry, I failed to combine the two comments (I know you said to combine them, but somehow it didn’t stick — late night man, been working all day, thanks for restating your earlier comment).

Here are 2 reasons I’d like to do it pro-bono, to make my intentions explicit:

1. I’m interested in working with struggling public schools in districts that have been struggling with budget cuts; schools that have been cutting down staff, who can’t afford to give students new text books, and so on. This likely means low-income neighborhoods.

I’m not talking about wealthy-neighborhood public schools that took the misstep of going with a $250K proprietary solution that still produced a site that has poor design, user experience and validation/accessibility/best practice issues. I’m not saying their needs in this situation isn’t important, I just think there are better candidates that are in greater need.

2. Pro-bono work has a different dynamic versus a paid gig. First, pro-bono means I can treat the project as a personal project rather than a work obligation (of which I have many); something I’m doing with the sole intention of helping a struggling community, a way to give back.

Paid gigs will have requirements, scope dictated by the client, revisions, and other obligations. I’d like to drive the process on my own terms (and in exchange, the school gets a professionally-crafted site).

If we’re talking about taking on a project at a reduced fee, there are many things I can do for-profit at my regular fee and regular process — but this wasn’t my intent to begin with.

Chris

October 31st, 2010

Excellent article. I completely agree, my wife is a teacher, her school’s website is horrific, and there is an overwhelming lack of technological intelligence in the school district.

Reza

October 31st, 2010

I made this by myself.. http://www.smkn1bjs.sch.id/ I am teacher in this school…

Michael Tuck

October 31st, 2010

Louis, the potential for revolution (perhaps evolution is a better term?) is what thrills me about this. I’ve posted on Caleb’s Google Group and have reached out to a number of people about this. The early results are, well, early, but very positive. Jacob’s offer is tremendously generous — not sure people outside the public-school community realize just how generous — and needs all the buzz we can generate. Let’s get it rolling, folks!

Michael Soriano

October 31st, 2010

I just redesigned my daughter’s school website from static html to wordpress: http://dunsmoreelementary.com/

school staff is updating daily, teacher pages to come soon. wordpress is very user friendly and i believe will power school websites even more in the future.

Michael Soriano

October 31st, 2010

@Jacob – i’m definitely interested in your plan. The school wp site i created has only been live for 3 months – but I’ve discovered plenty of information: what the teachers and staff are capable of updating / what the principal and the parents wants to see etc.

i.e. i implemented a calendar plugin – which I though would be beneficial for the school. The plugin is an events calendar which displays the month / week etc. – the problem: data entry. The school won’t provide the time to update enter their events. So I scrapped that – just stuck with the standard list (copy and paste): http://dunsmoreelementary.com/school-calendar/

As much as possible, all they want is to copy and paste, they don’t want to learn new things. I also “dummed-down” the admin area so much its not even funny.

Also – the parents love the email notification of posts via feedburner.

I can go on.

Tracey

October 31st, 2010

Our district just recently canned our CMS and is asking teachers to set up wikis through http://www.pbworks.com. Pretty limited as to the styling options and images posed problems initially (had to change where they were hosted due to the district firewall). I’m fortunate to be married to a web developer who styled my page for me but most teachers aren’t as fortunate and are still left with horrible looking pages Any thoughts on wikis as a replacement for webpages within education?

xaos3k

October 31st, 2010

Great article, after reading this i looked for the homepage of my old school and, oh wonder, nothing changed there.
In fact (as i looked through the source) i was horrified, it’s generated by Frontpage 4.0, 5.0 and MS Office, everything mixed together.

So if you want to see a example for (extremely) bad webdesign outside of the US (Germany, to be specific) look at http://www.kooperationsschule-friesack.de/ .

Michael Tuck

October 31st, 2010

Michael, your experience would be invaluable for this burgeoning project. Tracey, I think wikis would be a great alternative for some schools. Reza, nice job; would you be interested in doing it for other schools?

Let’s use Caleb’s group to coordinate: http://is.gd/gwL3m

Mel

October 31st, 2010

I completely understand this, I work for the A.C.T Goverment and we create the school websites for the schools.
We use Mysource Matrix as our CMS which is easy for teachers to use (at least those with the ability to update a facebook status)
Here are some examples:
http://www.melrosehs.act.edu.au/
http://www.chisholm.act.edu.au/
http://www.ainslies.act.edu.au/

Cindy Auligny

October 31st, 2010

My school website’s also generated by Frontpage 4.0, MS Office. As a student, I admit that I have no sympathy for this site. I just visited it when my teacher asked. Came there, downloaded my exercises, and left it. Sometimes never came back.
I really want those schools to upgrade their sites. We live in the 22th century. We live in the technology and computing generation.

Jamie

November 1st, 2010

very good article, in a similar vein it would be good if sixrevisions had an article on how organisations can cope with constraints similar those schools are faced with for example a CMS that is already bought in, strict regulations etc.

Drew

November 1st, 2010

The one thing I didn’t see mentioned in the article or the comments was the factor of ADA Compliance. Government funded schools are required to adhere to strict ADA guidelines to make their websites accessible.

When I was working at a state college as a web dev, making sure we complied with every single rule was a hassle and it axed a lot of really cool features, mostly because screen readers wouldn’t understand them. We’re not just talking about adding some alt tags though, this list is pretty intense. I’m talking about the Section 508 standards. You can read them at access-board(dot)gov

Let me give you some of my favorites:

“when audio presentations are available on a multimedia web page, the audio portion must be captioned.”

“Web pages shall be designed so that all information conveyed with color is also available without color.”
perhaps with the use of text labels?)

“When pages utilize scripting languages to display content, or to create interface elements, the information provided by the script shall be identified with functional text that can be read by assistive technology.”

“Documents shall be organized so they are readable without requiring an associated style sheet.”

I’m not saying this aren’t good things, I’m saying that from a development standpoint, it’s a huge kick in the pants to deal with.

Chris

November 1st, 2010

IMHO one of the key problems is the money angle. Schools (private and public) have some blind spots about spending money. Basically, there are familiar types of expenses (rent, utilities, salaries, supplies) that they can understand, and there are unfamiliar types of expenses that look to them like add-on “luxuries.” Web design is one of the latter. (i.e. “We don’t need it to look pretty.”)

I think one of the appeals of online “site builder” services is that the school doesn’t have to spend money or thought up front for a custom design, nor do they have to hunt for, or hire, an additional staff person who can do website stuff. The fact that subscription services wind up costing them the same money or more doesn’t register, because hey, that’s not “design,” that’s “renting website space,” a type of expense they can understand and accept.

The same rationale is why the school secretaries often do the school newsletter, with equally dismal results; this problem isn’t confined to Web design.

If this wasn’t enough, public schools, and to a lesser extent private schools, also have to justify all their expenses to a committee/board composed mostly of lay people who have no understanding of the value of design either. Doing a decent school website doesn’t only have to sell lay people on the necessity of having a website, it has to sell lay people on the idea that having your website WORK is important — which is really what web design is all about.

Drew

November 1st, 2010

Strike that, reverse it.

Marcell Purham

November 1st, 2010

I think their sites look so horrific is because they barley use the site but as for college sites and so on they’re always high end and great looking.

Michael Tuck

November 1st, 2010

Drew, your insights on ADA compliance would be very useful. Feel like joining?

Chris, I definitely agree. As much as schools emphasize “technology in the classroom,” “21st century learning,” etc, they still display a horse-and-buggy mindset when it comes to using that technology for anything besides, say, a spiffed-up overhead projector.

Jasmine

November 1st, 2010

The websites generated with MS Office and FrontPage look so horrible! I didn’t even know there are people designing websites using MS Office. :)

RobMoffett

November 1st, 2010

I really enjoyed this article and have forwarded it on to my Chief Tech Officer. I am the (only) web designer / developer for the second largest school district in Arkansas. Before I was hired in May of this year, our District of 39 schools had no web designer and it showed (http://www.pcssd.org/INDEXbak5-24-2010.HTML).

I am working towards constructing a WordPress powered site for the District using multisite capability to build child sites for each of the 39 schools and numerous departments. Unfortunately, since I am the sole designer my time gets split up among print work, maintaining / updating the existing site, assisting with technology issues and if I have time working on the WordPress version of the site.

I have found that there is a great deal of reluctance when you start talking about change and new technology. Our communications department (all 3 of us) actually gets more complaints about the site now that there are advancements being made than when it was a totally useless waste of bandwidth.

Don’t judge the current iteration too harshly (http://www.pcssd.org), it is just a stop-gap until the WP based site is ready for deployment.

Idraki M.

November 2nd, 2010

This article has generated few ideas I can see from all the above comment. Way to go man.

JK

November 2nd, 2010

Great Article, as a web developer in a School in the UK, I am constantly bombarded with these offers from “School Internet providers.” most of their systems do appear inflexible, expensive and outdated. We decided to go the Open Source route with our Website and Learning Platform which gives us much more potential for development. We developed a Drupal based site http://www.trinity.cumbria.sch.uk/ we also use a Moodle VLE http://vle.trinity.cumbria.sch.uk/

Michael Tuck

November 2nd, 2010

Rob, JK, those are strong school sites. Rob, you’re entirely correct in your observations about school staffers’ reluctance to embrace new (at least new to them) technologies and methodologies. JK, the more I learn about the “School Internet provider” offerings, the less impressed I am with them. Jasmine, MS Office does indeed create web sites, if you want to call them that. I suspect those are sites generated by administrators and office staff when they’re told, “Get a site up by Tuesday!” and don’t know what else to do or what tool to use.

Frank

November 2nd, 2010

Thank you for writing this article! I am an inner city public school teacher (by choice), and I can honestly say that websites and technology integration in many urban schools are abysmal. As a former web designer with experience at fancy big city shops, my eyes glaze when I look at some of our school sites (tables for presentation anyone?). My old school was a brand new shiny public school but the website was wretched planned, designed, integrated and supported. I have many, many, many thoughts about technology and education, particularly inner city education, and would love to continue this discussion.

Michael Tuck

November 2nd, 2010

Frank, your thoughts and input on the issue would be very welcome at the Google Group we’ve started:

http://is.gd/gwL3m

If you’re interested, you’re more than welcome to join. I teach in the inner city also, and have almost all of my adult career, so I imagine I’ve seen some of the same things you’ve seen, and not just with below-par Web sites….

Paul Stuart

November 2nd, 2010

What a fascinating discussion! As an ex-teacher of IT, I believe that schools have been left to their own devices (and skill-sets) with regard to their websites. Enough said. That’s why we now offer schools here in New Zealand a Drupal-based system which has had a LOT of development to make it easy for non-tech teachers and administrator to keep up to date. Take a look:
http://www.greenhithe.school.nz
http://www.dannevirkesouth.school.nz
http://www.ponsonbyintermediate.school.nz
We think these sites look pretty good and they support a bunch of users from classroom teachers and their blogs to administrators who upload newsletters and calendar events.
We’d love to talk to schools anywhere in the world wanting a rock-solid, feature-rich platform for their website. Sure, there’s a cost – you get what you pay for, especially if it’s free – but it’s affordable and there are no hidden extras.

Greg

November 3rd, 2010

what? lexington has a poor color scheme? millions of Lakers fans will disagree! haha.

Brad Durham

November 8th, 2010

I must have missed this article when it was first posted.

My mother-in-law is the PR for a school district which puts her in charge of the site. There is so much bureaucracy in just the development of the site that schools are slaves to mediocre design.

The school districts are limited to the resources that are on a list provided by the state. For websites it would be the contractor list. This is something that you need to apply to be on. From there it is all a matter of the lowest bidder. This is usually a company dedicated to school sites and usually take advantage of the lack of knowledge within the education industry to get tens of thousands for a custom limited CMS and poor design design.

It cost them a bit over $150,000. All because they thought they needed this special CMS. I have had the pleasure of going in the backend. And it is nothing special. Additionally, they can’t have the site redesigned by another designer and leave it on the CMS. They HAVE to go to the CMS supplier for all design.

The only good thing out of all of this is that they get decent support. Though that is extra.

Andy Williams

November 10th, 2010

Great article and I’ve been reading the comments with interest.
As school website providers in the UK it’s really interesting to read about school websites in the US.
Schools in the UK also have similar blind spots to spending money on websites as Chris describes, although I really hope no-one has spent £100k when £1k will suffice!

Schools should also value their own time more. An in-house solution still has a ‘cost’ and from our experience, a potentially uncertain outcome.

If you’re intestested, here’s some examples of UK school websites all of which have a school specific CMS and produced for around $2000:
http://www.greenschoolsonline.co.uk/Examples/

Ryan Hayes

November 11th, 2010

I stumbled across this article while doing a Google search for schools using WordPress for their sites. I am a high school teacher, I run my own WordPress installation on an Xserve in my department office and host my class Website: http://maclab.edisonchargers.com/, new this year student WordPress sites w/ Buddypress: http://boltpress.edisonchargers.com/, and school newspaper and my new video class: http://thebolt.edisonchargers.com/.

Anyhow, the main school Website is horrendous: http://edisonchargers.com/. I think I finally have the admin onboard to do a complete overhaul. Since I have a familiarity with WP, I am steering them in that direction. There is a good chance that I will be the Webmaster and have my advanced students do updates of sports, events, etc.

However, if this does happen, I don’t want to just use a stock template. I am a beginner/intermediate at CSS and HTML. Here is my old class site that I coded (first site completely from scratch using Coda and CSSEdit): http://maclab.edisonchargers.com/_maclab/.

I sure could use a mentor because I don’t know how to tackle it and no zero PHP. I was thinking of using a framework like Thematic or Hybrid. I video teacher I have been collaborating with as I start my new video production class, took over his school Website last year and it is running on WP: http://hillcresthornets.org/. I like the sports scores and the beats. My school is a big sports school. Also, a site I have been following and is an inspiration for school districts: http://dearbornschools.org/ and the webmaster’s direct blog: http://blog.dearbornschools.org/webmaster/.

If I convince the admin and tak on this task, I have no idea where to start and sure could use a guide.

Kalimati

December 3rd, 2010

The problem of poor quality school websites is much the same here in India. It is good to note that so many people share the same concerns.

I have done a few websites with Joomla, although I imagine WP should be equally capable.

Most schools choose to have a website because others have one. Rarely do they appreciate how it can help them and commit the resources it requires. They land-up with a brochure site, far from exploiting the full potential.

G-raph

December 6th, 2010

I have sponsored my dauchters school a drupal website, because I could not see the ugly one anymore. So I made one for them. Have a look, It doesn’t have to be ugly!!
http://www.lagereschoolsintmartinus.be

Mq

December 27th, 2010

Good site i have seen your donate site. It looks better.

Jim Leedy

March 14th, 2011

I stumbled onto this while checking to see how our site stacked up in Google. I am the director of business development here at School Webmasters and I wish I would have found this article when it first came out. We had a site in the decent category, and admittedly we could improve some things with our coding and designs, but one thing we got going for us is that we do all the work for the schools on the sites for $119 a month. We have graphic designers, copy writers, a couple PR people and enough staff to make sure that the sites stay current. We seek out the info and follow up until we get it. Updates are done same day usually and we guarantee 2 days. It saves schools time and money, and they get great sites year after year.

This was a great article, and I would like to hear more about it. Thanks to all who commented as well.

Leave a Comment

Subscribe to the comments on this article.