Category: Websites and SEO

I ran across a great resource for anyone who has a website (most everyone these days). The resource is a website that analyzes your website in minutes. I found it extremely revealing with regard my websites and how I can improve them.

Most SEO analyzing websites spit out a ton of confusing information that can be overwhelming if you are just trying to get some pointers on what to adjust or where your site can be improved.

Additionally, I just ran across a web client of mine who was asking a lot of questions about how to improve their website, I went through their site and gave them a list of things to improve. I later found this resource, tried it out and found gave similar instructions that a real person would give.

Website Grader will ask you for various information, but all you have to enter is your website url and a report will be generated pretty fast. Below are some of the pieces of information they give you about your site.

I just stumbled on this great website which has very useful and simple jquery ajax applications. I will review each here in a simple way so you can see all of the useful information. This website shows a video tutorial, a text tutorial and a demo for each of the ajax applications.

Please keep in mind that you should use these design elements sparingly and tastefully. Using too many effects in your webdesign can be tacky and detract from the overall design.

Ajax image carousel

This creates an endless carousel with an html list. It also displays a very smooth scrolling effect. This is very simple to set up and uses jquery. Here is an image showing the carousel. View the code and tutorial here.

Ajax smooth slidedown

This shows you how to make a smooth div slidedown effect without the initial jump. This can be used for many cool ajax effects. View the code and tutorial here.

Ajax smooth data changer

This creates a panel that automatically switches out a list of divs. A very nice effect for blog or website sidebars that want to show rotating pieces of information in an attractive way. View the code and tutorial here.

Ajax Smooth Image Fade

I myself have always wondered how to do the smooth image crossover fade and this tells you how to do it. The effect is very nice on buttons, menus and even images on display. View the code and tutorial here.

Ajax Sliding Tab Effect

This is a great effect for teb boxes. I see it cropping up all over the web now days. Use it for tabbed browing of information or even arrow based browsing (arrows on the left and right). View the code and tutorial here.

Very Sleek Tooltip Bubble

Very nice use of the JQuery puff effect. This shows an informational popup over the area you want when the user mouses over the area specified. Good for tooltips, information divs and any other popup application. View the code and tutorial here.

Loading a Large Image with Ajax

You have seen progress indicating gifs show up while a large image is being loaded. Ever wonder how to do this? This tutorial tells you how to do this and have complete control over how the image loads. I do not have a picture of this as this tells you how to load any image with ajax. View the code and tutorial here.

Slideout Side Menu Effect

If you have been to the Apple website recently you might have seen this in action. This gives you an interactive side menu. When a user hovers over one of the menu dividers — that menu shows up. Very nice effect (play around with the demo). View the code and tutorial here.

Ajax for Instant & Server Side Form Validation

Most of the new “Web 2.0” websites have very fluid forms. This is because of the fact that you can lose user’s interest in registering or even buying if it is too hard to fill out the form. I myself have left websites because I found it very hard to get the form to validate. This tutorial shows you how to make a form that validates on the fly, including doing server side calls for user names and such. Quite useful for streamlined user registration. View the code and tutorial here.

There more tutorials and demos on this site regarding Ajax and JQuery. The ones selected here were selected because I thought they could be very easy and useful for web designers who want to have a design edge without haveing to spend too much time coding ajax effects.

With the new Web look spreading through every site new and old, there are a lot of times when you want to use absolutely positioned pngs on your site.

The 2 problems we face. The first one is that the PNG format is not fully supported on all browsers that are in use today. The way we handle that is with a simple include into the main template file of your site.

All you have to do is add your image path and then change the values in the “left” and “top” to adjust the position of the image. You will have to adjust the values in the “if It IE 7” section while looking at the image in Internet Explorer 6 or 7.

I hope this helps anyone who is having trouble with absolutely placing PNG images for cross browser compatibility.

In this Dreamweaver CS4 Tutorial you will learn how to create a basic website using Dreamweaver CS4.

You will learn how to Define a site, Create a template, Design your template page, Design your css style sheet, Insert Editable Regions , Create the pages of your site using the template, Link all the pages together, Create a form, Check your site in the browser and, Upload your site and make it live.

Learning how to build websites can be daunting at first. but with the amount of information on the web, it’s very easy to gradiently approach the subject and become a good website builder. I started a couple of years ago and I can now put together websites with ease. If you want to learn to build websites then this is for you.

This article is not for you if you only want to learn to build websites using visual based website builders and/or content management systems. I will be doing a separate tutorial on how to build websites that way. Realize that both ways can be used correctly and have their rightful uses depending on the goal for your website.

I will not be telling you how to build websites by myself — instead I will be telling you where I learned to build websites. I will give you links to the right places to learn, and all free.

The first and best place to start learning about websites is W3 Schools. W3 Schools has all free tutorials on all of the subjects you need to learn to be able to start building your’e own website. What you need to do is do the tutorials on W3 Schools in the order listed below. Make sure you play around with each concept after you read it. If you have any questions, post a comment here and I will answer it.

Learning Website Building Basics

Read this first. This article gives you the whole picture before you start learning. I suggest you read it.

Learn HTML. HTML(Hyper Text Markup language) is what every website is made out of. It is the first thing you will need to learn, to be on your way to building websites. Make sure you take the time to really get this because it is the most basic and essential piece of websites.

Learn CSS. CSS(Cascading Style Sheets) is what most websites use to efficiently style their HTML. With CSS you can make your website have an overall consistent design or feel. It also enables you to make design changes that reflect on numerous HTML pages by only changing the design change in one place.

Learn Basic Website Hosting. Web hosting means having a place for your website to reside. Learning this will allow you to set up your own website. For example, this website is “www.techassistnow.com”. If anyone goes to that web address, they see this website. When you understand how to host your own website you can then have your own domain name and website content. This will allow you to put together a full basic website that can be seen publicly on the web.

Once you get a feel for this, practice using HTML and CSS until you are pretty comfortable with it. It is wise to know these subjects well before going onto the next step, which can be difficult at first. By Learning HTML and CSS you have the basic knowledge to build a website. If you want to learn how to make interactive, more modern websites, continue down this list.

Learning Advanced Techniques

Learn Javascript. Javascript allows you to build interactivity into your web pages. With javascript you can make your page come to life and be more inviting to the people visiting your website. Learning Javascript can be troublesome at first, so take it easy and mess around with the examples as much as you can. Javascript has nothing to do with JAVA. JAVA is an advanced programming language and shares no similarity to javascript.

Learn PHP. PHP is a programming language that allows you to be able to deliver more dynamic web site content. This kind of programming is called server side scripting. There are numerous different types of server side scripting. I recommend using PHP because it is the simplest to learn and is used broadly on the internet. Do not expect to learn this all at once. As you learn some, use it and build something with it.

Once you have gotten pretty good at PHP, you have come a long way. Learning the really advanced features of website building will become easier as well as learning other server-side scripting languages.

Learning More about the Advanced Techniques

Becoming really good at building websites can involve numerous other subjects. I list them below so you can be directed to the right place. Other than that you can google any questions you have and find very good free articles and tutorials on these subjects. As a tip, if you see something that you like on a website you can right click in the browser window and click “View Source”. Looking through the HTML should give you an idea of how it was done.

Learn Ajax Here. Ajax is a type of javascript programming that can make webpages even more dynamic and load faster. When you go to a website like Google Docs you can see ajax in effect. A lot of new websites are using this programming technique.

Learning Web Design

Learning web design is a whole subject in its self. Learning web design normally requires learning graphic design to a degree. If you are already a designer or if you just want to jump into learning web design, read on.

Learn Photoshop. Photoshop is the main program used today to design web sites. Many sites are planned using a graphics program before any HTML or web coding is done. Websites done like this can have a huge edge on aesthetics and design. Photoshop is a huge program and can be a lot to learn by yourself. I suggest getting a book on this. The book I used was the Photoshop Bible, they come out with new ones for each new Photoshop version. Google “Photoshop Bible” or go to Amazon and get it.

Learn Web Design and Web 2.0. These are some very good tutorials from Scratch Media. I love this website and would suggest anyone read the information on there.