Q:

503 status fails to load images or CSS

I have the following 503 status set:
RedirectMatch 503 ^/(?!index\.html)
ErrorDocument 503 /index.html
Header always set Retry-After "604800"

I understand that this rule tells any robots that the server is down for maintenance and to check back in a week.
This is working perfectly, but the server is failing to load any images or CSS. I've checked via the Google Chrome console and receive the following error:

Failed to load resource: the server responded with a status of 503
  (Service Temporarily Unavailable)

How do I add to the .htaccess file to include CSS and image files (JPG, PNG etc)?
In addition to this question, can you recommend a good resource for learning about .htaccess? The Apache documentation seems to be very bloated and difficult to navigate.

A:

Have mod_rewrite installed and try this:
RewriteEngine On
RewriteCond %{REQUEST_URI} !^(.*).png [NC]
RewriteCond %{REQUEST_URI} !^(.*).jpg [NC]
RewriteCond %{REQUEST_URI} !/index.html [NC]
RewriteCond %{REQUEST_URI} !^(.*).css [NC]
RewriteRule ^(.*)$ - [R=503,L]
ErrorDocument 503 /index.html
Header always set Retry-After "604800"

The 4th line checks the request to see if the part of the URL coming after the domain name is /index.html. The 2nd line checks to see if the URL ends in .gif. The 3rd line checks to see if it ends in .jpg, and the 5th line checks to see if it ends in .css. Add another line below it if you need to enable another file extension.
The 6th line means match anything when all the criteria is true (meaning all the rewritecond directives return true) and redirect it to error 503.
The 7th line sets the error 503 page to the contents of the /index.html page. The last line adds HTTP headers that cause the browser to store the copy of the page for 604800 seconds. This should be removed (and better yet, replaced with a no-caching option) if you plan to fix your site sooner than 604800 seconds.

