How to Make Sexy Websites

Not too long ago, I started making websites profesionally. After a lot of toiling, I discovered the key to making sexy websites: read, read, read! I always do my best work after having read many design blogs and articles, so I want to share the wealth with y’all (and thus hopefully make your learning curve more shallow).

While there is a trend of specialization developing in other industries, it seems that the web design and design industry favors those who have broader abilities (nevertheless, this is a debate they’re having in the financial world as well). For this reason, I try to keep constant tabs on the latest in general graphic design, branding, writing, and various programming technologies that are relevant to the web. Reflecting that blend, here are (IMHO) the most important websites that beginning web designers/web developers should thoroughly browse:

Greenies: For those just starting out

  • Web design from scratch – The BEST place to start if you’re just beginning to make professional websites. This site has a wide variety of topics, including the entire design process, graphics, and branding.
  • W3Schools – Check out their HTML and CSS tutorials in parallel with Web design from scratch (knowledge of HTML and CSS is super important because it gives you complete, pixel-by-pixel control over your designs). W3Schools’ tutorials give you really straightforward explanations and examples, and beat the pants off of reading huge books since they convey their information concisely.

The (barely?) Initiated: beyond the basics

Graphics Creation

  • You Suck at Photoshop – You need some graphics skills to make sexy websites, and Photoshop is usually the weapon of choice for graphics work. This link is geared towards beginners (and is hilarious).
  • PSDTUTS – More advanced tutorials for when you stop sucking at Photoshop ;)

Logo Blogs

Branding Blogs


  • CSS Remix – For inspiration from CSS-based designs
  • Toxel – General creative design inspiration (covers creativity in the virtual and physical realms)
  • Design Meltdown – A site focusing on web design
  • Some designers include description and rationale behind projects in their portfolios (like Mark Boulton). These can be pretty useful to go through.


  • A List Apart – A very popular website “for people who make websites,” with an emphasis on code.
  • NETTUTS – From the same people who brought you PSDTUTS, these guys give you a lot of tips on more advanced things you can do with HTML, CSS, etc.
  • Freelance Switch – About the business of being a freelance designer, writer, illustrator, farmer, or whateverer.

How to keep up without perpetually having 20 Firefox tabs open

These resources are by no means an exhaustive list, but are certainly good starting points. If you haven’t set up an RSS feed reader yet, you should strongly consider it – it’s the easiest way to be in the loop on all of these websites (I use Google Reader). Of course, there’s way too much good stuff on the web about making websites, so BEWARE: you may become info-whelmed.

If you know of some good sites that I’ve left off my list, drop a comment and help us all!

4 thoughts on “How to Make Sexy Websites

  1. I somehow became the web-editor for our newspaper and now i need to deal with this. Can i just put something together on iweb and upload the pages on to the server? I do have dreamweaver but i have no clue how to use it, and i don’t have enough to learn it.

  2. Sorry for the slow reply (my comment notifications somehow got turned off). If you don’t have time to learn how to make websites, I’d suggest looking into WordPress. It’s originally blogging software that’s been extended to run a variety of sites beyond just blogs (New York Times, for example, uses WordPress to run their online newspaper). It’s very easy to use and requires no programming, but is extensible if you want to customize it with your own code, themes, etc.

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>