XHTML is the basic language of the web. Using this technology alone will enable you to write simple, text based web sites. If you put your mind to it you can learn enough of this in an afternoon to make a simple, no frills, static web site.
Now I don't advocate this if you are trying to sell your web design skills, but if you are a newbie, just starting out, you can write a very simple site just using XHTML and you can do it without too steep a learning curve.
An example of what XHTML looks like is shown on the right. Click the image to see it full size.
XHTML is the computer language used to build the ordinary text on a web site and display images. Almost every website you'll see is made up of XHTML or HTML. This is a relatively easy language to learn and if you put your mind to it, you'll be writing XHTML pretty well within a few hours.
You can type this stuff in using notepad or an ordinary text editor. Or you can obtain an XHTML editor which will colour code what you type and help you correct syntax (the grammar of programming languages) errors.
The Power of CSS
CSS stands for cascading style sheets, which is a bit of a funny name.
It basically means that if you write a nice plain XHTML web page, you can make it look completely different by applying a separate CSS style sheet file to it.
This is powerful and simple - imagine - you can write a web page that looks one way, and by only changing the style-sheet you can make it look completely different.
Click the image thumbnails on the right. Each one is exactly the same web page, using exactly the same XHTML. The only difference is each one has a different style sheet and images applied to it.
Now do understand, to get these types of results with CSS you'll need to be very good at it, and have great graphic design skills.
BUT the point I want to make is that even just using pure CSS and XHTML, (and practically no graphics), you can still achieve a simple, good looking site that people will love. Actually people tend to prefer simpler sites in the long run - the ones they visit every day.
Javascript
JavaScript is used in conjunction with HTML to access the Document Object Model (DOM) of the web page.
JavaScript runs locally on the user's computer and can respond quickly to the user (as opposed to scripts that run on the web server which would take longer to react).
Examples of why you might use Javascript are :change something when the user rolls his cursor over an image or a link - for example you might change the image or re-colour the linkvalidate some user input on a formopen a new window - a pop-up window.Look. I'll admit it. Javascript is a little more difficult to master if you haven't come from a programming background. It is by no means impossible, but will take a little more effort.
The good news is you can actually use a lot of pre-written Javascript modules when you first start coding, so don't be alarmed by Javascript's apparent complexity. Try looking through this web site which provides a fantastic and easy introduction to using Javascript for certain functions to get your self on the right track.
The Document Object Model
The Document Object Model, or DOM, allows a web designer to programmatically manipulate the contents of a web page.
What do you mean I hear you say? Well, if you are new to web design I don't blame you for wondering what on earth I am talking about.
All the individual parts of a web page are accessible via well defined routines (in say Javascript) so that you can make a web page dynamic.Events - i.e user actions are also accessible which means you can respond in real time to user actions.
So - if someone clicks a link on your page, you could (if you wanted to) decide to make a new paragraph of text appear, as if by magic next to the link.
Knowing about this sort of stuff, even if you don't strictly know how to do it, means you will be more aware of the possibilities available to you on your web pages.
DHTML
Next you'll need to learn about DHTML - known as Dynamic HTML. It's not another type of XHTML - it's the same XHTML we talked about earlier, but rather DHTML is concept of using all the following technologies together :
A scripting language - in our case Javascript CSSThe document obect model (DOM)XHTMLThese components of DHTML have already been described so I'll just talk about what DHTML does for you.
Ok - are you ready?
DHTML allows you to programmatically access every part of your web page at run-time via the DOM and Javascript so that you can alter how the web page behaves as it is running. DHTML gives you the ability to create a more dynamic web page over just a static web page (i.e. one that you wrote using only XHTML.)
Now when I say dynamic, I don't mean images jumping about all over the place. Rather more that at some point, you might need to send an item of data from one place on the page to another at run-time.However, just to show you the sort of thing DHTML can do and also to let you see something you should no longer think about doing to a web page -the link shows a subtle snow effect over a photo
AJAX
AJAX is not yet another programmng language - it's a bit like DHTML (which uses the DOM, Javascript, XHTML and CSS together), in that it is the practice of using Javascript together with XML, but asynchronously. AJAX means Asynchronous Javascript and XML. Asynchonous means things can happen potentially, all at once.
Nowadays AJAX is used widely in Web 2.0 style web sites as it can, in most cases, significantly increase the user experience.
A simple example is shown in the link on the right : A random image is substituted by going to the web server, generating a random number which corresponds to an image, and then sending the image to the page. The page does not refresh. Cool uh? Look - don't despair - if you don't understand why this is cool. If you sign up to my newsletter, you'll have the opportunity to learn how to do all this stuff, with me to help you.Server Side Scripting - e.g. PHP
You'll need to understand and use at least one server side scripting language. Examples of these are:
PHPJSP ASP or ASP.NETto mention just a few. I use PHP as do many freelance web developers.Server side scripts allow your web pages to do a lot more than straightforward XHTML pages.
Basically, a server side scripting language is something that the webserver runs before building the XHTML web page, and may even generate XHTML on the fly. It is also used to access databases, so you can retrieve information about customers, products or users and once say a user is logged onto your web page, you can make the page personal and relevant to the them.PHP Framework
Although you don't need to use a PHP framework, (assuming you are using PHP as your scripting language), it can help to do so. I resisted for some time, but found that I was coding the same boring bits of web applications time and time again, so now use my PHP framework of choice which is CodeIgnitor.
CodeIgniter suits me because it is EASY. The advantages of CodeIgniter are many. The number one advantage being that it is utterly simple to install, both on your Windows development box AND on your Linux webserver. To install on both, I guarantee will take you a maximum of 1 minute per installation. Try that with symfony, Zend Framework CakePHP or any of the others.
CodeIgniter is small and fast and easy to use. Even if you have never heard of the MVC architectural pattern.
That said, if your web developer does not use a framework, no worries. It is just better usually for productivity if he/she does.
Database Skills - e.g. MySQL
MySQL is a freely available relational database management system and is the best choice for the freelance web designer.
A database enables you to store information that you can retrieve at a later date and enables you to store :
specific items of data about customersallows for customer login and password retrievalpersonalisation of web pagescustomer accounts and history of transationsproduct descriptions and pricingThe list is in fact, endless and is entirely dependent on how you want the database to enhance the functionality of your website.
You will need database design and maintenance skills in order to create well organised and extensible design. But, I want to say - it is another thing to learn, true - BUT - it really isn't that hard. I did a Computing Science University degree in the UK, and studied database design so I know it from the academic viewpoint and from having been a database consultant for years in the City of London banking environment. That was a challenging time - I mean I had to tune (like tuning an engine) databases with many millions of records.You probably won't be dealing with more than a few thousand records in any database you create for your first or second web design project. So don't worry about it. It is a lot to learn, but if you want to, you can do it.
Search Engine Optimization
- Internet MarketingThere are four elements to internet marketing
- the process by which you bring targetted traffic to your web site. Namely :
on page search engine optimization
- this is where you construct each page on your web site to be as appealing to search engines as it is to humanspaid advertising - this might be pay per click advertisingexcellent website content
- this means you can't just have a 5 or 10 page website (well you can initially, but you have to add a new page or three every week, or so until you have hundreds of pages on your web site). Excellent and copious content will attract incoming linksoff page optimization
- this is where you use directories, social media sites, forums and others to bring in relevant traffic and add to your search engine density. Build It And They Will Come . . . No They Won't!Many people think that all you have to do is build a pretty, web site with a cool design with about 5 pages and people will flock to it. They just don't get it. The site shown up above is one such site.
Since creating this hub, the site has been taken down because the owner found it wasn't bringing in lots of traffic. He needs to re-think his online strategy.His site was designed by a cool graphic designer, but the point I would make is : how cool is a site that looks good, (I mean get a load of that urban feel, lop-sided main menu - I would never think of that!), when it gets no visitors.
web design is not all about graphic designweb design is not secretarial (typing)web design is not something a graphic designer can just turn his hand toweb design is a comprehension of, and ability to use a large number of internet technologies
Photoshop
- Making It Look GoodAll right -
you don't need to learn how to use Adobe Photoshop in particular. There are lots of other image manipulation programs out there that cost a lot less. However, there are zillions of Photoshop tutorials for practically anything you'll ever want to do, so I tend to favour the use of this program.
Now don't get me wrong. I am not suggesting that by learning this program you will become a talented graphic designer - you may already be one, in which case good for you.
But if you are like me, you don't have any graphic design skills. Just make your mind up to learn a few simple tasks using this tool, and you'll be able to make professional, graphically enhanced websites without being artistic. How? I'm putting together a course on that later. But for now you're going to have to trust me.Flash
You Can Avoid It If You Want To Unless 100% Flash web sites are something in which you want to specialise, there is no need to dash out and buy a copy of Macromedia Flash right now.
Flash Doesn't Work Well In Search Engines, True . . . The reason is, that whilst a full-on Flash site can look wonderful and display safely in any size of screen, using any flash enabled browser, it generally has very little textual content. And what little content it has, (unless you take extra steps to duplicate the content in XHTML and employ a measure of cloaking), can't been seen by search engines.
. . .But Text Isn't What Flash Is All About Anyway Flash is after all primarily a graphical tool, and text features low on the agenda of most fully Flashed web sites because if the designers wanted a lot of text, they would probably have used XHTML instead.A Compromise The answer to using Flash for most of us is not to build 100% full Flash sites, but rather to use Flash in key situations on a standard XHTML site, deploying it only where you need to make a visual presentation of the type that Flash does so well.
Used in this way, Flash is not the container, but rather one of many possible items in an XHTML container. Used this way, Flash has no impact on search engine visibility and you can use the rest of your site to communicate using text and images.
There are many low cost, Flash generation tools that you can use to create small Flash presentations. I really like 3DFA and use it for most of my Flash output.
On Page Search Engine Opimization
As you build your website, you'll need to keep in mind what your goal for building it is. Presumably you'll want visitors - a website with no interested visitors isn't really up to much is it?
It's Not Hard There are a number of simple steps to take to optimize each page for search engines like Google. Other types of optimization nowadays take place off page (i.e. with the other things you do to create interest in your site that don't take place on your site), but you should not neglect the foundational importance of on-page optimization. It is part of what makes your site eligible for appearing on a first page position in Google for example.
Briefly, you'll need to create good quality title tags, description tags headings and content, that are on target for each page's topic. You'll need to make sure each image is properly tagged, (I saw a 'guru' on a YouTube video the other day actually say that alt tags on images are no longer important - like DUH!). Alt tags on images ARE important. But maybe you need to learn how best to write them for both your visitors and for Google.
Conclusion
There is a lot to learn if you decide to become a web designer, and more importantly as I hope I have emphasized, a lot your web designer needs to know before you hire him/her. I will add to this skills list over the next couple of days as I can think of quite a few more items to include.
Just Starting Out With A Business Web Site? If you are just starting out with a new business and need a website, you can of course hire a web designer to do everything for you, but do consider
finding the right web designer with the types of skills I have talked aboutmaintaining the site yourself without resorting to tools that turn the process into some sort of WYSIWYG-fest. If you hide behind point-and-click tools you will never understand what is going on and never know how to apply subtle but important code changes to site. You only have to spend some time in Site Build It forums to see that much.
BUT! Site Build It is a successful one stop shop product for people who want to earn money online and who do not want to learn about HTML or web design.
If you can find someone competent to start you off (and I don't mean someone who can only do beautiful drawings, I mean a technical web designer who knows how to use a template to make up for their graphics shortcomings) who can do everything functionally you could ever dream of with a web site, and ask that person to answer your questions when you get stuck, you could think about handling the update and maintenance of the site yourself.
No comments:
Post a Comment