Created
January 29, 2015 16:59
-
-
Save LNA/9ae606571160f1635ed4 to your computer and use it in GitHub Desktop.
Headers Vrs. Body
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
[~] curl -v http://justinjackson.ca/words.html | |
* Adding handle: conn: 0x7fe4a2004000 | |
* Adding handle: send: 0 | |
* Adding handle: recv: 0 | |
* Curl_addHandleToPipeline: length: 1 | |
* - Conn 0 (0x7fe4a2004000) send_pipe: 1, recv_pipe: 0 | |
* About to connect() to justinjackson.ca port 80 (#0) | |
* Trying 104.130.236.182... | |
* Connected to justinjackson.ca (104.130.236.182) port 80 (#0) | |
> GET /words.html HTTP/1.1 | |
> User-Agent: curl/7.30.0 | |
> Host: justinjackson.ca | |
> Accept: */* | |
> | |
< HTTP/1.1 200 OK | |
* Server nginx is not blacklisted | |
< Server: nginx | |
< Vary: Accept-Encoding,Cookie | |
< X-Cacheable: SHORT | |
< Cache-Control: max-age=600, must-revalidate | |
< X-Cache: HIT: 4 | |
< Content-Type: text/html | |
< X-Cache-Group: normal | |
< Date: Thu, 29 Jan 2015 16:35:15 GMT | |
< Keep-Alive: timeout=20 | |
< X-Type: default | |
< Transfer-Encoding: chunked | |
< ETag: "1a11ad-1946-50bc76dde5686" | |
< Connection: keep-alive | |
< X-Pass-Why: | |
< Set-Cookie: X-Mapping-fjhppofk=4843DFFDB6FE19C5C39BD3D33977FCF2; path=/ | |
< Last-Modified: Sat, 03 Jan 2015 23:00:53 GMT | |
< | |
<!DOCTYPE html> | |
<html lang="en"> | |
<head> | |
<meta charset="UTF-8"> | |
<title>Words</title> | |
<link href="words.css" rel="stylesheet"> | |
<link href="https://plus.google.com/u/0/115056462967470089501" rel="author"> | |
</head> | |
<body> | |
<h1>This is a web page.</h1> | |
<p>There's not much here.</p> | |
<p>Just words.</p> | |
<p><strong>And you're reading them.</strong></p> | |
<p>We've become obsessed with fancy designs, responsive layouts, and scripts that do magical things.</p> | |
<p><strong>But the most powerful tool on the web is still words.</strong></p> | |
<p>I wrote these words, and you're reading them: <em>that's</em> magical.</p> | |
<p>I'm in a little city in British Columbia; you're probably somewhere else. I wrote this early in the morning, June 20th, 2013; you're probably reading it at a different time. I wrote this on my laptop; you could be reading this on your phone, a tablet or a desktop.</p> | |
<p>You and I have been able to connect because<em> I wrote this </em>and <em>you're reading it.</em> <strong>That's the web</strong>. Despite our different locations, devices, and time-zones we can connect <em>here, </em>on a simple HTML page.</p> | |
<p>I wrote this in a text editor. It's 6 kB. I didn't need a Content Management System, a graphic designer, or a software developer. There's not much code on this page at all, just simple markup for paragraphs, hierarchy, and emphasis.</p> | |
<p>I remember teaching my daughter to code HTML when she was 8. The first thing she wrote was <a href="http://bizbox.ca/kidlet/">a story about a squirrel</a>. She wasn't "writing HTML"; <strong>she was sharing something with the world</strong>. She couldn't believe that she could write a story on our home computer, and then publish it for the world to see. She didn't really care about HTML, she cared about sharing her stories.</p> | |
<p><strong>You are still reading.</strong></p> | |
<p>Think about all the things you could communicate with a simple page like this. If you're a businessperson, you could sell something. If you're a teacher, you could teach something. If you're an artist, you could show something you've made. <strong>And if your words are good, people will read them.</strong></p> | |
<p>If you're a web designer, or a client who is working with one, I'd like to challenge you to think about words first. Instead of starting with a style guide or a Photoshop mockup, <em>start with words on a page</em>.</p> | |
<p>What do you have to say? If you don't know, there's not much use in adding all that other cruft. <strong>Just start with one page</strong>, with a single focus. Write it and publish it, and then <em>iterate on that</em>. Every time you're about to add something, ask yourself: does this help me communicate better? Will that additional styling, image, or hyperlink give my audience more understanding? If the answer's "no", don't add it.</p> | |
<p><strong>At its heart, web design should be about words</strong>. Words don't come <em>after</em> the design is done. Words are the beginning, the core, the focus.</p> | |
<p>Start with words.</p> | |
<p> | |
Cheers,<br> | |
Justin Jackson<br> | |
<a href="http://twitter.com/mijustin">@mijustin</a><br> | |
<a href="https://plus.google.com/u/0/115056462967470089501?rel=author">On Google+</a> | |
</p> | |
<p class="note">Want to build and launch your own products on the web? Looking to build an audience online? <a href="http://justinjackson.ca/newsletter">Subscribe to my newsletter</a>.</p> | |
<p class="note">This post was originally inspired by Jason Fried's design of <a href="https://knowyourcompany.com/">Know Your Company</a>.</p> | |
<h2>Translations</h2> | |
<ul> | |
<li><a href="words_af.html" hreflang="af">Afrikaans</a> – thanks to <a href="https://twitter.com/LeoGopal">Leo Gopal</a></li> | |
<li><a href="words_cs.html" hreflang="cs">Czech</a> – thanks to <a href="https://twitter.com/jenahajek">Jan Hajek</a></li> | |
<li><a href="words_de.html" hreflang="de">German</a> – thanks to <a href="http://yannickihmels.de">Yannick Ihmels</a> and <a href="https://twitter.com/david_l991">David Lucas</a></li> | |
<li><a href="words_el.html" hreflang="el">Greek</a> – thanks to <a href="https://twitter.com/yiannis_k">Yiannis Konstantakopoulos</a></li> | |
<li><a href="words_es.html" hreflang="es">Spanish</a> – thanks to <a href="https://twitter.com/_ramgp">Ramón García-Pérez</a></li> | |
<li><a href="words_fa.html" hreflang="fa">Persian</a> – thanks to <a href="https://twitter.com/kamyarns">Kamyar</a></li> | |
<li><a href="words_fr.html" hreflang="fr">French</a> – thanks to <a href="https://twitter.com/plmd">PLMD</a> and <a href="https://twitter.com/framaka">Alexis Kauffmann</a></li> | |
<li><a href="words_hu.html" hreflang="hu">Hungarian</a> – thanks to Hüperión Fordítói Műhely</li> | |
<li><a href="words_it.html" hreflang="it">Italian</a> – thanks to <a href="https://twitter.com/pixline">Pixline</a></li> | |
<li><a href="words_ja.html" hreflang="ja">Japanese</a> – thanks to <span>Elle Kasai</span></li> | |
<li><a href="words_ko.html" hreflang="ko">Korean</a> – thanks to <a href="https://twitter.com/hongminhee">Hong Minhee</a></li> | |
<li><a href="words_mt.html" hreflang="mt">Maltese</a> – thanks to <a href="http://mangionlightfoot.com">Vanessa Galea</a></li> | |
<li><a href="words_nl.html" hreflang="nl">Dutch</a> – thanks to <a href="https://twitter.com/fschaap">Frank Schaap</a></li> | |
<li><a href="words_pl.html" hreflang="pl">Polish</a> – thanks to <a href="https://twitter.com/_wolanski">Gregory Wolanski</a></li> | |
<li><a href="words_pt-BR.html" hreflang="pt-BR">Brazilian Portuguese</a> – thanks to <a href="https://twitter.com/heitorbelloni">Heitor Belloni</a></li> | |
<li><a href="words_ro.html" hreflang="ro">Romanian</a> – thanks to <a href="http://fr.linkedin.com/in/lucianpricop">Lucian Pricop</a></li> | |
<li><a href="words_ru.html" hreflang="ru">Russian</a> – thanks to <a href="https://twitter.com/artw_dev">Ярослав Wебком</a></li> | |
<li><a href="words_sv.html" hreflang="sv">Swedish</a> – thanks to <a href="https://twitter.com/mymarkup">Erik Stattin</a></li> | |
<li><a href="words_tr.html" hreflang="tr">Turkish</a> – thanks to <a href="https://twitter.com/opereysin">Opereyşın</a></li> | |
<li><a href="words_zh.html" hreflang="zh">Chinese</a> – thanks to <a href="https://twitter.com/ZhuangdaZhu">Zhuangda Zhu</a></li> | |
</ul> | |
<script src="words.js"></script> | |
</body> | |
</html> | |
* Connection #0 to host justinjackson.ca left intact |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment