Tom Leo's Blog

Home    Ask me anything   

Hacker with a Computer Science Degree

April 24, 2014 at 10:13am
0 notes

Python Scope

Some basic scoping examples in python

The result should be

1. foo test
in-place addition is actually performing a new binding to the name x

2. foo test - nonlocal

3. kwarg inital values gotcha
[1, 1]
[1, 1, 1]

April 23, 2014 at 7:35pm
0 notes

10 HTML Tags You Might Not Be Using →

This was an interesting list, I found the samp and kbd tags the most interesting and put together a crappy example

0 notes

:Before and :After →

styling virtual children of our container, both in the virtual first-child position, and the virtual last-child position.
Yeah, “after” doesn’t mean “after”, it means “at the very end of”

0 notes

User Expectations

A UI component should properly set a users expectation, if the users expectation is different than the functionality of the UI component then the users trust is broken.

Patrick Cox explains:

When a user first encounters a restroom door, the door itself (like a button) sets the expectation that they can walk through it to another room. The label describes the room behind the door, this sets the expectation of what the user will see or do once inside. If a building had a women’s restroom improperly labeled “Mens”, the user expectation and trust would be broken once a man entered the room.

Keeping it simple also means that you should avoid using long labels for things. While “Get a hold of me” or “This is the men’s bathroom” or “Are you sure you want to do this?” clearly set the user’s expectation, they aren’t the prettiest things to have squished on a button or a small door sign. Long labels are not just ugly; if they are too long they can be confusing and most people won’t read the entire thing.

0 notes

A Modern Designer’s Canvas →

Have you ever wondered — responsive websites aside — why so many Web pages are fixed width and centered in the viewport? Do you think it has anything to do with the fact that clients sign off on fixed-width visuals. I’d say one’s a direct result of the other. I’d go further and suggest that asking for approval on visuals should be considered harmful, because we’re reinforcing that outdated notion that a Web page should be a facsimile of a frozen image.

…it’s time to discuss non-layout and layout elements of design separately. This means that the look and feel of individual components and how they are arranged on a grid are now two separate design challenges and that, whereas layout will undoubtably change across screen sizes, the look and feel of a component will almost certainly stay the same.

March 24, 2014 at 6:19pm
0 notes

CSS Diner →

This is a really cool game that challenges your understanding of CSS3 selectors. Check it out!

March 13, 2014 at 11:14am
2 notes

The Truth About Multiple H1 Tags in the HTML5 Era →

Key Aspects of the HTML5 Document Outlining Algorithm

While the pre-HTML5 document outline was drawn purely from heading tags alone, the HTML5 document outline algorithm utilizes the following key aspects:

  • Sectioning root: A sectioning root is a container that provides a scope for the discrete content sections that will be defined within it. Each sectioning root gets its own individual outline.The top level sectioning root of any page is formed by its <body> tags, so there is always an outline generated for any webpage, starting from the <body> tags and working through the sections it is broken into.
    • Sectioning root tags: <body>, <blockquote>, <figure>, <td>, <details>, <dialog>, <fieldset>
  • Sectioning content: Each sectioning root is broken into a series of content sections. These sections are created by placing sectioning content element tags around discrete pieces of content. Sectioning content elements are nestable and semantic. The type that should be used depends on the nature of the content it will contain. (We’ll discuss how to use each sectioning content element further on.)
    • Sectioning content tags: <section>, <article>, <nav>, <aside>
  • Heading content: Text-only labels for sections of content. In the absence of sectioning content tags, the presence of a heading tag will still be interpreted as the beginning of a new content section..
    • Heading tags: <h1>, <h2>, <h3>, <h4>, <h5>, <h6>

Understanding how these aspects of HTML5 are used is relatively straightforward, and the process typically goes much like this:

  1. The sectioning root of the document is formed by its <body> tags.
  2. Within that sectioning root, the document is broken into sectioning content, e.g. by wrapping articles with the <article> tags.
  3. Heading tags are placed into the content sections as required, with the first heading tag in any section acting as the label for that section.

There are many other aspects to the HTML5 document outline algorithm. Extensive information on these is available on W3C.

However, with just the aspects listed above, we are able to solve all the problems described in the previous section of this tutorial.

March 5, 2014 at 4:05pm
0 notes
Tom Leo&#8217;s Blog turned 3 today!

Tom Leo’s Blog turned 3 today!

(Source: assets)

January 19, 2014 at 2:28pm
2 notes

Publication Standards Part 1: The Fragmented Present →

  • latest version of ePub standard isn’t supported by any e-reader
  • iBook and mobi are wrapped in a DRM

1 note

The Vendor Prefix Predicament: ALA’s Eric Meyer Interviews Tantek Çelik →

  • All vendors should put the time into pushing their ideas through the W3C working groups. Circumventing standards like what webkit is doing is not a good thing.