DotCMS is the content management system used by SUNY Cortland to manage the cortland.edu website. This guide is supplied as a reference for common functions and workflows in dotCMS.
The content editor in dotCMS contains many of the same editing functions of a word processor. This section highlights the most common functions of the editor toolbar, pictured below.
Use Bold sparingly to indicate important text.
Use Italic sparingly to indicate important text that should be read with emphasis.
Use Header > Little Header to reduce the font size of a heading to the normal paragraph font size.
Use Links > Screen Reader Only to include text that is accessible to screen readers but not shown on screen. This can be used to enhance link text like “Read More” that does not describe where the link goes.
Use h2 through h6 to indicate headings.
The h1 heading is used for the title of the page, which is included automatically on a SUNY Cortland webpage. Subsequent headings define the structure of the page. Examples of proper heading structure are provided on Mozilla Developer's Network website.
Use the Insert/edit image option to manage the source and image description for an image.
The image description should include concise, meaningful information that is provided to screen readers in place of the image. For more information, view the visit the Images in dotCMS section below, and view Webaim's Alternative Text article.
Select the text/content in the editor that you'd like to reformat, then use the clear formatting button. This step should always be taken after pasting content from an outside source such as a Microsoft Word document.
When saving images for the web, the image format and compression will vary depending on the image.
Graphics and simple images with few colors should be saved as a PNG.
Photographs and full-color images should be saved using the JPEG format (sometimes labeled as JPG). When exporting an image from Adobe Photoshop, the Quality setting for a JPEG should be set between 40 and 55 percent, depending on the clarity needed. A banner image (848 by 403 pixels) should not exceed 75 kilobytes (kB) in size.
The following video describes the process of resizing an image and saving/compressing it for the web.
When inserting an image in dotCMS, include a description. The image description should include concise, meaningful information that is provided to screen readers in place of the image.
The description should include all important or meaningful information in the image. Consider the purpose of the image on the page; how is it relevant and what is it conveying? If the image was not shown, what would you need to know about it?
When creating images to use on your website, choosing the correct format and size is important.
Images in single-column body content should be no larger than 850 pixels wide, and only as tall as needed. Banner images should be sized to 850 pixels wide and 400 pixels high.
Images in the right column should be 232 pixels wide or less, and only as tall as needed.
When body content is split into two equal-width columns, images should be 408 pixels wide or less, and only as tall as needed.
When body content is split into a wide left column and a narrow right column, images in the right column should be no wider than 262 pixels, and only as tall as needed.