Имена для фоновых изображений, каталоги

Во время создания макета через наши «фотошопы» проходит множество картинок, фоновых и не очень.

Чтобы долго не ломать голову, где какая картинка. Я называю их по имени объекта, фоновой картинкой, которого она является.

body.jpg(картинка для body), header.gif(#header), logo.gif(#logo), catalog-item.gif(.catalog-item)

Картинки складываю в директорию i, JavaScript лежит в директории js, рыбные картинки в temp_images, стили в папке css.

Вот и все премудрости. А, как у вас?

Этот пост затевался для того, чтобы определиться с этими 2-мя премудростями:

  1. Какие имена лучше всего давать фоновым картинкам?
  2. Какие имена для папок с ресурсами?


Социальное

  • http://sudoku.org.ua/rus/blog/ Волошин Сергей

    Не знаю как лучше, сам использую:
    /с для CSS
    /d для Downloads
    /i для картинок
    /j для JavaScript

  • http://www.reactant.ru 4Ek

    Аналогично i и js для картинок и скриптов соответственно.
    Только в последнее время начал бить i на подпапки, названия которых образованы из популярных префиксов. Проще ориентироваться, когда много картинок.

  • http://seigiard.com Seigiard

    css/
    img/
    js/

    а картинки схоже, только для фоновых добавляю постфикс bg
    header.png
    header-bg.png

    если есть класс – пишу, например h1-pointer-bg.png – это бэкграунд для h1.pointer

  • Lynn

    css, js, i
    В i подкаталоги для больших кусков, но структура пока не устоялась.

  • http://numberoneblogger.com/ Number One

    1. каюсь, до недавнего времени у меня бэки были просто bg1.gif, bg2.gif и так далее… Сейчас постепенно перехожу на более понятные описания, исходя из названия контейнера (header.gif, logo.gif)

    2. i/(images/) js/ icons/ css/

  • http://webmakerslounge.com Neutrino

    /images и добавляю подпапки
    /style
    /scripts или js

    Картинки тоже по имени обьекта называю, но добавляю определения, на пример body_bg или menu_border.

  • http://lovata.com Zigzag

    Папки:

    /img – для элементов оформления страницы
    /temp – сида скидываю картинки-рыбы
    /js – для скриптов
    /css – для стилей

    Названия для элементов оформления даю исходя из их положения, например: footer-bg, nav-glob-bg, sidebar-h2-bg, header-logo и т.п.

  • http://hidded.pp.ru/ hidded

    Делаю сложно ./_resources/{styles,scripts,images,images/temp}.
    Просто в _resources лежат остальные куски оформления от «движка».

  • http://cssing.org.ua akella

    У меня консервативно:
    img/
    css/
    js/

    Картинки именую как header-bg, header-top
    str.gif всегда называю картинку которая растягивается на весь блок :) Для Faux Columns типа.
    В селекторах отдаю предпочтение дефису – “content-main”

  • http://www.chossonandkallah.com Shimon

    предпочитаю называть изображения по их предназначению с разделением слов с помощью дефиса. Например кнопку с текстом add to cart я назову add-to-cart.png, a общие элементы – к классу header у меня header-bg.png, а к тегу h2 – h2.png

    Папки создаю по такой схеме:
    design/images/
    design/css/
    design/js/

  • http://nundesign.livejournal.com Tatyana

    В последних проектах, особо богатых графикой, выделяю картинки не только по именам (имена – похоже, как и у вас), но и по типам. Все фоновые картинки имеют префикс bcg
    bcg-body
    bcg-top
    bcg-…
    все иконки – префикс ico-
    ico-settings
    ico-users
    ico-…
    Так мне проще ориентироваться в самой файловой системе с картинками (их подтипы сортируются по именам, эмулируя “группы”). Рубрики создаю с более полными названиями:
    css/
    js/
    Связано, скорее, с текучкой кадров в нашем офисе (особенно среди дотнетовских программеров), т.е. именовать всё вообще приходится более интуитивно понятно, не до сокращений.
    Пытаюсь найти оптимальную модель именования файлов-рубрик-идентификаторов и прочего, понятную всем моим разработчикам.

  • http://geruway.ru geruway

    Структура папок:
    /i/ – “i” как сокращение от images и от include
    /i/a/ – anonses. картинки для анонсов
    /i/b/ – banners
    /i/c/ – catalog. для картинок каталога
    /i/d/ – design
    /i/v/ – visuals. всевозможные визуалы
    /i/favicon.ico
    /i/print.css
    /i/screen.css
    /i/script.js

    /i/a/, /i/c/ и /i/v/ – от проекта к проекту.

    Фоновые картинки называю по принципу: bg.jpg, bg-header.jpg, bg-footer.jpg.
    Кнопочки: button-submit.gif, button-confirm.gif.
    Иконки: icon-home.gif, icon-sitemap.gif, icon-contact.gif.

    Главное преимущество: при сортировке по имени картинки сортируются по их назначению.

  • http://reg.kost.ru kost

    Фоновым картинкам — префикс “bg-” (bg-header.gif, bg-menu.gif, etc.).

    Иконкам — префикс “ico-”.

    “i/” — директория для картинок.
    “css/” — для стилей.
    “js/” — для скриптов.

  • http://Pharmacy127.net Dr.Brown

  • http://webmascon.com/ Максим Россомахин

    Фоновые всегда именую по классу (или айдишке), в котором они подключкены к странице:

    bg-header.png (для #header)

    Папки:

    i/
    css/
    js/

  • http://dimox.name Dimox

    Фоновые изображения обзываю аналогично – для #header – header.gif. Если фон состоит из нескольких частей, то, например, так:
    header_bg.gif
    header_left.gif
    header_right.gif

    Структура папок:
    i/ – изображения
    css вместе с html-файлами

  • http://www.sexhtml.ru/ Никита

    Я вообще не вижу смысла заморачиваться на именах картинок. Понимаю, структуру блоков обсуждать, но картинки…

    А структура папок у меня такая:

    - www
    – media
    — css
    — img
    — htc
    — js