Student Email HTML Guidelines
These guidelines are intended to assist you with creating emails formatted in HTML that can be sent to students. HTML-formatted emails can be complex with graphics and images or simple with bolded, italicized or centered text.
Please contact Enrollment Services Communications with questions.
- The viewing area can be quite small (e.g. mobile devices), so either use a flexible, percent-based table, or else a narrow fixed table. The recommended width is 700 pixels, which is also the width that ES Communications uses. Do not use a CSS-based layout structure, since it is likely to fail in multiple email clients (Outlook, Gmail, Yahoo, etc.).
- Page title is not needed. Some email clients may display the title as part of the message.
- All HTML emails submitted must include specific information including a physical address and an opt-out message
as required by the CAN-SPAM Act. Copy and paste this required code directly into your HTML code and place it in the
footer of your email.
Email is SDSU's <a href="https://registrar.sdsu.edu/students/additional_resources_students/email_mailing_updates" target="_blank">official form</a> of student communication. To ensure future delivery, please add our email address to your address book, safe sender list, or buddy list. Update your contact information in the <a href="https://sunspot.sdsu.edu/pls/webapp/web_menu.login" target="_blank">SDSU WebPortal</a>. <br /><br /> This email was sent to [% member:email %]. If you would like to opt back into receiving emails you can do so by <a href="[% manage_url %]">managing</a> your preferences. If you no longer wish to receive email messages from SDSU which may include important information regarding registration, deadlines and graduation, you may <a href="[% unsub_url %]">unsubscribe</a>.<br /><br /> <a href="https://www.sdsu.edu/"><img alt="SDSU" border="0" height="30" src="https://s3.amazonaws.com/emma-assets/p7zcb/11f56bc861ddc102f95a0a7ca6527855/sdsu_logo.png" width="150"/></a><br /><br /> <a href="https://www.google.com/maps/place/San+Diego+State+Universityfirstname.lastname@example.org,-117.073442,17z/data=
!3m1!4b1!4m5!3m4!1s0x80d95686a6a04a21:0xc39f2ac6bf82f916!8m2!3d32.7759894!4d-117.0712533" target="_blank">[% account_rsvp_address_1 %] [% account_rsvp_address_2 %]<br />[% account_rsvp_city %], [% account_rsvp_state %] | [% account_rsvp_zip_code %] [% account_rsvp_country %]</a>
You may add styling so that it matches the rest of your email.
- You must use the following code in the body of your message to accurately personalize
- For first name: [% member:first_name default="Student" %]
- For last name: [% member:last_name default="Name" %]
- Example: "Dear [% member:first_name default="Student" %] [% member:last_name default="Name" %]," will show as "Dear Student Name," or "Dear Jane Smith,"
Graphics and Links
- Graphics must be saved to your server.
- Include alt attributes on all images. This describes the image to the user, is shown when images are not loaded, and is also required to meet accessibility standards.
- Keep graphics small in file size (total page less than 500K, but the smaller the better) and limit text. Some ISPs block large messages.
- Use absolute URLs for images and links, which is the entire file path of where the graphic is
stored on your server (or the full website URL for the image). Make sure you include
the https:// as appropriate.
For example: https://registrar.sdsu.edu/_resources/images/header_registrar.jpg
- Do not use the text, "Click here" as your links in the email. It is not considered
accessible. Instead link key phrases that identify what a click or tap of the link
is going to render. Links should go where they say they are going to go. Before submitting
your HTML file, make sure to check all links to ensure they work and that they are
going where the email copy describes.
For example: If you want to link to the Office of the Registrar website, then the text showing for the link would be, "Office of the Registrar website" and the text itself would be hyperlinked to https://registrar.sdsu.edu. The code would look like: <a href="https://registrar.sdsu.edu" target="_blank">Office of the Registrar website</a>
- Designate links to open in a new window (target="_blank").
For example: <a href="https://registrar.sdsu.edu" target="_blank">Office of the Registrar website</a>
- Embed styles within the HTML using inline styles (within the code). Do not link to or attach a style sheet as these are usually ignored by email clients and security settings often block attached style sheets. Internal style sheets located at the top of the HTML may also be ignored by some email clients, but not in others.
- Make sure the page is readable without styles. Many email clients ignore CSS. This will also with the accessibility to all viewers.
- To ensure the email looks the way you want it to, send yourself a test email through both Outlook and Gmail prior to submitting your HTML file to ES Communications.
Requesting HTML emails
- Complete and submit the Student Message Request form indicating the personalization options used as well as whether your message will be plain text or HTML.
- Submit the HTML file to Enrollment Services Communications at the same time you submit the Student Message Request form. This is the only file needed because all images have absolute URLs and CSS is embedded in the HTML.