Author: LoriBrister

Starting from One with Web Design

Hit the ground running with Bootstrap and other web design tools.

N.B. Much of the following post is a continuation/ sequel to Starting from Zero with Web Design, so if you haven’t read that post you may want to start there, as it provides context for the information given here. On the other hand, if you haven’t read the earlier article, I have also included tips for jumping ahead, that is, over, coding all together. 

You don’t have to start from scratch.

Humanists have busy schedules. Between our dissertations, articles, teaching, grading, etc. etc….. etc… there isn’t much time left to learn code and build a website. But we still have interesting collections, data, maps, and other ideas to share. Can we still be digital humanists? This has been the debate at the center of the field for years, partially because of remarks made by Stephen Ramsay, who has far, far more clout than I do, so I’m going to avoid a lengthy discussion for now. But, in short, technology has advanced so rapidly that you no longer have to know how to code, let alone program, in order to build, which is, at least according to Ramsay, the crucial element of digital humanities.

Some of the sources below are absolutely free, while some require a monthly fee. Many platforms require no coding experience at all, while others, like Bootstrap, require some working knowledge.

WordPress is a simple, free platform for sharing research, bibliographies, and archives. Most people think of WordPress as simply a blogging tool, but you can also set up “Pages.” What’s the difference? Blogs are displayed and read in “rolls,” so that each new post appears above the previous posts on your homepage. A “Page” is a single post, like an “About” page or “Links” page that is static, but easy to update. You simply edit your page to add new information, rather than adding a new post. Tawnya Ravy’s SalmanRushdieArchive is a great example of a DH project that runs off WordPress. There’s a small, yearly fee of around $18 for adding your own domain name, but it’s free if you keep as your URL.

If you decide to get server space (either free or paid hosting), you can run WordPress on your site for free by downloading from, and many host providers like GoDaddy include a WordPress plugin to run your entire site or even just a blogging component of your site. I use the WordPress plugin to power the blog page of my own website.

Blogger is powered by Google, but is very similar to WordPress. It’s a free blogging service with a lot of templates to choose from. You can also add static pages to organize information or archives. One benefit of Blogger is that you do have access to your source code to change colors or fonts. This allows for increased customization over WordPress, which makes you pay extra for many customization options.

Drupal is another powerful Content Management System (CMS) for websites that you can use if you already have server space. Like, Drupal is free and open source; however, it is not designed specifically as a blogging platform. Drupal is for designing more dynamic websites. You can use one of Drupal’s templates “out of the box,” or if you are code-savvy, you can customize the design to make it uniquely yours. Drupal is often used by web developers for high-profile, massive hits pages; for instance, is a Drupal site. Drupal is also available as a free plug in from many server providers.

Squarespace is a great all-in-one option that probably costs less than your Netflix subscription. You get server space, a domain, and a ready-made theme/template. A simple tutorial program leads you through the steps to customize your page. No coding is required. Squarespace is $8 per month if billed annually, or $10 for a month-to-month plan. For a few dollars more you can get buy a sleek template that will make your website look like you paid a developer thousands of dollars.

Bootstrap: So let’s say you do know a little bit about coding, or at least enough to poke around and figure things out, but you don’t want to start your HTML or CSS from scratch. Bootstrap is a free, open source framework for web design and development. If you’ve worked your way through Codecademy‘s “Build Your Own Professional Website” course, then you already know a little about Bootstrap. It’s the coding framework you use at the end of the tutorial to recreate the Airbnb website, which is built with Bootstrap.

Bootstrap was designed by people at Twitter, but because it’s open source, a lot of variations are available via GitHub (a website for sharing open source code of all kinds) and other sites. My own website was built using a version of Bootstrap called “Modern Business,” which includes a javascript image carousel, similar to what you find on Hulu or Netflix, along with over a dozen templates for webpage. If you download the Bootstrap package, it comes with HTML, CSS, Javascript, fonts, and a lot of other extras. I didn’t know a lot about CSS and nothing about Javascript when I started using Bootstrap, but you learn a lot more by doing. Here’s an entire gallery of really great websites built with Bootstrap. Because it’s so versatile and easy to use, a lot of web developers are now getting paid a lot of money to build customized Bootstrap sites.

We want to hear from you!

Do you have any tools, platforms, or plugins that you recommend to people who want to get their DH project up and running? Do you have more excuses for why you still haven’t started that DH project you’ve been rolling around in your head for months? Let our team of marginally trained grad students help you out! Tell us what to write about next time!


Lori Brister is a doctoral candidate in the English Department at The George Washington University, where she is completing her dissertation on the history, literature, and ephemera of nineteenth century tourism. She is currently building an interactive GIS program that maps texts and images related to tourism. To learn more about Lori’s work, visit


Starting from Zero with Web Design

ICodecademyCode2‘ve always been interested in web design, though I didn’t know what to call it. I built my first website in the proverbial dark ages of Internet temporality. Spatially, it was located in some long-forgotten Geocity. There were probably twinkling stars. A midi-file of Richard Marx  undoubtedly  played in the background. Over the years I’ve experimented with customizing blogs, but my attention was diverted by jobs and grad schools, when all the while, technology was advancing exponentially. Worse still, I was nearing the end of my PhD and realizing for the first time that the humanities had emerged into the digital age. Too much had changed to just pick up where I left off, and I found myself starting all over again at zero.

If you feel like you’re always playing catch up but don’t know where to start, you’re definitely not alone. Here are a few tips and tricks I picked up over the past year.

Where to Start

Web Design

Start with web design. Most websites are written in a combination of HTML and CSS.  HTML stands for “Hyper Text Markup Language,” and it’s the basic language of the Internet. On its own, an HTML site would look pretty boring without lines of code that say “Use this font for the headings” or “Use this image as the background.” But if you write that over and over and over again in your HTML, it gets messy and cluttered, i.e. bad code. That’s where CSS (Cascading Style Sheet) comes in.

CSS is a separate page of code that tells your HTML, “For all headings, use this size font; for all paragraphs, use this color font.” CSS is more efficient because nobody has just one webpage. You may have one website, yes, but each site is made up of many different pages, such as “About,” “Blog,” and “CV.” If , for instance, you decide you don’t like that font or color after all, you would have to go into every single page to make changes. That’s where CSS comes in. You can factor all of that style out of your HTML pages into a CSS page. Then, for any changes you make on the style sheet, it “cascades” down through all of your HTML pages. All the pages are changed at once, and your page looks uniform and more professional.

Where to Learn HTML and CSS

Codecademy BadgeCodecademy is a great place to start; it’s a free website full of tutorials to teach yourself code. You’re given a three-panel environment, including an instructions panel, a text editor to write your code, and a “browser” window that instantly reflects your changes.  Each course at Codecademy is divided into sections and structured like a game. You get points for every exercise, and at the end of every section, you collect a badge that says “HTML Basics III” or “200 Exercises.” The website tracks your progress through each course, so you can compete against your best daily high score, and always start exactly where you left off.

Codecademy gives you a lot of course options–HTML, Python, Ruby, etc–and you’ll probably want to dive right into all of them, but be patient. Start with HTML/CSS, then when you’re done with that, use Codecademy’s recently released “Build Your Own Professional Website” tutorial to practice all your new mad skillz. (Yes, you will be saying exactly that when you brag to your friends.) This tutorial also teaches you about Bootstrap, an opensource framework for building websites. You can download Bootstrap for free and use professionally built CSS pages.

Since From Zeros and Ones, and the entire DH Working Group, is about admitting what we don’t know, learning from each other, and sharing our progress along the way, here’s the first rough prototype of my website that I built after finishing Codecademy’s tutorial. (You can also visit the current version of my website here:, now, sadly, without Richard Marx midi files.)

If you’ve finished up with Codecademy and want to move on to more advanced HTML and CSS, W3Schools has excellent in-depth tutorials for pretty much everything from formatting CSS to a useful tool for finding colors using hexadecimal values–the 6-character code browsers use to display millions of colors.

You can also learn a lot just by asking for help. Dr. Daniel DeWispelare, of the GWU English Department, led two workshops for our DH Working Group, covering an enormous amount of HTML, CSS, PHP, and SQL. Ask your friends, colleagues, and professors. You’re sure to find someone who enjoys building sites (or working with other coding languages) and will be happy to help.

Questions about Building Your Own Site

What do I need to get started?

You’ll need a text-editor for writing out your HTML/CSS. Technically, you can do that on Windows Wordpad, but you’re just asking for headaches. Text editors like Komodo (free!) work best because they use “syntax highlighting,” where, for instance, your tags  (<header></header>) may appear purple if you’ve written them correctly, but turn orange if there are any errors in your code’s syntax. Just like saving any other file on your computer, you can add an extension like .html and .css. The homepage of any website is always saved “Index.html”. You will also need an FTP (File Transfer Protocol) program for transferring your HTML and CSS files from your computer to your server. I use Filezilla, which is also free.

What’s a server and do I really need one? 

A server is another computer (albeit a much more powerful one) where websites are stored. You can build a website on your own computer, but nobody else can see it, and you probably want to show off your new skills. When you put your website on a server, it’s accessible to anyone with an internet connection.

Server space usually costs money, but there are free options out there for playing around with webdesign, anything from the simple changes to building complex websites. Blogspot still lets you edit your own HTML files, whereas WordPress charges a fee to access your HTML and CSS files. Many schools and universities offer free server space to students and faculty through the IT department. Finally, if you want to get experience but aren’t quite ready to show the world, free programs like WAMP (for Windows) and MAMP (for Macs) allow you to use your own computer as a “server.” You can view the site in your own browser, but it’s not actually on the Internet. No one else can see it; your site is as private as the photos or other files on your computer. These programs are often used by professional developers to perfect code before launching sites.

The best advice anyone ever gave about anything, including web design.

Unless you’ve got access to the nuclear launch codes, the best way to learn is by experimenting. Change the font, change the background color, changes the header. You can change them back if you want. Start small, build up your confidence, you won’t believe how quickly you’ll progress once you’ve got the basics.

If you’ve got advice for getting started with web design–or DH more generally–let us know in the comments below. And feel free to share your own stories and sites!

Lori Brister is a doctoral candidate in the English Department at The George Washington University, where she is completing her dissertation on the history, literature, and ephemera of nineteenth century tourism. She is currently building an interactive GIS program that maps texts and images related to tourism. To learn more about Lori’s work, visit