Discover best practices for creating and organizing content for
your website on Wings.
for the Web – A useful summary of best practices. Learn
to write pages that are easy for the eye to scan, and that rise to
the top of search engine results.
for the Web (video series) – This series of videos,
produced for the UB Digital Content Transformation, covers Web
writing best practices in more depth (35:41).
University at Buffalo
Stylebook and Notes – Consult this online glossary for
guidance on the spelling and usage of UB-specific terms, such as
those referring to UB programs and buildings.
See the UB
Communications Toolbox for UB logo downloads, brand guidelines,
acceptable typefaces and university colors.
In order to use an image on the Web, it must be saved as an
appropriate file type. Here is a list of popular file formats and
an explanation of their uses:
- GIF (Graphics Interchange Format) – This format
works well for simple graphics with few colors and large blocks of
solid color. Use it for logos, diagrams, and icons. Transparent
background. Simple animation. Typically has a small file size.
- JPG or JPEG (Joint Photographic Experts Group)
– This format is best for photographs and images with many
shades of realistic color. Typically has a larger file size.
- PNG (Portable Network Graphics) – Somewhere
between a GIF and a JPG, this file format can handle a transparent
background and many colors.
Create images for your website in your favorite graphics
application. You may download graphics applications from the UBIT
Software page, or use other applications you purchase, such as
Create your images at the size they will actually appear
on your Web page, or resize acquired images to the size they will
appear. Avoid resizing the image using an HTML editor or HTML code:
this will slow down the speed at which your pages load, and
frustrate your site’s visitors.
For example, if your image will display as 250 pixels wide
and 250 pixels tall, do not use an image that is 1000 pixels wide
and 1000 pixels tall and “shrink” the image by setting
the image with in an HTML editor. Instead, resize the image in a
graphics application to 250px X 250px.