Jump to content
  • 0

Несоответствия результата и psd-исходника


Raritet
 Share

Question

Всем привет.

Ознакомившись с азами, взялся верстать простенький макет, скачанный из Сети. Однако столкнулся с неожиданными проблемами, причем, не каким-тот там позиционированием, а с несоответствием psd-макета и результата.

Итак, скрин PSD-макета:

psd_simple-1.jpg

 

 

Теперь скрин из браузера:

html_simple-1.jpg

 

 

Фон задавал как обычно: дефолтный + url картинки.

Но… В точке 1 обозначил ступенчатый переход, он виднеется по периметру с двух сторон, где картинка накладывается на фон. При этом, на макете не нашел ни градиентов, ни дополнительных фонов. Цвета, естесно, копировал, а не на глаз.

Я понимаю, что он из-за перепада цветов, но почему ж этого перехода нету в PSD ???

Теперь о следующей неприятности, с которой столкнулся. Хочу максимально воспроизвести такое же расположение текста относительно картинки, как в исходнике, но получается лишь очень отдаленно (((. Картинку разместил top right, как и полагается. Интересно, что марджины и размеры шрифта поставил такие же! В частности, несовпадение хорошо видно в точке 2, где светлая полоса должна заходить между  абзацев. Сколько ни старался воспроизвести – не то, и отличается существенно (повторюсь – при скопированных параметрах отступов и шрифта). Если растягивать картинку по горизонтали – фигня получается, растягивается и вид явно не тот. Если пробовать двигать блок с текстом – тоже фигня, в самом лучшем случае, он сильно отдаляется от левого края.

В общем, вопросы будут выглядеть как-то так:

1. Почему появляется переход, которого нету в PSD? Как с ним бороться? Если градиентами, то откуда лучше начинать/заканчивать их?

2. Почему такое несоответствие между позициями фоновой картинки и контента, при том, что отступы мерялись с макета? Как поступать в таких случаях? От чего отталкиваться? Что считается априори важным, а чем можно пренебречь?

 

 

Понимаю, что, скорей всего, не я первый столкнулся с такими проблемами, но в Сети че т не нашел конкретных ответов.

Спасибо.

                                                                                                                                                                                                   Raritet                                                                            

P.S. Залить макет не могу - его размер 1,1 mb.

 

 

Link to comment
Share on other sites

2 answers to this question

Recommended Posts

  • 0
  1. сохрани фон в PNG
  2. форматирование контента в браузере и в фотошопе разное — это должно быть учтено при создании макета. повторить 1:1 можно только при фиксированной ширине контента + вставить <br /> в ручную. и то не гарантирую что будет как в макете, так как даже ширина букв шрифта, скорее всего, будет разной. надо понимать что фотошоп создан, в первую очередь, для полиграфии, а не для WEB. браузеры не умеют так же гибко работать со шрифтами как он.
Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy