Permalink
Browse files

Fixing up the speakers HTML/CSS

  • Loading branch information...
1 parent 17d2f82 commit 33e02b479d4173da183a87022a438b219d55e6e4 @dragoonis dragoonis committed Feb 25, 2013
Showing with 96 additions and 83 deletions.
  1. +27 −34 css/main.css
  2. +69 −49 speakers.html
View
@@ -568,52 +568,45 @@ div#airthphotos div img {
clear: both;
}
-div.speaker-left img {
- width: 240px;
- margin-right: 20px;
- margin-bottom: 20px;
- float: left;
-}
-
-div.speaker {
+.speaker {
padding: 20px;
+ position: relative;
}
-div.speaker p {
- text-align: justify;
+.speaker.yellow {
+ background: url(../img/yellow_bg.png) repeat;
+ color: #fffff4;
}
-div.last {
- margin-bottom: 20px;
+.speaker.yellow h1,
+.speaker.yellow h2 {
+ color: #fffff4;
+ text-shadow: 1px 3px 2px #a55b00;
+ filter: dropshadow(color=#a55b00, offx=1, offy=3);
}
-div.speaker-left div.abstract h2 {
- margin: 20px auto;
- line-height: 1.2em;
- width: 100%;
+.speaker img {
+ width: 240px;
+ margin: 12px 0 12px 12px;
+ float: right;
}
-div.speaker-right {
- background: url(../img/yellow_bg.png) repeat;
- color: #fffff4;
+.speakers .speaker:last-child {
+ margin-bottom: 20px;
}
-div.speaker-right img {
- width: 240px;
- margin-left: 20px;
- margin-bottom: 20px;
- float: right;
+.speaker p {
+ line-height: 1.2em;
}
-div.speaker-right div.abstract h2 {
- margin: 20px auto;
- line-height: 1.2em;
- width: 100%;
+.speaker h1 {
+ text-align: left;
+ margin-top: 1%;
}
-div.speaker-right h1,
-div.speaker-right h2 {
- color: #fffff4;
- text-shadow: 1px 3px 2px #a55b00;
- filter: dropshadow(color=#a55b00, offx=1, offy=3);
-}
+.speaker h2 {
+ font-size: 2.0em;
+ text-align: left;
+ margin: 20px auto;
+ line-height: 1.2em;
+}
View
@@ -2,68 +2,88 @@
layout: default
title: Speakers
---
-<div class='speaker speaker-left'>
- <div class='bio'>
+
+<div class="speakers">
+
+ <div class="speaker clearfix">
+
+ <img class="hidden-phone" src="/img/lsandvik.jpg" alt="Linda Sandvik" />
+
<h1>Linda Sandvik</h1>
- <img class="hidden-phone" src='img/lsandvik.jpg' alt='Linda Sandvik' />
- <p>Linda is a interface developer, wannabe MacGyver and adventurer. She's a nomad but is currently living in Hackney (London) and learning UX design at Last.fm (she likes learning new things).</p>
- <p>She is a technology resident at Spike Island art gallery, and recently discovered tinkering with electronics. She has made stuff like a laser harp, burping trashcans and an arcade style cycling game with actual bicycles as the controllers. She is obsessed with facilitating creativity &amp; learning, and making interactive installations that bridges the physical and digital.</p>
- </div>
- <div class='abstract'>
+ <div class="bio">
+ <p>Linda is a interface developer, wannabe MacGyver and adventurer. She's a nomad but is currently living in Hackney (London) and learning UX design at Last.fm (she likes learning new things).</p>
+ <p>She is a technology resident at Spike Island art gallery, and recently discovered tinkering with electronics. She has made stuff like a laser harp, burping trashcans and an arcade style cycling game with actual bicycles as the controllers. She is obsessed with facilitating creativity &amp; learning, and making interactive installations that bridges the physical and digital.</p>
+ </div>
+
<h2>Making things better</h2>
- <p>How do we become better interface developers? How do we find better problems to solve?</p>
- <p>The most interesting work lies outside of your comfort zone. So how can you get there? This is a sort of crash course in stepping out of your comfort zone, trying new things, learning to learn and creating your own luck.</p>
- <p>How should we do research &amp; development? To be innovative, we must create a culture that tolerates failure. But who wants to fail? And certainly not admit to it. I want to share with you some of my failures. We're taught to do things the right way. But to discover something that other people haven't, one needs to do things the wrong way.</p>
+ <div class="abstract">
+ <p>How do we become better interface developers? How do we find better problems to solve?</p>
+ <p>The most interesting work lies outside of your comfort zone. So how can you get there? This is a sort of crash course in stepping out of your comfort zone, trying new things, learning to learn and creating your own luck.</p>
+ <p>How should we do research &amp; development? To be innovative, we must create a culture that tolerates failure. But who wants to fail? And certainly not admit to it. I want to share with you some of my failures. We're taught to do things the right way. But to discover something that other people haven't, one needs to do things the wrong way.</p>
+ </div>
</div>
-</div>
-
-<div class='speaker speaker-right'>
- <div class='bio'>
+
+ <div class="speaker yellow clearfix">
+
+ <img class="hidden-phone" src="img/ibarber.jpg" alt="Ian Barber" />
+
<h1>Ian Barber</h1>
- <img class="hidden-phone" src='img/ibarber.jpg' alt='Ian Barber' />
- <p>Ian Barber works as a Senior Developer Advocate for Google+, and is based in Google's London office. Ian has been developing and managing development teams professionally since 2002. Among various open source interests, Ian is the author of the PHP Support Vector Machine extension and a contributor to the brokerless messaging library ZeroMQ. He blogs at <a href='http://phpir.com'>http://phpir.com</a> and <a href='http://www.riskcompletefailure.com'>http://www.riskcompletefailure.com</a>.</p>
- </div>
- <div class='abstract'>
+ <div class="bio">
+ <p>Ian Barber works as a Senior Developer Advocate for Google+, and is based in Google's London office. Ian has been developing and managing development teams professionally since 2002. Among various open source interests, Ian is the author of the PHP Support Vector Machine extension and a contributor to the brokerless messaging library ZeroMQ. He blogs at <a href="http://phpir.com">http://phpir.com</a> and <a href="http://www.riskcompletefailure.com">http://www.riskcompletefailure.com</a>.</p>
+ </div>
+
<h2>How Google Builds Webservices</h2>
- <p>We've been building web services for many years at Google, and over the years our approach to them has evolved. In this talk we will look at some of the lessons learned and how they are embodied in the latest generation of our API service, and why developer experience matters both outside and inside of a team. This talk should be helpful for anyone considering or developing web services for the wider development community.</p>
+ <div class="abstract">
+ <p>We've been building web services for many years at Google, and over the years our approach to them has evolved. In this talk we will look at some of the lessons learned and how they are embodied in the latest generation of our API service, and why developer experience matters both outside and inside of a team. This talk should be helpful for anyone considering or developing web services for the wider development community.</p>
+ </div>
</div>
-</div>
-
-<div class='speaker speaker-left'>
- <div class='bio'>
+
+ <div class="speaker clearfix">
+
+ <img class="hidden-phone" src="/img/rtuck.jpg" alt="Ross Tuck" />
+
<h1>Ross Tuck</h1>
- <img class="hidden-phone" src='img/rtuck.jpg' alt='Ross Tuck' />
- <p>Ross Tuck is a senior developer and team lead at Ibuildings in the Netherlands, despite being American. He's currently obsessed with hypermedia, CQRS and vector graphics but this tends to change quickly. Otherwise, he's usually trying to make time to read.</p>
- </div>
- <div class='abstract'>
+ <div class="bio">
+ <p>Ross Tuck is a senior developer and team lead at Ibuildings in the Netherlands, despite being American. He's currently obsessed with hypermedia, CQRS and vector graphics but this tends to change quickly. Otherwise, he's usually trying to make time to read.</p>
+ </div>
+
<h2>HTTP and Your Angry Dog</h2>
- <p>What is an etag, exactly? What's all that stuff in the Accept header? And what the heck does a Vary header do anyways?! Web developers use HTTP everyday but most of us don't know how to get the most out of it. This talk goes past memorizing status codes (although we'll see those too) and teaches how to get the most out of every request and response.</p>
+ <div class="abstract">
+ <p>What is an etag, exactly? What's all that stuff in the Accept header? And what the heck does a Vary header do anyways?! Web developers use HTTP everyday but most of us don't know how to get the most out of it. This talk goes past memorizing status codes (although we'll see those too) and teaches how to get the most out of every request and response.</p>
+ </div>
</div>
-</div>
-
-<div class='speaker speaker-right'>
- <div class='bio'>
+
+ <div class="speaker yellow clearfix">
+
+ <img class="hidden-phone" src="/img/dzuelke.jpg" alt="David Zuelke" />
+
<h1>David Zuelke</h1>
- <img class="hidden-phone" src='img/dzuelke.jpg' alt='David Zuelke' />
- <p>David Zuelke works as the Lead Architect at EMH Technologies, the technical incubator of European Media Holding, in Munich, Germany. He has been developing applications on the web since long before the turn of the millennium and regularly speaks at conferences around the world about things he likes or gets to work on, such as systems architecture, REST &amp; HTTP, Hadoop &amp; Big Data, CouchDB and, of course, PHP.</p>
- </div>
- <div class='abstract'>
+ <div class="bio">
+ <p>David Zuelke works as the Lead Architect at EMH Technologies, the technical incubator of European Media Holding, in Munich, Germany. He has been developing applications on the web since long before the turn of the millennium and regularly speaks at conferences around the world about things he likes or gets to work on, such as systems architecture, REST &amp; HTTP, Hadoop &amp; Big Data, CouchDB and, of course, PHP.</p>
+ </div>
+
<h2>Surviving a Prime Time TV Commercial</h2>
- <p>Setting up an online shop is a relatively trivial task these days. Pick your application, adjust some templates, sign payment provider contracts, make sure your supply chain is in order, and launch.</p>
- <p>But once you decide to aim higher and start airing commercials, on TV, during prime time hours, then regular off-the-shelf software will not cope with the flood of incoming requests. That's when it is time to build something a little more durable, without a single point of failure, serving pages in under a hundred milliseconds, unfazed by extreme concurrency.</p>
- <p>This is a talk about lessons learned and missions accomplished.</p>
+ <div class="abstract">
+ <p>Setting up an online shop is a relatively trivial task these days. Pick your application, adjust some templates, sign payment provider contracts, make sure your supply chain is in order, and launch.</p>
+ <p>But once you decide to aim higher and start airing commercials, on TV, during prime time hours, then regular off-the-shelf software will not cope with the flood of incoming requests. That's when it is time to build something a little more durable, without a single point of failure, serving pages in under a hundred milliseconds, unfazed by extreme concurrency.</p>
+ <p>This is a talk about lessons learned and missions accomplished.</p>
+ </div>
</div>
-</div>
-
-<div class='speaker speaker-left last'>
- <div class='bio'>
+
+ <div class="speaker clearfix">
+
+ <img class="hidden-phone" src="/img/ade.jpg" alt="Ade Oshineye" />
+
<h1>Ade Oshineye</h1>
- <img class="hidden-phone" src='/img/ade.jpg' alt='Ade Oshineye' />
- <p>Ade is a Senior Developer Advocate in Google's London office and works on the Google+ project. Over the last decade he's worked on trading systems for a variety of investment banks as well as on Google's advertising and mobile search systems. He's also the co-author of "Apprenticeship Patterns": a book that teaches you how to learn to be a great programmer. He's particularly interested in Developer Experience, distributed systems and the future of online news.</p>
- </div>
- <div class='abstract'>
+ <div class="bio">
+ <p>Ade is a Senior Developer Advocate in Google's London office and works on the Google+ project. Over the last decade he's worked on trading systems for a variety of investment banks as well as on Google's advertising and mobile search systems. He's also the co-author of "Apprenticeship Patterns": a book that teaches you how to learn to be a great programmer. He's particularly interested in Developer Experience, distributed systems and the future of online news.</p>
+ </div>
+
<h2>Identity, responsiveness and the future of the web</h2>
- <p>Devices like the Chromebook Pixel (which are hi-DPI, touch-sensitive but aren't phones or tablets) show us that the future of the web is too complex for a simplistic approach to responsiveness. It's not enough to think that media queries and a few screen width breakpoints suffice to make your site future-friendly.</p>
- <p>In this talk I'm going to propose that responsiveness requires us to take into account the entire context of the user. That means everything from device orientation to bandwidth to identity.</p>
+ <div class="abstract">
+ <p>Devices like the Chromebook Pixel (which are hi-DPI, touch-sensitive but aren't phones or tablets) show us that the future of the web is too complex for a simplistic approach to responsiveness. It's not enough to think that media queries and a few screen width breakpoints suffice to make your site future-friendly.</p>
+ <p>In this talk I'm going to propose that responsiveness requires us to take into account the entire context of the user. That means everything from device orientation to bandwidth to identity.</p>
+ </div>
</div>
+
</div>

0 comments on commit 33e02b4

Please sign in to comment.