The modern web is brimming with attractive, immersive and interactive sites. Yet creating these sites requires a blend of skills. Skills that go beyond technical knowledge and expertise. Skills like artful design, self-organisation, audience empathy and market awareness.
So what's the secret? Let's explore the top 10 essential web skills needed to create professional quality websites and top the search engine ranking charts.
1. HTML and CSS
Hyper-Text Markup Language (HTML) is the language of the web. At its heart every web page has an HTML core. Fortunately it's easy to get started. Basic web pages can be built with just a handful of HTML tags, for example <h1>, <b>, <div>, <a> and <img>.
The latest HTML incarnation, version 5, is supported by all mainstream browsers on PCs, tablets and smartphones. HTML5 includes built-in multi-media support via the <video> and <audio> tags. Version 5 also introduced the powerful <canvas> element, which by hosting graphical shapes and bitmaps kindled a fast expanding collection of sophisticated browser-based games.
The Cascading Style Sheet (CSS) language is the ideal companion to HTML. While HTML is primarily concerned with basic page structure and content, CSS is all about presentation. Analyse the code behind a modern web page and you'll typically see a heavy reliance on styles. In fact, many have more CSS code than HTML.
CSS usage can result in simpler, tidier and easier to maintain web pages. The latest CSS3 offers fine-grained levels of control over page layout, element appearance and subtle effects. And, just like HTML, CSS is easy to learn.
Today's webpage editors and tools often shield us from viewing the raw HTML and CSS code. This is a shame. Even moderate coding expertise ensures you can exert more control. And you can also take full advantage of those huge online collections of code samples, tricks and tips.
2. JavaScript and Ajax
JavaScript has been synonymous with browser-based development since the late 1990s. An interpreted scripting language with a Java-like syntax, JavaScript code adds webpage features that aren't possible using HTML and CSS alone.
Whether it's interactive popups, smooth scrolling slide shows, animated cartoons, data field validation or cookie creation and management, JavaScript code provides the solution. And all modern web browsers have advanced just-in-time (JIT) compilation to deliver high-speed JavaScript execution.
A key aspect of modern web page technology is the ability to update page contents without reloading the whole web page. Techniques like AJAX extract data from the server then dynamically populate HTML elements. Elements that might, for example, display the latest news headlines, rolling adverts or new tweet notifications.
It takes a little effort to become a proficient JavaScript coder, but the language can tackle virtually any coding challenge. This opens up new opportunities. For example using JavaScript-based development frameworks that generate apps for Microsoft Windows, Apple Mac OSX, Linux, Apple iOS and Google Android.
3. PHP and SQL
PHP code executes on the web server, rather than in the browser. Designed specifically for website development PHP is quite easy to learn.
PHP statements can generate complete web pages or just specific page sections. The source code can either be embedded inside an HTML page or located in a separate '.php' file. The rich library of web-friendly functionality and built-in database support means PHP is an ideal choice for many data-centric operations, including handling logins, user preferences and all manner of e-commerce functionality.
Template-oriented PHP frameworks, such as Drupal, offer a simplified way to harness the power of PHP. A template-based approach lowers the learning curve, allowing developers to focus on design and content. Even so a few basic PHP skills allow you to tweak the template-generated code to suit your particular needs.
Websites typically store data in some sort of persistent repository, usually a database. SQL databases store data in tables, each one designed for a specific purpose. For example, a customer address table would hold house number, address lines, postcode and country.
SQL is based around english-like statements such as 'create', 'insert', 'update' and 'select'. The open source MySQL database has become the de facto standard for web hosting packages. Alternatives include the small-footprint, platform-independent SQLite.
4. Server Administration
Server administration is a potentially daunting area. Fortunately many web hosting packages include a browser-based administration tool. Many of these tools offer user-friendly, drag-and-drop interfaces and they work fine for everyday activities.
Yet, to be in full control you'll need command-level access to your site's server and its collection of files and folders. A few basic skills will cover the core admin operations. These include the transfer of pages, images and code files to and from the hosting server, configuration settings management and performing backups.
Fortunately the file transfer (FTP) application is simple to learn and runs on all platforms. It transfers files between individual machines and across the Internet. And the more admin skills you gain, the greater control you can exert.
5 Image Management
Most websites have a bespoke collection of images. These images span a wide range of sizes, styles and formats. And each image format has particular virtues and compromises. Consequently, working with images is another essential skill.
At the very least you'll need to crop, scale, rotate, resize, adjust colour balance and export to a variety of image formats. Advanced techniques such as colour fades and tints, rounded edges and shadows, blurs and softening effects add a touch of class and individuality to page banners and inline images.
There's a wealth of professional-grade image manipulation products and tools, both free and commercial. The ever popular Adobe Photoshop products have many fans who generate a wealth of web-located tutorials, in both written and video formats. But others prefer open source alternatives, such as the powerful GIMP tool.
6 Audience Empathy
You might consider empathy to be a rather unusual requirement for a website creator. However, establishing audience empathy is just as important as any technical prowess.
Successful websites have a target audience in mind. It could be business people, sport-minded individuals, technology experts, bookworms or those with a social media addiction. Deliver a website with plenty of audience-specific, frequently updated content and they'll return to your site time and time again.
You'll need to determine who these people are and what makes them tick. So, detach yourself from the website technicalities and try to think like a first-time or returning visitor. In this way you can figure out what grabs their attention and, just as importantly, what turns them off.
There are many questions to ask. Can you rapidly determine what the site is about? Which part of the page draws your initial focus? Does it feel relevant, fresh and topical? Is the flow and navigation intuitive and consistent? The more questions you ask and answer the more in tune you'll become with your audience.
7 Page Design
A good eye for design is another vital skill. Regardless of page content clashing colours, difficult to read fonts and inappropriate images means no one will browse your website for long.
Yet again it's vital to understand your audience. Bright, bold designs might work brilliantly for one group but be an instant turn-off for another. Equally, a straight-to-the-point, business-like style might not be lively enough for some.
Make sure you have a design layout in your head or sketched out on paper. Then it's easier to harness the technology and bring it to life. Many designers prefer to work with advanced, graphical-interface tools so they can concentrate on the visual, layout and flow aspects of the design without getting bogged down in HTML and CSS specifics.
Once again Adobe's tools are a popular, if expensive, choice. If the price proves prohibitive there's plenty of free and open source alternatives. But whatever tool you use take the time to explore all its features.
And don't forget design is an ongoing process. There's always room for improvement and subtle refinements following a new insight, audience feedback or after reading about the latest techniques.
8 SEO and SEM
Achieving a high search engine ranking doesn't happen by accident. Instead it's down to in-depth knowledge of your chosen domain or marketplace. The more research you do the more effectively you can target the site's content, links and adverts.
Search engine optimisation (SEO) and marketing (SEM) techniques aim to take full advantage of this research to boost the website's ranking. Identification of the search keywords and phrases people are likely to enter during a search is just one example.
Yet, it's not just about your own pages. Ensuring your site is integrated into the web as a whole is time well spent. This 'off-site' optimisation focuses on in-bound links from other popular or relevant sites. In the battle to reach the top of search rankings off-site optimisation is a critical factor.
Use a quality analytical tool to monitor audience figures, collate page hit statistics, highlight how visitors found your site and more. Google provide free SEO tools, including Google Analytics and AdWords. But there are scores of free and commercial alternatives.
9 Project Management
Self-motivation and drive is all well and good, but it's easy to be swamped by a mountain of important and urgent tasks. With so many design, development, research and marketing activities to coordinate, prioritise and monitor, applying even a few basic project management techniques makes all the difference.
It isn't necessary to own a sophisticated tool or undertake training. Simple prioritised lists work well enough. Why not record each new activity on a separate card or post-it note. It's a rapid way to capture a fleeting thought or idea. And it only takes seconds to reorganise.
The trick is to allocate a short period each day to review and maintain your task list.
10 Patience and Perseverance
Great websites aren't constructed in a day. They have an abundance of interesting, informative and distinctive content, all interlinked into a cohesive, easy-to-navigate experience. This typically takes months of creative effort. Even then there's no time to rest. Static, unchanging websites soon lose their appeal.
Lively, topical, frequently refreshed pages entice visitors to return time and time again to discover what's new. Allocate at least a few hours each week for page updates and refinements and you'll have an edge on many competitive sites.
Yet, even for the most patient and committed person, at times it can all seem a little daunting. For encouragement keep checking the search engine statistics. Watching the audience figures grow as your website expands in quantity and quality is a sure fire way to increase motivation.
No comments:
Post a Comment