The Basic Overview
I would say that 12 years ago, web design was pretty easy (if you didn't mind learning html). Writing your code in html took a long time, but anyone could do it using "note pad," or "simple text." Now web design has become a bit more complex.
With html, you could make a page with text and images, maybe add some forms so that your visitor could type the name and address on your page. Those were the good old days.
In the mid 90's, people started to create applications that would write the code for you. One of the first ones that comes to mind is, "Netscape Gold." With this application, what took you hours to code in html would take about 5 minutes. Netscape Gold would let you drag and drop and you were done.
Netscape Gold was one of the first wysiwygs (pronounced wiz-eee--wig,,,,"what you see is what you get").
Now there are many wysiwygs. Therefore, people that don't know any code can create web pages. Some of the most popular wysiwygs are;
DreamWeaver (MacroMedia, now Adobe)
Go Live (Adobe, I don't see how long it will be around)
Frontpage (MicroSoft) Yuck!
I would say that those are the big three. But these days, almost any application, even word or MicroSoft Publisher will create a web page for you with the click of a button. Of course those applications write terrible code (we'll talk about that later).
Things have changed greatly since the mid 90's. Now people visit the grocery store, order movie tickets, download movies, sell their cars, watch their stock portfolios and more, all via the internet.
What you see on most web pages cannot get done just using Html. The net has evolved to the point where to develop almost any web page, the developer must be aware of, if not understand, many languages and file formats.
So here is a little summary of what does what.
In today's web sites, CSS is the thing to know. With CSS you can do some amazing things in your web page. CSS is created to "format" you page. CSS is like having Word in the Html language. You can set point sizes, fonts, and more. I would go more in depth here, but to someone that is totally new to web design, if I gave more examples, then you would have no clue what I'm talking about.
Today, most wysiwygs write CSS for you, as well as your html.
So, we have html for structure, css for formatting the page. But what about interactivity. What if when someone visits your site, you have a picture, and when the user rolls their mouse over the picture, they see a new image that says, "You just won the lottery! Yeahhhhhhhh!."
You can't do this with html, but you can with JavaScript. With javaScript, you can create games, clocks, just about anything. With JavaScript you can use "conditional statements."
This means you can say;
If the mouse rolls over the image over there, then, show the viewer this image here.
If the mouse rolls away from the image, then, show the original image.
If the mouse clicks the image, then, go to CNN's website.
This is interactivity. This is JavaScript.
So there you have it. Html, Css and JavaScript, all working together on one web page.
If you know each of these languages, then you can sit down with "note pad" and just write the code to make a web site. But I would say it would take you a good 3 months of study (constant study) to totally understand the code so that you could use it.
What Wysiwygs Do for you Today.
Today, DreamWeaver, Go Live and even FrontPage will write html, css and javascript for you. As you are in these applications, placing an image here and an image there, the application is writing html, css and javascript for you. Isn't it a beautiful life? Maybe, maybe not.
It's a Wonderful World of Wysiwygs
Well, maybe. The problem is that when you are working in a wysiwyg, at some point, something will go wrong. The application will put the code in the wrong spot and what you spent 4 hours to prepare doesn't work. This is when you might have to go into the code and fix it by hand. On the other hand, when I'm working on this web site, I usually work in about 5 applications all at the same time. I might do my text in Word, my images in Photoshop, my animations in Flash, my rollovers in Fireworks and to put it all together, then I would be using Dreamweaver. This being the case, I have to copy and paste the code going from one application to the next. If I don't know anything about the code, then I don't know where to copy and paste what,,,,where.
|
|
| Now don't be worried, this sounds complex and it can be, but I'm just showing you the big picture. Most likely, you won' t (right????). | |
Viewing Code on Anybody's Web site.
For what it's worth, if you are on anybody's website, to see their code, all you have to do in the browser is go to the "view" drop down window and select "source." Give it a try on this page. If you do that, now you can see all of the code that was used to develop this page.
|
|
There's More!
So now you have your webpage all set up. You have articles, pictures, background colors of your page, and now you want people to be able to type in their name and address and put that in a data base.
|
|
Ut,,,,Ohhhhhh........More Languages.
When you have the user input information on your site, the items used to take in the information are called "forms." With these forms you have options such as input text boxes (type text), radio buttons, check boxes and drop down selection boxes.
The forms are easy to create in any of the wysiwygs. But registering, recording and transferring the information into a manageable data base is a whole different story. One of my best friends that is an excellent web developer says, "There is no such thing as a simple form." Now let me tell you about this guy. He can write html, css, javascript and more, all by hand and,,,,most likely, he could do it while in his sleep.
So why is there no such thing as an easy form. Here we go.
|
|
Front End, Middle Ware, Back End.
Here are some terms that you will hear especially if someone is doing a website for you. Front End. Also known as "client side." When you hear, "Front End," think of yourself, sitting at the computer, looking at the web page, in the browser. The Front end is how the web page looks. It's images, the text and the forms and whatever else you might be seeing. Some web developers only work on the front end, the client side. This where where you create the appearance of the page.
|
|
Back End. Server Side.
When you hear these terms, think of the data base where the information from the forms will be stored. When you hear the term, "server," just think of a computer that stores information. You can make your own computer a server. To store information in a data base, you need web, data base software. Some of the most popular softwares are MicroSoft's Access, Filemaker (Apple), then there is Oracle, and there are others. Each of these softwares could take a month or so to "master?"
These softwares create little areas in their databases called, "fields." Fields store the addresses, email addresses, phone number, credit card information from the form where your web site visitor typed in the information. So, you have the front end, you have your database set up on the backend, but there is still more to learn. We don't have a way for the front end to talk to the back end, so, we need Middle Ware.
|
|
Middle Ware
Middle Ware languages let the form information on the browser transfer to the appropriate field on the back end, in the data base. Here are some languages that let this happen. CGI (Common Gateway Interface) ASP (Active Server Pages) PHP Coldfusion(a MacroMedia software that comes bundles with DreamWeaver. With middle ware software, you write the code that lets the front end talk to the back end.
|
|
Let's Summarize
On the Front End you will need; Html, css, javascript and maybe some Flash. To get your images ready to go on your pages, you will need some image manipulation software like PhotoShop or Fireworks. And if you want animation, you might want to use some Flash. On the back end you'll need some data base software. For Middle Ware, you'll need to understand a language that will let the front end talk to the back end. Pretty simple ehhhh? What do Ya Think.
|
|
There's More.
Once you have your pages ready to go for the world to see, then you'll need three more things. A domain name. This is a registered name for your site like Disney.com, Nbc.com, Cnn.com, abc.com, espn.com, maryloubob.com. This will cost you somewhere between 5 to 50 dollars depending on where you get it. A Web Host. This is a place to store all of your web pages on a computer somewhere so that the world can see them. Finally, you will need a FTP (file transfer protocol) application. What this does is transfers all of your images, pages and forms to the web host so that the world can see them.
|
|
Super Summary
Are Ya scared? Did I give you a little bit too much information? Let me say this. I know very few people that know how all of these languages and applications works. Usually web developers will have specialties that they confine themselves to. Many developers will only do front end work. Others will only work on middle ware and back end. If you understand the front end and need some forms, then many people will pay someone to do the backend work. So don't worry. Whatever you don't understand, there is someone out there that you can pay to create the portion of page development that you don't understand.
In closing let me say this. For every language and application that I have mentioned, there is a 1200 page book at Barnes and Noble that you can buy that will teach you how each one works. This one page document is just a summary. I personally am a front end guy. I use Dreamweaver, Photoshop, Flash and some video editing software for my pages. I can write html and css from scratch. I understand the concepts behind JavaScript, but I can't write the code. If I need backend work, I pay somebody.
If you are knew to web development I hope this gives you an idea of where to start on your path to enlightenment. If you have questions or comments, then please email me.
|
|
I teach html, DreamWeaver, Photoshop, Flash and Fireworks. I do it via web conferencing which means that you can be anywhere on the planet, and you and I can connect live, in real time on the net, and you can start learning. So best wishes in you internet development lives. |