Penn Graduate Student Center
Posting Events on the Website All of the following steps are done in the Events Management database.
THE BARE MINIMUM CHECKLIST *When reusing or re-activating an event from within the Events database, most event descriptions must be altered to meet the standards below. Never assume an event description meets those standards until you review it against the rules below. ! Properly mark paragraphs. An events description can have as many paragraphs as necessary. Just be sure to mark each and every paragraph with the proper code: <p> (at the beginning of a paragraph) and </p> (at the end). Proper paragraph breaks will auto-magically appear when the event displays on our website. As a result, <br /> is never to be used. Example Code: <p>Managing the demands of graduate school and parenting can be difficult for students, partners, and their families. This event will give you a chance to meet other Penn students and partners to share experiences, find advice, and make new friends. Partners and children are welcome.</p> <p>We will provide free brunch and craft materials but ask that you please register in advance.</p>
Appears as: Managing the demands of graduate school and parenting can be difficult for students, partners, and their families. This event will give you a chance to meet other Penn students and partners to share experiences, find advice, and make new friends. Partners and children are welcome. We will provide free brunch and craft materials but ask that you please register in advance. ! Make web addresses into links. The full web address is never be provided in the event descriptionâ&#x20AC;&#x201D;simply provide a link for the appropriate word(s). If printed, the page will auto-magically print out the full web address of the link. Nifty! Wrong: For more information, visit the Gnome and Dwarf Club website (http://www.gnomedwarfagency.com). Example Code: For more information, visit the <a href="http://www.gnomeanddwarf.org"> Gnome and Dwarf Club website</a>.
Appears as: For more information, visit the Gnome and Dwarf Club website. The phrase "click here" is banished from our website kingdom. Wrong: To learn more about this event click here. Right: Additional information about this exhibit.
! Write out e-mail addresses, but also make them into links. Example Code: To register for any of the events below, please email <a href="mailto:ctlhelp@sas.upenn.edu">ctl-help@sas.upenn.edu</a>.
Appears as: To register for any of the events below, please email ctlhelp@sas.upenn.edu. ! Define any abbreviations and acronyms. If an acronym or abbreviation is to be used in the description, please use the <abbr> element to define it. Example Code: <abbr title="The Graduate and Professional Student Assembly">GAPSA</abbr>
Appears on the site (when the user hovers near the abbreviation):
! The ampersand (&) gets some special lovinâ&#x20AC;&#x2122;. In order to accommodate as many devices and browsers as possible, ampersands must be entered into the XHTML code as: &amp; Example Code: Brad Pitt &amp; Angelina Jolie
Appears as: Brad Pitt & Angelina Jolie 2
GET FANCY Emphasize important text. When text needs to be stressed for the reader use <span class="attention">. It will auto-magically render the text on the website as both red and bold. Do not use additional code to provide the bold or color styles. Example Code: I like you, but <span class="attention">not like that</span>!
Appears as: I like you, but not like that! Format Text: Italicize Example Code: You’re not <em>that</em> cute. Appears as: Your’re not that cute. Format Text: Bold Example Code: Tickets are <strong>non-refundable</strong>. Appears as: Tickets are non-refundable. Create a bulleted list. Example Code:
<ul> <li>smart</li> <li>sexy</li> <li>beautiful</li> </ul>
Appears as: • • •
smart sexy beautiful
3
Really Attracting Attention In the spirit of our helpful gnome, there are two classes available for drawing explicit attention to text on the screen. <div class="information"> (for the helpful to know, but not critical statements) and <div class="exclamation"> (also known as the "hey, dumbass!" statement that attempts to knock the user over the head to note something truly important). A word of caution: donâ&#x20AC;&#x2122;t overuse these! Save them for truly important statements. Otherwise, their usefulness at attracting attention will be diminished. - Information Example Code: <div class="information"><p> Seeking funding through fellowships or grants? Visit <a href="../navgrant/resources.php">Navigating the Grant: Resources</a>.</p></div>
Appears as:
- Exclamation Example Code: <div class="exclamation"><p> To complete your registration, don't forget to give us your <a href="#details">Contact Details.</p></div>
Appears as:
WANNA LEARN MORE? This is just the beginning (I know, I knowâ&#x20AC;&#x201D;you are quivering with excitement)! To learn about writing for the web, see: Online Style & Gnomenclature Guide. (http://www.gsc.upenn.edu/admin/guides/style.pdf)
4