Tag Archive | "html"

Anatomy of A Tag


This entry is part 4 of 5 in the series Web Coding For People Who Are Tired of Being Called Dummies (click to view in order)

Let’s breakdown the tag. Tags all start with a base (like strong) but tags can also have attributes. Attributes are like settings for a tag. Here is a snippet containing a link:

Here's a link to <a href="http://www.google.com">Google</a>, friend.

The code above produces:

Here's a link to Google, friend.

The base tag here is called an anchor tag, or just <a> (notice the </a> to end the link). However, an <a> tag isn’t very useful until you give it an attribute, telling it where the link goes. In this case, the attribute is called href. Attributes are set by inserting them into the a tag directly.

<a href="http://www.google.com">

Tags can have lots of attributes, but most of them aren’t required. (Here is a big list of tags.) A few more of interest:

<br />

This is a break tag. It is analogous to hitting return on your keyboard. After you do it, you move to the next line. Here are two breaks in a row:

Not much to see, right? Just like hitting return. Wait a second, you might be thinking. Why is there a slash after the br? Here’s why: Each tag that is opened must be closed. If you start something in italics with the <em> tag (it’s short for emphasis), then you must close it with with a corresponding </em> tag. However some tags are self-closing, thus the slash at the end. Breaks are like this, as are images.

<img src="images/logo.jpg" />

The <img> tag allows you to put images into your page. The src attribute tells you the address where the browser can find the image. This tag says load the image logo.jpg from the folder images. This address brings up the issue of relative vs. absolute addressing. Onward, dear reader.

Posted in CodeComments (0)

What is a Website?


This entry is part 2 of 5 in the series Web Coding For People Who Are Tired of Being Called Dummies (click to view in order)

You know what a website is, but you’re not sure what a website is.

The best way to think about a website is simply as a group of files. Files just like the ones on your hard drive, organized into folders. Except instead of files that end in .doc and .mp3, these files end in things like .html and .jpg. Website files are kept on a server and delivered to your browser when you ask for them by visiting a particular URL. Your browser analyses them and renders them to the screen.

So next up we are going to make a very small website which will live on your hard drive. People won’t be able to access this website while it is on your hard drive, but it will allow you to build it. When it is ready you can put it on a server on the Internet and then bang. Live website.

Posted in CodeComments (0)

You Can Code


This entry is part 1 of 5 in the series Web Coding For People Who Are Tired of Being Called Dummies (click to view in order)

Code is scary. Here is some intimidating code from the Perl Programming Language:

use push_pull;
$data_bytes = pack "C10", 0, 1, 2, 3, 4, 5, 6, 7, 8, 9;
$data = new push_pull::CkByteData();
$data->append($data_bytes,10);
$blockSize = 16;
$paddingScheme = 0;
$data->pad($blockSize,$paddingScheme);
print $data->getEncoded("hex") . "\r\n";

Yikes.

I have no idea what this does, but just looking makes me want to join the Amish. It looks like some foreign language, and nothing could be more daunting than looking at newspaper in another language. Who has time to learn another language? No one. Ever.

Good news! This is English! It’s just a set of instructions for the machine to follow. Simple ones. Learn the instructions, learn the language, triumphant victory.

The first language you want to learn is HTML. HyperText Markup Language. This language is structural. It structures your data into a webpage. You “markup” your content with tags.

A tag looks like this:

<strong>

A slash is used to end a tag. Like so:

</strong>

Here is how you use one:

Something is <strong>wrong</strong> with grandma.

The strong tag causes things to become bold. The code above will produce this:

Something is wrong with grandma.

Easy, no? That’s HTML. There is nothing more to it. There are quite a few tags to learn, but they all obey the same rules. There are tags to place an image, tags to turn text into links, every piece of a webpage is defined by a tag. Even the webpage itself. (It’s the <html> tag).

So, what exactly is a website, anyway?

Posted in CodeComments (0)

Single Page Site With jQuery


Some websites are simple. Some are so simple they could all just go on one page with a touch of Javascript to show and hide the content pieces. The only trick is to make sure that the URL reflects the currently viewed container, and that when someone bookmarks it or shares a link, Javascript will determine which container to show first. So here’s how you do that.

// Set the current item token, and the on-load token to default		
var current_token = load_token = 'first'; 
$(document).ready(function() { 
	// Get the on-load token from the URL 
	var loc = document.location.href;
	var pound_index = loc.indexOf("#");
	if (pound_index != -1) {
		load_token = loc.substring(pound_index + 1, loc.length);
	}
 
	$('.content').hide(); // Hide everything
	$('#'+load_token).show(); // Show the on-load content
 
	$('.switch').click(function() {
	 	// Get the token to switch to from the link id
		var this_id = $(this).attr('id');
		var underscore_index = this_id.indexOf("_");
		var on = this_id.substring(underscore_index + 1, this_id.length);
		if (current_token != on) { // Only if the user is actually switching
			$('.content').hide(); // Hide everything
			$('#'+on).show(); // Show the desired content
			location.href = '#'+on; // Set the URL so it's bookmarkable
			current_token = on;
		}
	});
});

and if our HTML looks like this:

<div id="nav"> 
	<ul> 
		<li><a href="#first" class='switch' id='top_first'>first</a></li> 
		<li><a href="#second" class='switch' id='top_second'>second</a></li> 
		<li><a href="#third" class='switch' id='top_third'>third</a></li> 
		<li><a href="#fourth" class='switch' id='top_fourth'>fourth</a></li> 
	</ul> 
</div> 
<div id="first" class='content'>one one one</div> 
<div id="second" class='content'>two two two</div> 
<div id="third" class='content'>three three three</div> 
<div id="fourth" class='content'>four four four</div>

We end up with this:


This is content box one.
This is known as content box two.
This little fella goes by content box three.
We don’t talk about content box four.

If you notice, when you click the links, the URL changes. If you refresh that same URL, you will find the same box selected. Nifty, no?

Posted in CodeComments (0)


PHVsPjxsaT48c3Ryb25nPndvb18xY29sX2hlaWdodDwvc3Ryb25nPiAtIDIwMDwvbGk+PGxpPjxzdHJvbmc+d29vXzJjb2xfaGVpZ2h0PC9zdHJvbmc+IC0gMjAwPC9saT48bGk+PHN0cm9uZz53b29fM2NvbF9oZWlnaHQ8L3N0cm9uZz4gLSAxNTA8L2xpPjxsaT48c3Ryb25nPndvb180Y29sX2hlaWdodDwvc3Ryb25nPiAtIDEwMDwvbGk+PGxpPjxzdHJvbmc+d29vX2Fib3V0X2J1dHRvbjwvc3Ryb25nPiAtIDwvbGk+PGxpPjxzdHJvbmc+d29vX2Fib3V0X2VuYWJsZTwvc3Ryb25nPiAtIGZhbHNlPC9saT48bGk+PHN0cm9uZz53b29fYWJvdXRfaGVhZGVyPC9zdHJvbmc+IC0gPC9saT48bGk+PHN0cm9uZz53b29fYWJvdXRfcGhvdG88L3N0cm9uZz4gLSA8L2xpPjxsaT48c3Ryb25nPndvb19hYm91dF90ZXh0PC9zdHJvbmc+IC0gPC9saT48bGk+PHN0cm9uZz53b29fYWRzX3JvdGF0ZTwvc3Ryb25nPiAtIGZhbHNlPC9saT48bGk+PHN0cm9uZz53b29fYWRfY29udGVudF9hZHNlbnNlPC9zdHJvbmc+IC0gPC9saT48bGk+PHN0cm9uZz53b29fYWRfY29udGVudF9kaXNhYmxlPC9zdHJvbmc+IC0gZmFsc2U8L2xpPjxsaT48c3Ryb25nPndvb19hZF9jb250ZW50X2ltYWdlPC9zdHJvbmc+IC0gaHR0cDovL3d3dy53b290aGVtZXMuY29tL2Fkcy93b290aGVtZXMtNDY4eDYwLTIuZ2lmPC9saT48bGk+PHN0cm9uZz53b29fYWRfY29udGVudF91cmw8L3N0cm9uZz4gLSBodHRwOi8vd3d3Lndvb3RoZW1lcy5jb208L2xpPjxsaT48c3Ryb25nPndvb19hZF9pbWFnZV8xPC9zdHJvbmc+IC0gaHR0cDovL3d3dy53b290aGVtZXMuY29tL2Fkcy8xMjV4MTI1YS5qcGc8L2xpPjxsaT48c3Ryb25nPndvb19hZF9pbWFnZV8yPC9zdHJvbmc+IC0gaHR0cDovL3d3dy53b290aGVtZXMuY29tL2Fkcy8xMjV4MTI1Yi5qcGc8L2xpPjxsaT48c3Ryb25nPndvb19hZF9pbWFnZV8zPC9zdHJvbmc+IC0gaHR0cDovL3d3dy53b290aGVtZXMuY29tL2Fkcy8xMjV4MTI1Yy5qcGc8L2xpPjxsaT48c3Ryb25nPndvb19hZF9pbWFnZV80PC9zdHJvbmc+IC0gaHR0cDovL3d3dy53b290aGVtZXMuY29tL2Fkcy8xMjV4MTI1ZC5qcGc8L2xpPjxsaT48c3Ryb25nPndvb19hZF9tcHVfYWRzZW5zZTwvc3Ryb25nPiAtIDwvbGk+PGxpPjxzdHJvbmc+d29vX2FkX21wdV9kaXNhYmxlPC9zdHJvbmc+IC0gdHJ1ZTwvbGk+PGxpPjxzdHJvbmc+d29vX2FkX21wdV9pbWFnZTwvc3Ryb25nPiAtIDwvbGk+PGxpPjxzdHJvbmc+d29vX2FkX21wdV91cmw8L3N0cm9uZz4gLSA8L2xpPjxsaT48c3Ryb25nPndvb19hZF90b3A8L3N0cm9uZz4gLSBmYWxzZTwvbGk+PGxpPjxzdHJvbmc+d29vX2FkX3RvcF9hZHNlbnNlPC9zdHJvbmc+IC0gPHNjcmlwdCB0eXBlPVwidGV4dC9qYXZhc2NyaXB0XCI+PCEtLQ0KZ29vZ2xlX2FkX2NsaWVudCA9IFwicHViLTcxMDQyODQwNTMwMzMzMTBcIjsNCi8qIHdoaXQuaW5mbyA0Njh4NjAsIGNyZWF0ZWQgMy8xNi8xMCAqLw0KZ29vZ2xlX2FkX3Nsb3QgPSBcIjE1MDc1NDQ2NzdcIjsNCmdvb2dsZV9hZF93aWR0aCA9IDQ2ODsNCmdvb2dsZV9hZF9oZWlnaHQgPSA2MDsNCi8vLS0+DQo8L3NjcmlwdD4NCjxzY3JpcHQgdHlwZT1cInRleHQvamF2YXNjcmlwdFwiDQpzcmM9XCJodHRwOi8vcGFnZWFkMi5nb29nbGVzeW5kaWNhdGlvbi5jb20vcGFnZWFkL3Nob3dfYWRzLmpzXCI+DQo8L3NjcmlwdD48L2xpPjxsaT48c3Ryb25nPndvb19hZF90b3BfZGlzYWJsZTwvc3Ryb25nPiAtIHRydWU8L2xpPjxsaT48c3Ryb25nPndvb19hZF90b3BfaW1hZ2U8L3N0cm9uZz4gLSBodHRwOi8vd3d3Lndvb3RoZW1lcy5jb20vYWRzLzQ2OHg2MGEuanBnPC9saT48bGk+PHN0cm9uZz53b29fYWRfdG9wX3VybDwvc3Ryb25nPiAtIGh0dHA6Ly93d3cud29vdGhlbWVzLmNvbTwvbGk+PGxpPjxzdHJvbmc+d29vX2FkX3VybF8xPC9zdHJvbmc+IC0gaHR0cDovL3d3dy53b290aGVtZXMuY29tPC9saT48bGk+PHN0cm9uZz53b29fYWRfdXJsXzI8L3N0cm9uZz4gLSBodHRwOi8vd3d3Lndvb3RoZW1lcy5jb208L2xpPjxsaT48c3Ryb25nPndvb19hZF91cmxfMzwvc3Ryb25nPiAtIGh0dHA6Ly93d3cud29vdGhlbWVzLmNvbTwvbGk+PGxpPjxzdHJvbmc+d29vX2FkX3VybF80PC9zdHJvbmc+IC0gaHR0cDovL3d3dy53b290aGVtZXMuY29tPC9saT48bGk+PHN0cm9uZz53b29fYWxsX2NhdGVnb3J5X3RpdGxlPC9zdHJvbmc+IC0gQ2F0ZWdvcmllczwvbGk+PGxpPjxzdHJvbmc+d29vX2FsdF9zdHlsZXNoZWV0PC9zdHJvbmc+IC0gZGFya2JsdWUuY3NzPC9saT48bGk+PHN0cm9uZz53b29fYXJjaGl2ZXM8L3N0cm9uZz4gLSBTZWxlY3QgYSBwYWdlOjwvbGk+PGxpPjxzdHJvbmc+d29vX2FyY2hpdmVfbGF5b3V0PC9zdHJvbmc+IC0gM19jb2x1bW5zLnBocDwvbGk+PGxpPjxzdHJvbmc+d29vX2F1dGhvcjwvc3Ryb25nPiAtIGZhbHNlPC9saT48bGk+PHN0cm9uZz53b29fYXV0b19pbWc8L3N0cm9uZz4gLSBmYWxzZTwvbGk+PGxpPjxzdHJvbmc+d29vX2Jsb2NrX2ltYWdlPC9zdHJvbmc+IC0gaHR0cDovL3doaXQuaW5mby9ibG9nL3dwLWNvbnRlbnQvdGhlbWVzL2xpdmV3aXJlL2ltYWdlcy8zMDB4MjUwLmdpZjwvbGk+PGxpPjxzdHJvbmc+d29vX2Jsb2NrX3VybDwvc3Ryb25nPiAtIGh0dHA6Ly93d3cud29vdGhlbWVzLmNvbTwvbGk+PGxpPjxzdHJvbmc+d29vX2Jsb2dfY2F0ZWdvcnk8L3N0cm9uZz4gLSBTZWxlY3QgYSBjYXRlZ29yeTo8L2xpPjxsaT48c3Ryb25nPndvb19ibG9nX2NhdF9pZDwvc3Ryb25nPiAtIDwvbGk+PGxpPjxzdHJvbmc+d29vX2Jsb2dfbmF2aWdhdGlvbjwvc3Ryb25nPiAtIGZhbHNlPC9saT48bGk+PHN0cm9uZz53b29fYmxvZ19uYXZpZ2F0aW9uX2Zvb3Rlcjwvc3Ryb25nPiAtIGZhbHNlPC9saT48bGk+PHN0cm9uZz53b29fYmxvZ19wZXJtYWxpbms8L3N0cm9uZz4gLSA8L2xpPjxsaT48c3Ryb25nPndvb19ibG9nX3NpZGViYXI8L3N0cm9uZz4gLSBTZWxlY3QgYSBzaWRlYmFyOjwvbGk+PGxpPjxzdHJvbmc+d29vX2Jsb2dfc3VibmF2aWdhdGlvbjwvc3Ryb25nPiAtIGZhbHNlPC9saT48bGk+PHN0cm9uZz53b29fYnJlYWRjcnVtYnM8L3N0cm9uZz4gLSBmYWxzZTwvbGk+PGxpPjxzdHJvbmc+d29vX2J1dHRvbl9saW5rPC9zdHJvbmc+IC0gPC9saT48bGk+PHN0cm9uZz53b29fY2F0X21lbnU8L3N0cm9uZz4gLSBmYWxzZTwvbGk+PGxpPjxzdHJvbmc+d29vX2N1c3RvbV9jc3M8L3N0cm9uZz4gLSA8L2xpPjxsaT48c3Ryb25nPndvb19jdXN0b21fZmF2aWNvbjwvc3Ryb25nPiAtIDwvbGk+PGxpPjxzdHJvbmc+d29vX2Rpc2NsYWltZXI8L3N0cm9uZz4gLSA8L2xpPjxsaT48c3Ryb25nPndvb19lbmFibGVfYWxsX2NhdGVnb3J5PC9zdHJvbmc+IC0gZmFsc2U8L2xpPjxsaT48c3Ryb25nPndvb19lbmFibGVfYmxvZ19jYXRlZ29yeTwvc3Ryb25nPiAtIGZhbHNlPC9saT48bGk+PHN0cm9uZz53b29fZXhjbHVkZV9wYWdlc19mb290ZXI8L3N0cm9uZz4gLSA8L2xpPjxsaT48c3Ryb25nPndvb19leGNsdWRlX3BhZ2VzX21haW48L3N0cm9uZz4gLSA8L2xpPjxsaT48c3Ryb25nPndvb19leGNsdWRlX3BhZ2VzX3N1Ym5hdjwvc3Ryb25nPiAtIDwvbGk+PGxpPjxzdHJvbmc+d29vX2ZlYXR1cmVkX2NhdGVnb3J5PC9zdHJvbmc+IC0gRmVhdHVyZWQ8L2xpPjxsaT48c3Ryb25nPndvb19mZWF0X2VudHJpZXM8L3N0cm9uZz4gLSAxPC9saT48bGk+PHN0cm9uZz53b29fZmVhdF9oZWlnaHQ8L3N0cm9uZz4gLSAyMTA8L2xpPjxsaT48c3Ryb25nPndvb19mZWF0X3dpZHRoPC9zdHJvbmc+IC0gMjgwPC9saT48bGk+PHN0cm9uZz53b29fZmVlZGJ1cm5lcl9pZDwvc3Ryb25nPiAtIEZlZWRidXJuZXIgSUQ8L2xpPjxsaT48c3Ryb25nPndvb19mZWVkYnVybmVyX3VybDwvc3Ryb25nPiAtIDwvbGk+PGxpPjxzdHJvbmc+d29vX2ZsaWNrcl9lbnRyaWVzPC9zdHJvbmc+IC0gU2VsZWN0IGEgTnVtYmVyOjwvbGk+PGxpPjxzdHJvbmc+d29vX2ZsaWNrcl9pZDwvc3Ryb25nPiAtIDwvbGk+PGxpPjxzdHJvbmc+d29vX2ZsaWNrcl91cmw8L3N0cm9uZz4gLSBGbGlja3IgVVJMPC9saT48bGk+PHN0cm9uZz53b29fZ29vZ2xlX2FuYWx5dGljczwvc3Ryb25nPiAtIDwvbGk+PGxpPjxzdHJvbmc+d29vX2hvbWU8L3N0cm9uZz4gLSBmYWxzZTwvbGk+PGxpPjxzdHJvbmc+d29vX2hvbWVwYWdlPC9zdHJvbmc+IC0gbGF5b3V0LWRlZmF1bHQucGhwPC9saT48bGk+PHN0cm9uZz53b29faG9tZV9sYXlvdXQ8L3N0cm9uZz4gLSAzX2NvbHVtbnMucGhwPC9saT48bGk+PHN0cm9uZz53b29faG9tZV9zaWRlYmFyPC9zdHJvbmc+IC0gU2VsZWN0IGEgc2lkZWJhcjo8L2xpPjxsaT48c3Ryb25nPndvb19ob21lX3RodW1iX2hlaWdodDwvc3Ryb25nPiAtIDU3PC9saT48bGk+PHN0cm9uZz53b29faG9tZV90aHVtYl93aWR0aDwvc3Ryb25nPiAtIDEwMDwvbGk+PGxpPjxzdHJvbmc+d29vX2ltYWdlX3NpbmdsZTwvc3Ryb25nPiAtIGZhbHNlPC9saT48bGk+PHN0cm9uZz53b29faW5jX2ludHJvX3BhZ2U8L3N0cm9uZz4gLSBmYWxzZTwvbGk+PGxpPjxzdHJvbmc+d29vX2luY19pbnRyb19wYWdlX2xlZnQ8L3N0cm9uZz4gLSBmYWxzZTwvbGk+PGxpPjxzdHJvbmc+d29vX2luY19pbnRyb19wYWdlX3JpZ2h0PC9zdHJvbmc+IC0gZmFsc2U8L2xpPjxsaT48c3Ryb25nPndvb19pbmNfdGFiYmVyX3BhZ2VzPC9zdHJvbmc+IC0gZmFsc2U8L2xpPjxsaT48c3Ryb25nPndvb19pbnRyb19wYWdlPC9zdHJvbmc+IC0gPC9saT48bGk+PHN0cm9uZz53b29faW50cm9fcGFnZV9sZWZ0PC9zdHJvbmc+IC0gPC9saT48bGk+PHN0cm9uZz53b29faW50cm9fcGFnZV9yaWdodDwvc3Ryb25nPiAtIDwvbGk+PGxpPjxzdHJvbmc+d29vX2xheW91dDwvc3Ryb25nPiAtIGJsb2cucGhwPC9saT48bGk+PHN0cm9uZz53b29fbG9nbzwvc3Ryb25nPiAtIDwvbGk+PGxpPjxzdHJvbmc+d29vX21hZ19mZWF0dXJlZDwvc3Ryb25nPiAtIFNlbGVjdCBhIG51bWJlcjo8L2xpPjxsaT48c3Ryb25nPndvb19tYWdfc2Vjb25kYXJ5PC9zdHJvbmc+IC0gU2VsZWN0IGEgbnVtYmVyOjwvbGk+PGxpPjxzdHJvbmc+d29vX21hbnVhbDwvc3Ryb25nPiAtIGh0dHA6Ly93d3cud29vdGhlbWVzLmNvbS9zdXBwb3J0L3RoZW1lLWRvY3VtZW50YXRpb24vZ2F6ZXR0ZS1lZGl0aW9uLzwvbGk+PGxpPjxzdHJvbmc+d29vX21pZF9leGNsdWRlPC9zdHJvbmc+IC0gPC9saT48bGk+PHN0cm9uZz53b29fbmF2X2V4Y2x1ZGU8L3N0cm9uZz4gLSA8L2xpPjxsaT48c3Ryb25nPndvb19vdGhlcl9lbnRyaWVzPC9zdHJvbmc+IC0gU2VsZWN0IGEgTnVtYmVyOjwvbGk+PGxpPjxzdHJvbmc+d29vX3BhZ2Vfc2lkZWJhcjwvc3Ryb25nPiAtIFNlbGVjdCBhIHNpZGViYXI6PC9saT48bGk+PHN0cm9uZz53b29fcG9ydF9pbWFnZXM8L3N0cm9uZz4gLSBmYWxzZTwvbGk+PGxpPjxzdHJvbmc+d29vX3Jlc2l6ZTwvc3Ryb25nPiAtIHRydWU8L2xpPjxsaT48c3Ryb25nPndvb19zaG9ydG5hbWU8L3N0cm9uZz4gLSB3b288L2xpPjxsaT48c3Ryb25nPndvb19zaG93X2Nhcm91c2VsPC9zdHJvbmc+IC0gZmFsc2U8L2xpPjxsaT48c3Ryb25nPndvb19zaG93X3ZpZGVvPC9zdHJvbmc+IC0gZmFsc2U8L2xpPjxsaT48c3Ryb25nPndvb19zaW5nbGVfaGVpZ2h0PC9zdHJvbmc+IC0gMTgwPC9saT48bGk+PHN0cm9uZz53b29fc2luZ2xlX3dpZHRoPC9zdHJvbmc+IC0gMjUwPC9saT48bGk+PHN0cm9uZz53b29fc2xpZGVyPC9zdHJvbmc+IC0gZmFsc2U8L2xpPjxsaT48c3Ryb25nPndvb19zbWFsbHRodW1iX2hlaWdodDwvc3Ryb25nPiAtIDQyPC9saT48bGk+PHN0cm9uZz53b29fc21hbGx0aHVtYl93aWR0aDwvc3Ryb25nPiAtIDU2PC9saT48bGk+PHN0cm9uZz53b29fc3VibmF2PC9zdHJvbmc+IC0gZmFsc2U8L2xpPjxsaT48c3Ryb25nPndvb190YWJiZXJfcGFnZXM8L3N0cm9uZz4gLSA8L2xpPjxsaT48c3Ryb25nPndvb190YWJzPC9zdHJvbmc+IC0gZmFsc2U8L2xpPjxsaT48c3Ryb25nPndvb190aGVtZW5hbWU8L3N0cm9uZz4gLSBHYXpldHRlPC9saT48bGk+PHN0cm9uZz53b29fdGhlX2NvbnRlbnQ8L3N0cm9uZz4gLSB0cnVlPC9saT48bGk+PHN0cm9uZz53b29fdGh1bWJfaGVpZ2h0PC9zdHJvbmc+IC0gNzY8L2xpPjxsaT48c3Ryb25nPndvb190aHVtYl93aWR0aDwvc3Ryb25nPiAtIDEwMDwvbGk+PGxpPjxzdHJvbmc+d29vX3R3aXR0ZXI8L3N0cm9uZz4gLSA8L2xpPjxsaT48c3Ryb25nPndvb190d2l0dGVyX2VuYWJsZTwvc3Ryb25nPiAtIHRydWU8L2xpPjxsaT48c3Ryb25nPndvb190d2l0dGVyX3VzZXJuYW1lPC9zdHJvbmc+IC0gd29vdGhlbWVzPC9saT48bGk+PHN0cm9uZz53b29fdmlkZW9fY2F0ZWdvcnk8L3N0cm9uZz4gLSBTZWxlY3QgYSBjYXRlZ29yeTo8L2xpPjwvdWw+