Ivana Vasilj | Blog

iPhone 365

2012-02-12T00:00:00-08:00

Yesterday I finished my iPhone 365 project, a photography project I started 1 year ago. Well-known among photographers, 365 is a project for taking a photo each day for a year. There are no other rules: you choose your photo equipment, subjects you photograph, when to start with it. It allows a lot of space for creativity with a simple goal: to become better at photography.

I decided to make it an iPhone 365 project for 3 simple reasons:

I started a 365 once before that, only to quit it after less than 2 months. I wasn’t always eager to carry a bulky SLR with me, and editing photos required way too much time and dedication on a daily basis, to the point where it became a real drag.
It’s a euphemism to say that I worship my iPhone 4, mostly because of its fabulous camera; it never leaves my side (and needless to say, the best camera is the one that’s always with you).
There are so many great iPhone apps for taking and editing your photos. I will list the ones I used.

My favourite photo apps

Built-in camera app. With its irreplaceable HDR setting, it’s still my most preferred app for shooting. I used all the other apps only for editing (apart from Hipstamatic).
Camera+. Really the ultimate photo app, I used it for 90% of the shots. Not only for its great effects, but it also offers a variety of white balance choices, built-in timer, etc. I could have easily renamed my project to Camera+ 365.
Instagram. The most social photo app, fast and with beautiful effects. Everybody knows it, everybody loves it.
Hipstamatic. The name says it all. I love its look, retro feel, and the random mode. The “most lomo” app, just shoot and don’t look back.
CrossProcess. Admirably emulated cross processed film, great results.

The experience

The greatest benefit I got from doing this is the community feedback from my Flickr friends, great number of them coming from The Daily Shoot project, which unfortunately is no longer active, but it had great daily assignments that kept me motivated, and connected with people who are doing the same thing.

Staying motivated is a real bummer here: I certainly had plenty of days where I would just point to and shoot the first thing I saw (one example of that). Having a great idea for a shot for 365 days (and execute it) is hardly likely, so there were plenty of ups & downs. My favourite (and totally unexpected) ups were the 3 of my photos that got explored on Flickr.

We all know that practice makes perfect. What makes 365 a great project is that you can do it even if you never had a camera in your hands. Even if you don’t become much better at photography, and you definitely will, you’ll have one year of your life in photos, a unique and irreplaceable souvenir worth having.

I Deleted My Facebook Account

2011-04-11T00:00:00-07:00

I had never actually liked that Facebook idea of “connecting” with people you don’t get to see often in your everyday life (obviously, there’s a good reason for that).

Almost 3 years ago I started to travel a lot, and Facebook seemed fitting for staying in contact with new friends who I wasn’t going to see that soon, if ever. So I signed up. I never used it to “collect” each and every person I had ever met; I had around 80–90 “friends” when I scheduled it for deletion (that’s right, you can delete it, not just deactivate, and it works). My criteria for connecting with someone were:

person is a friend,
we’re not particularly close (met a couple of times / haven’t seen each other for years), but I like him / her, and want to stay in touch.

So Facebook and I lived in harmony as long as I thought of it as a contact book, though I caught myself a number of times evaluating who I should be friends with on Facebook. I take friendships seriously, and I felt uncomfortable being virtually surounded mostly by people that are merely acquaintances. And making a list of “true” friends is something I find insane, which is how I felt with Facebook.

I don’t want to go much into how other people spend time on Facebook. As for myself, I disliked being a part of a judging, stalking, Big Brother generation. Also, people I wanted to stay in contact with shared tons of information I didn’t need to know (news, music videos, quizzes, out of context status messages), which totally missed the initial point of staying in touch, just left me swamped with feeds of trivia, and distorted image of people I know, or used to know. I realized:

I’m in touch with people I really care about, mostly through other ways of communication (IM, email, phone, OMG seeing in person!), Facebook brought nothing new in this regard for me.
I prefer Twitter for keeping up with people I like.
I don’t want to “stay in touch”. Location and circumstances create friendships, they shouldn’t be kept alive artificially.

I’ve been off Facebook for 1 month, and I’m happy :)

My Echoes On The Web

2010-07-23T00:00:00-07:00

Recently I created a page here called Echoes that aggregates my social activity from various sites such as Twitter, Flickr, Delicious bookmarks and more. Because this site is static, I needed a service that can:

Grab the feeds from multiple sources,
Aggregate, transform and filter content so the end result only contains recent activity,
Output the result as JSON-P so I can pull it into my site with JavaScript.

Yahoo Pipes is a service that can perform all of the above and, because of its graphical interface of connecting balloons with pipes, it’s also tons of fun to play with for days.

My Echoes pipe is public, so feel free to view the source or clone it. You can also view the JavaScript code that fetches the pipe output and merges it with the markup of the Echoes page.

Headings in HTML4 & HTML5

2010-05-18T00:00:00-07:00

Headings are for organizing content into sections. Nice heading structure represents document outline, improves accessibility, may help with search engine rankings — it's simply beautiful.

New elements in HTML5, such as section, article and hgroup, have changed the way of marking up headings a bit. So let's compare "the old" and "the new" way.

Headings in HTML4

These are the rules of heading structure I follow in HTML4:

Nest headings properly, do not skip levels (h1 is followed by h2, h2 is followed by h2 or h3, etc.)
Use one h1 element per document / page (the main, top level heading for that page)

Those are basically accessibility techniques and have little to do with HTML 4.01 Specification (which only notes that some people consider skipping heading levels to be bad practice). Check out Techniques for WCAG 2.0 (in case you haven't before), particularly these:

This is the example of use from HTML4 spec:

    
<DIV class="section" id="forest-elephants">
  <H1>Forest elephants</H1>
  <P>In this section, we discuss the lesser known forest elephants.
  ...this section continues...
  <DIV class="subsection" id="forest-habitat">
    <H2>Habitat</H2>
    <P>Forest elephants do not live in trees but among them.
    ...this subsection continues...
  </DIV>
</DIV>

So, there's a main div.section starting with the h1, and a div.subsection starting with the h2 element.

Headings in HTML5

First, let's take a look at the examples of use from HTML5 specification draft. Snippet #1:

    
<body>
  <h1>Let's call it a draw(ing surface)</h1>
  <h2>Diving in</h2>
  <h2>Simple shapes</h2>
  <h2>Canvas coordinates</h2>
  <h3>Canvas coordinates diagram</h3>
  <h2>Paths</h2>
</body>

and its equivalent snippet #2:

    
<body>
 <h1>Let's call it a draw(ing surface)</h1>
 <section>
  <h1>Diving in</h1>
 </section>
 <section>
  <h1>Simple shapes</h1>
 </section>
 <section>
  <h1>Canvas coordinates</h1>
  <section>
   <h1>Canvas coordinates diagram</h1>
  </section>
 </section>
 <section>
  <h1>Paths</h1>
 </section>
</body>

Both are correct in HTML5. What's the difference then, if you can just continue with your HTML4 practice?

Sections may contain headings of any rank, but authors are strongly encouraged to either use only h1 elements, or to use elements of the appropriate rank for the section's nesting level.

Authors are also encouraged to explicitly wrap sections in elements of sectioning content, instead of relying on the implicit sections generated by having multiple headings in one element of sectioning content.

This actually means you should only use h1 for headings; start with a new section (or other elements of sectioning content: article, aside, nav) and its h1 for each level. Snippet #1 is "HTML5 transitional". Snippet #2 is the way to go.

Cool thing about the new way of usage is that you can aggregate any section from a document in other documents, it will fit into the external document’s outline.

Why have 6 heading levels then?

Why not just h (like in XHTML2)?

Backward compatibility
hgroup — heading might have multiple levels (subheadings, taglines, alternative titles) — though I cannot think of an example with headings other than h1 and h2

hgroup

There's also a new kid on the block. hgroup is also a heading, more precisely an element for grouping h1–h6 elements, in cases when heading has multiple levels, like:

      
<hgroup> 
  <h1>Monochrome daydreaming</h1> 
  <h2>Homesite of Ivana Vasilj</h2> 
</hgroup>

In document outlines, the text and rank of hgroup elements will be the text and rank of their highest ranked (or the first if many of the same rank) h1–h6 descendant. So the hgroup from the example above, would appear in an outline only as the h1 element with the text (Monochrome daydreaming) it encloses.

More on the subject

Wonder if you've done your heading structure right? Check your document outline with HTML 5 Outliner. Also check out Headings in HTML 5 and accessibility, a nice article by Bruce Lawson. And, of course, the best resource, Sections in HTML 5 specification.

For one not-from-spec example of use, here's the markup (the relevant part) of this document:

      
<body>
  <hgroup> 
    <h1>Monochrome daydreaming</h1> 
    <h2>Homesite of Ivana Vasilj</h2> 
  </hgroup>
  
  <article>
    <h1>Headings in HTML4 & HTML5</h1>
  
    <section>
      <h1>Headings in HTML4</h1>
    </section>
  
    <section>
      <h1>Headings in HTML5</h1>
  
      <section>
        <h1>Why have 6 heading levels then?</h1>
      </section>

      <section>
        <h1>hgroup</h1>
      </section>
        
      <section>
        <h1>More on the subject</h1>
      </section>
    </section>

  </article>

</body>

First Post

2010-05-10T00:00:00-07:00

Well it was about time for me to have my site / blog – first and only. It is powered by Jekyll (which is absolutely great) and GitHub Pages. It is also pure HTML5 ;)

Here I'll be writing about various stuff of my interest, which you may find useful / interesting as well, so stay tuned.

(Thanks to my sis' for the little cloud in the header)