HTML & Web Development Resources
The following resources include tools, software, browsers, references, and services that can be useful when learning HTML, designing websites, developing webpages, and managing websites.
This is a curated collection rather than a complete directory. Some resources are included because I personally use or recommend them, while others are widely used references and tools that are helpful during web development. Additional resources will be added as useful tools are discovered.
HTML & Web References
These references are useful when checking HTML syntax, browser behavior, web standards, accessibility, and other technical information.
| Resource | Description |
|---|---|
| MDN Web Docs | A detailed reference for HTML, CSS, JavaScript, Web APIs, accessibility, and other web technologies. |
| WHATWG HTML Living Standard | The current HTML standard and a useful technical reference when checking the exact requirements for HTML elements, attributes, and browser behavior. |
Fonts & Icons
Font and icon resources can help with choosing, organizing, and using typography and scalable icons in web projects.
| Resource | Description |
|---|---|
| FontBase | A font manager for organizing, previewing, and activating fonts. It also provides access to Google Fonts from within the application. |
| Google Fonts | A large collection of fonts that can be browsed and used for web typography. |
| Adobe Fonts | A large font library that integrates with Adobe applications and supports fonts for desktop and web projects. |
| Font Awesome | A large collection of scalable icons that can be used in websites and user interfaces. |
Web Browsers
Testing webpages in more than one browser helps identify differences in rendering, forms, CSS, newer web features, and browser-specific behavior.
| Browser | Description |
|---|---|
| Firefox | Mozilla's web browser and an important browser for testing websites using the Gecko rendering engine. |
| Google Chrome | Google's web browser and a useful development and testing browser with built-in developer tools. |
| Microsoft Edge | Microsoft's Chromium-based browser and an important browser for testing websites on Windows. |
Code Editors
You do not need an expensive web development application to create HTML and CSS. A plain-text or source-code editor is enough to build a complete website.
| Software | Description |
|---|---|
| Adobe Dreamweaver | A professional web development application with source-code editing, site management, FTP, and other website development tools. |
| Notepad | The basic text editor included with Windows. It can be used to create and edit HTML and CSS files without additional software. |
| Notepad++ | A free source-code editor for Windows with syntax highlighting, tabs, search tools, and other features that make editing HTML and CSS easier than using a basic text editor. |
Graphics & Image Editing
Image-editing software is useful for preparing photographs, logos, graphics, backgrounds, and other images before they are placed on a website.
| Software | Description |
|---|---|
| Adobe Photoshop | Professional image-editing software for photographs, graphics, web images, image optimization, and design work. |
| GIMP | Free and open-source image-editing software for photo retouching, image composition, graphics, and other image-editing tasks. |
| IrfanView | A lightweight Windows image viewer with useful image conversion, resizing, cropping, batch processing, and basic editing tools. |
Color Tools
Color tools can provide inspiration and help identify color combinations, palettes, shades, tints, and color values for web design projects.
| Resource | Description |
|---|---|
| SchemeColor | A color palette resource with color schemes, hexadecimal and RGB values, shades, tints, gradients, and other color information. |
Online Code & Browser Support
Online coding and compatibility resources are useful for experimenting with HTML and CSS and checking whether web features are supported by different browsers.
| Resource | Description |
|---|---|
| CodePen | An online code editor for creating and experimenting with HTML, CSS, and JavaScript examples directly in a browser. |
| Can I Use? | A browser compatibility reference for checking support for HTML, CSS, and other web platform features across browsers. |
Validation & Testing
Validation, accessibility, and performance tools can help locate errors and potential problems before a website is published or while an existing site is being maintained.
| Resource | Description |
|---|---|
| W3C Markup Validation Service | Checks HTML and other markup documents for syntax and conformance problems. |
| W3C CSS Validation Service | Checks CSS stylesheets and CSS contained in webpages for errors and standards-related problems. |
| WebAIM Contrast Checker | Checks the contrast between foreground and background colors to help evaluate text color accessibility. |
| PageSpeed Insights | Analyzes webpage performance and provides information that can help identify performance and user-experience problems. |
Web Hosting & Domains
A web hosting account stores the files used by a website, while a domain name provides the address visitors use to reach the site. Many companies provide both services, but hosting and domain registration do not have to be purchased from the same company.
| Service | My Experience |
|---|---|
| HostGator | My overall choice for web hosting. I have tested many of the popular web hosting services over the years, and HostGator stands out for the way I prefer to build and manage websites. |
| GoDaddy | I do not use GoDaddy for web hosting, but I find it convenient for purchasing and managing domain names. |
Note: Hosting requirements vary considerably between websites. Compare current pricing, features, renewal costs, storage, backups, support, server requirements, and account limitations before choosing a hosting provider.
FTP Software
FTP software provides a convenient way to transfer website files between a local computer and a web server.
| Software | My Experience |
|---|---|
| FileZilla | I have used FileZilla for many years. Of the FTP programs I have tried, I find it one of the easiest ways to upload, download, and manage website files on a web server. |
Adobe Creative Cloud
Adobe Creative Cloud provides professional applications that can cover much more than web development. My subscription gives me access to applications such as Dreamweaver, Photoshop, Illustrator, and Acrobat.
For someone who regularly uses several Adobe applications, the subscription can provide a complete collection of professional design and development tools. For someone who only needs to edit HTML or make occasional changes to images, however, the subscription may be difficult to justify because capable free and lower-cost alternatives are available.
My Bare-Bones Web Design Setup
If I were no longer using my Adobe subscription and wanted a simple, inexpensive collection of tools for building and maintaining websites, I would start with the following:
| Task | Software | Why |
|---|---|---|
| HTML & CSS | Notepad++ | A lightweight source-code editor with the features needed to comfortably create and maintain HTML and CSS files. |
| Image Viewing & Quick Editing | IrfanView | Fast and convenient for viewing, resizing, cropping, converting, and performing basic image work. |
| Advanced Image Editing | GIMP | A free image editor with more advanced tools for work that would otherwise require software such as Photoshop. |
| File Transfer | FileZilla | A straightforward way to transfer and manage files on a web server. |
| Browser Testing | Chrome, Edge & Firefox | Testing in multiple browsers helps catch compatibility and rendering differences before a website is published. |
This basic collection provides everything needed to write HTML and CSS, prepare images, transfer files to a server, and test webpages without requiring a paid web development suite.