Wikivoyage:Banner Expedition

From Wikivoyage
Jump to: navigation, search

The Banner Expedition is a Wikivoyage Expedition to collaboratively develop and implement a page-top picture banner and horizontal Table of Contents for Wikivoyage guides. If you'd like to join the effort, please add your signature to the section below!

Rationale[edit]

Our default page layout has served us well, but it is not without its issues. The Table of Contents (TOC) can take up a lot of space and its placement can interfere with the layout of bullet points, pictures and text. Moreover our guides look kind of "texty", like an encyclopedia. The aim of creating a page-top banner is:

  • create a clean start to the page by having a lead image and horizontal TOC at the top before the article begins
  • make the first impression of our guides more eye-catching
  • give our guides a fresh and more modern look

The page banner can be much more than just 'decoration' for an article. The best banners offer a visual introduction to an area and challenge people's preconceived ideas.

Goals[edit]

The principal goal of the expedition today is to create a custom banner image for every article on Wikivoyage! See #Progress to get an idea of how close we are getting to this goal.

A particular priority is to add custom pagebanners to all Guide-status articles that currently lack them.

Other goals of this expedition are:

  • Incorporate on mobile site?
  • Spruce up breadcrumb trail & geo icon display
  • Other features that come up!

Expedition members[edit]

Standards[edit]

How it works[edit]

  • The banner is displayed when the {{pagebanner}} template is inserted at the top of the page.
  • If only {{pagebanner}} is inserted, the default banner will display.
  • To display a photo in the banner, add the name of the photo. E.g., {{pagebanner | picturename.jpg}}''
  • Other options are available to customize the appearance of the banner. These are discussed more fully at Template:Pagebanner.

Usage[edit]

  • Banners should be used on all destination guides, itineraries, phrasebooks, and travel topics, so the site has a consistent look and feel. They should not be used on project pages. If you want one for your user page, please use {{Userbanner}}.
  • Do not re-use banners for multiple articles, unless there is a consensus to make a special exception.

Image size[edit]

  • Banners have a 7:1 width to height ratio.
  • Banners need to be at least 1800 pixels wide to accommodate wide screens (images do not scale up to fit the size of the screen). The recommended dimensions are 2100 x 300 pixels.

Image sources[edit]

All images must be in the public domain or be CC-compatible. You can easily find a large-sized, properly licensed image that can be turned into a banner by using this search query (replace "Paris" with the article name).

Saving images[edit]

How do I help?[edit]

Cropping to a 2100:300 fixed ratio in GIMP

Creating a banner[edit]

To create a banner, first find a suitable image—there are many options on Wikimedia Commons. The full size image should be wider than 2100px, since the banner itself will need to be that width. Download the image and open it using GIMP [1] (or another image editor of your choice). A simple online picture editor can be found at Pixlr.

With GIMP, Rotate the image if necessary to get the horizon level, using (Shift+R) or Tools->Transform tools->Rotate. crop the image using the crop tool (Shift+C) after setting the crop tool to a fixed aspect ratio of 2100:300 in the "tool options" window. (If you don't see the tool options window, click Windows -> Dockable Dialogs -> Tool Options.) When you have adjusted the image boundaries to your taste, hit enter to crop the image. Then click Image -> Scale Image and enter 2100 for width and 300 for height, then click Scale. Lastly, use File -> Export to save the cropped image as a jpg.

If you're on Mac OS X, you can use "Preview" to easily crop the images.

[edit]

Nutshell
A banner file name is in three parts in ordinary text:
The required first part is the location name with optional clarification in parentheses, so we know where it can be used.
The required second part is the word banner
The optional but recommended third part is a short description of the image, so users can have some idea of what the banner looks like.
this is followed by the file type suffix, usually .jpg.

Banners for travel topics, itineraries and phrasebooks may use the same structure, or may be adapted as necessary. Try to follow precedent or create a more useful alternative.

Detail
  • Unless there are copyright issues, banner files are uploaded to Wikimedia Commons.
  • Location name is the name of the destination or region. It should be at city or district level if possible, or be the name of a national park or generally accepted name of a geographical feature when outside of a city. This identifies the lowest level article where the banner may be used.
  • If you think the location name is obscure or ambiguous, add a region and/or country name in parentheses directly after the location name as a disambiguator.
  • An optional numeral to distinguish the banner from other banners with similar names may be added at the end of the name. For example: London banner Thames 1.jpg, Western Cape banner Table mountain 3.jpg, etc.
  • The word Wikivoyage is not a standard part of the name. If you include it, put it just before the word"banner", ie. Wikivoyage banner. It does not add anything useful to the name, as the file must be categorized under commons:Category:Wikivoyage banners anyway.
  • Try not to use unnecessarily long or complicated names, and the use of punctuation and underscores. Use conventional spelling and separate words with single spaces.
Functions
Identifies a destination or region for which the banner applies.
Disambiguates or clarifies which particular usage of the name is relevant (if necessary)
The word banner identifies the file as a banner and splits the name so that other language users can easily identify which part is the location identifier and which is the deacription.
Provides some description of the actual image. This should be provided in more detail in the description section of the file documentation.

The specified order of the components allows for easiest identification of usable banners for a given article, particularly where the language of the file name is not familiar to the user.

Examples
File:Perth (Scotland) banner Bridge over the Tay.jpg (Ambiguous destination: Scotland identifies which city with the name Perth is relevant).
File:Au in der Hallertau (Bayern) banner Clock tower.jpg (Obscure destination: Bayern identifies the region in which this destination can be found)
(Examples needed of other languages, particularly with non-latin text)

Uploading to Commons[edit]

Now upload it to Commons, add it to the appropriate category (e.g., Category:Wikivoyage banners of Vienna).

An alternative option for uploading a cropped photo to the Commons is using DerivativeFX. It might save some time as well as ensure adhering to all the legal responsibilities. All you have to do is:

  1. Type the name of the Commons photo you used to make the banner on the first page, click OK
  2. Untick "Add Template {{RetouchedPicture}}"
  3. Untick any unnecessary categories below, but keep the main destination category, click OK
  4. Upload the file from your computer and type in a new file name including ".jpg"
  5. Add the appropriate "Category:Wikivoyage banners of " to the bottom of the Summary box.
  6. Tick the last red paragraph, hit Upload file, and it's done!

If you get an error after hitting the "Upload" button where it redirects you to Commons, you have to reselect the file from your computer and select the license from the drop down menu. Occasionally you also need to manually enter the original author. Then hit "Upload file" again.

Adding the banner to the article[edit]

  • If there is no page banner, please check that you are editing a main space article. Page banners should not be used on project or talk pages.
  • Edit the article and remove the default banner file name from the template. It will look something like like {{pagebanner | Asia_default_banner.jpg}}, and the text to remove is Asia_default_banner.jpg, or equivalent, leaving {{pagebanner}}. Save the edit.
  • Look in the left sidebar in section "Toolbox" and click on "Data item". This will open the page in Wikidata for the destination.
  • Click on the "Add" link below the "Statements" table.
  • Type "Wikivoyage banner" in the first field, insert the file name of the new banner image in the second field (for instance "Cool-banner-name.jpg") then click "save".
  • Optional: For further customization, you may also want to add a {{Pagebanner}} template, the basic syntax is: {{Pagebanner | Cool-banner-name.jpg}}.
  • If you would like to add a caption to the banner, which will appear when a reader hovers their mouse cursor over the image, add the parameter "caption=" with the text as shown - {{Pagebanner | Cool-banner-name.jpg | caption= Caption about this cool banner}}.
  • If the article has a lead image, consider moving that image down below some text in order to keep it from being edged against the banner.
  • Currently (September 2013) page banners are under evaluation in Dutch and are used in:

Changing a banner[edit]

Default banners
  • Default banner images are displayed on thousands of articles. They should not be changed without consensus. Proposed changes may be discussed on the Banner Expedition talk page or the Travellers' pub.
  • New default banners for travel topics or subsets of a default template range should also be discussed before application. When applied they must be applied consistently throughout the range for which they are intended.
Changing custom banners
  • Poor quality banners may be replaced by better quality banners. Banners may be replaced by more appropriate banners. Correctly sized banners are by default more appropriate than incorrectly sized banners. Leave an edit summary explaining why the new banner is more appropriate. If anyone disagrees with a substitution for reasons other than correct sizing or image quality, temporarily replace the banner with the appropriate default banner and get consensus on the article talk page.

How to make a quality banner[edit]

Bad banner
Good banner
  1. Find an amazing high-resolution image. Banners should give an outstanding view of a destination, and should make readers want to go there. Thus, banners should be made from fantastic images that really make a destination shine. Don't use washed out, blurry snapshots you took with your mobile phone while cycling through a valley in rainy weather at night. Use awesome pictures that look professional, colorful, sharp and have a great composition. Let's be honest here, quality of self-made pictures is often flaky, so it's better to use outstanding freely-licensed images available on the web. Try the Wikimedia Commons categories Featured pictures by country, Quality images by country or Valued images by country, or do a search for freely licensed images on Google Images or Flickr.
  2. Make a good composition. Most images, even panoramas, don't have an aspect ratio of 7:1, so you'll need to crop the original image in photo-editing software. By cropping you'll need to make a new composition that is different from the original. Make sure that the composition you choose is making the destination look fantastic! You can either focus on a certain detail of the original image or you can scale the original image down and show as much of it as possible in the banner. While editing, only scale images down and never upscale them. By upscaling, image data is lost and the banner will look blurry and bad. A big no-no. Also keep in mind that the page title will take up the upper left part of the banner, so the best part of the image is ideally placed at the right side of the banner. Getting a good composition is difficult—some outstanding images from Commons will simply never look good in banner form. If so, ditch the image and find a different one. When cropping an image, do not be tempted to make the aspect ratio different from 7:1. It takes no more effort to do it correctly, and it will have to be corrected when found.
  3. Save with maximum quality. If you found a nice image, and turned it into a nice banner with a good composition, then it's time to save the image in JPG format. Always save files with maximum image quality, else ugly artifacts will mess up your banner. If done right, your banner will have a size of around 600KB to 1MB. If your banner has a file size that's considerably lower, you need to work with a higher resolution base image.
Composite images
Collages, photomontages etc, are a lot of work to do well, and unless you are particularly skilled at this kind of work and don't mind having your efforts rejected due to differences in taste, probably not worth the effort. Use them at your own risk - each proposed application must be accepted by consensus.
The best banners
For a selection of the best banners on Wikivoyage and the opportunity to recognise the images that you think are beautiful, check out Star standard banners.

Other ways to help[edit]

  • If you can't do the image manipulations, and have found a really nice, suitable panorama that is reasonably proportioned, but not quite 7:1 you can use it, but put {{crop}} under the banner template to label the banner for maintenance.
  • If you find a nice non panoramic image that you think would be great for a specific article banner, leave a message on WV:Banner expedition/Banner suggestions with a link to the image and a link to the article for which it could be the banner. The source image must be at least 1800 pixels wide..

Progress[edit]

This section keeps track of the progress we have made in terms of implementing the template in articles in the mainspace, and how many of the banner templates have custom images.

Sitewide implementation[edit]

Out of 26303 eligible articles in the Wikivoyage mainspace, 26303 have implemented the banner template. 0 articles in mainspace do not have a banner.

100 % complete

Custom banner images[edit]

Of the 24676 implementations of the banner template on pages eligible for a custom banner, 7662 already have a custom banner image and 17,014 still require a custom banner image.

7662 / 24676 = 31.05% complete

Standard banner images[edit]

Out of 1628 disambiguation pages, 1627 have the standard banner.

1627 / 1628 = 99.939% complete

Missing banners[edit]

Tool to find which articles still need a banner template

Tool to find which articles above outline still need a custom banner template

Tool to find which city guide and usable articles still need a custom banner template

Tool to find which disambiguation pages still need a standard page banner

When there are more than 100 banners at, please ask user Kizar on Wikidata to run xyr bot (example).