Understanding STATIC_URL in Django

Both STATIC_URL = 'static/' and STATIC_URL = '/static/' are valid configurations, but they have slightly different behaviors that might explain why one works for you and the other doesn't.

The Difference Between the Two Settings

According to the Django documentation, STATIC_URL must end with a slash if set to a non-empty value, which both of your examples do. The key difference is:

• STATIC_URL = 'static/' (without leading slash) is a relative URL path
• STATIC_URL = '/static/' (with leading slash) is an absolute URL path from the domain root

Why the Leading Slash Matters

When STATIC_URL is a relative path (without the leading slash), Django will prefix it with the server-provided value of SCRIPT_NAME (or / if not set). This is mentioned in the documentation note:

If STATIC_URL is a relative path, then it will be prefixed by the server-provided value of SCRIPT_NAME (or / if not set). This makes it easier to serve a Django application in a subpath without adding an extra configuration to the settings.

In most development environments with runserver, this should work fine either way, but there are scenarios where the absolute path (with leading slash) might be more reliable, especially if your application is served from a subdirectory.

Troubleshooting Your Static Files

If you're having issues with static files not loading, here are some things to check:

1. Make sure django.contrib.staticfiles is in your INSTALLED_APPS
2. Verify your static files are in the correct location (app_name/static/app_name/...)
3. Check that you're using the {% load static %} and {% static '...' %} template tags correctly
4. Ensure DEBUG = True during development (for automatic static file serving)
5. Check your browser's developer tools to see the actual URL being requested for static files

Example of Correct Configuration

Here's a complete example of how to set up static files:

PYTHONCopied
# settings.py
INSTALLED_APPS = [
    # ...
    'django.contrib.staticfiles',
    # ...
]

STATIC_URL = '/static/'  # This works reliably in most setups

# Optional: If you have project-level static files
STATICFILES_DIRS = [
    BASE_DIR / "static",
]

# For production (not needed during development)
# STATIC_ROOT = BASE_DIR / "staticfiles"

HTMLCopied
<!-- In your template -->
{% load static %}
<link rel="stylesheet" type="text/css" href="{% static 'myapp/style.css' %}">

Both forms are technically correct according to the documentation, but using the leading slash (/static/) is a common practice that tends to work more consistently across different deployment scenarios.