как сделать такой эффект на сайте?

Редакторов много изображений ...всё о фотошопе твердят ...это просто картинка такая ...

А как в фотошопе ...ну либо научиться, либо попросить/нанять, второе скорее, кому нужно просто так развлекаться ...хотя те кто учится вполне могут и за спасибо сделать наверное )))))))

Ну, либо сразу такую картинку сделать, либо просто полупрозрачный фон использовать

Картинку такую просто в фотошопе сделайте и используйте её как фон.

можно создать блок <div>, и в него обернуть еще один блок <div>...в первый див поставить фон во всех красках как она есть.. . во второй див поставить в качестве фона черный цвет, с прозрачностью ( например background: rgba( 0, 0, 0, 0.5);), и в этот же блок писать текст... желательно, чтобы оба блока были одинаковой ширины и высоты, и не имели отступов относительно друг друга

Здравствуйте.
Есть три варианта:
1. Нарисовать такое же изображение в фотошопе.
2. Прописать в html:

<div id="image">
<div id="opacity">контент</div>
</div>

А в css:

#image {
width:Xpx;
height:Ypx;
background:url('путь к картинке') no-repeat;
}
#opacity {
width:100%;
height:100%;
background:#000;
opacity:0.5;
}

В этом случае прозрачным станет не только черный див с id="opacity", но и его содержимое.

3. Использовать rgba.
В html все так же, как и в предыдущем варианте, а в css изменение:

#opacity {
width:100%;
height:100%;
background:rgba(0, 0, 0, 0.5);
}

Тогда прозрачным станет только фон дива с id="opacity", а вот содержимое этого дива прозрачным не будет.

Ты не думал что это просто и есть такая картинка?