You don’t need to understand technology to grok understand social media, but frankly, it sometimes helps. Or at least a basic grounding in how AJAX is different from PHP, and why CSS won’t sort out your SQL will help you to follow what a developer is on about and whether they are likely to be telling the truth when they blame X for screwing up your website.
So today: a bit of a break from the usual applied social media stuff – here’s my quick primer on what some of the main concepts are and how they relate to each other. I won’t even list the caveats: for a start, this only describes a handful of the relevant technologies out there, and I’m no expert in any of them – I’ve tried to be concise rather than accurate.
HTML: how it’s structured
HyperText Markup Language is in the middle of my ‘spectrum’ but a good place to start. HTML is the framework of a webpage, containing the content. It describes what the different parts of the page are – this bit’s a heading, this bit’s a list, this phrase is a link to another page etc. The ‘markup’ refers to the fact that it takes plain text and by wrapping certain phrases in tags, demonstrates to a web browser how that bit should be presented.
CSS: what it looks like
If HTML gives the structure, then Cascading Style Sheets describe the appearance. So when I say HTML tags demonstrate how something should be presented, that’s just the starting point. CSS lets you override the defaults and specify things like colours, fonts, borders and backgrounds, as well as radically altering the layout of a page. The fact that the leading web browsers tend to display the same CSS in different ways is both a charming thread in life’s rich tapestry and the reason why a web designer on a deadline should never be approached without body armour.
XML: what it represents
Extensible Markup Language isn’t a feature of all websites, but’s its increasingly common – RSS feeds are a form of XML. It looks a lot like HTML but it does more than just describe the structure of a page; it describes what the information actually is. So, for example, an RSS feed denotes a list of items, each with a title, a link and a description – which gives enough information for machines elsewhere on the internet to process those items in meaningful ways (aka Semantic Web): displaying them as a list of news stories, for example.
PHP: how it’s processed
SQL: the relationships between the data
Structured Query Language in flavours such as MySQL are database management tools. At one level, they provide commands for PHP or other script to send information to and from a database, like a user’s profile information or shopping cart contents. More profoundly, the way these databases are designed should reflect the relationships between real world concepts: searching your library’s online catalogue might involve looking in the ‘Authors’ table and returning a list of all the associated items in the ‘Book’ table along with one or more associated ‘Genres’ from another table.
Linux/Apache: the way requests are handled
Worth a mention are the operating systems and software which run the web servers on which the databases and scripts operate. On the open source side, there’s the Linux operating system (various flavours) on which people generally run the Apache web server software – a constantly-running program which handles requests for web pages from browsers, pieces together the appropriate HTML pages including running any scripts if necessary, and sends them back over the internet. The Microsoft equivalents would be Windows/IIS.
Hmmm, feels like I’ve oversimplified and overcomplicated it all in equal measure – there’s more to this technical writing lark than meets the eye. But hopefully if you’re involved in this space but aren’t especially technically minded (like the colleague whose initial query sparked this post), some of that might go some way to showing how it all fits together.
Steph – really useful. I more or less understood it all – just stumbled over the word “grok” at the start, but a quick google sorted that out! tks. Paul
Thanks Paul – I’ve tweaked that now.
I’m glad you did! But I learned a new word, so there you go.
A v good stab at plain Englishising the technology Steph – hard to be concise and not drag in loads of other jargon isn’t it? But this sounds pretty clear to me.
The jargon file always helps with internet slang, I find.
Good stuff as always, Steph.
[…] From server to surfer: anatomy of a website at Helpful Technology – Whilst I rather pompously like to refer to myself as a digital enabler, Steph Gray is rapidly becoming a damn good digital explainer […]
[…] 7 October 2008 Steph Gray has written a handy primer on the set of technologies that support the getting digital content from server to surfer. […]
Excellent stuff – exactly what I look to you for!
Thanks for the encouragement folks! I might do a few more of these technical posts in future…
Mrs Steph just bought me Joel Spolsky’s ‘Best Software Writing’ compendium for my birthday so I’m hoping to pick up some tips…
[…] From server to surfer – the anatomy of a website (particularly impressive in the way that it explains quite complex ideas) […]