{"id":875,"date":"2017-09-01T20:16:56","date_gmt":"2017-09-01T20:16:56","guid":{"rendered":"https:\/\/in.nau.edu\/web\/?page_id=875"},"modified":"2020-05-04T09:23:45","modified_gmt":"2020-05-04T16:23:45","slug":"image-standards","status":"publish","type":"page","link":"https:\/\/in.nau.edu\/web\/image-standards\/","title":{"rendered":"Image Standards"},"content":{"rendered":"

Image standards<\/h1>\n
Only photos approved by NAU Marketing can be used on WordPress sites. Approved photos are available in the NAU Online Photo Gallery<\/a>. If you are actively publishing pages in WordPress and do not have access to the\u00a0 NAU Online Photo Gallery<\/a>, please reach out to your Unit Web Coordinator<\/a> for assistance.<\/p>\n
Watch the Media Library video<\/a><\/p>\n\n
\n \n
\n
Image naming Accordion Closed<\/span><\/h4>\n <\/span>\n <\/div>\n <\/a>\n
\n \n\n
Some media element details must be edited before being uploaded to WordPress. Other details that are essential for accessibility can be edited after upload. These details will live with the image, so you only need to enter the information once.<\/p>\n
Image filename<\/h3>\n
\n
5 to 7 descriptive words<\/li>\n
Only lowercase letters<\/li>\n
Hyphens instead of spaces<\/li>\n
No special characters<\/li>\n
E.g. nau-ambassador-talking-to-students.jpg<\/li>\n<\/ul>\n
Media library caption<\/h2>\n
Unless you want an image caption to automatically appear on your webpage, please do not populate the caption field.<\/p>\n
Media library title<\/h2>\n
The media element’s t<\/strong>itle<\/strong> is different from the file name provided when you uploaded the element. The title within WordPress should be descriptive and readable.<\/p>\n
\n
Title of each image to match file name<\/li>\n
Use spaces instead of hyphens<\/li>\n
Use appropriate capitalization<\/li>\n
E.g. NAU ambassador talking to students<\/li>\n<\/ul>\n
Media library alt text<\/h2>\n
Including Alt Text for every media element ensures that screen readers and similar technology can describe the element to someone who may be visually impaired. Be as descriptive as possible.<\/p>\n
\n
Complete sentence structure<\/li>\n
E.g. Male freshman student happily interacts with NAU Student Ambassador.<\/li>\n<\/ul>\n<\/body><\/html>\n\n <\/div>\n<\/div>\n\n\n
\n \n
\n
Publishing Images Accordion Closed<\/span><\/h4>\n <\/span>\n <\/div>\n <\/a>\n
\n \n\n
Accessing the Media Library<\/h2>\n
Adding media to your WordPress site adds it to your Media Library, so you can access the same media from any Page or Post in your site.<\/p>\n
There are several methods to access the Upload New Media<\/strong> tool:<\/p>\n
$\"Arrows$ <\/p>\n
\n
Click Media<\/strong> from the side menu, then select Add New<\/strong><\/li>\n
Click + New<\/strong> from the top menu, then select Media<\/strong> $\"The$ <\/li>\n
In the Page or Post editing view, click Add Media<\/strong> above the text editor<\/li>\n<\/ul>\n
\n
Uploading Images<\/h2>\n
In the Upload New Media<\/strong> tool, you can drag and drop images into the window or click Select Files<\/strong> to navigate to the media on your computer or network drive.<\/p>\n
$\"The$ <\/h3>\nImage size tips<\/h3>\n
\n
Images cannot be larger than 8 MB<\/li>\n
Images should be 2400 px wide and 72 dpi<\/li>\n<\/ul>\n<\/body><\/html>\n\n <\/div>\n<\/div>\n\n
Choosing effective photos<\/h2>\n
The images you use should: <\/strong><\/p>\n
\n
appear to capture a moment in time<\/li>\n
avoid direct eye contact or posing<\/li>\n
portray action and movement<\/li>\n
convey a sense of place<\/li>\n
communicate our commitment to diversity when possible<\/li>\n
focus on profiles, stories, and strong human interest\u2014images should have an editorial look and feel to them<\/li>\n
meet prospects right where they are<\/li>\n
have a clear relation to the content\u2014doesn\u2019t always need to be direct, but should make sense<\/li>\n<\/ul>\n\n\n
\n
\n
\n \n
\n
\n Bad photo examples Tab Open<\/span>\n <\/h4>\n <\/div>\n <\/a>\n <\/li>\n
\n \n
\n
\n Good photo examples Tab Closed<\/span>\n <\/h4>\n <\/div>\n <\/a>\n <\/li>\n <\/ul>\n \n
\n \n
\n
Bad photo examples Accordion Open<\/span><\/h4>\n <\/span>\n <\/div>\n <\/a>\n
\n \n\n\n
$\"\"$
\nThe fade effect gives this photo a dated look. The positioning of the athlete should not show the back of her head and the background is too complex.<\/p>\n
\n
$\"\"$
\nAlthough a text overlay may seem compelling, the statement cannot contribute to the SEO of the page and is inaccessible for users who need screen readers.<\/p>\n\n\n <\/body><\/html>\n\n <\/div>\n<\/div>\n\n \n
\n \n
\n
Good photo examples Accordion Closed<\/span><\/h4>\n <\/span>\n <\/div>\n <\/a>\n
\n \n\n\n
$\"\"$
\nThis photo conveys the sense of diversity here at NAU. It has good balance and composition, and captures a moment in time which makes it feel more authentic.<\/p>\n
\n
$\"\"$
\nThis image shows an iconic NAU building to convey a sense of place and portrays action and movement.<\/p>\n\n\n <\/body><\/html>\n\n <\/div>\n<\/div>\n\n <\/div>\n\n\n
\n
\n\n
\n
\n
Academic unit site support<\/h3>\n <\/div>\n
\n
\n