<?xml version="1.0"?>
<News hasArchived="true" page="8920" pageCount="10794" pageSize="10" timestamp="Mon, 07 Sep 2026 20:52:04 -0400" url="https://my3.my.umbc.edu/posts.xml?mode=activity&amp;page=8920&amp;range=30">
<NewsItem contentIssues="true" id="27820" important="false" status="posted" url="https://my3.my.umbc.edu/posts/27820">
<Title>Hack the Parks- Bringing the Community Together for Change</Title>
<Tagline>Do you have a solution to improve Baltimore City Parks?</Tagline>
<Body>
<![CDATA[
    <div class="html-content">
    <p><span><a href="http://gb.tc/programs/hacktheparks/" rel="nofollow external" class="bo">http://gb.tc/programs/hacktheparks/</a></span></p>
    <p>Park improvements can be an engine of change for Baltimore. Well-maintained city parks <a href="https://www.planning.org/cityparks/briefingpapers/saferneighborhoods.htm" rel="nofollow external" class="bo">promote social health</a>, improve neighborhood safety, and spur economic growth. </p>
    <p>The power to make Baltimore's parks (and the city, as a whole) sustainable, livable and vibrant lies with us. So we are calling on the citizens of Baltimore to "hack" the city's parks. By hacking we mean, citizens develop their own applications (whether they be technology-based or not) which create simple, tangible benefits for the community.</p>
    <p><a href="http://gb.tc/" rel="nofollow external" class="bo">gb.tc</a> has partnered with the <a href="http://moit.baltimorecity.gov/" rel="nofollow external" class="bo">Mayor's Office of Information Technology</a> and Baltimore's <a href="http://bcrp.baltimorecity.gov/" rel="nofollow external" class="bo">Department of Recreation and Parks</a> to give Baltimoreans a real opportunity to change our urban green spaces. The goal isn't just to better life in Baltimore, but to give citizens the chance to build real, sustainable businesses which help achieve this end.</p>
    <p>Hack the Parks is making <a href="http://gb.tc/programs/hacktheparks/eligibility/" rel="nofollow external" class="bo">grants available</a> to support the most innovative park improvement proposals. We encourage you to think small, at least to start. The funded projects are all pilots. In addition to seed money, the selected pilot projects will also be given park space or other Rec and Parks resources to test their plans, pivot, and evolve into truly viable products. </p>
    <p>Here's how it works:</p>
    <ul>
    <li>Throughout April and May 2013, anyone can propose a solution (or multiple solutions) to improve a Baltimore City park.</li>
    <li>On May 24, the selected pilot projects will be announced.</li>
    <li>In June, Rec and Parks will roll out implementation of the funded solutions.</li>
    <li>All summer long, the solutions will be used in their assigned city parks. Updates on each project will be posted on this website, so the community can keep track of its progress.</li>
    <li>At the end of the summer, there will be a celebration where presentations will be made on each project's success.</li>
    </ul>
    <p><em>Hack the Parks is made possible with the support of </em></p>
    <p><a href="http://moit.baltimorecity.gov/" rel="nofollow external" class="bo"><img src="http://gb.tc/files/resources/small_orioles-moit.png" alt="MOIT Logo" style="max-width: 100%; height: auto;"></a></p>
    <div><br></div>
    </div>
]]>
</Body>
<Summary>http://gb.tc/programs/hacktheparks/  Park improvements can be an engine of change for Baltimore. Well-maintained city parks promote social health, improve neighborhood safety, and spur economic...</Summary>
<Website>http://gb.tc/programs/hacktheparks/</Website>
<TrackingUrl>https://my3.my.umbc.edu/api/v0/pixel/news/27820/guest@my.umbc.edu/3e2b05b930afc0422be445ee867dbfac/api/pixel</TrackingUrl>
<Group token="shriver">The Shriver Center</Group>
<GroupUrl>https://my3.my.umbc.edu/groups/shriver</GroupUrl>
<AvatarUrl>https://assets2-my.umbc.edu/system/shared/avatars/groups/000/000/008/0bfad113286cf6b1bc6dedbdbfc7e5ef/xsmall.png?1441293069</AvatarUrl>
<AvatarUrl size="original">https://assets1-my.umbc.edu/system/shared/avatars/groups/000/000/008/0bfad113286cf6b1bc6dedbdbfc7e5ef/original.jpg?1441293069</AvatarUrl>
<AvatarUrl size="xxlarge">https://assets3-my.umbc.edu/system/shared/avatars/groups/000/000/008/0bfad113286cf6b1bc6dedbdbfc7e5ef/xxlarge.png?1441293069</AvatarUrl>
<AvatarUrl size="xlarge">https://assets2-my.umbc.edu/system/shared/avatars/groups/000/000/008/0bfad113286cf6b1bc6dedbdbfc7e5ef/xlarge.png?1441293069</AvatarUrl>
<AvatarUrl size="large">https://assets1-my.umbc.edu/system/shared/avatars/groups/000/000/008/0bfad113286cf6b1bc6dedbdbfc7e5ef/large.png?1441293069</AvatarUrl>
<AvatarUrl size="medium">https://assets1-my.umbc.edu/system/shared/avatars/groups/000/000/008/0bfad113286cf6b1bc6dedbdbfc7e5ef/medium.png?1441293069</AvatarUrl>
<AvatarUrl size="small">https://assets4-my.umbc.edu/system/shared/avatars/groups/000/000/008/0bfad113286cf6b1bc6dedbdbfc7e5ef/small.png?1441293069</AvatarUrl>
<AvatarUrl size="xsmall">https://assets2-my.umbc.edu/system/shared/avatars/groups/000/000/008/0bfad113286cf6b1bc6dedbdbfc7e5ef/xsmall.png?1441293069</AvatarUrl>
<AvatarUrl size="xxsmall">https://assets3-my.umbc.edu/system/shared/avatars/groups/000/000/008/0bfad113286cf6b1bc6dedbdbfc7e5ef/xxsmall.png?1441293069</AvatarUrl>
<Sponsor>Shriver Center:Intern, Co-op, Research &amp; Service-Learning</Sponsor>
<ThumbnailUrl size="xxlarge">https://assets3-my.umbc.edu/system/shared/thumbnails/news/000/027/820/32bb9f32e97807c36a1b1a881b31d33b/xxlarge.jpg?1366205768</ThumbnailUrl>
<ThumbnailUrl size="xlarge">https://assets3-my.umbc.edu/system/shared/thumbnails/news/000/027/820/32bb9f32e97807c36a1b1a881b31d33b/xlarge.jpg?1366205768</ThumbnailUrl>
<ThumbnailUrl size="large">https://assets4-my.umbc.edu/system/shared/thumbnails/news/000/027/820/32bb9f32e97807c36a1b1a881b31d33b/large.jpg?1366205768</ThumbnailUrl>
<ThumbnailUrl size="medium">https://assets4-my.umbc.edu/system/shared/thumbnails/news/000/027/820/32bb9f32e97807c36a1b1a881b31d33b/medium.jpg?1366205768</ThumbnailUrl>
<ThumbnailUrl size="small">https://assets1-my.umbc.edu/system/shared/thumbnails/news/000/027/820/32bb9f32e97807c36a1b1a881b31d33b/small.jpg?1366205768</ThumbnailUrl>
<ThumbnailUrl size="xsmall">https://assets3-my.umbc.edu/system/shared/thumbnails/news/000/027/820/32bb9f32e97807c36a1b1a881b31d33b/xsmall.jpg?1366205768</ThumbnailUrl>
<ThumbnailUrl size="xxsmall">https://assets2-my.umbc.edu/system/shared/thumbnails/news/000/027/820/32bb9f32e97807c36a1b1a881b31d33b/xxsmall.jpg?1366205768</ThumbnailUrl>
<PawCount>2</PawCount>
<CommentCount>0</CommentCount>
<CommentsAllowed>true</CommentsAllowed>
<PostedAt>Wed, 17 Apr 2013 09:36:37 -0400</PostedAt>
<EditAt>Wed, 17 Apr 2013 13:52:23 -0400</EditAt>
</NewsItem>

<NewsItem contentIssues="true" id="27822" important="false" status="posted" url="https://my3.my.umbc.edu/posts/27822">
<Title>Tackling Accessibility on The Web</Title>
<Body>
<![CDATA[
    <div class="html-content">
    <p>As browser capabilities continue to grow the websites that we are building are getting ever more complex. Fancy JavaScript UIs are great for showing off the latest technologies but they can cause a real problem for assistive technologies like screen readers.</p>
    <p>Unfortunately accessibility is one of those topics that often gets overlooked by a lot of developers. This makes me a little sad. If we want the web to remain a place that can be enjoyed by everyone, we need to be considering our users at both ends of the spectrum.</p>
    <p>In this article my aim is to show you just how easy it is to make your websites accessible.</p>
    <h2>Why Should You Care About Accessibility?</h2>
    <p>There are three main reasons why you should care about making your websites accessible.</p>
    <h3>#1 It’s the Right Thing To Do</h3>
    <p>This reason alone should be all you need to convince you that accessibility is worth the time and effort.</p>
    <p>Building accessible websites is just simply the right thing to do.</p>
    <p>As developers we enormous power to create anything that our minds can dream of. It’s our responsibility to make sure that the things that we create can be enjoyed by everyone, regardless of whether they might have a disability.</p>
    <h3>#2 You Will Become a Better At What You Do</h3>
    <p>Whether you are a programmer, designer, copywriter or any other web professional, having a focus on accessibility will help you to improve your skills.</p>
    <p>Lets look at the example of a programmer. Building accessible websites means that you need to write good, standards-compliant code. That point in itself has a lot of benefits outside of the realm of accessibility. Writing good code that complies with W3C and WHATWG standards means that it is going to be easier for others to understand, which is a big bonus if you work on a team with other programmers.</p>
    <p>The same benefits are present for designers. Having a conscious focus on accessibility will make you consider how your choice of color and layout will effect users that are color blind or suffer motor impairments (a loss or limitation of muscle control).</p>
    <p>In the fantastic documentary <a href="http://www.objectifiedfilm.com/" rel="nofollow external" class="bo">Objectified</a> industrial designer <a href="http://danformosa.com/" rel="nofollow external" class="bo">Dan Formosa</a> said something that has really stuck with me.</p>
    <blockquote>
    <p>What we really need to do to design is look at the extremes.</p>
    <p>The weakest, or the person with arthritis, or the athlete, or the strongest person.</p>
    <p>Because if we understand what the extremes are, the middle will take care of itself.</p>
    </blockquote>
    <p>That last line is particularly powerful. When we are designing we need to think about the power users. How can we make using our application easier for people that spend significant amounts of time using it? Keyboard shortcuts in GMail are a good example of designing for power users.</p>
    <p>We also need to think about people at the other end of the spectrum. What can we do to make our site easier to navigate for blind people that rely on screen readers? Will somebody that has trouble moving a mouse precisely be able to click that small button?</p>
    <p>Asking all these questions forces you to think more deeply about whatever it is that you are building. It develops your understanding of problems and expands your skills as a web professional.</p>
    <h3>#3 You May Be Required To By Law</h3>
    <hr>
    <p><strong>Disclaimer</strong>: I am not a lawyer and the following should not be taken as legal advice.</p>
    <hr>
    <p>In some countries there are laws that require certain organizations (usually government) to make all digital information accessible.</p>
    <p>Section 508 of the Rehabilitation Act in the United States requires that all Federal agencies make digital information accessible to everyone.</p>
    <p>The UK has a British Standard (BS8878) that makes recommendations on accessibility but there is no legal requirement for anyone to follow them.</p>
    <h2>An Introduction to Screen Readers</h2>
    <p>Before we dive into how you can make your website more accessible lets first take a look at one of the most common assistive technologies begin used, screen readers.</p>
    <p>If you’ve never used a screen reader before I definitely recommend that you get one installed on your computer (if it didn’t come with one) and give it a go. You will probably need to read the help documentation first so that you understand how to move around a web page.</p>
    <p>If you are a Mac user you should have <a href="http://www.apple.com/uk/accessibility/voiceover/" rel="nofollow external" class="bo">VoiceOver</a> already installed. You can fire it up in <em>System Preferences</em>.</p>
    <p>For Linux users the best screen reader I have used is <a href="https://live.gnome.org/Orca" rel="nofollow external" class="bo">ORCA</a>.</p>
    <p>Windows users should check out <a href="http://community.nvda-project.org/" rel="nofollow external" class="bo">NVDA</a>.</p>
    <p>You might be surprised at how difficult it is to navigate a website using the screen reader alone. I know that I was the first time I used one. Now imagine that every time you wanted to check your Facebook feed, post a tweet or do a simple web search you had to use a screen reader. It’s a bit of an eye-opener.</p>
    <p>Now that you’ve explored some of the reasons why you should care about accessibility, lets take a look at some practical tips for making your websites more accessible.</p>
    <h2>Semantic Markup and WAI-ARIA</h2>
    <p>Using the new semantic HTML elements such as <code>&lt;header&gt;</code>, <code>&lt;footer&gt;</code> and <code>&lt;article&gt;</code> can help computer programs to identify key areas of content on the page. This is because the HTML5 specification explicitly defines what types of content these elements should contain.</p>
    <p>The concept here is great, but as HTML5 is still evolving a lot of companies that develop assistive technologies have not yet implemented the new standard. This means that while the use of these new elements should make accessibility easier for developers, many of the tools on the market today simply don’t understand them.</p>
    <p>Before HTML5 came along there was an effort to give greater meaning to HTML markup through a standard called <a href="http://www.w3.org/TR/wai-aria" rel="nofollow external" class="bo">WAI-ARIA</a> (Accessible Rich Web Applications). This standard defines a number of <em>roles</em> that page elements can have. Some of these roles closely mirror the new HTML5 semantic elements (such as <em>article</em> and <em>main</em>) but there are a few unique ones too. HTML elements are assigned a role using a <code>role</code> attribute.</p>
    <pre>&lt;div role="article"&gt;...&lt;/div&gt;</pre>
    <p>If you want to learn more about WAI-ARIA check out this great article from Opera Software: <a href="http://dev.opera.com/articles/view/introduction-to-wai-aria/" rel="nofollow external" class="bo">Introduction to WAI-ARIA</a>.</p>
    <p>Even though a lot of screen readers don’t currently understand the new semantic elements I personally think that using them is a better approach than WAI-ARIA.</p>
    <hr>
    <p><strong>Note:</strong> The W3C is working on some guidelines for <a href="http://www.w3.org/TR/aria-in-html/" rel="nofollow external" class="bo">using WAI-ARIA in HTML5</a>.</p>
    <hr>
    <h2>Making Web Forms Accessible</h2>
    <p>There a couple of key things that you can do to make your web forms accessible. In this article I am going to focus on the proper use of labels and the <code>tabindex</code> attribute.</p>
    <h3>Using Labels</h3>
    <p>Labels are really important for users that rely on screen readers for navigating the web. Without them it can be really difficult for these users to fill in your web forms.</p>
    <p>Simply adding labels to your form isn’t quite good enough. You need to make sure that you are properly assigning each label to it’s corresponding input element(s).</p>
    <p>To do this you need to first give your <code>&lt;input&gt;</code> element an ID. You then add a <code>for</code> attribute to your <code>&lt;label&gt;</code> element and set its value to the ID that you just gave your input. An example of this can be found below.</p>
    <pre>&lt;label for="name"&gt;Name:&lt;/label&gt;&#x000A;    &lt;input type="text" name="name" id="name"&gt;</pre>
    <p>An added benefit of assigning labels to inputs is that the area taken up by the label becomes a clickable target for the input. So if you click the label the input will gain focus, or if it is a checkbox or radio button it will toggle the input state. This is really useful for users with motor impairments that might not be able to accurately target small form controls.</p>
    <h3>Using The tabindex Attribute</h3>
    <p>The <code>tabindex</code> attribute gives you a way of specifying the order in which inputs should be focused when the tab key is being used to navigate through a web form.</p>
    <p>The default order that inputs are focused is determined by the placement of the <code>&lt;input&gt;</code> elements in the HTML markup. If you want to change this order for any reason you should specify the <code>tabindex</code> on all of the <code>&lt;input&gt;</code> elements in the form. Passing in a value between 1 and <em>n</em> (where <em>n</em> is the total number of input elements).</p>
    <pre>&lt;label for="name"&gt;Name:&lt;/label&gt;&#x000A;    &lt;input type="text" name="name" id="name" tabindex="1"&gt;&#x000A;    &#x000A;    &lt;label for="email"&gt;Email:&lt;/label&gt;&#x000A;    &lt;input type="email" name="email" id="email" tabindex="3"&gt;&#x000A;    &#x000A;    &lt;label for="phone"&gt;Phone:&lt;/label&gt;&#x000A;    &lt;input type="tel" name="phone" id="phone" tabindex="2"&gt;</pre>
    <p>In the example above the focus order will move from the name input to the phone input and then finally to the email input.</p>
    <p>If you have a web form with a slightly irregular layout, manipulating the focus order can really help users relying on assistive technologies.</p>
    <h2>Accessible Images</h2>
    <p>To make your images accessible you need to ensure that you add a detailed description of the image in the <code>alt</code> attribute. When a screen reader encounters an image, this is the text that it will read to the user.</p>
    <pre><code>&lt;img src="cows.jpg" alt="Cows grazing in a field on a sunny day."&gt;&#x000A;    </code></pre>
    <p>You should be able to build up a mental picture of the image by reading the <code>alt</code> text alone.</p>
    <h2>Creating Accessible Links</h2>
    <p>There are two accessibility considerations to make when creating links. The first is to think about the anchor text that will become the clickable link. This text should make sense if it was taken out of the context of the page. ‘Click here’ is a really bad example of anchor text.</p>
    <p>The second consideration is the use of a <code>title</code> attribute. This can be used to add a description of the page that you are linking to. This description will then be displayed in a tool-tip when the user hovers their mouse over the link and may also be read aloud by a screen reader.</p>
    <pre>&lt;a href="<a href="http://teamtreehouse.com">http://teamtreehouse.com</a>" title="Learn how to use HTML, CSS and JavaScript to create websites by watching videos on TeamTreehouse.com"&gt;Learn to build websites with Treehouse&lt;/a&gt;</pre>
    <h2>Tackling Tables</h2>
    <p>Tables can be tricky to understand for assistive technologies. In this section you are going to learn about two techniques you can use to give your tables greater meaning.</p>
    <h3>Adding Captions</h3>
    <p>The <code>&lt;caption&gt;</code> element can be used to add a description of the data in the table. This should be placed directly after the opening tag of the <code>&lt;table&gt;</code> element.</p>
    <pre>&lt;table&gt;&#x000A;      &lt;caption&gt;&#x000A;        Table 1.1 shows the exam scores of 120 pupils in the Physics exam.&#x000A;      &lt;/caption&gt;&#x000A;      ...&#x000A;    &lt;/table&gt;</pre>
    <p>Captions will be displayed on the page so you will probably want to style them using CSS.</p>
    <p>Screen readers will read the caption aloud before continuing on to the data. This helps to give the user more context around the data in the table.</p>
    <h3>Scoped Table Headers</h3>
    <p>It is important to use table headers (<code>&lt;th&gt;</code> elements) to markup row or column headings in your tables. You can however go one step further and use the <code>scope</code> attribute to define whether the heading refers to the data in the column or in the row. This is done by setting the <code>scope</code> attributes value to either <code>col</code> or <code>row</code>.</p>
    <p>For example, if you were marking up a restaurant menu you might use table headings scoped to the column for the column headings in the first row, and table headings scoped to the row for the title of each individual menu item. This is because the name of each menu item is associated with the price of that item. Here is some HTML markup to demonstrate this.</p>
    <pre>&lt;table&gt;&#x000A;      &lt;thead&gt;&#x000A;        &lt;tr&gt;&#x000A;          &lt;th scope="col"&gt;Menu Item&lt;/th&gt;&#x000A;          &lt;th scope="col"&gt;Price&lt;/th&gt;&#x000A;        &lt;/tr&gt;&#x000A;      &lt;/thead&gt;&#x000A;      &lt;tbody&gt;&#x000A;        &lt;tr&gt;&#x000A;          &lt;th scope="row"&gt;Scrambled Egg with Salmon&lt;/th&gt;&#x000A;          &lt;td&gt;$3.50&lt;/td&gt;&#x000A;        &lt;/tr&gt;&#x000A;        ...&#x000A;      &lt;/tbody&gt;&#x000A;    &lt;/table&gt;</pre>
    <p>Defining scopes on table headers makes it much easier for computer programs to understand the relationships between data in your tables.</p>
    <h2>Tools for Testing Accessibility</h2>
    <p>Now that you’ve picked up some tips on how to make your websites more accessible lets take a look through some tools that you can use to test your websites.</p>
    <h3>Screen Readers</h3>
    <div>
    <a href="http://blog.teamtreehouse.com/wp-content/uploads/2013/04/accessiblity-voiceover-treehouse.png" rel="nofollow external" class="bo"><img alt="Using VoiceOver on the Treehouse Homepage" src="http://blog.teamtreehouse.com/wp-content/uploads/2013/04/accessiblity-voiceover-treehouse-1024x616.png" width="584" height="351" style="max-width: 100%; height: auto;"></a><p>Using VoiceOver on the Treehouse Homepage</p>
    </div>
    <p>The best way of testing for accessibility is to utilize the tools that your users will be using. Use a screen reader to navigate your website and identify areas that are difficult to access. Could you move some of your markup around so that the main navigation is encountered sooner by the screen reader?</p>
    <h3>Web Accessibility Evaluation Tool (WAVE)</h3>
    <div>
    <a href="http://blog.teamtreehouse.com/wp-content/uploads/2013/04/accessibility-wave.png" rel="nofollow external" class="bo"><img alt="Using WAVE to Identify Accessibility Issues" src="http://blog.teamtreehouse.com/wp-content/uploads/2013/04/accessibility-wave-1024x617.png" width="584" height="351" style="max-width: 100%; height: auto;"></a><p>Using WAVE to Identify Accessibility Issues</p>
    </div>
    <p><a href="http://wave.webaim.org/" rel="nofollow external" class="bo">WAVE</a> is a really useful tool for identifying issues in your websites. The tool works in a similar way to the W3C HTML validator. You pass in a URL to your web page and it then analyzes the page against a list of common accessibility issues. WAVE gives you recommendations around page structure, navigation, the correct use of elements (and attributes) as well as much more.</p>
    <h3>Spur</h3>
    <div>
    <a href="http://blog.teamtreehouse.com/wp-content/uploads/2013/04/accessibility-spur-treehouse.png" rel="nofollow external" class="bo"><img alt="Using Spur to See The Treehouse Website in Greyscale" src="http://blog.teamtreehouse.com/wp-content/uploads/2013/04/accessibility-spur-treehouse-1024x616.png" width="584" height="351" style="max-width: 100%; height: auto;"></a><p>Using Spur to See The Treehouse Website in Greyscale</p>
    </div>
    <p><a href="http://www.spurapp.com" rel="nofollow external" class="bo">Spur</a> is a great web application for testing the visual design of your websites. It allows you to apply a variety of effects – such as greyscale, high contrast and blur – to a snapshot of your website. These effects can be really useful for evaluating the use of color in your designs.</p>
    <h3>Color Oracle</h3>
    <div>
    <a href="http://blog.teamtreehouse.com/wp-content/uploads/2013/04/accessibility-color-oracle.png" rel="nofollow external" class="bo"><img alt="Using Color Oracle To Simulate Color Blindness" src="http://blog.teamtreehouse.com/wp-content/uploads/2013/04/accessibility-color-oracle-1024x616.png" width="584" height="351" style="max-width: 100%; height: auto;"></a><p>Using Color Oracle To Simulate Color Blindness</p>
    </div>
    <p><a href="http://colororacle.org/" rel="nofollow external" class="bo">Color Oracle</a> is another great tool for testing the colors used in your web page designs. This tool replicates a number of types of color blindness, such as <em>Deuteranopia</em>, <em>Protanopia</em> and <em>Tritanopia</em>. It can be really useful for identifying areas in your designs that may need to adjusted to better cater to color blind users.</p>
    <h2>Summary</h2>
    <p>In this article you’ve taken a look at some of the techniques and tools that you can use to make your websites more accessible. However there are some things that we haven’t covered. I recommend that you check out the W3C <a href="http://www.w3.org/WAI/" rel="nofollow external" class="bo">Web Accessibility Initiativee</a> for more information on what you can do to make your websites accessible to everyone.</p>
    <p>I’m interested to hear about your experiences when dealing with accessibility. Share your thoughts in the comments below.</p>
    <p>The post <a href="http://blog.teamtreehouse.com/tackling-accessibility-on-the-web" rel="nofollow external" class="bo">Tackling Accessibility on The Web</a> appeared first on <a href="http://blog.teamtreehouse.com" rel="nofollow external" class="bo">Treehouse Blog</a>.</p>
    </div>
]]>
</Body>
<Summary>As browser capabilities continue to grow the websites that we are building are getting ever more complex. Fancy JavaScript UIs are great for showing off the latest technologies but they can cause...</Summary>
<Website>http://feedproxy.google.com/~r/teamtreehouse/~3/xJynBdaSJzo/tackling-accessibility-on-the-web</Website>
<TrackingUrl>https://my3.my.umbc.edu/api/v0/pixel/news/27822/guest@my.umbc.edu/4234246ea23683178b2d4bc09a152dcc/api/pixel</TrackingUrl>
<Tag>accessibility</Tag>
<Tag>android</Tag>
<Tag>css</Tag>
<Tag>design</Tag>
<Tag>development</Tag>
<Tag>html</Tag>
<Tag>html-and-xhtml</Tag>
<Tag>html5</Tag>
<Tag>ios</Tag>
<Tag>javascript</Tag>
<Tag>learn-to-code</Tag>
<Tag>responsive</Tag>
<Tag>web</Tag>
<Group token="retired-583">Web Developer - Build Group</Group>
<GroupUrl>https://my3.my.umbc.edu/groups/retired-583</GroupUrl>
<AvatarUrl>https://assets3-my.umbc.edu/system/shared/avatars/groups/000/000/583/fc60f5d7abc2e080599bb6dc465db54d/xsmall.png?1363101197</AvatarUrl>
<AvatarUrl size="original">https://assets4-my.umbc.edu/system/shared/avatars/groups/000/000/583/fc60f5d7abc2e080599bb6dc465db54d/original.jpg?1363101197</AvatarUrl>
<AvatarUrl size="xxlarge">https://assets4-my.umbc.edu/system/shared/avatars/groups/000/000/583/fc60f5d7abc2e080599bb6dc465db54d/xxlarge.png?1363101197</AvatarUrl>
<AvatarUrl size="xlarge">https://assets4-my.umbc.edu/system/shared/avatars/groups/000/000/583/fc60f5d7abc2e080599bb6dc465db54d/xlarge.png?1363101197</AvatarUrl>
<AvatarUrl size="large">https://assets3-my.umbc.edu/system/shared/avatars/groups/000/000/583/fc60f5d7abc2e080599bb6dc465db54d/large.png?1363101197</AvatarUrl>
<AvatarUrl size="medium">https://assets3-my.umbc.edu/system/shared/avatars/groups/000/000/583/fc60f5d7abc2e080599bb6dc465db54d/medium.png?1363101197</AvatarUrl>
<AvatarUrl size="small">https://assets4-my.umbc.edu/system/shared/avatars/groups/000/000/583/fc60f5d7abc2e080599bb6dc465db54d/small.png?1363101197</AvatarUrl>
<AvatarUrl size="xsmall">https://assets3-my.umbc.edu/system/shared/avatars/groups/000/000/583/fc60f5d7abc2e080599bb6dc465db54d/xsmall.png?1363101197</AvatarUrl>
<AvatarUrl size="xxsmall">https://assets4-my.umbc.edu/system/shared/avatars/groups/000/000/583/fc60f5d7abc2e080599bb6dc465db54d/xxsmall.png?1363101197</AvatarUrl>
<Sponsor>Web Developer - Build Group</Sponsor>
<PawCount>0</PawCount>
<CommentCount>0</CommentCount>
<CommentsAllowed>true</CommentsAllowed>
<PostedAt>Wed, 17 Apr 2013 09:30:16 -0400</PostedAt>
</NewsItem>

<NewsItem contentIssues="true" id="27885" important="false" status="posted" url="https://my3.my.umbc.edu/posts/27885">
<Title>WebRTC video-chat embed unveiled</Title>
<Body>
<![CDATA[
    <div class="html-content">Fresh Tilled Soil unleashes the power of modern web standards<div><table border="0"><tbody><tr><td>
    <a href="http://share.feedsportal.com/share/twitter/?u=http%3A%2F%2Fwww.netmagazine.com%2Fnews%2Fwebrtc-video-chat-embed-unveiled-132691&amp;t=WebRTC+video-chat+embed+unveiled" rel="nofollow external" class="bo"><img src="http://res3.feedsportal.com/social/twitter.png" style="max-width: 100%; height: auto;"></a> <a href="http://share.feedsportal.com/share/facebook/?u=http%3A%2F%2Fwww.netmagazine.com%2Fnews%2Fwebrtc-video-chat-embed-unveiled-132691&amp;t=WebRTC+video-chat+embed+unveiled" rel="nofollow external" class="bo"><img src="http://res3.feedsportal.com/social/facebook.png" style="max-width: 100%; height: auto;"></a> <a href="http://share.feedsportal.com/share/linkedin/?u=http%3A%2F%2Fwww.netmagazine.com%2Fnews%2Fwebrtc-video-chat-embed-unveiled-132691&amp;t=WebRTC+video-chat+embed+unveiled" rel="nofollow external" class="bo"><img src="http://res3.feedsportal.com/social/linkedin.png" style="max-width: 100%; height: auto;"></a> <a href="http://share.feedsportal.com/share/gplus/?u=http%3A%2F%2Fwww.netmagazine.com%2Fnews%2Fwebrtc-video-chat-embed-unveiled-132691&amp;t=WebRTC+video-chat+embed+unveiled" rel="nofollow external" class="bo"><img src="http://res3.feedsportal.com/social/googleplus.png" style="max-width: 100%; height: auto;"></a> <a href="http://share.feedsportal.com/share/email/?u=http%3A%2F%2Fwww.netmagazine.com%2Fnews%2Fwebrtc-video-chat-embed-unveiled-132691&amp;t=WebRTC+video-chat+embed+unveiled" rel="nofollow external" class="bo"><img src="http://res3.feedsportal.com/social/email.png" style="max-width: 100%; height: auto;"></a>
    </td></tr></tbody></table></div>
    </div>
]]>
</Body>
<Summary>Fresh Tilled Soil unleashes the power of modern web standards     </Summary>
<Website>http://feedproxy.google.com/~r/net/topstories/~3/PWT3imVnsEw/story01.htm</Website>
<TrackingUrl>https://my3.my.umbc.edu/api/v0/pixel/news/27885/guest@my.umbc.edu/511942b15e1250e2067cd384850da447/api/pixel</TrackingUrl>
<Tag>css</Tag>
<Tag>development</Tag>
<Tag>html</Tag>
<Tag>javascript</Tag>
<Tag>mysql</Tag>
<Tag>net</Tag>
<Tag>php</Tag>
<Tag>sql</Tag>
<Tag>web</Tag>
<Group token="retired-583">Web Developer - Build Group</Group>
<GroupUrl>https://my3.my.umbc.edu/groups/retired-583</GroupUrl>
<AvatarUrl>https://assets3-my.umbc.edu/system/shared/avatars/groups/000/000/583/fc60f5d7abc2e080599bb6dc465db54d/xsmall.png?1363101197</AvatarUrl>
<AvatarUrl size="original">https://assets4-my.umbc.edu/system/shared/avatars/groups/000/000/583/fc60f5d7abc2e080599bb6dc465db54d/original.jpg?1363101197</AvatarUrl>
<AvatarUrl size="xxlarge">https://assets4-my.umbc.edu/system/shared/avatars/groups/000/000/583/fc60f5d7abc2e080599bb6dc465db54d/xxlarge.png?1363101197</AvatarUrl>
<AvatarUrl size="xlarge">https://assets4-my.umbc.edu/system/shared/avatars/groups/000/000/583/fc60f5d7abc2e080599bb6dc465db54d/xlarge.png?1363101197</AvatarUrl>
<AvatarUrl size="large">https://assets3-my.umbc.edu/system/shared/avatars/groups/000/000/583/fc60f5d7abc2e080599bb6dc465db54d/large.png?1363101197</AvatarUrl>
<AvatarUrl size="medium">https://assets3-my.umbc.edu/system/shared/avatars/groups/000/000/583/fc60f5d7abc2e080599bb6dc465db54d/medium.png?1363101197</AvatarUrl>
<AvatarUrl size="small">https://assets4-my.umbc.edu/system/shared/avatars/groups/000/000/583/fc60f5d7abc2e080599bb6dc465db54d/small.png?1363101197</AvatarUrl>
<AvatarUrl size="xsmall">https://assets3-my.umbc.edu/system/shared/avatars/groups/000/000/583/fc60f5d7abc2e080599bb6dc465db54d/xsmall.png?1363101197</AvatarUrl>
<AvatarUrl size="xxsmall">https://assets4-my.umbc.edu/system/shared/avatars/groups/000/000/583/fc60f5d7abc2e080599bb6dc465db54d/xxsmall.png?1363101197</AvatarUrl>
<Sponsor>Web Developer - Build Group</Sponsor>
<PawCount>0</PawCount>
<CommentCount>0</CommentCount>
<CommentsAllowed>true</CommentsAllowed>
<PostedAt>Wed, 17 Apr 2013 08:35:07 -0400</PostedAt>
</NewsItem>

<NewsItem contentIssues="true" id="27826" important="false" status="posted" url="https://my3.my.umbc.edu/posts/27826">
<Title>Complex, Yet Simple: Making Sense Of Type Classification (Part 1)</Title>
<Body>
<![CDATA[
    <div class="html-content">
    <table width="650">
    <tbody>
    <tr>
    <td>
    <div>
    <img src="http://statisches.auslieferung.commindo-media-ressourcen.de/advertisement.gif" alt="" style="max-width: 100%; height: auto;"><br><a href="http://auslieferung.commindo-media-ressourcen.de/random.php?mode=target&amp;collection=smashing-rss&amp;position=1" rel="nofollow external" class="bo"><img src="http://auslieferung.commindo-media-ressourcen.de/random.php?mode=image&amp;collection=smashing-rss&amp;position=1" alt="" style="max-width: 100%; height: auto;"></a> <a href="http://auslieferung.commindo-media-ressourcen.de/random.php?mode=target&amp;collection=smashing-rss&amp;position=2" rel="nofollow external" class="bo"><img src="http://auslieferung.commindo-media-ressourcen.de/random.php?mode=image&amp;collection=smashing-rss&amp;position=2" alt="" style="max-width: 100%; height: auto;"></a> <a href="http://auslieferung.commindo-media-ressourcen.de/random.php?mode=target&amp;collection=smashing-rss&amp;position=3" rel="nofollow external" class="bo"><img src="http://auslieferung.commindo-media-ressourcen.de/random.php?mode=image&amp;collection=smashing-rss&amp;position=3" alt="" style="max-width: 100%; height: auto;"></a>
    </div>
    </td>
    </tr>
    </tbody>
    </table>
    <p>In my previous article on Smashing Magazine (“<a href="http://www.smashingmagazine.com/2013/01/17/understanding-difference-between-type-and-lettering/" rel="nofollow external" class="bo">Understanding the Difference Between Typography and Lettering</a>”), I wrote about how understanding type terminology can help us better appreciate the arts of typography and lettering. This article again deals with terminology, probably more specifically than most designers are used to, and the title gets to the heart of what I’m communicating in this article.</p>
    <p>Everyone knows their serifs and sans, slabs and scripts, but most classifications go much deeper than that. Type classification, while helpful, is often convoluted, confusing and even controversial. This article, distilling some of the complexities into a more understandable format, lands somewhere in the middle between the basics and genuine type nerdery — <strong>the perfect level for a practicing designer</strong>.</p>
    <p><img alt="Making Sense of Type Classification" src="http://media.smashingmagazine.com/wp-content/uploads/2013/04/featured.jpg" width="500" height="350" style="max-width: 100%; height: auto;"></p>
    <h3>Why Classify Type?</h3>
    <p>There’s a certain intellectual delight in knowledge, particularly knowledge about one’s field of work and study. More importantly, perhaps, there is a way in which seemingly impractical knowledge of one’s profession lends more credence to the designer. That being said, what you’ll read here is by no means impractical. It really comes down to solid design choices.</p>
    <p><a href="http://www.marksimonson.com/notebook/view/the-artist-vs-the-lettering-artist" rel="nofollow external" class="bo"><img src="http://media.smashingmagazine.com/wp-content/uploads/2013/04/Artist-14-opt.jpg" alt="Artist-14-opt" width="500" height="324" style="max-width: 100%; height: auto;"></a><br><em>Sets film in 1920′s uses typeface from 1975.</em></p>
    <p>A good grasp of type history will help you avoid typographic anachronisms, which, although often lost on the general public, do not escape the notice of many designers, as demonstrated in <a href="http://www.marksimonson.com/notebook/view/the-artist-vs-the-lettering-artist" rel="nofollow external" class="bo">Mark Simonson’s article</a> on the 2012 Oscar winner for Best Picture, “The Artist,” and his <a href="http://www.marksimonson.com/notebook/category/son-of-typecasting" rel="nofollow external" class="bo">other typographic scrutinies</a> of popular movies and media.</p>
    <p>It’s not exclusively about the history of type, however. Type classification <strong>is also helpful in pairing typefaces for projects</strong>, sometimes based on historical proximity but also by noting similar features that unify the typefaces, such as axis or x-height. In some cases, by finding enough disparity in the small features, very different typefaces become complementary.</p>
    <p>Most importantly, perhaps, this article will not only familiarize you with general type history and commonly used terminology, but also help you learn to look for and recognize important characteristics of type and the inexhaustible minutiae that make typefaces unique, as well as arm you with useful descriptors of type styles.</p>
    <h3>Type Classification Systems</h3>
    <p>Over the past century, quite a few classification systems have been proposed. Most are generally believed to be subjective and incomplete, and many of them use the same terms for similar but slightly different classes. The impossibility of a truly complete classification system has led many people to dismiss any attempt to classify typefaces — there are simply too many variables to make anything close to a practical, comprehensive system. Essentially, <strong>classification describes typefaces; it does not define them</strong>. It’s not inflexible, and is more of an aid than a rule. However, for the reasons given above, I believe there is value to be found in it. Below are a few examples.</p>
    <p>The primary “official” classification system currently is the <strong>Vox-ATypI system</strong>. Originally put together in 1954 by Maxmilien Vox, it was adopted in 1962 by the Association Typographique Internationale (ATypI), which made a minor change at the 2010 conference (appropriately, held in Dublin) to include Gaelic as an extra category. It classifies typefaces in 11 general categories, with some subdivision. Its Wikipedia article <a href="http://en.wikipedia.org/wiki/VOX-ATypI_classification" rel="nofollow external" class="bo">provides an excellent overview</a>.</p>
    <p>The <a href="http://luc.devroye.org/britishstandards.html" rel="nofollow external" class="bo">British Standards Classification of Typefaces</a>, adopted in 1967, is also based on Vox’s original classification. It is slightly simplified and has remained essentially unchanged since its adoption.</p>
    <p>Bringhurst, in his <a href="http://en.wikipedia.org/wiki/The_Elements_of_Typographic_Style" rel="nofollow external" class="bo">Elements of Typographic Style</a> — perhaps the standard in typographic textbooks today — categorizes typefaces loosely after periods of art history; for example, Baroque, Rococo, Romantic, etc. A book designer himself, Bringhurst focuses on text typefaces and practically ignores display type.</p>
    <p>Others are much more general. An early <a href="http://en.wikipedia.org/wiki/Thibaudeau_classification" rel="nofollow external" class="bo">system by French typographer Francis Thibaudeau</a>, which provided the base for Vox’s later more thorough classification, includes four broad categories: Antiques (sans serifs), Égyptiennes (slab serifs), Didots and Elzévirs (faces with triangular serifs).</p>
    <p>Gerrit Noordzij, while at the Royal Academy of Fine Arts in the Hague, held that typography was essentially an <a href="http://en.wikipedia.org/wiki/Gerrit_Noordzij#The_stroke_of_the_pen" rel="nofollow external" class="bo">extension of handwriting</a>, teaching typography using loose categories of letters that might be written with a broad-nib or pointed-nib pen, as well as interrupted or uninterrupted strokes, with varieties of both serifs and sans falling into each category.</p>
    <p>These are just a few of the ways people have classified type over the years. <strong>In this two-part article, I will condense the various methods slightly</strong> and present what is at the very least generally accepted as legitimate (as there will always be a few out there who refuse to give up a particularly unusual classification method, or who decry any method at all).</p>
    <h3>Classifying Serif Typefaces</h3>
    <p>In part 1 here, we’ll cover serif styles, following the natural progression of type history, and thus move into sans and other categories in part 2.</p>
    <h4>Humanist</h4>
    <p>Starting off, naturally, at the beginning of type history, we’re in the middle 1400s, during the Renaissance. The movement, led by Italian cultural hubs such as Florence and Venice, was drawing Europe away from medieval practices, and typography was one part of that. Rather than using the blackletter, or Fraktur type, that Gutenberg used, printers began to create type mimicking the Latin writing hand of the philosophers and scribes of the time, beginning around 1465.</p>
    <p><img alt="Renaissance Printing" src="http://media.smashingmagazine.com/wp-content/uploads/2013/04/rennaissance.jpg" width="500" height="354" style="max-width: 100%; height: auto;"><br>
    <em>A 1905 textbook illustration of Renaissance printers</em></p>
    <p>These typefaces are variously called Humanist or Venetian due to the zeitgeist and geography of the Renaissance. A number of distinct characteristics define Humanist typefaces.</p>
    <p>Primarily, <strong>Humanist faces were very calligraphic in nature</strong>, and one way this manifested itself was in the strong axis, most apparent in the bowls of characters and the lowercase “o,” a characteristic borrowed from the angle at which a right-handed writer holds a pen. Another interesting way this showed itself was in the notably angled crossbar on the lowercase “e.” Other calligraphic influences are clear, such as inconsistencies in stroke weight and the way serifs are formed.</p>
    <p>Other defining characteristics include a small x-height and a lower contrast between thick and thin strokes.</p>
    <p><img alt="Venetian Typeface Characteristics" src="http://media.smashingmagazine.com/wp-content/uploads/2013/04/venetian1.jpg" width="500" height="350" style="max-width: 100%; height: auto;"></p>
    <p>Not all Humanist typefaces are from the Renaissance era, however; many Humanist revivals have been created in more recent years, such as Centaur (1914) and Adobe Jenson (1996). Adobe Jenson, used in the specimen above, is based on the work of Renaissance printer Nicolas Jenson, a prominent printer and type designer who moved from his native France to Venice and contributed significantly to print and design history. There are even Humanist sans faces, but we’ll get to those in part 2. Although an influential period in type history, the Humanist era served primarily as a transition to newer styles of typefaces and was relatively brief.</p>
    <p>Other examples of Humanist typefaces include Guardi, Arno, ITC Berkeley and Stempel Schneidler.</p>
    <h4>Garalde</h4>
    <p>In the <strong>Old-Style faces</strong>, often called Garaldes, we see type really beginning to come into its own. I call them Garaldes here because the term “Old Style” is at times used to include Humanist, Garalde and Transitional typefaces; simply calling this group “Garalde” helps to retain its identity.</p>
    <p><img alt="Aldus Manutius and Claude Garamont" src="http://media.smashingmagazine.com/wp-content/uploads/2013/04/garalde1.jpg" width="500" height="350" style="max-width: 100%; height: auto;"><br>
    <em>Aldus Manutius and Claude Garamont</em></p>
    <p>This period in type history lasts from the late-15th century all the way until the early 1700s, and the type created in this period has shown remarkable longevity. “Garalde” itself is a hybrid term borrowed from the names of two notable type designers of the era, French punchcutter Claude Garamont and the Venetian Aldus Manutius. The category is occasionally called “Aldine” after Manutius.</p>
    <p>There are many similarities to the Humanist faces, but things are moving in a particular direction, as we’ll see with the consecutive categories of Transitional and Didone. You can see the type designers treating type as different from the written word, losing some of the idiosyncrasies of handwriting that the Humanist designers retained, while carrying over others. The axis of the stress straightens, and while it still has an angle, it is subtler. <strong>The serifs become more carefully formed, and characters are designed more proportionately.</strong> One of the most obvious differences is the crossbar of the lowercase “e,” which, while remaining angled in the Humanist typefaces, drops to a horizontal position in the Garaldes. Also, the difference between heavy and light stroke weights increased, and everything became more precise, perhaps due to the progress in technical aspects of making type.</p>
    <p><img alt="Old Style Typeface Characteristics" src="http://media.smashingmagazine.com/wp-content/uploads/2013/04/oldstyle1.jpg" width="500" height="350" style="max-width: 100%; height: auto;"></p>
    <p>A huge amount of type was created in this era, and much of it is commonly used today, either digitized versions or new revivals. Common examples of the Garalde faces include Caslon, Sabon, Palatino, Galliard and Janson — not to be confused with Jenson, the Humanist typeface. In fact, Janson, named after Dutch punchcutter Anton Janson, is now thought to be the work of Miklós Kis, a Hungarian, produced during an apprenticeship in Amsterdam.</p>
    <h4>Transitional</h4>
    <p>Work was begun on the first Transitional typeface in 1692, long before people had left behind making Garaldes. In fact, William Caslon was creating typefaces based on Old-Style Dutch type as late as the 1720s. Because this part of type history is also significant, <strong>many have asserted that “Transitional” is an inadequate name for it</strong>, and this category may also be termed Neoclassical or Realist.</p>
    <p><img alt="Louis XIV and the Romain du Roi" src="http://media.smashingmagazine.com/wp-content/uploads/2013/04/louis+romain.jpg" width="500" height="350" style="max-width: 100%; height: auto;"><br>
    <em>Louis XIV and the Romain du Roi</em></p>
    <p>In the late-17th century, Louis XIV, as part of a general renovation of France’s Imprimerie Royale (the governmental printing works), commissioned the French Academy of Sciences to create a new typeface. The Romain du Roi — literally <strong>the “King’s Roman”</strong> — was designed using a strict grid, and its development was an arduous process, involving a committee that included a mathematician and an engineer. Although commissioned in 1692, the entire family of 86 fonts was not completed until 1745.</p>
    <p><img alt="Baskerville and Fournier" src="http://media.smashingmagazine.com/wp-content/uploads/2013/04/baskerville+fournier.jpg" width="500" height="350" style="max-width: 100%; height: auto;"><br>
    <em>John Baskerville (left) and Pierre Simon Fournier (right)</em></p>
    <p>Two of the biggest names in type during this period were <strong>John Baskerville and Pierre Simon Fournier</strong>. Baskerville, an entrepreneur who dabbled in multiple businesses, developed quite an interest in printing and eventually designed his own type in order to improve on Caslon’s work. This did not please most of the printing world at the time, and Baskerville endured harsh criticism, despite having such luminaries as Benjamin Franklin as friends and advocates of his work. You may have read of the <a href="http://www.mcsweeneys.net/articles/caslon-baskerville-and-franklin-revolutionary-types" rel="nofollow external" class="bo">humorous encounter</a> in which Franklin outwitted a critic of Baskerville. Numerous revivals, both metal and digital type, that draw on Baskerville have been made.</p>
    <p>Fournier was among the printers who praised Baskerville’s type, reserving particularly high compliments for his italics. Fournier was highly respected in his lifetime, and despite having consulted royalty both within France and internationally on type design and having established printing houses, Fournier is primarily remembered today for introducing the point system as a way to measure type sizes. Pierre Fournier, uncannily sharing a name with an acclaimed 20th-century cellist, also had an interest in music and developed a new style of typography for musical notation.</p>
    <p><img alt="Transitional Type Characteristics" src="http://media.smashingmagazine.com/wp-content/uploads/2013/04/transitional1.jpg" width="500" height="350" style="max-width: 100%; height: auto;"></p>
    <p>In the Transitionals (or Neoclassicals), we see certain trends continuing. The axis is now nearly, if not completely, vertical. The weight difference between the thickest and thinnest points is now exaggerated. The serifs are less bracketed and flatten out. <strong>Details become very refined.</strong></p>
    <p>Eric Gill’s Joanna, Melior, Clearface and Mrs. Eaves — a Baskerville revival named after Sarah Eaves, Baskerville’s wife — all fall into this category.</p>
    <h4>Didone</h4>
    <p>As strange as it seems, what we call modern typefaces first appeared in the second half of the 1700s. Therefore, I will call them by their less absurd name — and who can argue that saying “Didone” is not more fun than saying simply “Modern”? Bringhurst terms them Romantics.</p>
    <p>Through the 18th and 19th centuries, <strong>France witnessed a small printing dynasty in the Didot family</strong>. Over multiple generations, the family made major contributions to printing. One of the most remarkable members was Firmin Didot, who, with Giambattista Bodoni, ushered in and now acts as a namesake for this part of type history.</p>
    <p><img alt="F. Didot and G. Bodoni" src="http://media.smashingmagazine.com/wp-content/uploads/2013/04/didot+bodoni.jpg" width="500" height="350" style="max-width: 100%; height: auto;"><br>
    <em>Firmin Didot (left) and Giambattista Bodoni (right)</em></p>
    <p>In large part inspired by Baskerville, <strong>Didot and Bodoni pushed the limits of type design.</strong> They explored a similar style and were both meticulous craftsmen, consequently igniting a fierce rivalry. Bodoni (1740–1813) gave himself entirely to his craft. He was renowned for the beauty of his type specimens, and, a technically brilliant punchcutter himself, he designed some 298 typefaces. Didot (1764–1836), on the other hand, retired in 1827 to pursue political office and literature in his later years, writing tragedies and literary critiques.</p>
    <p>If Baskerville’s stroke contrast was exaggerated, then the Didones’ are in the extreme. The heavy strokes are very heavy, and the light are a hairline. The stress is again completely vertical, and the apertures — places where the character opens — are generally very tight. Combined, these make for a very awkward visual rhythm, and Didones are always a poor choice for chunks of text. Rather, they work best at large sizes, as titling and display type, because the features emphasize the elegance of individual characters and do not blend well. Adobe’s <a href="http://www.myfonts.com/fonts/adobe/new-caledonia/" rel="nofollow external" class="bo">New Caledonia</a>, which softens some extremes and thus works for longer bits of text, is a possible exception.</p>
    <p><img alt="Didone Characteristics" src="http://media.smashingmagazine.com/wp-content/uploads/2013/04/modern1.jpg" width="500" height="350" style="max-width: 100%; height: auto;"></p>
    <p>Aside from the obvious Bodoni and Didot faces, in their dozens of variants from nearly every foundry, Basilia, Aviano, Walbaum, Ambroise and Scotch Roman are exemplary moderns.</p>
    <h4>Slab Serif</h4>
    <p><img alt="Slab Serif Characteristics" src="http://media.smashingmagazine.com/wp-content/uploads/2013/04/slab1.jpg" width="500" height="350" style="max-width: 100%; height: auto;"></p>
    <p>This article wouldn’t be complete without a mention of slab serifs. These are among the easiest to identify because of their very obvious appearance. Originally created for advertising, posters and other large media, slab serifs, alternatively called “Mechanicals” (in VOX-ATypI) and “Égyptiennes” (by Thibaudeau), were the first types expressly designed as display type. Vincent Figgins is credited with the first slab serifs, the earliest specimen dating to 1815, and his work inspired a diversity of critiques variously commending and lambasting the new style.</p>
    <p><strong>Abrupt serifs</strong>, usually in heavy weights, and a no-nonsense attitude are the trademarks of this style.</p>
    <p><img alt="Clarendon characteristics" src="http://media.smashingmagazine.com/wp-content/uploads/2013/04/clarendon.jpg" width="500" height="350" style="max-width: 100%; height: auto;"></p>
    <p>Clarendons, a notable offshoot of the original slab serifs, are a slightly tamed slab style, often in less extreme weights and using bracketed serifs. They have a lighter, friendlier character than the Neo-Grotesque slabs (i.e. those with unbracketed serifs and geometric construction).</p>
    <p>H&amp;FJ’s Sentinel (2009) and David Berlow’s Belizio (1998) are examples of recent Clarendons.</p>
    <h3>And That’s It… For Now</h3>
    <p>If you have made it this far in the article, congratulations! You are now in possession of a solid basic understanding of type classification, at least as far as serif typefaces take you, and you are able to recognize the important distinguishing features that make typefaces unique. Following the line of type history, we’re now in the middle of the 19th century, and we have the entirety of sans serifs and some discussion of display faces ahead of us. We’re really only halfway through, so if you’ve enjoyed it, you can look forward to part 2!</p>
    <p><strong>For now, here’s a little exercise to test your comprehension of what we’ve covered</strong> in this article so far. Take a look at these specimens and comment on how you’d classify them. Keep in mind that classification is an aid, rather than a hard and fast system, so don’t be shy — let us know where you’d place these typefaces!</p>
    <p><img alt="Typography Test Specimen" src="http://media.smashingmagazine.com/wp-content/uploads/2013/04/testspecimen.jpg" width="500" height="601" style="max-width: 100%; height: auto;"></p>
    <p><strong>Identify each typeface by its number (1 to 6)</strong> if you are classifying it in the comments. Extra points if you can identify the individual typefaces! I’ll be joining the discussion with the answers later, although I am sure you’ll have figured them out soon.</p>
    <p><em>(al)</em></p>
    <hr>
    <p><small>© Joseph Alessio for <a href="http://www.smashingmagazine.com" rel="nofollow external" class="bo">Smashing Magazine</a>, 2013.</small></p>
    </div>
]]>
</Body>
<Summary>        In my previous article on Smashing Magazine (“Understanding the Difference Between Typography and Lettering”), I wrote about how understanding type terminology can help us better...</Summary>
<Website>http://www.smashingmagazine.com/2013/04/17/making-sense-type-classification-part/</Website>
<TrackingUrl>https://my3.my.umbc.edu/api/v0/pixel/news/27826/guest@my.umbc.edu/7ea25b4cfcfa4b3a6aada2a3eab0595e/api/pixel</TrackingUrl>
<Tag>css</Tag>
<Tag>design</Tag>
<Tag>development</Tag>
<Tag>fonts</Tag>
<Tag>html</Tag>
<Tag>javascript</Tag>
<Tag>mysql</Tag>
<Tag>php</Tag>
<Tag>sql</Tag>
<Tag>typography</Tag>
<Tag>web</Tag>
<Group token="retired-583">Web Developer - Build Group</Group>
<GroupUrl>https://my3.my.umbc.edu/groups/retired-583</GroupUrl>
<AvatarUrl>https://assets3-my.umbc.edu/system/shared/avatars/groups/000/000/583/fc60f5d7abc2e080599bb6dc465db54d/xsmall.png?1363101197</AvatarUrl>
<AvatarUrl size="original">https://assets4-my.umbc.edu/system/shared/avatars/groups/000/000/583/fc60f5d7abc2e080599bb6dc465db54d/original.jpg?1363101197</AvatarUrl>
<AvatarUrl size="xxlarge">https://assets4-my.umbc.edu/system/shared/avatars/groups/000/000/583/fc60f5d7abc2e080599bb6dc465db54d/xxlarge.png?1363101197</AvatarUrl>
<AvatarUrl size="xlarge">https://assets4-my.umbc.edu/system/shared/avatars/groups/000/000/583/fc60f5d7abc2e080599bb6dc465db54d/xlarge.png?1363101197</AvatarUrl>
<AvatarUrl size="large">https://assets3-my.umbc.edu/system/shared/avatars/groups/000/000/583/fc60f5d7abc2e080599bb6dc465db54d/large.png?1363101197</AvatarUrl>
<AvatarUrl size="medium">https://assets3-my.umbc.edu/system/shared/avatars/groups/000/000/583/fc60f5d7abc2e080599bb6dc465db54d/medium.png?1363101197</AvatarUrl>
<AvatarUrl size="small">https://assets4-my.umbc.edu/system/shared/avatars/groups/000/000/583/fc60f5d7abc2e080599bb6dc465db54d/small.png?1363101197</AvatarUrl>
<AvatarUrl size="xsmall">https://assets3-my.umbc.edu/system/shared/avatars/groups/000/000/583/fc60f5d7abc2e080599bb6dc465db54d/xsmall.png?1363101197</AvatarUrl>
<AvatarUrl size="xxsmall">https://assets4-my.umbc.edu/system/shared/avatars/groups/000/000/583/fc60f5d7abc2e080599bb6dc465db54d/xxsmall.png?1363101197</AvatarUrl>
<Sponsor>Web Developer - Build Group</Sponsor>
<PawCount>0</PawCount>
<CommentCount>0</CommentCount>
<CommentsAllowed>true</CommentsAllowed>
<PostedAt>Wed, 17 Apr 2013 08:26:47 -0400</PostedAt>
</NewsItem>

<NewsItem contentIssues="true" id="27815" important="false" status="posted" url="https://my3.my.umbc.edu/posts/27815">
<Title>Teaching Kids to Code With Youth Digital</Title>
<Body>
<![CDATA[
    <div class="html-content">With a heightened emphasis on learning to code, Youth Digital wants to help the next generation of young entrepreneurs succeed.</div>
]]>
</Body>
<Summary>With a heightened emphasis on learning to code, Youth Digital wants to help the next generation of young entrepreneurs succeed.</Summary>
<Website>http://feedproxy.google.com/~r/YoungentrepreneurcomBlog/~3/BiPOBva73vw/</Website>
<TrackingUrl>https://my3.my.umbc.edu/api/v0/pixel/news/27815/guest@my.umbc.edu/3067df868294e67a33cd721fafd08cb9/api/pixel</TrackingUrl>
<Tag>coding</Tag>
<Tag>entrepreneur-interview</Tag>
<Tag>profiles</Tag>
<Tag>programming</Tag>
<Tag>startup</Tag>
<Tag>technology-news</Tag>
<Tag>young-entrepreneurs</Tag>
<Group token="entrepreneurship">Alex. Brown Center for Entrepreneurship</Group>
<GroupUrl>https://my3.my.umbc.edu/groups/entrepreneurship</GroupUrl>
<AvatarUrl>https://assets2-my.umbc.edu/system/shared/avatars/groups/000/000/092/53c03b106bdc6e19e4bf0a41b5a37add/xsmall.png?1771000363</AvatarUrl>
<AvatarUrl size="original">https://assets3-my.umbc.edu/system/shared/avatars/groups/000/000/092/53c03b106bdc6e19e4bf0a41b5a37add/original.jpg?1771000363</AvatarUrl>
<AvatarUrl size="xxlarge">https://assets2-my.umbc.edu/system/shared/avatars/groups/000/000/092/53c03b106bdc6e19e4bf0a41b5a37add/xxlarge.png?1771000363</AvatarUrl>
<AvatarUrl size="xlarge">https://assets1-my.umbc.edu/system/shared/avatars/groups/000/000/092/53c03b106bdc6e19e4bf0a41b5a37add/xlarge.png?1771000363</AvatarUrl>
<AvatarUrl size="large">https://assets4-my.umbc.edu/system/shared/avatars/groups/000/000/092/53c03b106bdc6e19e4bf0a41b5a37add/large.png?1771000363</AvatarUrl>
<AvatarUrl size="medium">https://assets1-my.umbc.edu/system/shared/avatars/groups/000/000/092/53c03b106bdc6e19e4bf0a41b5a37add/medium.png?1771000363</AvatarUrl>
<AvatarUrl size="small">https://assets3-my.umbc.edu/system/shared/avatars/groups/000/000/092/53c03b106bdc6e19e4bf0a41b5a37add/small.png?1771000363</AvatarUrl>
<AvatarUrl size="xsmall">https://assets2-my.umbc.edu/system/shared/avatars/groups/000/000/092/53c03b106bdc6e19e4bf0a41b5a37add/xsmall.png?1771000363</AvatarUrl>
<AvatarUrl size="xxsmall">https://assets3-my.umbc.edu/system/shared/avatars/groups/000/000/092/53c03b106bdc6e19e4bf0a41b5a37add/xxsmall.png?1771000363</AvatarUrl>
<Sponsor>The Alex. Brown Center for Entrepreneurship</Sponsor>
<PawCount>0</PawCount>
<CommentCount>0</CommentCount>
<CommentsAllowed>true</CommentsAllowed>
<PostedAt>Wed, 17 Apr 2013 07:00:57 -0400</PostedAt>
<EditAt>Wed, 17 Apr 2013 07:00:57 -0400</EditAt>
</NewsItem>

<NewsItem contentIssues="true" id="30061" important="false" status="posted" url="https://my3.my.umbc.edu/posts/30061">
<Title>Surfing Logs Reveal Global Eating Patterns</Title>
<Body>
<![CDATA[
    <div class="html-content">
    <p>The way we view online recipes reveals how our eating habits change over time, say computational sociologists.</p>
    <p><img src="https://www.technologyreview.com/sites/default/files/images/Foodies.png" alt="" width="146" height="381" style="max-width: 100%; height: auto;"></p>
    </div>
]]>
</Body>
<Summary>The way we view online recipes reveals how our eating habits change over time, say computational sociologists.</Summary>
<Website>http://www.technologyreview.com/view/513811/surfing-logs-reveal-global-eating-patterns/</Website>
<TrackingUrl>https://my3.my.umbc.edu/api/v0/pixel/news/30061/guest@my.umbc.edu/f78459b05ed977189cec90d1615d820d/api/pixel</TrackingUrl>
<Tag>development</Tag>
<Tag>internet</Tag>
<Tag>mit</Tag>
<Tag>technology</Tag>
<Tag>web</Tag>
<Group token="retired-583">Web Developer - Build Group</Group>
<GroupUrl>https://my3.my.umbc.edu/groups/retired-583</GroupUrl>
<AvatarUrl>https://assets3-my.umbc.edu/system/shared/avatars/groups/000/000/583/fc60f5d7abc2e080599bb6dc465db54d/xsmall.png?1363101197</AvatarUrl>
<AvatarUrl size="original">https://assets4-my.umbc.edu/system/shared/avatars/groups/000/000/583/fc60f5d7abc2e080599bb6dc465db54d/original.jpg?1363101197</AvatarUrl>
<AvatarUrl size="xxlarge">https://assets4-my.umbc.edu/system/shared/avatars/groups/000/000/583/fc60f5d7abc2e080599bb6dc465db54d/xxlarge.png?1363101197</AvatarUrl>
<AvatarUrl size="xlarge">https://assets4-my.umbc.edu/system/shared/avatars/groups/000/000/583/fc60f5d7abc2e080599bb6dc465db54d/xlarge.png?1363101197</AvatarUrl>
<AvatarUrl size="large">https://assets3-my.umbc.edu/system/shared/avatars/groups/000/000/583/fc60f5d7abc2e080599bb6dc465db54d/large.png?1363101197</AvatarUrl>
<AvatarUrl size="medium">https://assets3-my.umbc.edu/system/shared/avatars/groups/000/000/583/fc60f5d7abc2e080599bb6dc465db54d/medium.png?1363101197</AvatarUrl>
<AvatarUrl size="small">https://assets4-my.umbc.edu/system/shared/avatars/groups/000/000/583/fc60f5d7abc2e080599bb6dc465db54d/small.png?1363101197</AvatarUrl>
<AvatarUrl size="xsmall">https://assets3-my.umbc.edu/system/shared/avatars/groups/000/000/583/fc60f5d7abc2e080599bb6dc465db54d/xsmall.png?1363101197</AvatarUrl>
<AvatarUrl size="xxsmall">https://assets4-my.umbc.edu/system/shared/avatars/groups/000/000/583/fc60f5d7abc2e080599bb6dc465db54d/xxsmall.png?1363101197</AvatarUrl>
<Sponsor>Web Developer - Build Group</Sponsor>
<PawCount>0</PawCount>
<CommentCount>0</CommentCount>
<CommentsAllowed>true</CommentsAllowed>
<PostedAt>Wed, 17 Apr 2013 06:27:34 -0400</PostedAt>
</NewsItem>

<NewsItem contentIssues="true" id="27813" important="false" status="posted" url="https://my3.my.umbc.edu/posts/27813">
<Title>How to Build a Lean and Efficient Business Plan</Title>
<Body>
<![CDATA[
    <div class="html-content">Your business plan must be ready to accommodate rapid changes so that your company can follow suit. Here are five ways to make your business plan as lean and effective as possible.<br><br><a href="http://da.feedsportal.com/r/163067827229/u/49/f/625555/c/34343/s/2ad1726d/a2.htm" rel="nofollow external" class="bo"><img src="http://da.feedsportal.com/r/163067827229/u/49/f/625555/c/34343/s/2ad1726d/a2.img" style="max-width: 100%; height: auto;"></a>
    </div>
]]>
</Body>
<Summary>Your business plan must be ready to accommodate rapid changes so that your company can follow suit. Here are five ways to make your business plan as lean and effective as possible.</Summary>
<Website>http://feedproxy.google.com/~r/entrepreneur/startingabusiness/~3/0nKOgnwi-_o/story01.htm</Website>
<TrackingUrl>https://my3.my.umbc.edu/api/v0/pixel/news/27813/guest@my.umbc.edu/29e48a697c2eab713ad837bc3daab831/api/pixel</TrackingUrl>
<Group token="entrepreneurship">Alex. Brown Center for Entrepreneurship</Group>
<GroupUrl>https://my3.my.umbc.edu/groups/entrepreneurship</GroupUrl>
<AvatarUrl>https://assets2-my.umbc.edu/system/shared/avatars/groups/000/000/092/53c03b106bdc6e19e4bf0a41b5a37add/xsmall.png?1771000363</AvatarUrl>
<AvatarUrl size="original">https://assets3-my.umbc.edu/system/shared/avatars/groups/000/000/092/53c03b106bdc6e19e4bf0a41b5a37add/original.jpg?1771000363</AvatarUrl>
<AvatarUrl size="xxlarge">https://assets2-my.umbc.edu/system/shared/avatars/groups/000/000/092/53c03b106bdc6e19e4bf0a41b5a37add/xxlarge.png?1771000363</AvatarUrl>
<AvatarUrl size="xlarge">https://assets1-my.umbc.edu/system/shared/avatars/groups/000/000/092/53c03b106bdc6e19e4bf0a41b5a37add/xlarge.png?1771000363</AvatarUrl>
<AvatarUrl size="large">https://assets4-my.umbc.edu/system/shared/avatars/groups/000/000/092/53c03b106bdc6e19e4bf0a41b5a37add/large.png?1771000363</AvatarUrl>
<AvatarUrl size="medium">https://assets1-my.umbc.edu/system/shared/avatars/groups/000/000/092/53c03b106bdc6e19e4bf0a41b5a37add/medium.png?1771000363</AvatarUrl>
<AvatarUrl size="small">https://assets3-my.umbc.edu/system/shared/avatars/groups/000/000/092/53c03b106bdc6e19e4bf0a41b5a37add/small.png?1771000363</AvatarUrl>
<AvatarUrl size="xsmall">https://assets2-my.umbc.edu/system/shared/avatars/groups/000/000/092/53c03b106bdc6e19e4bf0a41b5a37add/xsmall.png?1771000363</AvatarUrl>
<AvatarUrl size="xxsmall">https://assets3-my.umbc.edu/system/shared/avatars/groups/000/000/092/53c03b106bdc6e19e4bf0a41b5a37add/xxsmall.png?1771000363</AvatarUrl>
<Sponsor>The Alex. Brown Center for Entrepreneurship</Sponsor>
<PawCount>0</PawCount>
<CommentCount>0</CommentCount>
<CommentsAllowed>true</CommentsAllowed>
<PostedAt>Wed, 17 Apr 2013 06:00:00 -0400</PostedAt>
</NewsItem>

<NewsItem contentIssues="true" id="27814" important="false" status="posted" url="https://my3.my.umbc.edu/posts/27814">
<Title>Money tips for freelancers</Title>
<Body>
<![CDATA[
    <div class="html-content">The downturn has caused freelancers to suffer at the hands of cash-strapped clients, argues Jon Norris. These tips should help smooth your cashflow<div><table border="0"><tbody><tr><td>
    <a href="http://share.feedsportal.com/share/twitter/?u=http%3A%2F%2Fwww.netmagazine.com%2Fopinions%2Fmoney-tips-freelancers&amp;t=Money+tips+for+freelancers" rel="nofollow external" class="bo"><img src="http://res3.feedsportal.com/social/twitter.png" style="max-width: 100%; height: auto;"></a> <a href="http://share.feedsportal.com/share/facebook/?u=http%3A%2F%2Fwww.netmagazine.com%2Fopinions%2Fmoney-tips-freelancers&amp;t=Money+tips+for+freelancers" rel="nofollow external" class="bo"><img src="http://res3.feedsportal.com/social/facebook.png" style="max-width: 100%; height: auto;"></a> <a href="http://share.feedsportal.com/share/linkedin/?u=http%3A%2F%2Fwww.netmagazine.com%2Fopinions%2Fmoney-tips-freelancers&amp;t=Money+tips+for+freelancers" rel="nofollow external" class="bo"><img src="http://res3.feedsportal.com/social/linkedin.png" style="max-width: 100%; height: auto;"></a> <a href="http://share.feedsportal.com/share/gplus/?u=http%3A%2F%2Fwww.netmagazine.com%2Fopinions%2Fmoney-tips-freelancers&amp;t=Money+tips+for+freelancers" rel="nofollow external" class="bo"><img src="http://res3.feedsportal.com/social/googleplus.png" style="max-width: 100%; height: auto;"></a> <a href="http://share.feedsportal.com/share/email/?u=http%3A%2F%2Fwww.netmagazine.com%2Fopinions%2Fmoney-tips-freelancers&amp;t=Money+tips+for+freelancers" rel="nofollow external" class="bo"><img src="http://res3.feedsportal.com/social/email.png" style="max-width: 100%; height: auto;"></a>
    </td></tr></tbody></table></div>
    <br><br><a href="http://da.feedsportal.com/r/163067828449/u/49/f/502346/c/32632/s/2ad24045/a2.htm" rel="nofollow external" class="bo"><img src="http://da.feedsportal.com/r/163067828449/u/49/f/502346/c/32632/s/2ad24045/a2.img" style="max-width: 100%; height: auto;"></a>
    </div>
]]>
</Body>
<Summary>The downturn has caused freelancers to suffer at the hands of cash-strapped clients, argues Jon Norris. These tips should help smooth your cashflow     </Summary>
<Website>http://feedproxy.google.com/~r/net/topstories/~3/l21la_fjGkY/story01.htm</Website>
<TrackingUrl>https://my3.my.umbc.edu/api/v0/pixel/news/27814/guest@my.umbc.edu/fab2e4c30a42ff4d8260508be43a33ce/api/pixel</TrackingUrl>
<Tag>css</Tag>
<Tag>development</Tag>
<Tag>html</Tag>
<Tag>javascript</Tag>
<Tag>mysql</Tag>
<Tag>net</Tag>
<Tag>php</Tag>
<Tag>sql</Tag>
<Tag>web</Tag>
<Group token="retired-583">Web Developer - Build Group</Group>
<GroupUrl>https://my3.my.umbc.edu/groups/retired-583</GroupUrl>
<AvatarUrl>https://assets3-my.umbc.edu/system/shared/avatars/groups/000/000/583/fc60f5d7abc2e080599bb6dc465db54d/xsmall.png?1363101197</AvatarUrl>
<AvatarUrl size="original">https://assets4-my.umbc.edu/system/shared/avatars/groups/000/000/583/fc60f5d7abc2e080599bb6dc465db54d/original.jpg?1363101197</AvatarUrl>
<AvatarUrl size="xxlarge">https://assets4-my.umbc.edu/system/shared/avatars/groups/000/000/583/fc60f5d7abc2e080599bb6dc465db54d/xxlarge.png?1363101197</AvatarUrl>
<AvatarUrl size="xlarge">https://assets4-my.umbc.edu/system/shared/avatars/groups/000/000/583/fc60f5d7abc2e080599bb6dc465db54d/xlarge.png?1363101197</AvatarUrl>
<AvatarUrl size="large">https://assets3-my.umbc.edu/system/shared/avatars/groups/000/000/583/fc60f5d7abc2e080599bb6dc465db54d/large.png?1363101197</AvatarUrl>
<AvatarUrl size="medium">https://assets3-my.umbc.edu/system/shared/avatars/groups/000/000/583/fc60f5d7abc2e080599bb6dc465db54d/medium.png?1363101197</AvatarUrl>
<AvatarUrl size="small">https://assets4-my.umbc.edu/system/shared/avatars/groups/000/000/583/fc60f5d7abc2e080599bb6dc465db54d/small.png?1363101197</AvatarUrl>
<AvatarUrl size="xsmall">https://assets3-my.umbc.edu/system/shared/avatars/groups/000/000/583/fc60f5d7abc2e080599bb6dc465db54d/xsmall.png?1363101197</AvatarUrl>
<AvatarUrl size="xxsmall">https://assets4-my.umbc.edu/system/shared/avatars/groups/000/000/583/fc60f5d7abc2e080599bb6dc465db54d/xxsmall.png?1363101197</AvatarUrl>
<Sponsor>Web Developer - Build Group</Sponsor>
<PawCount>0</PawCount>
<CommentCount>0</CommentCount>
<CommentsAllowed>true</CommentsAllowed>
<PostedAt>Wed, 17 Apr 2013 05:48:56 -0400</PostedAt>
</NewsItem>

<NewsItem contentIssues="true" id="27812" important="false" status="posted" url="https://my3.my.umbc.edu/posts/27812">
<Title>Twitter tip-toes into the ad game</Title>
<Body>
<![CDATA[
    <div class="html-content">
    <p><img src="http://netdna.webdesignerdepot.com/uploads/2013/04/thumbnail7.jpg" alt="Thumb" width="200" height="160" style="max-width: 100%; height: auto;">Twitter finally tossed a bigger hat into the advertising realm on February 20, 2013 by announcing the new Twitter Ad API and the five initial partners who will power this new vehicle. Yes, Twitter already has the capability to run ads — we’ve all been annoyed by ‘Promoted Tweets’ clogging up our timelines since 2010 — but now the experience should be better for marketers and less disruptive for users.</p>
    <p>In theory…</p>
    <p>But what does all of this mean for those of us in the design and advertising world? Let’s break this little nugget down and dive into the logistics, the theory and the user-experience.</p>
    <h1>Twitter Ad API in non-geek speak</h1>
    <p>So, what exactly is the Twitter API?</p>
    <p>Basically, the API powers Twitter, acting as a line of communication between software programs. Among other things, the Twitter API is what makes HootSuite, TweetBot and Twitterific possible.</p>
    <p>In 2010 Twitter began to limit access to its open source API, bought up certain companies that had mastered the API (bye-bye TweetDeck) and irritated many a hacker, designer, start-up guru or just anyone loving Tweetdeck, or the possibility of creating the next Tweetdeck. Many in the Twitter community saw the looming specter of capitalism on the horizon, and the shutting off of access to the API was the first move towards monetization of the platform and the conversion of tweets into commodities.</p>
    <p>Rumors of advertising tweets, IPOs and acquisitions bounced about the web and in April of 2010, the platform launched Promoted Tweets.</p>
    <p>Prior to the new Twitter Ad API, one had to manually monitor trending campaigns, use a cumbersome one-off tweet promoting process or actually call the advertising division of Twitter to run a campaign. By keeping the process of Promoted Tweets out of the realm of mass automation, Twitter managed to keep the number of advertising tweets in a user’s feed under control.</p>
    <p>The downfall of the previous advertising system left little option for scalability or growth from a marketer’s perspective. Twitter claims that scalability was a major reason for releasing this new API. Knowing that outside companies already had mechanisms in place for tracking, responding to and engaging followers using the existing API, Twitter chose five partners to help launch the Ad API and is currently working with others to broaden the advertising options.Adobe, SalesForce, SHIFT, Hootesuite and TBG Digital are all helping make the Twitter world a more unified and ad-friendly space.</p>
    <p>One of the Twitter Ad API partners, Adobe Media Opti­mizer, posted some promising results of testing with new API. According to the Adobe Digital Marketing Blog, the initial test campaigns showed a dramatic increase of 63% in followers with a reduction of 60% in the cost per follow.</p>
    <p>But what does all of this really mean for the creators and executioners of ad campaigns?</p>
    <p>Agencies can now monitor conversations on a massive scale, automate the engagement process,  and respond to trends in real time with Promoted Tweets all from the same software platform.</p>
    <p> </p>
    <h1>Listen &amp; Engage</h1>
    <p>Twitter claims that all of this Ad API technology will help ads become more relevant, not increase their volume. April Underwood, Product Manager at Twitter, answered the concerns about ad volume during a recent interview with FastCoCreate.com:</p>
    <blockquote>
    <p>“So from a user standpoint it doesn’t mean we’re becoming more aggressive in terms of ads or altering the user experience at all. This is all about giving marketers more choice as well as a broader set of tools in their arsenal that they can use in how they want to work with us.”</p>
    </blockquote>
    <p>The Ad API is designed to allow marketers to better tune its listening cap towards conversations related to their target audience and respond rapidly. According to the Salesforce Marketing press release on PR Newswire you can now listen to more than 400 million daily tweets and “track real-time conversations from more than 540 million social sources across the web including Facebook, Twitter, YouTube, LinkedIn, blogs and online communities”</p>
    <p> </p>
    <h1>Wow, insert head explosion here</h1>
    <p>Let’s break that down to a more manageable scenario. Say your client owns a company specializing in organic dog food products and have hired your agency to expand web traffic and conversions using social media. You can now employ the services of one of the above Partners and begin to track keywords, hashtags and conversations related to all things organic for Fido. You can then follow the conversation trends across multiple social media platforms.</p>
    <p>You’ve got the framework in place and are using Promoted Tweets that target conversations about dogs and/or organics and your system is responding to scale, in an automated fashion, and on a regular basis without hiring an army of interns to feed the Twitter advertising beast.</p>
    <p>Tragically, another round of tainted dog food hits the markets from some unsavory supplier which substitutes food particles with toxic kibble and Fidos are getting sick left and right. People are questioning the sources of their favorite buddy’s dinner and turning to social media to talk about the problem and find solutions.</p>
    <p>Score for your agency. You’re already scanning related keywords and your team is now spitting out relevant Promoted Tweets directly from one of the monitoring software partners targeting these trending conversations. You’re able to respond in real time to the appropriate audience concerning a breaking news story that directly impacts your product and your target demographic.</p>
    <p>Your brilliant team then scans these Facebook conversations and creates a series of blog posts addressing solutions and options for healing Fido, preventing such catastrophes in the first place by purchasing organic dog food, and including links to coupons on your client’s e-commerce site. You then blast links to the blog post now sitting on your client’s blog as Promoted Tweets to organic loving dog owners. Your client’s traffic explodes and they become the next Newman’s Own.</p>
    <p>Before the Ad API this process was doable, but the manpower required would have both limited the response abilities of your team, and cost your client a small fortune in billable hours. And while you were able to monitor these conversations and trends using social monitoring software, you were not able to launch a Promoted Tweet from that same platform. You had to navigate the clunky Twitter ad interface or call them.</p>
    <p>Another powerful tool for advertisers is the ability to automate the segmentation of your targeted demographics. Using the organic Fido example, let’s say you want special tweets to go out to women in their mid thirties living in the South and a different tweet to urban males in San Francisco in their late twenties. You can now automate that process and deliver different messages using partner software rather than loading individual messages separately through the Twitter interface.</p>
    <p>You also have a ton of metrics, analytics and raw data on your side and can show your client very specific numbers on the ROI of your efforts.</p>
    <p>And that’s why they pay you the big bucks!</p>
    <p> </p>
    <h1>Cautiously creeping into the ad game</h1>
    <p>Twitter has taken its sweet time entering the ad world on this scale, and rightfully so. The platform is powered by community and conversation.</p>
    <p>Twitter is a different beast, based entirely on the fundamental need for people to communicate in real time. Twitter is driven by conversations not professional biographies or personal, past narratives.</p>
    <p> </p>
    <h1>Twitter is rapid, it’s real-time and it’s fickle.</h1>
    <p>Ensuring that the user-experience on the platform is not exploited too much or too blatantly is paramount in promoting the growth and popularity of the company rumored to be worth almost $10 billion dollars.</p>
    <p>Facebook showed the social media big boys what happens when you base a company’s value on technology it has yet to fully integrate and numbers that are simply hypothetical. Zuckerburg’s botched IPO and the rapid decline of the Facebook stock served as a lesson to all major social media beasts looking to go public.</p>
    <p>Get your house in order and have a solid, predictable advertising revenue stream in place first. Provide value beyond coercing users to throw barn animals and virtually poke each other all day. Build a vehicle that allows big advertisers to step into the game and easily throw some serious money at your company and then deliver the goods in actual data showing conversions, engagement and growth patterns with the platform’s existing community.</p>
    <p>But truly, for Twitter to maintain its core community strength, it needs to delicately integrate this latest evolution of Promoted Tweets into the interface. We are a culture who, in theory, likes our privacy and knowing that someone, somewhere is mining our tweets for data to then try and make us consume, well that is a little creepy. And if not monitored properly or if implemented poorly, people will find another means of communicating in real-time on a different platform.</p>
    <p> </p>
    <p><em><strong>Does Twitter’s ad API have a big future? Could Twitter ever challenge Google for advertising revenue? Let us know your thought in the comments.</strong></em></p>
    <p><em>Featured image/thumbnail, <a href="http://www.shutterstock.com/pic-73007482/stock-vector-big-speech-bubble-made-from-small-bubbles-retro-colors.html" rel="nofollow external" class="bo">conversation image</a> via Shutterstock.</em></p>
    <p><br><br>
    </p>
    <table width="100%">
    <tbody>
    <tr>
    <td>
          <a href="http://www.mightydeals.com/deal/be-awesome-at-online-business.html?ref=inwidget" rel="nofollow external" class="bo"><strong>eBook: Be Awesome at Online Business  – only $9!</strong></a>
        </td>
    <td>
          <a href="http://www.mightydeals.com/?ref=inwidget" rel="nofollow external" class="bo"><br>
            <img src="http://mightydeals.com/web/images/widget-logo.png" height="40" width="90" style="max-width: 100%; height: auto;"><br>
          </a>
        </td>
    </tr>
    </tbody>
    </table>
    <p><br> </p>
    <a href="http://www.webdesignerdepot.com/2013/04/twitter-tip-toes-into-the-ad-game/" rel="nofollow external" class="bo">Source</a>
    </div>
]]>
</Body>
<Summary>Twitter finally tossed a bigger hat into the advertising realm on February 20, 2013 by announcing the new Twitter Ad API and the five initial partners who will power this new vehicle. Yes, Twitter...</Summary>
<Website>http://www.webdesignerdepot.com/2013/04/twitter-tip-toes-into-the-ad-game/</Website>
<TrackingUrl>https://my3.my.umbc.edu/api/v0/pixel/news/27812/guest@my.umbc.edu/919d249756421f12857aa1e4696c17f0/api/pixel</TrackingUrl>
<Tag>advertising</Tag>
<Tag>art</Tag>
<Tag>css</Tag>
<Tag>design</Tag>
<Tag>development</Tag>
<Tag>html</Tag>
<Tag>html5</Tag>
<Tag>illustrator</Tag>
<Tag>javascript</Tag>
<Tag>mysql</Tag>
<Tag>oracle</Tag>
<Tag>photoshop</Tag>
<Tag>php</Tag>
<Tag>promoted-tweet</Tag>
<Tag>promoting-a-company-on-twitter</Tag>
<Tag>social-media</Tag>
<Tag>sql</Tag>
<Tag>tweetdeck</Tag>
<Tag>twitter</Tag>
<Tag>twitter-ad-api</Tag>
<Tag>twitter-advertising</Tag>
<Group token="retired-583">Web Developer - Build Group</Group>
<GroupUrl>https://my3.my.umbc.edu/groups/retired-583</GroupUrl>
<AvatarUrl>https://assets3-my.umbc.edu/system/shared/avatars/groups/000/000/583/fc60f5d7abc2e080599bb6dc465db54d/xsmall.png?1363101197</AvatarUrl>
<AvatarUrl size="original">https://assets4-my.umbc.edu/system/shared/avatars/groups/000/000/583/fc60f5d7abc2e080599bb6dc465db54d/original.jpg?1363101197</AvatarUrl>
<AvatarUrl size="xxlarge">https://assets4-my.umbc.edu/system/shared/avatars/groups/000/000/583/fc60f5d7abc2e080599bb6dc465db54d/xxlarge.png?1363101197</AvatarUrl>
<AvatarUrl size="xlarge">https://assets4-my.umbc.edu/system/shared/avatars/groups/000/000/583/fc60f5d7abc2e080599bb6dc465db54d/xlarge.png?1363101197</AvatarUrl>
<AvatarUrl size="large">https://assets3-my.umbc.edu/system/shared/avatars/groups/000/000/583/fc60f5d7abc2e080599bb6dc465db54d/large.png?1363101197</AvatarUrl>
<AvatarUrl size="medium">https://assets3-my.umbc.edu/system/shared/avatars/groups/000/000/583/fc60f5d7abc2e080599bb6dc465db54d/medium.png?1363101197</AvatarUrl>
<AvatarUrl size="small">https://assets4-my.umbc.edu/system/shared/avatars/groups/000/000/583/fc60f5d7abc2e080599bb6dc465db54d/small.png?1363101197</AvatarUrl>
<AvatarUrl size="xsmall">https://assets3-my.umbc.edu/system/shared/avatars/groups/000/000/583/fc60f5d7abc2e080599bb6dc465db54d/xsmall.png?1363101197</AvatarUrl>
<AvatarUrl size="xxsmall">https://assets4-my.umbc.edu/system/shared/avatars/groups/000/000/583/fc60f5d7abc2e080599bb6dc465db54d/xxsmall.png?1363101197</AvatarUrl>
<Sponsor>Web Developer - Build Group</Sponsor>
<PawCount>0</PawCount>
<CommentCount>0</CommentCount>
<CommentsAllowed>true</CommentsAllowed>
<PostedAt>Wed, 17 Apr 2013 05:15:04 -0400</PostedAt>
<EditAt>Wed, 17 Apr 2013 05:15:04 -0400</EditAt>
</NewsItem>

<NewsItem contentIssues="true" id="27810" important="false" status="posted" url="https://my3.my.umbc.edu/posts/27810">
<Title>In the Wake of Tragedy, A Rush to Prejudice</Title>
<Body>
<![CDATA[
    <div class="html-content">
    <p><a href="http://usdemocrazy.net/wp-content/uploads/2013/04/Erik-Rush.jpg" rel="nofollow external" class="bo"><img alt="" src="http://usdemocrazy.net/wp-content/uploads/2013/04/Erik-Rush-300x237.jpg" width="300" height="237" style="max-width: 100%; height: auto;"></a>By now, we are all aware of Tuesday’s tragedy – the bombing of the 2013 Boston Marathon which left <a href="http://abcnews.go.com/US/boston-marathon-victim-identified-krystle-campbell/story?id=18965706#.UW4I8rWG3VE" rel="nofollow external" class="bo">three dead</a> and approximately 150 injured and maimed.  </p>
    <p>The question on everyone’s mind: who is responsible?</p>
    <p>To many, the word “terrorism” is synonymous with “Islam.”</p>
    <p>An unfortunate truth, but it cannot be denied.</p>
    <p>With the 9/11 attacks relatively recent in American history and fresh in the minds of countless Americans, many suspected the fault lay with an Islamic militant group – namely, al-Qaeda.  While the suspicion may be relatively justified (and expected) due to previous attacks, some took it a step further.</p>
    <p>Conservative columnist and Fox News contributor Erik Rush was at the forefront of controversial tweets this past Tuesday.  Shortly after the story broke, Rush <a href="http://www.rightwingwatch.org/content/erik-rush-kill-all-muslims-response-boston-marathon-attack" rel="nofollow external" class="bo">tweeted</a>: </p>
    <blockquote>
    <p>Everybody do the National Security Ankle Grab! Let’s bring more Saudis in without screening them! C’mon! #bostonmarathon</p>
    </blockquote>
    <p>A seemingly outraged follower of Rush’s replied:</p>
    <blockquote>
    <p>Sweet God.  Are you ALREADY BLAMING MUSLIMS??</p>
    </blockquote>
    <p>To which Rush retorted:</p>
    <blockquote>
    <p>Yes, they’re evil.  Let’s kill them all.  </p>
    </blockquote>
    <p>As public outcry over Rush’s remarks intensified, Rush announced he was merely being sarcastic.  </p>
    <p>However, as Rush continued to tweet, he began to increasingly undermine his own claim.  <a href="http://www.huffingtonpost.com/2013/04/15/erik-rush-boston-marathon-muslims_n_3087642.html?utm_hp_ref=media#slide=2340399" rel="nofollow external" class="bo">Remarks </a>such as</p>
    <blockquote>
    <p>Hypothesis proven: Libs responding to “kill them all” sarcasm neglect fact that their precious Islamists say the same about us EVERY DAY.</p>
    </blockquote>
    <p>and </p>
    <blockquote>
    <p>Keep ‘em coming, Islamist apologist worms! It’s good to know where and who you are!</p>
    </blockquote>
    <p>do not necessarily legitimize his initial defense of sarcasm.</p>
    <p>At the end of the day, we cannot not know for sure whether his remarks held any bit of sincerity or were purely sarcastic.  </p>
    <p>Whatever the case, one thing is certain: Mr. Rush certainly falls into the category of viewing terrorism and Islam as one.  </p>
    </div>
]]>
</Body>
<Summary>By now, we are all aware of Tuesday’s tragedy – the bombing of the 2013 Boston Marathon which left three dead and approximately 150 injured and maimed.     The question on everyone’s mind: who is...</Summary>
<Website>http://usdemocrazy.net/in-the-wake-of-tragedy-a-rush-to-prejudice/</Website>
<TrackingUrl>https://my3.my.umbc.edu/api/v0/pixel/news/27810/guest@my.umbc.edu/4ae1a4b500d3aa4cc417fe668167c55b/api/pixel</TrackingUrl>
<Tag>boston</Tag>
<Tag>boston-marathon</Tag>
<Tag>democracy</Tag>
<Tag>irc</Tag>
<Tag>islam</Tag>
<Tag>islamophobia</Tag>
<Tag>news</Tag>
<Tag>politics</Tag>
<Tag>umbc</Tag>
<Tag>usdemocrazy</Tag>
<Group token="retired-12">USDemocrazy</Group>
<GroupUrl>https://my3.my.umbc.edu/groups/retired-12</GroupUrl>
<AvatarUrl>https://assets1-my.umbc.edu/system/shared/avatars/groups/000/000/012/f0935e4cd5920aa6c7c996a5ee53a70f/xsmall.png?1279120129</AvatarUrl>
<AvatarUrl size="original">https://assets4-my.umbc.edu/system/shared/avatars/groups/000/000/012/f0935e4cd5920aa6c7c996a5ee53a70f/original.jpg?1279120129</AvatarUrl>
<AvatarUrl size="xxlarge">https://assets3-my.umbc.edu/system/shared/avatars/groups/000/000/012/f0935e4cd5920aa6c7c996a5ee53a70f/xxlarge.png?1279120129</AvatarUrl>
<AvatarUrl size="xlarge">https://assets4-my.umbc.edu/system/shared/avatars/groups/000/000/012/f0935e4cd5920aa6c7c996a5ee53a70f/xlarge.png?1279120129</AvatarUrl>
<AvatarUrl size="large">https://assets4-my.umbc.edu/system/shared/avatars/groups/000/000/012/f0935e4cd5920aa6c7c996a5ee53a70f/large.png?1279120129</AvatarUrl>
<AvatarUrl size="medium">https://assets1-my.umbc.edu/system/shared/avatars/groups/000/000/012/f0935e4cd5920aa6c7c996a5ee53a70f/medium.png?1279120129</AvatarUrl>
<AvatarUrl size="small">https://assets2-my.umbc.edu/system/shared/avatars/groups/000/000/012/f0935e4cd5920aa6c7c996a5ee53a70f/small.png?1279120129</AvatarUrl>
<AvatarUrl size="xsmall">https://assets1-my.umbc.edu/system/shared/avatars/groups/000/000/012/f0935e4cd5920aa6c7c996a5ee53a70f/xsmall.png?1279120129</AvatarUrl>
<AvatarUrl size="xxsmall">https://assets1-my.umbc.edu/system/shared/avatars/groups/000/000/012/f0935e4cd5920aa6c7c996a5ee53a70f/xxsmall.png?1279120129</AvatarUrl>
<Sponsor>USDemocrazy</Sponsor>
<PawCount>21</PawCount>
<CommentCount>8</CommentCount>
<CommentsAllowed>true</CommentsAllowed>
<PostedAt>Wed, 17 Apr 2013 01:11:52 -0400</PostedAt>
</NewsItem>

</News>
