The Wall

Web Dev: Power of the Forward Slash “/”

(Warning: this is kind of like blathering mixed with ranting, may be hard to follow, im no professional writer)

 

I swear to god this is one of the industries for well-kept secrets and sadly, I don’t think it’s on purpose. I think as mentors and newbies alike, we need to do out best to describe to people the ins and outs of how the web works and whats going to ultimately stop making so many young developers go bald with stress.

What im here to talk about today, is the power of the Relative, Absolute, and Semi-Absolute paths. This includes deep document roots as well.

Im going to come out and say it, this is what I do and its caused me a LOT less stress: Use Document Roots on Server Side resource management, use Semi-Absolute for everything else.
I have never failed with this, and this includes SSL Certificate Pathing (more on this in a sec if you dont know what it means)

Heres what I do in a breakdown:

I do PHP so I will be providing PHP examples, if you use ASP or Perl, translate accordingly!

Ever come across a piece of HTML that looks like this:

<img src=”<?php echo $dir; ?>/images/funnycats.jpg” />

Chances are when you check the source your going to see something loopy. $dir might be relative “../”, might be “../../”, it could be an absolute path “http://www.mysite.com/”. What either of these arent is efficient, in any way.

 

Truth is, a lot of developers tend to go the way to the Absolute path because then theres control over what is placed in the whole link. While just as popular, “../” type links are finally starting to see the way of the dodo. But still, meh.

I like to use the single Forward-Slash “/” for internal page usage.

Why? Ill tell you.

 

When you use a single / at the beginning of a HREF or SRC attribute, it drives itself all the way back to the root of the site automatically. From here, its just a matter of working your way back up to the resource, so having a well thought out file structure would help wonders. But which looks better to you:

<img src=”http://www.somesite.com/images/interface/icon.png” /> (Absolute)

or

<img src=”../../images/interface/icon.png” /> (Relative)

or

<img src=”/images/interface/icon.png” /> (Semi-Absolute)

?

 

 The Pros and Cons of Absolute

Pros

• Complete control of the URL path

Cons

• Will have to update each link path (if not set dynamically) if the site URL ever changes
• Will have to manually manage switches between HTTP and HTTPS when dealing with SSL certificates (trust me, on partially secure sites, this is a HUGE pain in the ass) less you dont mind your userbase having to close popup windows informing them that the secure page has non-secure content!

	private function slug($text) {
		return preg_replace(array(
			"/([^a-z0-9-])/",
			"/-{1,10}/"
		),
		"-",
		strtolower(trim($text)));
	}