Paul Alkema

Discussions on Web Development and Security

Paul Alkema

Entries Tagged as Misc

What Ever Happened To Geocities?

April 22, 2013 · No Comments

Is Geocities still around? When I was 15, my first website was at Geocities. I think this is what started my interest in web development, although I look back on that now and don't really see that as being web development at all, it was still my first website.

In 1999 Yahoo bought Geocities, ten years later in 2009, I received an email from Yahoo, notifying my that my account was going to be closed as they were closing all Geocities accounts.

So, there in is the question, what ever happened to Geocities?

[Read more →]

No CommentsTags: Misc

960 CSS Framework

November 30, 2010 · 73 Comments

About 960

I was recently introduced to a css framework called 960. At first I was EXTREMELY skeptical, but after using it and actually looking at the code behind it, I have officially become a 960 fan.

First off, let me start by saying this css framework isn't going to solve all of your css issues but it will most definitively help. The way that 960 works is it puts everything into a grid. You have 3 options, the 12 column grid, the 16 column grid and the 24 column grid. I personally prefer the 16 column grid but it's really just a personal preference.

A down side to using 960 is that it restricts your design to this grid. This in my opinion makes things look really nice and organized but some designers might not like having this limitation. Another downside is that you really need to be disciplined to not add any margin or padding on the left or right of any of your div's as this breaks the grid.

The upside, is that it really helps things to be pixel perfect and consistent. I've had issues before with css where in one spot something might be 10px away then on a different page it's 11px away. Why? Usually something stupid; 960 will usually take cialis super active care of these types of issues. Also, it really helps css be more cross compatible.

How To Use It

In this example I'm going to explain how to create a basic header, body, footer template.

Lets start by importing the 960 grid onto our page. You should download the zip file located on 960's website and import the css into your file. You should also create a css file specific to your page, I'm going to use the file custom.css in this example.

 <link rel="stylesheet" href="css/reset.css" /> <link rel="stylesheet" href="css/960.css" /> <link rel="stylesheet" href="css/custom.css" /> 

In my custom css file I put classes used to define the height and background colors of each divs. Most of the time defined heights are not necessary as content that is normally inside of the div created my height however my example contains no content so this was necessary. When using 960 adding margin or padding, top and bottom are allowed along with adding defined height however margin and padding on the left or right side along with defined widths are not recommended as this breaks the 960 grid.

 /* sets background color to gray */ body { background-color:#CCC; color:#FFF; } /*set foreground color to white */ .container_16 { background-color:#FFF; } /* set heights and backgrounds for my containers. */ #header { height:120px; background-color:#000; } #nav { height:32px; background-color:#999; } #body { background-color:#FFF; min-height:400px; } #footer { background-color:#666; min-height:154px; } /* set heights and background colors for my children divs. */ #body div{ margin-top:10px; background-color:#333; height:380px; } #footer div { margin-top:10px; background-color:#CCC; height:134px; } 

The html for this is very basic; Just 4 divs with the container_16 class. This class is used only on containers where you want the full 16 column with.

 <div class="container_16" id="header"> Header </div> <div class="container_16" id="nav"> Nav </div> <div class="container_16" id="body"> Body </div> <div class="container_16" id="footer"> Footer </div> 

When we put divs inside our containers we need to use the grid_## class. This class should only be used inside of the container class and if the number proceeding the underscore is less than 16, than it should always be used in conjunction with other divs that equal 16. Also, one of the awesome things about 960 is that not only can you use divs to do some of these things but you can use li's, h1's, h2's and pretty much any other html tag.

 <div class="container_16" id="header"> <div class="grid_16"> Header </div> </div> <div class="container_16" id="nav"> <ul> <li class="grid_2"> Nav 1 </li> <li class="grid_2"> Nav 2 </li> <li class="grid_2"> Nav 3 </li> <li class="grid_2"> Nav 4 </li> <li class="grid_2"> Nav 5 </li> <li class="grid_2"> Nav 6 </li> <li class="grid_2"> Nav 7 </li> <li class="grid_2"> Nav 8 </li> </ul> </div> <div class="container_16" id="body"> <div class="grid_4"> Body Column 1 </div> <div class="grid_4"> Body Column 2 </div> <div class="grid_4"> Body Column 3 </div> <div class="grid_4"> Body Column 4 </div> </div> <div class="container_16" id="footer"> <div class="grid_4"> Footer Column 1 </div> <div class="grid_4"> Footer Column 2 </div> <div class="grid_4"> Footer Column 3 </div> <div class="grid_4"> Footer Column 4 </div> </div> 

There is more to it, but this is the basics so PLEASE, make sure you check it out. I really think it could make your life easier. 960's website

CHECK OUT MY DEMO!!

73 CommentsTags: CSS · Misc

Google Creates Car That Drives Itself

October 12, 2010 · 27 Comments

Is Google actually working on a car that will drive itself? On Oct. 12th 2010 on the official Google blog they announced that they are working on a self driving car. A car that drives itself! Not only did they say that they’re working on this awesome car, but according to their blog, they already have a working prototype.

"So we have developed technology for cars that can drive themselves. Our automated cars, manned by trained operators, just drove from our Mountain View campus to our Santa Monica office and on to Hollywood Boulevard. They’ve driven down Lombard Street, crossed the Golden Gate bridge, navigated the Pacific Coast Highway, and even made it all the way around Lake Tahoe. All in all, our self-driving cars have logged over 140,000 miles. We think this is a first in robotics research." - Google

http://googleblog.blogspot.com/2010/10/what-were-driving-at.html

27 CommentsTags: Misc

Reverse Image Search using tineye.com

July 09, 2010 · 37 Comments

About 6 months ago I came across a reverse image search website called tineye.com. This site's is really an excellent way to find an original or the source of image. It can also be really helpful for finding other websites that have stolen your original images.

tineye.com

37 CommentsTags: Misc