I just received this email question from one of my students:
Peter,
I am currently working on a website for one of my clients. She said that she took your web design class and mentioned that you use QualityHostOnline.com for your hosting and domain needs instead of GoDaddy. My question is why? Why meaning is there a reason or just a preference that you choose Quality Hosting. Please let me know.
Here is my response:
Tim,
Originally GoDaddy limited what you could install on the server. When I first hosted with them I quickly found out I couldn’t install Drupal. I still remember how arrogant the help person was telling me that the agreement did not allow a refund but that he was going to refund some of my money anyway…
The Drupal limitation has since been fixed although recently there was a snafu with a GoDaddy client using Drupal and being charged over $6,000 (http://www.huffingtonpost.com/adam-fendelman/why-i-dont-owe-godaddy-65_b_129276.html) The only thing that helped resolve the problem was his article on Huntington and the furor it caused. All the bad press caught GoDaddy’s president’s attention and he stepped in to resolve the things and stop the bad press.
Their advertising is extremely sexist. Something I might enjoy looking at but not something I can recommend to students in class. Especially when one of my students started doing a web site for his church…
And, just recently, I tried to transfer my domain being held by GoDaddy to QualityHostOnline. It took me over two months to accomplish due to an unknown userid/password that was automatically setup without my input when I purchased a privacy option. Because my email on GoDaddy was no longer valid I had to fax, mail, and send scanned copies of my driver’s license and a specific numbered form to a branch of GoDaddy. They would also have accepted copies of my passport which makes me even more nervous. They made it EXTREMELY difficult to do the transfer. I had to send the request three different times and made numerous phone calls all to the answer of “I’m sorry, that is out of our control.”
Meanwhile, I’ve been with QualityHostOnline for almost five years now and have had excellent support, low cost, and overall good results on a consistent basis. They were very helpful and responsive during my domain name transfer. I’ve also recommended this hosting service to other instructors and many many clients and everyone is having the same positive experience.
So, there you have it.
Guess I’ll make this into a blog entry.
Peter
PS – You might want to do a web search for “GoDaddy ethics” It makes for some interesting reading.
Addendum: 09-15-09 I’ve been having a lot of downtime with QualityHostOnline.com and am migrating my servers over to BlueHost.com based on recommendations from several of my students. I can no longer recommend QualityHost as I have in the past.
SitePoint is offering The Art and Science of CSS as a free PDF download until December 1st, 2008. Check it out at this link: http://twitaway.aws.sitepoint.com/
Using Flash for specific fonts
Rounded corners
Specialized background techniques (very cool)
Using CSS with tables
Lots of really great ideas and lots of example code walking you through everything a step at a time.
While you are at it, register for their Community Crier newsletter. Its short and sweet and often has some great ideas included.
Leverage your knowledge of the Web. Here’s a great opportunity to meet some really interesting people and help non-profits with their web presentation.
Sierra Bravo is a web design group in the Minneapolis-St. Paul area and they are putting together their 2nd annual Overnight Website Challenge.
The Challenge: Build ten teams of volunteer web pros to create free websites for ten nonprofits. Last time we dropped the F-word (free free free) we had more takers than we could take. Sierra Bravo fully expects that this kind of loose talk will again open the floodgates for non-profits seeking help and do-gooder types with mad programming chops. So, until there are no more good nonprofits with bad websites, let’s do it again.
Even if you aren’t a professional coder I’m sure the folks at Sierra Bravo would love to have you pouring coffee or making movies.
Be a part of the movement of using the Web to help change the world.
– Thanks Jesse for sending me this link!
Plan to attend? Post your experience as a comment to this blog entry.
I’m using ScreenFlow to create my onscreen videos. This is an amazing program that allows me to capture video and sound and edit using scrolling and panning. Mac only. What is displayed here is only the video portion of the more complete tutorials I offer as part of my online and face2face courses.
The videos shots of my whiteboard talks are taken using a very inexpensive ($150) Aiptek HD1080P pocket-size video. Chad Peterson, one of my students is working on the editing. These resulted from one of my online students asking me to record my entire class. That is very difficult, getting good sound, but I thought I’d try some simple videos that focused on specific concepts to see how enhance the learning activities for each module.
I’d be interested in your comments on how useful these would be to you as a student. Thanks!
I often talk about my son Micah in my classes because he gives me so many real-life examples that show how the concepts I present in class are put to work out in the real world.
Micah has written an interesting resume building site named GigTide using Adobe Flex. When he first published the site he received emails from several users in Italy and Greece asking him to fix the application so they could use the special characters of their language.
Did he have to re-write the entire application? Nope. All he had to do was change the character encoding to UTF-8 (Read Tim Bray’s article if you’d like to know all the gory details about character encoding.) Now GigTide.com can be used by Americans as well as by people that use a script languages found in other parts of the world.
And, its a good thing too, because when Micah checked his Google Analytic numbers the other day he discovered a nice surge in hits from Thailand. He did a little research and discovered a Thai blogger had written about GigTide and it triggered a surge in interest with the site.
That’s the example. Here’s what I teach in my course:
Keep in mind that when you put a web site up that you have the entire world as your market. Not just your town, or your state, or your country, but the potential of the whole world. (Think on how you can leverage your product/service/site to address more than the people in your own village…)
Use Google Analytics to keep track of what your site(s) are doing
Write your code and design your applications so they are accessible to people around the world
You have to register with Adobe to use the tool, but registration is free.
Look for the “Create” button on the left to open up the palette selector and you can either upload an image or pull one from your Flickr account. I’ve seen similar pages do this, but they took color samples at random from the image. With Kuler you can move the hotspots around to select the key colors that you want to incorporate in your theme. The resulting color swatch shows the hex color values and is great to print out and keep with your client files.
Here is a screen shot showing our Computer Careers logo and part of the resulting color swatches:
By using colors on a consistent basis you improve the professional look and feel of the site and increase the believability of the site.
Special thanks to Michael in my Web Programming classes for showing me this great web development tool.
Matt Potochnik, the webmaster for the City of Mankato and a graduate of South Central College Computer Careers , has recommended Aptana . This is an excellent, open-source text editor that can be installed as a stand-alone editor or as a plug-in to Eclipse, the popular GUI programming environment that IBM wrote and later made open-source.
I’ve been using Aptana to edit my XHTML, CSS, and JavaScript files for several weeks now and really like it. It has an excellent debugger, plays well with FireFox, and allows me to code very quickly with its excellent syntax popups and DOM tree display. Errors are flagged immediately so I can fix things before things get all snarfled in a ball of goop.
Jesse Daniels , a software engineer from DayPort , and also a graduate from the Computer Careers program, pointed out how cool the DOM Display is. It allows a programmer to see the entire structure of the page and then jump to any specific element in the code window by simply clicking on the element in the DOM map.
I highly recommend this editor to anyone that spends time writing XHTML, JavaScript, PHP, or other scripting languages.
The cache (pronounced "cash") is a storage space on your hard drive that holds all the files that the browser receives from web servers. This includes html files as well as graphics, sounds clips, and movies.
In order to display things as fast as possible the browser checks the cache first and if it finds the pages you are requesting it uses the files on your hard drive instead of waiting for new ones to be downloaded from the Web.
If you are a web developer this can be trouble because the browser will keep showing you the old version and not the file with the changes you have just made.
A common trick is to hold down the CTRL key when requesting a new web page. This tells the browser to bypass the cache and to get the files once again from the source. This works with IE6, IE7, FireFox and other Mozilla-based browsers.
Using FireFox about:config settings
In FireFox you can disable the cache by using the about:config page. Type about:config in the address field of Firefox.
Do a search for browser.cache and set the line set browser.cache.disk.enable to false. Restart FireFox to apply this setting.
There are many other settings you can make to FireFox in the about:config page. Here is an excellent page that highlights some popular ones. Proceed with caution however. You can really ruin things if you mess around too much and don’t know what you are doing. Make one change at a time and test it. Also, I would recommend backing up the prefs.js file if you plan to do extensive configuration changes. On XP it is located in the C:\Documents and Settings\YOUR-USER-NAME\Application Data\Mozilla\Firefox\Profiles\YOUR-CONFIG-FOLDER.default. (If everything fails just delete the prefs.js file and FireFox will create a new one with default values.)
What should I charge? This question comes up a lot.
Here’s are some pieces to the puzzle that might help determine what to charge a customer. Each one has to work with the others.
What is your time worth?
How fast are you?
Do you want the business relationship to be long term or short term?
What is the current market rate?
How much experience do you have?
What is your time worth?
A person out of high school working at a burger shop will put a lower price on his or her time than a professional manager that is making big bucks. Be careful not to undersell the value of your time.
How fast are you?
You have to realistically look at how fast your can create web pages or write a program. It takes a new student a much longer time to figure out a basic CSS design than a seasoned, five-year CSS expert. And, the expert will have several templates ready and waiting so he or she can create a basic site in minutes. Literally.
Even something as simple as typing speed plays into this figure. Let’s say you can only tap out 30 words per minute on a good day. And, that’s using English words. It might drop down to 15 words a minute when you start typing code…
Now compare your output to another person who is able to type code at 60 wpm or higher. Who will be the most productive? The 60 wpm will be able to generate four web pages or more for every one the 15 wpm typist can write. If you have your skill set down (CSS, XHTML, design, some JavaScript) and have a few web site templates in your personal library that you can build from you will be able to finish normal tasks much quicker than someone that doesn’t. The faster you are the more you can charge. Time is money for both you and your client.
Do you want the business relationship to be long term or short term?
This will help you determine how to charge. If you want this to develop into a long term relationship you may want to charge a flat rate for a set number of pages. Later additions and changes could be billed at an hourly rate. A common error though is to charge to little in order to “buy the business”. After awhile you will find yourself doing lots work and the first question, “What am I worth?” will be nagging at you. It’s always harder to raise rates later than to bill a little higher in the beginning.
Should you charge by the hour or by the project? A short job is usually best by the hour. Longer projects could be billed by a flat rate. Also, if you are newer to the business of web site programming and design you might want to charge a flat rate for a set number of pages.
What is the current market rate?
This is the question that most people are really asking. But, these numbers are only valuable if they seen in context with the other questions listed here. Most professional agencies charge between $100 – $200/hour. A complete, professional website normally runs $1,500 on up depending on how complex it is. The keyword here is professional. Also, keep in mind that these rates are what the agency charges, not what the web programmer gets paid. The agency or company has to pay salaries, utilities, and rent out of this money as well as show a profit.
I usually recommend to people just breaking into the market to charge between $15 – $50/hour depending on their skill level. Once they are established they can charge the higher rate. Established could be roughly defined as a person that has at least 10-15 working web sites that they maintain.
How much experience do you have?
As you continue to work in the field and learn more skills and techniques you will be able to charge more. Experienced people have built up a toolbox of code and techniques that allow them to build and maintain sites/programs quickly and easily. Also, a web developer/programmer that can build a shopping cart or a web page that can be maintained by the customer without needing a programmer is a lot more valuable than one that can only create static web pages that simply display information.
If you can think of better ways to do the routine things quicker and easier you will be even more valuable. For example, one of my students started work at a web design company and put together a framework of code that allowed him to created complex web sites very quickly. Each web site had the same basic structure, but by adding different graphics and modifying the CSS code he was able to create unique sites in an hour or so (once he had the framework built.) All the other employees took several weeks to accomplish the same amount of work.
An Application Programming Interface is a set of functions that let you “hook” into a system without having access to the source code or inside workings of that system. There’s an API for all the modern languages like Java, PHP, Ruby On Rails, and HTML. Sites such as Google, Amazon, and eBay all have an API allowing programmers to access information from their sites. Here’s a list of the APIs Google has available for many of its services including maps, adwords, and Blogger data. This lets a savvy programmer include all types of eBay or Amazon services on their web site by using what these sites have already created.
You can also think of an API as a dictionary. Just like an English dictionary displays words and their meanings, an API lists all the functions available in the API as well as what type of information each one is expecting and what type of information each function will return. Programmers use an API as a reference in using functions correctly.
Up until now a programmer had to keep a copy of each API on their computer or keep a list of bookmarks pointing to the APIs out on Web.
gotapi.com changes all of that. All the common language APIs are now available from a single link page. (Sorry, the application APIs such as Google, Amazon, and eBay aren’t listed yet.) As a programmer this means you can find information quickly as you are writing code.
Tip: With the gotapi.com page displaying, click and drag the icon in the Address field of your browser and drop it on upper part of your Start menu button. You’ll see a solid black line showing you were it will be positioned as you drag it into the Start list.
Anytime you need to look up a function, gotAPI.com is only a click or two away.
- Special thanks to Sean Washington for reminding me about this really great programming tool.
Everyone likes free books. Here is an excellent resource being organized by Globaltext.org .
Here’s a summary from their web site:
Through what he’s dubbed, “The Global Text Project,” Rick Watson and an international team of professors aim to create a free library of 1,000 electronic textbooks covering subjects typically encountered during the first two years of college. A prototype text is already complete, and work is underway on the first book in the series.
The prototype book was created in 2004 because Watson couldn’t find a comprehensive textbook for a graduate level XML programming class he was teaching. Each student was assigned to write chapter, and Watson served as editor-in-chief. The book, “XML: Managing Data Exchange” (http://en.wikibooks.org/wiki/XML), turned out so well that it is still used in classes at UGA today. Each class that uses the text makes improvements on it, leaving it in better condition than they found it.
I looked through the XML text as well as the Java text and they both are an excellent resource for my class.
It’s interesting. Last semester I had my Web III (XML) class start a Wiki as part of the learning process. The idea was to do exactly what wikibooks is doing, although I didn’t know about wikibooks back then. I was disappointed when the students simply posted information that they copied from other sources on the Web in order to complete the assignment each week. I deleted the whole thing over the summer and decided not to pursue it.
Now I’m thinking of resurrecting this project. We could focus on a specific topic and all work together using a private wiki (a wiki is a web page where a group of people can all edit the pages – wikipedia is the most famous of these.) At the end of the semester we could submit the chapter to wikibooks.
Meanwhile, you don’t have to be in a third-world country to take advantage of these textbooks. Go out and find your favorite topics and bookmark them for reference.
Thanks to Tom Edwards for sending me the link about this.
CSS (Cascading Style Sheet) coding is gaining a lot of popularity. And, because it is often edited you should think about writing your code with a bit of style. This will help prevent errors and typos from creeping in and make your code much easier to decipher and update anytime in the future.
I’ve started adopting a three-column layout for my CSS code. Here’s a sample styling my <p> element and a header id selector.
(Click on the image for a larger view.)
At the top of each element block I add a comment describing what this will do. For the standard XHTML elements this isn’t necessary, but it is really critical for any custom id or class selectors you create.
In the first column I list the element (in pink) then the attributes. I’m always consistent with the curly braces putting the opening one right after the element going down two lines and typing in the closing one right away, so I don’t forget it.
In the middle column I list the value, lining them all up with each other. I use spaces to do this because tabs will expand and contract on other computers making a mess of things.
In the third column I add comments describing what each item does. This has saved me hours of work. It makes quick work to track down a specific item when making minor changes. This is especially true if you are smart in your commenting. Instead of stating the obvious, describe any weirdness that may be happening or how this attribute relates to the others. I pretend that whoever will be reading this is the future has only the basic knowledge of CSS.
Follow these guidelines for some very stylish CSS code. It will make you look very professional as well as making your web programming future a lot less stressful.
Works with all browsers. The code that Steve has crafted works in all popular browsers including IE, FireFox, NetScape, Opera, and Safari. And he graciously put it in the public domain.
Just a simple, unordered list - The menu starts out as a simple, unordered list. Its appearance is changed using CSS (Cascading Style Sheets), an idea that has caught on quickly since it was first introduced on A List Apart and promoted by Eric Meyer in his book Eric Meyer On CSS.
Excellent Commenting – In addition Steve has added lots and lots of comments so you can utilize his techniques in other CSS style sheets.
Valid CSS - After some readers complained about non-valid code, Steve went back in and fixed all the errors/warnings so the CSS code is now 100% valid.
Hear him talk about this project - Steve talks briefly about this menu system in his podcast with Leo Laporte, Episode #54 – The Blue Pill. While you are at it, check out the other podcasts they have on the page – many colleges use this material as part of their computer security courses. (You’ll never use wireless, unprotected at a coffee shop or hotel again!).
By the way, I’ve been using SpinRite on my computers since the 1980’s and highly recommend it. Back then it saved several hard drives on the first computer’s our company owned. And just a few months ago I used it to save the data on my wife’s computer. (She thought I was the hero, but it was really Steve Gibson!) Steve is known for writing Windows programs using assembler language. His programs are so tiny he doesn’t even need to zip them for downloading. He’s a true craftsman when it comes to code.
According to the Browser Stats on the W3Schools site over 26% of Web users are now using FireFox as their browser (August 2006). I’m not going to get into the reasons why so many people are switching beyond the fact that it is a safer browsing environment. However, if you are one of those 26% than you should look at these really great extensions that can be easily added into your copy of FireFox.
MeasureIt - The icon for this extension sits in the left end of the status bar. Click on it to activate it. Then click and drag to see the width and height of any object on your screen. This is an invaluable tool for figuring out margins and positioning when working with CSS.
Colorzilla - This icon looks like an eye-dropper and also sits in the left end of the status bar. Click to activate and then move the cross-hair cursor over any color on the screen to see what the color value for that pixel is. For very small areas you can watch the icon in the status bar – its background will match the color the cross hair is over. Click the cross-hair to make the numbers freeze. It would be nice if a control click would drop the RGB value in the clipboard.
Html Validator 0.7.9.3 - This extension displays a status for every page you visit in the lower right end of the status bar. It uses the TidyUI engine and is invaluable if writing XHTML code that meets current standards. The validator shows how many errors and warnings are on the page and if you click on the icon, a text editor displays showing where each error/warning is located in the code.
Web Developer 1.0.2 - This is the swiss-army knife for web developers. When installed it gives you an extra tool bar across the top of your browser with access to JavaScript, CSS, the DOM, validation tools, cookies, images, and object outlining. I turn off the tool bar to save screen real estate (right click on the tool bar and unselect the Web Developer tool bar option), but have quick access to all the tools via the tools/Web Developer menu selections.
Venkman JavaScript Debugger – I just discovered this tool this afternoon, but it looks like it fills a very critical need for JavaScript developers. I’ll be adding a blog entry in the future on this debugger after I’ve had a chance to noodle around with it a bit.
How to Download and Install Extensions
From the FireFox menu select tools/extensions
Click on the link in the lower right corner “Get More Extensions”
Use the search box to find the tools you want
One the home page for each extension you will see a green “install now” button. Click on this to download the extension and install it.
You’ll have to close all copies of FireFox for the installation to take effect.
Well, we have a fine new web site. And a dynamic one at that. One that can be safely updated by employees who would rather not feast on the alphabet soup of XHTML, FTP, CSS and DOCTYPES.
CCI needed two more things. First, they wanted to be able to have a common calendar so everyone could keep track of where the director was, schedule training sessions, and know who was using the conference room when.
We accomplished this by installing the open-source webCalendar program on their server. I blogged about this when I first implemented it under the topic The Web as a Tool.
They also wanted a way to communicate more within the organization. To have more collaboration. To be able to share documents and toss around ideas.
To accomplish this I used a popular open-source CMS (Content Management System) called Drupal. This is basically a shell or framework which is customized according to the client’s needs. It is built using PHP and mySQL and uses the same concepts of database-driven, dynamic web pages that I talked about in the previous entry Site Re-Design – Part IV.
Drupal allows the employees and friends of CCI to write books as a collaborative effort. They are starting with a cook book. They are also talking about writing down their collective work experiences. CCI is a support company for people with disabilities and there are many wonderful stories happening every day.
I also set up a forum out on Drupal so the employees can discuss hot topics or new ideas. The director can set up a poll like you see on many web sites today.
There’s also a private blog that each employee can contribute to. It will be an on-going journal about life at CCI.
I made this a private part of the CCI web site and only people with a user name and password can access the pages. As they build up their content they may decide to make some of it open to the public. With Drupal I’ll only have to check a few checkboxes and people without a password will be able view the materials.
There are hundreds of CMS’s available. I choose Drupal because of its strong community and excellent documentation. A quick search through the Drupal forums gives me lots of information and quick solutions.
Last week we got several of the CCI managers together in one of the computer labs at South Central and we had a great training session using Drupal. (They had already figured out web calendar on their own and didn’t need any help with it.) At first they were a little nervous, but as they started posting to their blogs and adding entries to the group-effort cookbook, they found out how much fun collaborate web work can be.
Next, convert the design into CSS code and build a template.
Finally, build the web site.
All right! All done!!
Well, not quite…I’d been getting emails about once a week from the CCI employment director. Every time a new position came open she had to send me an email so I could update the website.
There had to be a better way.
And there is. Here’s how a regular web page works:
The request goes over the Internet to the correct server (which is specialized computer that is probably inside a protected data center).
The server finds the file
and sends it back to the couple.
The new file (and its graphic files) display in the couple’s browser.
PHP is a program that lives on the server. When the couple request a web PHP web page, the request goes to the server the same, but before the server sends the file back, it looks through the file and runs any special programming code it finds. Then, it sends the results as a plain HTML file back to the couple.
This let’s all of us programmers do lots of really cool things. For example, we can take the choices the couple filled out on a form and pull information out of a catalog database, sending back a page that is customized based on what the couple typed in on the requesting page. CarSoup.com, eBay.com, and amazon.com are all examples of this type of server-side programming.
Ah ha! This could be my solution for the CCI employment page!. All I have to do is store the employment data in a database. (I used one called mySQL for this project.) I’ll take the standard web page I had developed and every place there was to be a job description I will write PHP code to pull the information out of the database and display it. The finished page will look the same to the end user (except the file name ended with .php instead of .html), but all of the job listings will be dynamic and change any time the data in the database is updated. Cool beans.
But, I still have to figure out how to get the database updated. For that I’ll write a special PHP page that only certain people know about. When they request this page with their browser (and type in the user ID and password correctly) I’ll have the server send them a form page they can type the job information into. Here’s what the page looks like:
When the employment director clicks on the “Save” button, a request is sent to the server where yet another PHP page runs, taking all the employment information and storing it in the database.Later, when another couple clicks on the regular CCI employment page, a new request will be sent to the CCI server. The server will run the PHP code I wrote telling it to extract the job information from the database and build an HTML page using that text. All the data that the employment director saved to the database will automatically display.I did the same thing for the activity and a few other pages.
Since implementing the system I haven’t received any “please update this page” emails. Now the client can update their own web page by simply filling out a form page in their browser. This is what web programming is all about: dynamic pages, putting the control in the hands of the user.
This topic of server-side programming is covered in the second half of my Web Programming II class using a language developed by Microsoft called ASP.NET. It works very similar to PHP.
Notice that even though the pages are dynamic, I still maintained all the design and accessibility features that I had originally built into the static pages.
In the email I sent to the director I had a hyperlink to the web page with the four designs. He simply forwarded this email to his employees in order to get their feedback.
It was almost a unanimous vote for design one. The only real change they wanted was to use the original blue circle logo.
The next step was to translate the design I had created in FireWorks into CSS code.
In order to make the page completely accessible I started with plain XHTML and text with no styles. Here’s how the page looked “naked”:
Click the graphic for a larger view
Dustin Diaz started the first annual “Naked Day” in 2005. On April 5th, webmasters around the world turn off their CSS to show how accessible their web pages are http://www.dustindiaz.com/naked-day.
This is how search engines see a web page. Just the facts, please ma’am. It is also makes your page very accessible to people with visual disabilities that have the computer read their pages using text-to-speech technologies such as JAWS.
The entire page layout was done using CSS. No tables. The idea is to keep all of the design code separate from the content so it isn’t watered down when the search engines look it over.
I spent a lot of time working through this using TextPad and a browser.
Here’s the end result:
Click the graphic to view the live site.
Here’s some things that I changed from the original design:
In my original design I had a header and then an introduction section alongside the menu, and then the content. It was much simplier just using a standard h2 header inside the content than trying to set up a special area for it.
I changed the heading font to Papyrus, matching the font used in their brochures.
And, you’ll also notice I changed the logo using their tried and true blue ball logo. (I had to create a new one in FireWorks because they didn’t have a copy available. I sent them copies for their files as a courtesy.)
Once I was satisfied with the design I made a master template page. Using the template I could do a quick “file save as” to create new pages utilizing all of the repeating code that I put into the original page design. This was a real time-saver.
I knew I would be doing the redesign of the CCI website for quite awhile and had several design layouts floating around in my head. Now was the time to get them down on paper. Usually I draw out very rough pencil sketches showing what the basic elements are needed as well as how they will be arranged on the page. This time I went directly into FireWorks, which is similar to PhotoShop, and pulled together a few variations on the design.
Here’s what they looked like:
Click for a larger view
Click for a larger view
Click for a larger view
Click for a larger view
Noticed how I used the blue theme highlighted with the pink. I knew their logo was dark blue. Blue is a cool color so I used the dark pink to add some contrast to the site. This was also the first time I had been able to experiment with gradients which I also created in FireWorks.
I had my favorites, but needed to know what the client liked so I built a quick web page showing each concept idea and published it to the Web in a special folder.Because this was a re-design, and I had access to their web host, I was able to use the client’s existing web site. But, I could just as easily have published it to one of my own domains.I sent the client an email with the link to the page asking them which design they preferred and letting them know that they could mix ‘n match elements from different designs if they wanted to.
I’m working on a web site re-design for CCI, a non-profit company that offers support for people with disabilities. I thought it would be interested to see the various steps of a web site re-design as it unfolded.
Here’s the original home page:
Click on it for a larger view
The first thing I did was meet with the director and come up with a list of things to be done. This formed the basis of project. Here’s the summary list. (And here’s a detailed list if you are interested in using it for your own web projects.) These were both created using Microsoft Project.
Looking at the to-do list you’ll see a basic process that can be used for most web site projects:
Plan things out on paper
Create the design and build a template using CSS
Build the static pages using the template for each new page
(Note: This is what the Web Programming I course covers)
Convert specific static pages into dynamic pages
Build the user-input screens for the dynamic pages
(Note: These steps are covered in Web Programming II using ASP.NET)
This is a temporary posting for all my Web Students.
There’s a free 2-hour seminar in Bloomington covering AJAX. This is sponsored by Intertech. You can register at http://intertech.com/REGISTER
AJAX is the JavaScript tools that are being used on web sites such as Google Earth where you have the smooth scrolling. Using AJAX smoothes out the user experience because you don’t have the pauses every time you click on a web page.
This is being held at Microsoft at 8300 Norman Center Drive, Suite 950
Bloomington, MN Which I could go but I have other plans for that day that I can’t change.
Post a response if you attend. I’d love to hear what you learned.
Explore what you are passionate about. Build a business using the power of the Web. Read these articles to find out tips and tricks on doing this successfully.
Have something to add? We are always interested in your ideas.
nd later made open-source. 
