File naming for UC Media Library

Transcription

1 File naming for UC Media Library IMAGE USAGE TABLE The main image sizes you will use are marked with an asterisk. If you want to change images on landing pages or subsection landing pages, please contact the Web Team for assistance. See examples of the image types on page 6. IMAGE TYPE IMG SIZE ACRONYM Top grid medium 1200px x 1200px _TG-med Top grid small left 600px x 600px _TG-sml-lt Top grid small right 600px x 600px _TG-sml-rt Top grid long image 1200px x 600px _TG-long *Staff or student profile 600px x 600px _profile *3 column rows 724px x 484px _3col 4 column rows 526px x 400px _4col Hero banner with text 1106px x 800px _hero-txt Staff hero banner 916px x 800px _hero-staff Brochure/doc 296px x variable _doc Widget 526px x variable _widget Landing page with side nav banner *Gallery images 1696px x 1130px Gallery w/o caption Gallery with caption 1200px x 800px 1200px x 1200 px _full _gallery _gallery-caption All images scale with the browser size (to suit all devices tablet, phone and PC) Description_SectionName_UsageAcronym.fileExtension (if known) 1 of 14

2 DESCRIPTION GUIDELINES The description of the image has to be as detailed as possible which includes and not limited to the background image (building name, trees, objects), student/staff name, time of the day, etc. The description in the name could be used (or expanded upon) without the hyphens for the ALT text. The image should be easily identifiable from the description and the ALT text. Below are some examples: Eg: Campus-open-day-students-with-FollowMe-placards_FTS_full.jpeg NAMING MEDIA IN THE T4 MEDIA LIBRARY Relevant Fields Name The name should follow the ALT text guidelines below and be no more than 80 characters. 2 of 14

3 Description This should follow the description guidelines above, providing a detailed description of the image or document uploaded. It should not exceed 400 characters. Keywords This should follow the ALT text SEO keyword guidelines below and should not exceed 4000 characters. Type This is automatically populated by T4 based on the type of media uploaded. Media This is the file uploaded to the library and will display the filename when viewing the library; it should follow the guidelines above and include the section name and file acronym. Thumbnail Thumbnails can be uploaded for PDF and documents. This is useful when the thumbnail automatically generated by T4 for documents is distorted. It should not exceed 40 kbytes. NOTES ON LINKING MEDIA TO TEXT TO T4 When media or documents are linked to text in T4 it will automatically replace the text you have with the name of the document in the Media Library. Eg: If linking the text "Read the guide for setting up internet in Ilam and Sonada Apartments" to a PDF in the Media Library called "Internet Set Up Guide for Ilam and Sonada Apartments brochure 2015", the text will be replaced with "Internet Set Up Guide for Ilam and Sonada Apartments brochure 2015 ". For this reason, the Media Name for media/documents linked to text should exactly replicate the text they are linking to. In instances where media or a document is linked to text in two different places with different text, the document will need to be uploaded twice with two different Media Names. Eg. Text reading "The undergraduate prospectus" and "Read the 2016 Undergraduate Prospectus" would both need to be uploaded to the Media Library with different names, even if they are the same document. 3 of 14

4 NOTES ON ALT TEXT In T4 the NAME field is the ALT text field. Complete the file name minus the.jpg on the end. Below is an image of a correct sample. Alt text allows the content and function of an image to be understood by people who require text readers (such as sight-impaired users) or when a page is unable to load an image correctly. Alt text also provides another opportunity to add SEO (Search Engine Optimisation) text that includes relevant keywords to be in the primary results of a search through a search engine such as google, yahoo etc. Some key questions to ask about the image: - What information is it presenting? - What purpose does it fulfil in regards to the content? Some key points when creating alt-text: - Context is everything. How does the image relate to the content of the web page? - The point of alt-text is to define the images for your readers. Tell your readers as much as possible about the image using as few words as possible. - Don t use image of or graphic of, this will be fairly obvious and the aim is to be succinct. - Place the important details in the first few words. Location, person, context. - Once again, be descriptive but use as few words as possible- otherwise you lose a good opportunity for SEO. NOTES ON SEO SEO is the process of affecting the visibility of a website or a web page in a search engine s unpaid results. The better optimised a website, the higher it s search engine results ranking. SEO gets traffic to your website- targeted traffic. The search engines have a scanner built into their code so that they essentially scan the internet for the most relevant content. NOTES ON V2 FULL WIDTH BANNER: For pages that use the NEW TEMPLATES (V2 content types) instead of using the standard Image content type, use V2 Full Width Banner (which is equivalent to Full Width Image). This allows you to put in the Alt text appropriate for that page into the Alt text field. 4 of 14

5 This will display a full width image on the respective page: And a description that screen-readers can read: 5 of 14

6 IMAGE TYPES 1170px x 782px NOTE: Use v2 Full Width Banner as the content type for Full Width Images _full 362px x 242px 263px x 200px 263px x 263px _3col _4col _profile 570px x 560px 270px x 265px 270px x 265px _TG-sml-lt _TG-sml-rt 570px x 265px _TG-med _TG-long 6 of 14

7 553px x 400px _hero-txt 458px x 400px _hero-staff 7 of 14

8 SECTION ACRONYMS Please use the below table as a references to the acronyms to the Section Names. Section Name Academic Services Academic Skills Centre Admissions Admissions and Enrolment A-Z Services and Support Bridging Programmes Campus Services Current Students Departments and Colleges Early Years Care and Education Enrol Financial Future Students Health Care International Learning Resources Post Grad Qualifications and courses Regulations Student Support and Services Summer Courses Sustain The Uni UC UC Rec Acronym ASR ASC ADM AER AZS BRP CPS CUS DPC EYC ERL FNS FTS HCS INT LNR PGS QLC RGL SSS SMR SSN UNI UNC UCR Image examples 8 of 14

9 TOP GRID M07 (EG: FUTURE STUDENTS) Top grid medium image (_TG-med) Top grid small image (_TG-sml-lt, _TG-sml-rt) Top grid long image (_TG-long) STUDENT/STAFF PROFILE IMAGES (_profile) 9 of 14

10 3 COLUMN ROWS (_3col) 4 COLUMN ROWS (_4col) [EG: CURRENT STUDENTS] HERO BANNER WITH TEXT (_hero-txt) [EG: EARLY YEARS CARE & EDUCATION] 10 of 14

11 FULL WIDTH IMAGE (_full) [EG: COLLEGES] DOCUMENT & BROCHURE IMAGES (_doc) WIDGET IMAGE (_widget) 11 of 14

12 STAFF HERO BANNER M08 (_hero-staff) [EG: ACCOUNTING & INFORMATION] OTHER TYPE OF IMAGES: 12 of 14

13 VIDEO SCREENSHOT FOR BANNER VIDEOS 3 X 4 GRID IMAGES (EG: COURSES & QUALIFICATIONS) VIDEO THUMBNAIL SOCIAL MEDIA AND FUNCTION ICONS 13 of 14

14 WEB ICONS 14 of 14