Website Designers and Webmasters

About a year ago, I ran into a fatal error with my PhotoShop 7.0, and I could not figure out how to fix it.

Whenever I opened my Photoshop, I got this error:

“Unable to continue because of a hardware or system error. Sorry but this error is unrecoverable.”

And the program would just shut down. I couldn’t even open it. For the life of me I couldn’t figure out the problem. Finally, after almost a year of checking for solutions, I found a solution!

The problem is that PhotoShop 7.0 can’t handle more that about 1000 Fonts! Why that would cause the entire program to crash and burn… who knows. I hope they fixed up the newer versions so I don’t have to worry about that. (I have over 5000 fonts.) So because of this stupid Error: “Unable to continue because of a hardware or system error. Sorry but this error is unrecoverable.” I had to delete 4000 fonts off of my machine. (Of course I have a back up, but still…)

Now that I have my PhotoShop Operational again, I’m going to be spending a lot of time learning all the tricks of this “awesome” program. Any designer I talk to says that PhotoShop is the best, period. But from what I’ve seen so far, it’s got a lot of annoyances that Fireworks has already streamlined. (Yes, I realize that my PhotoShop is five years old, and I’m taking that into consideration.) But I should be putting together a Product Comparison between Adobe PhotoShop and Macromedia FireWorks. That will probably end up being 3 or 4 posts.

-”Unable to continue because of a hardware or system error. Sorry but this error is unrecoverable.”
-Ashton Sanders

There is a very common problem when trying to upgrade sites made by “newbie” website developers or when you realize that html isn’t the only language on the internet, and you need to upgrade your site.

Problem:

You have a site where every page has a *.html or *.htm extension, and you want to add a dynamic, server-side programming language like PHP.

Solution #1:

Go through your entire site, and change every file name to a *.php extension. Then go through every page and correct all of the hyper links. Then do testing on your entire site to ensure that you haven’t missed any links. Also, if you know anything about search engine optimization and websites, you’ll know you need to create 301 redirects from your old pages to your new so that you don’t lose any Rankings you may have gained. Then you have more testing to do to make sure all of your 301 redirects work….

Solution #2

Add this one line of Code into your .htaccess:

AddHandler x-httpd-php5 .php .htm .html

That’s all it takes to add PHP to my html files?

Yep, that’s it. That little line of code has saved me hundreds of hours of work, and I’m sure it’s not as commonly known as it should be.

-Spread the Wealth
-Ashton Sanders

Cascading Style Sheets (CSS) make it very easy to replace text with an image. Here is the whole process described in as few words as possible:

Background Information

In CSS, “display:none” will cause that element and every child in it to disappear. There is nothing you can do to make one of the child’s element.
“background-image” give an element a background. This can be applied to just about every element.

Create the Elements in HTML

In your HTML, write this:

<h3 id=”title”>
<span>Here is the Title!</span>
</h3>

Create the CSS to replace the text with an image

In your CSS, write this:

/* Remove the Text */
#title span {
display:none;
}

h3#title {
background: url(”image/url.jpg”) no-repeat top left;
height: 20px;
width: 100px;
}

And Bam! Your text has disappeared off of the page, and the H3 element is 20 pixels wide and 100 pixels tall. It also has an image for a background that is aligned in the top left corner.

I’ve seen that CSS Text Replacement technique described with two pages, so I thought I’d see how short of a blog I could make out of it.

And Now you know how to replace text with an Image!

On a side Note, I’ve also seen this done with: “text-indent: -5000px;” or “visibility:hidden”. These work, but I would stick with display:none. It’s the cleanest way to do it.

-I hope that helps you out with your CSS and Design Needs.
-Ashton Sanders

Absolute Positioning with CSS can be a very useful thing.

I’ve been working a lot with CSS over the last year, but I’ve just recently discovered the secret to absolute positioning.

Absolute Positioning in CSS

Absolute positioning will allow you to move an HTML item from anywhere in your code to the same spot. For Example: The side bar on this page (Top Horse Connection) is at the very bottom of the HTML code. But the CSS absolute positioning tells the side bar to be positioned 170 pixels from the top of the page. Here is the CSS Code:

#sidebar {
position:absolute;
top: 170px;
left:0;
}

As you can see, it’s very simple. And it’s very useful when you want something to align along the right or left side of the screen. But what if you want a sidebar to be positioned in the middle of your screen (lets say 300 pixels to the left of the exact middle)?

You could do:

#sidebar {
position:absolute;
top: 170px;
left:400px;
}

On a 1400 pixel-wide-screen, that would work perfectly!, but what if your screen was 800 pixels wide, then the sidebar would be 100 pixels to the right of the middle… So what now?!?!

This is what would you do:

#sidebar {
position:absolute;
top: 170px;
left: 50%;
margin-left: -300px;
}

And Wala!

-More on the way
-Ashton Sanders

This is a PHP tutorial to add advanced include templates to your site.

What you need to know

• Basic PHP functions: include(); and the “for” loop.

Background PHP Information

It is a very useful thing to use a template on your site. Once I have finished designing a site, and converted it into XHTML/CSS, I then make two (or more) includes out of it: “header.php” and “footer.php”. Those two includes have everything that is the same on every page of the site. This allows me to easily add or remove a button, change the layout, etc. All I have to do is change one file, and the entire site is updated!

What’s the Problem?

If you know includes, you know that they must be relative paths, not absolute. (So if your page is in the pages folder (/pages/) and your header.php is in the header folder (/header/), you will need to write your include like this:

include(../header/header.php);

The problem arises when you don’t want to hard code every new page, in every new folder.

PHP Solution

Here is a simple for loop that will figure out what folder you are in, and put the appropriate number of “../”s to make your includes work:

<?
$folder = split(”/”, $_SERVER['PHP_SELF']);
$rootpath = “”;
for($count = count($folder); $count > 2; $count–){
$rootpath .= “../”;
}
include($rootpath . “include/header.php”);
?>

There you have it, some sweet, yet simple PHP.

-Enjoy,
-Ashton Sanders