How to Make a Website Like the 90s & 2000s: Examples, Tips, More

PDF download Download Article
Easily build a webpage with that late 90s or early 2000s aesthetic
PDF download Download Article

Want to make an retro 2000s or 90s-style website? While modern designers cringe at the design choices people made in the aughts, you can't deny that websites were more fun back then! It really helps to know HTML, but you can still get that Y2K-era web aesthetic using templates and layout builders. This article covers everything you need to know to make your website authentically 90s or 2000s, and shows you where to find the best HTML layouts/themes, animated GIFs, backgrounds, buttons, and more!

Making a 2000s or 90s Style Website: What You'll Need

  • Tons of colorful animated GIFs and buttons
  • 3D-style text graphics and lots of Comic Sans text
  • Repeating background patterns
  • HTML tables
  • JavaScript effects
  • At least one "Under Construction" GIF
  • A hit counter and guestbook
Section 1 of 3:

90s & 2000s Style Websites for Inspiration

PDF download Download Article
  1. {"smallUrl":"https:\/\/www.wikihow.com\/images\/thumb\/1\/15\/Make-a-Website-Like-the-90s-Step-1.jpg\/v4-460px-Make-a-Website-Like-the-90s-Step-1.jpg","bigUrl":"\/images\/thumb\/1\/15\/Make-a-Website-Like-the-90s-Step-1.jpg\/v4-728px-Make-a-Website-Like-the-90s-Step-1.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><p>License: <a target=\"_blank\" rel=\"nofollow noreferrer noopener\" class=\"external text\" href=\"https:\/\/en.wikipedia.org\/wiki\/Fair_use\">Fair Use<\/a> (screenshot)<br>\n<\/p><\/div>"}
    Fortunately, it's easy to find archives of real Web 1.0 sites and modern takes on old-school web aesthetics.
    • Neocities: This free web hosting site is home to tons of 90s and 2000s-style websites (and some modern ones) thanks to the service's similarity to GeoCities (a popular web host in the 90s and 2000s). You'll find tons of active retro websites with all the best (worst?) features of the 90s, including plenty of colorful Comic Sans text and low-resolution GIFs .
    • The Geocities-izer: Speaking of GeoCities, this fun tool will display any website as it would have looked if it were on GeoCities. Try it out with wikiHow.com—just turn down your speakers first!
    • Cameron's World: This site takes the wildest 90s and 2000s website traits and combines them into a single webpage.
    • Web Design Museum: This web gallery geared toward "forgotten trends in web design" is loaded with screenshots from websites dating back to 1991. [1]
    • The Geocities Gallery: If you want to see real websites from the early 2000s and late 90s, this website has archived tons of actual websites from GeoCities!
    2. Advertisement
Section 2 of 3:

Website Features of the 90s and 2000s

PDF download Download Article
  1. {"smallUrl":"https:\/\/www.wikihow.com\/images\/thumb\/2\/29\/Make-a-Website-Like-the-90s-Step-7.jpg\/v4-460px-Make-a-Website-Like-the-90s-Step-7.jpg","bigUrl":"\/images\/thumb\/2\/29\/Make-a-Website-Like-the-90s-Step-7.jpg\/v4-728px-Make-a-Website-Like-the-90s-Step-7.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><p>License: <a target=\"_blank\" rel=\"nofollow noreferrer noopener\" class=\"external text\" href=\"https:\/\/en.wikipedia.org\/wiki\/Fair_use\">Fair Use<\/a> (screenshot)<br>\n<\/p><\/div>"}
    Nothing makes a site more 90s/2000s than a slew of animated GIFs and buttons. Seriously, you'll need tons of these to make your website authentic! Plenty of retro GIF websites and search engines let you download all those flashy pixelated graphics you won't find on social media. Save the ones you love or loathe most for your website.
    • Animated GIF Search Engine : Searching for "button" to find all sorts of directional buttons (like "Next" and "Back"), or "cat" to find all sorts of silly cat-related GIFs.
    • 99GIF Shop : An unsorted array of cool retro GIFs.
    • Piskel : A free tool for creating your own animated pixel GIFs.
    • PicMix : The perfect source for 2000s-style GIFs that would have looked great on your MySpace profile.
    • Glitter Graphics ; All things glitter, including animated glittering backgrounds, dividers, icons, banners, and buttons for your website.
    • the 88x31 GIF Collection : Hundreds of buttons that are 88x31px—the most common size for website buttons in the 90s and 2000s.
    • Web Badges World : Free badges for all sorts of topics
    • Blinkies Café : Make your own blinking buttons.
  2. {"smallUrl":"https:\/\/www.wikihow.com\/images\/thumb\/6\/6e\/Make-a-Website-Like-the-90s-Step-5.jpg\/v4-460px-Make-a-Website-Like-the-90s-Step-5.jpg","bigUrl":"\/images\/thumb\/6\/6e\/Make-a-Website-Like-the-90s-Step-5.jpg\/v4-728px-Make-a-Website-Like-the-90s-Step-5.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><p>License: <a target=\"_blank\" rel=\"nofollow noreferrer noopener\" class=\"external text\" href=\"https:\/\/en.wikipedia.org\/wiki\/Fair_use\">Fair Use<\/a> (screenshot)<br>\n<\/p><\/div>"}
    In the 90s and early 2000s, repeating pattern backgrounds were all the rage. Any image that repeats seamlessly will work as a background on your retro website—think starry skies, rainbow clouds, bricks, cement, colorful fractals, wood grain, and Lisa Frank-style animal prints. Here are some places you can download some free 90s & 2000s backgrounds:
  3. {"smallUrl":"https:\/\/www.wikihow.com\/images\/thumb\/c\/c7\/Make-a-Website-Like-the-90s-Step-3.jpg\/v4-460px-Make-a-Website-Like-the-90s-Step-3.jpg","bigUrl":"\/images\/thumb\/c\/c7\/Make-a-Website-Like-the-90s-Step-3.jpg\/v4-728px-Make-a-Website-Like-the-90s-Step-3.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><p>License: <a target=\"_blank\" rel=\"nofollow noreferrer noopener\" class=\"external text\" href=\"https:\/\/en.wikipedia.org\/wiki\/Fair_use\">Fair Use<\/a> (screenshot)<br>\n<\/p><\/div>"}
    Today's simplistic sans-serif fonts won't get you that retro aesthetic. Instead, opt for old-school fonts like Comic Sans for all your text. If you can't bring yourself to go all in on Comic Sans, stick to a serif font like Times New Roman. And the more colors you use, the better!
    • The HTML <font> tag is now deprecated, but you can set the font on your website with CSS
    • Now that standard for customizing your fonts on the web, a lot of the old HTML tags that stylized fonts in the 90s no longer work (including the famous <blink> tag.
  4. {"smallUrl":"https:\/\/www.wikihow.com\/images\/thumb\/0\/03\/Make-a-Website-Like-the-90s-Step-6.jpg\/v4-460px-Make-a-Website-Like-the-90s-Step-6.jpg","bigUrl":"\/images\/thumb\/0\/03\/Make-a-Website-Like-the-90s-Step-6.jpg\/v4-728px-Make-a-Website-Like-the-90s-Step-6.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><p>License: <a target=\"_blank\" rel=\"nofollow noreferrer noopener\" class=\"external text\" href=\"https:\/\/en.wikipedia.org\/wiki\/Fair_use\">Fair Use<\/a> (screenshot)<br>\n<\/p><\/div>"}
    90s and 2000s-style websites were especially were loaded with flashy text logos made from ornate or futuristic fonts. You'll need at least one text-based graphic to welcome visitors to your site!
    • Cool Text's graphics and logo generator lets you create free text logos from an assortment of true-to-the-90s styles.
    • Flaming Text has great free 2000s-style logo creation templates, plus a few modern ones.
    • Make Wordart lets you design real 90s-style Microsoft Word WordArt logos right in your browser.
  5. {"smallUrl":"https:\/\/www.wikihow.com\/images\/thumb\/d\/de\/Make-a-Website-Like-the-90s-Step-8.jpg\/v4-460px-Make-a-Website-Like-the-90s-Step-8.jpg","bigUrl":"\/images\/thumb\/d\/de\/Make-a-Website-Like-the-90s-Step-8.jpg\/v4-728px-Make-a-Website-Like-the-90s-Step-8.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><p>License: <a target=\"_blank\" rel=\"nofollow noreferrer noopener\" class=\"external text\" href=\"https:\/\/en.wikipedia.org\/wiki\/Fair_use\">Fair Use<\/a> (screenshot)<br>\n<\/p><\/div>"}
    While websites today track visitors in the background, every website in the 90s and 2000s had a hit counter right on the page. You can still add an authentic visitor counter to your website thanks to sites like Free Website Hit Counter and Free Web Counter , both of which look extremely dated—which is exactly what you want!
    • Just select the most absurd counter on the page, add your URL to the field, and click Generate free hit counter HTML code to get the code you'll need to add to your website.
  6. {"smallUrl":"https:\/\/www.wikihow.com\/images\/thumb\/0\/06\/Make-a-Website-Like-the-90s-Step-9.jpg\/v4-460px-Make-a-Website-Like-the-90s-Step-9.jpg","bigUrl":"\/images\/thumb\/0\/06\/Make-a-Website-Like-the-90s-Step-9.jpg\/v4-728px-Make-a-Website-Like-the-90s-Step-9.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><p>License: <a target=\"_blank\" rel=\"nofollow noreferrer noopener\" class=\"external text\" href=\"https:\/\/en.wikipedia.org\/wiki\/Fair_use\">Fair Use<\/a> (screenshot)<br>\n<\/p><\/div>"}
    It's not a retro website without one or more "Under Construction" graphics. Even though it's tough to find these relics on the web now, one archivist from the Archive Team collected every "Under Construction" graphic and added them to a single webpage . [2] They're free to download, so grab some!
  7. {"smallUrl":"https:\/\/www.wikihow.com\/images\/thumb\/f\/fb\/Make-a-Website-Like-the-90s-Step-10.jpg\/v4-460px-Make-a-Website-Like-the-90s-Step-10.jpg","bigUrl":"\/images\/thumb\/f\/fb\/Make-a-Website-Like-the-90s-Step-10.jpg\/v4-728px-Make-a-Website-Like-the-90s-Step-10.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><p>License: <a target=\"_blank\" rel=\"nofollow noreferrer noopener\" class=\"external text\" href=\"https:\/\/en.wikipedia.org\/wiki\/Fair_use\">Fair Use<\/a> (screenshot)<br>\n<\/p><\/div>"}
    Before there was CSS, web designers used clunky tables to lay out their websites. Fortunately (unfortunately?), tables are not obsolete—you can still use HTML tables to create realistically late 90s and early 2000s website layouts if you're comfortable enough with HTML to get your hands dirty in code. [3]
  8. {"smallUrl":"https:\/\/www.wikihow.com\/images\/thumb\/b\/b8\/Make-a-Website-Like-the-90s-Step-11.jpg\/v4-460px-Make-a-Website-Like-the-90s-Step-11.jpg","bigUrl":"\/images\/thumb\/b\/b8\/Make-a-Website-Like-the-90s-Step-11.jpg\/v4-728px-Make-a-Website-Like-the-90s-Step-11.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><p>License: <a target=\"_blank\" rel=\"nofollow noreferrer noopener\" class=\"external text\" href=\"https:\/\/en.wikipedia.org\/wiki\/Fair_use\">Fair Use<\/a> (screenshot)<br>\n<\/p><\/div>"}
    So many websites in the 90s were set to music—you can still use the HTML5 <audio> tag to automatically play music once a visitor loads your page. [4] Check out the GeoCities MIDI Collection from the Internet Archive for an authentic selection of retro song files.
  9. {"smallUrl":"https:\/\/www.wikihow.com\/images\/thumb\/0\/02\/Make-a-Website-Like-the-90s-Step-12.jpg\/v4-460px-Make-a-Website-Like-the-90s-Step-12.jpg","bigUrl":"\/images\/thumb\/0\/02\/Make-a-Website-Like-the-90s-Step-12.jpg\/v4-728px-Make-a-Website-Like-the-90s-Step-12.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><p>License: <a target=\"_blank\" rel=\"nofollow noreferrer noopener\" class=\"external text\" href=\"https:\/\/en.wikipedia.org\/wiki\/Fair_use\">Fair Use<\/a> (screenshot)<br>\n<\/p><\/div>"}
    Have you ever moved your mouse on a 2000s website and noticed a silly cursor animation? Or maybe shooting stars or raindrops darting across the text? Web designers used simple JavaScript code to add all sorts of moving images and effects to websites, such as changing the mouse cursor to hearts, stars, or smiley faces. [5] As long as you can edit your website's HTML code, you can copy JavaScript code that brings these 2000s effects straight to your page.
  10. {"smallUrl":"https:\/\/www.wikihow.com\/images\/thumb\/e\/ed\/Register-to-Vote-by-Mail-Step-4-Version-3.jpg\/v4-460px-Register-to-Vote-by-Mail-Step-4-Version-3.jpg","bigUrl":"\/images\/thumb\/e\/ed\/Register-to-Vote-by-Mail-Step-4-Version-3.jpg\/v4-728px-Register-to-Vote-by-Mail-Step-4-Version-3.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><p>\u00a9 2024 wikiHow, Inc. All rights reserved. wikiHow, Inc. is the copyright holder of this image under U.S. and international copyright laws. This image is <b>not<\/b> licensed under the Creative Commons license applied to text content and some other images posted to the wikiHow website. This image may not be used by other entities without the express written consent of wikiHow, Inc.<br>\n<\/p><p><br \/>\n<\/p><\/div>"}
    Websites of the 90s and 2000s proudly displayed links to other great sites on the web. Whether you want to add your links right to your main page or create a page dedicated to links, be sure to fill up your links section with other retro-inspired websites (and wikiHow.com, of course).
    • In the 2000s, websites also joined forces with one another in "Webrings," which were communities of similar websites. When you joined a webring, you'd add the code to your website and visitors can check out other sites in the webring. You won't find many webrings around these days.
  11. {"smallUrl":"https:\/\/www.wikihow.com\/images\/thumb\/2\/26\/Make-a-Website-Like-the-90s-Step-14.jpg\/v4-460px-Make-a-Website-Like-the-90s-Step-14.jpg","bigUrl":"\/images\/thumb\/2\/26\/Make-a-Website-Like-the-90s-Step-14.jpg\/v4-728px-Make-a-Website-Like-the-90s-Step-14.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><p>License: <a target=\"_blank\" rel=\"nofollow noreferrer noopener\" class=\"external text\" href=\"https:\/\/en.wikipedia.org\/wiki\/Fair_use\">Fair Use<\/a> (screenshot)<br>\n<\/p><\/div>"}
    Before there were comments, people left messages on virtual guest books, especially in the 90s. You'll still find easy-to-add guestbooks you can link to prominently on your 90s-inspired website, including 123 Guestbook and Smart GB .
    12. Advertisement
Section 3 of 3:

Building Your 90s or 2000s Website

PDF download Download Article
  1. 1
    Get a host for your website. If you really want to capture that Y2k aesthetic and are willing to write (or copy and paste) HTML code from scratch, create an account with Neocities . Their free tier has enough features to cover all your retro website needs. Just be aware that you'll need to work with HTML files on Neocities—there's no website builder. You can edit HTML files on your computer and upload them through the website.
    • Really, any web host will do if you feel comfortable with basic HTML. You'll usually want to avoid web hosts that are too modern, like Squarespace or WordPress, as your site won't look like it's from the late 90s or early 2000s.
    • If you want to create an authentic 90s- or Y2K-style blog, not a whole website, you don't need to know much HTML. However, it's best to choose a blog host that lets you edit your HTML directly, like Blogger or Tumblr, so you can add some special HTML touches.
  2. 2
    Create a basic page in any text editor. Even if you don't know HTML, you can use this wikiHow basic HTML guide to create your first HTML file. Alternatively, if your web host has a browser-based editor, you can make your basic HTML page there. Save your HTML file as index.html .
  3. 3
    Try a theme or layout builder. If your HTML is rusty or you want a good starting point, there are tons of templates and layout builders you can copy and paste right into your HTML!
  4. {"smallUrl":"https:\/\/www.wikihow.com\/images\/thumb\/6\/66\/Make-a-Website-Like-the-90s-Step-4.jpg\/v4-460px-Make-a-Website-Like-the-90s-Step-4.jpg","bigUrl":"\/images\/thumb\/6\/66\/Make-a-Website-Like-the-90s-Step-4.jpg\/v4-728px-Make-a-Website-Like-the-90s-Step-4.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><p>License: <a target=\"_blank\" rel=\"nofollow noreferrer noopener\" class=\"external text\" href=\"https:\/\/en.wikipedia.org\/wiki\/Fair_use\">Fair Use<\/a> (screenshot)<br>\n<\/p><\/div>"}
    Today's devices can display millions of colors, but older computers could only show 256 colors at a time. And because only 216 of those colors displayed exactly the same on both PC and Macs, 90s web developers relied on a palette of only 216 "web-safe" colors to ensure their sites looked the same on all platforms. [6] While the web-safe palette is no longer needed, sticking to the colors from this palette for your website will give you that authentic 90s or Y2K aesthetic.
  5. 5
    Add your images. Download all the animated buttons, text effects, and other goodies you want to add to your page, then add them using the HTML <img> tag. If you're new to HTML, you can learn how easy it is to insert images on How to Insert Images with HTML .
  6. 6
    Set your background pattern. If you want to use a background image, it's best to set the background using CSS. You can learn how to do this in How to Set a Background Image in HTML . Be sure to use the CSS property background-repeat: repeat; to make your repeating background image cover the page like wallpaper.
  7. 7
    Insert your HTML tables. To learn how to make tables in HTML, check out our guide to creating tables . You can also skip the learning and use a table maker like HTMLtables.io to generate HTML to paste into your file!
    • If you'd rather not mess around with tables, you can get the same effects applying CSS properties to Div tags—especially the border-style: inset property.
    • HTML tables of the 1990s had thick beveled borders. In the 2000s, tables became more aesthetically pleasing, either with single 1px borders or no borders at all.
  8. 8
    Upload your page and images. Make sure to upload your index.html page and all of the pictures to the same directory so the images will show up on the page. If your web host requires you to use FTP or SFTP to upload the site, try the free, open-source app FileZilla .
    • Don't forget to paste the code for your guestbook and hit counter into your page!
    9. Advertisement

Expert Q&A

Ask a Question
200 characters left
Include your email address to get a message when this question is answered.
Submit
      Advertisement

      Video

      Tips

      • Want to see something funny? Open Google and search for "GeoCities," and check out the font on the search page!
        Thanks
        Helpful 0 Not Helpful 0
      • If you download graphics or buttons from a website to use in your design, give that site a link on your links page.
        Thanks
        Helpful 0 Not Helpful 0
      Submit a Tip
      All tip submissions are carefully reviewed before being published
      Name
      Please provide your name and last initial
      Submit
      Thanks for submitting a tip for review!
      Advertisement

      Warnings

      • Using blinking or flashing images on your website looks cool, but it could negatively affect viewers with seizure disorders. Use these features sparingly, or add a big warning to the top of your page so people can choose to click away.
        Thanks
        Helpful 0 Not Helpful 0
      • When you find graphics, backgrounds, and buttons online, download them from the site and upload them to your web host before using them in your designs. Hotlinking images (when a website uses an image that's on another person's webserver) is frowned upon, as it uses up the artist or archive's bandwidth. [7]
        Thanks
        Helpful 0 Not Helpful 0
      Advertisement

      You Might Also Like

      How to
      Login to a Website as an Admin
      How to
      Make a Free Website with Google Sites: Step-by-Step Guide
      How to
      Download, Install, and Use XAMPP on Windows
      How to
      Make a Link to a Specific Part of a Webpage in HTML
      How to
      Add Fun Games to Your Web Site for Free
      How to
      Host a Web Server for Free on Your Computer
      How to
      Change Text Color in HTML and CSS
      How to
      Create Your First Website
      How to
      Design a Website: Ideas, Layout, Optimization, & More
      Creating a How-To Website: A Complete Guide
      How to
      Be Your Own Certificate Authority
      How to
      Create a Web Host in Your Home
      How to
      Put Video on a Web Page
      How to
      Add Forums to a Website
      Advertisement

      References

      1. ↑ https://www.webdesignmuseum.org/
      2. ↑ http://textfiles.com/underconstruction/
      3. ↑ https://www.w3.org/WAI/PF/HTML/wiki/Table/layout_TABLE_deprecation
      4. ↑ https://html.com/media/
      5. ↑ https://github.com/tholman/cursor-effects
      6. ↑ https://htmlcolorcodes.com/color-chart/web-safe-color-chart/
      7. ↑ https://www.pixsy.com/academy/image-owner/hotlinking/

      About This Article

      In other languages
      Thanks to all authors for creating a page that has been read 40,259 times.

      Is this article up to date?

      Advertisement