My first suggestion would be to copy this completely. Try to duplicate it. Once you know how it's built, then you can edit it.
Build it in Illustrator. It could be built in Photoshop, but when you're dealing with all those icons, it's best to at least build those in IA if you wanted to use smart objects in PS. This way the icons won't get pixelated if you decide to resize them. If it's going to be on the web, then use web safe fonts, unless it's being coded to utilize a different font. Make it RGB and 72 resolution. Some say 96 resolution, but I always go with 72. The resolution step is more towards the refining/exporting step once you have the design done or if you built in PS. It's not something you worry about in IA. The dividing lines for example might be designed in IA, but they're going to be built with code, rather than a jpeg/png/gif image. Besides the icons, everything in that graphic would be coded to look the way it does.
It's not particularly well done though. It's close, but it needs refinement. The alignment/grid isn't consistent throughout. The trophy row is off, the features tri-section doesn't align with the tri-section below. The content within the tri-section doesn't start in the same section in each column. The user info section is too small, plus the line break hyphen is bad. I also don't think the layout would hold up if someone increased the font size in their browser, and considering this is adjustable on each individual user's computer, that would be an issue.
I suggest building in Illustrator, researching dimensions, then pick the size you want to go with. Pick your fonts and colors. If you know how code works, then that's a bonus, because then you can consider how this would get built.
This post was edited by ericswanson_19 on Mar 17 2015 03:50pm