Форум вебмастеров

Web дизайн Дизайнерское мастерство, где научиться этому и как. Коммерческие темы запрещены!

WelcomePartners
Ответ
 
LinkBack Опции темы
Старый 12.01.2013, 11:10 #1 (Ссылка)
Аватар для LeoMilan
Местный
 
Регистрация: 12.01.2013
Сообщений: 142
Сказал(а) спасибо: 31
Поблагодарили 10 раз(а) в 2 сообщениях
Репутация: 37
LeoMilan LeoMilan вне форума
Местный
Дополнительная информация
По умолчанию

Как новичку создать дизайн сайта?


Учусь по специальности программирование, но меня больше интересует конкретно направление создания сайтов. Но дизайн нам никогда не преподавали, всё что умею, все научился в инете. Подскажите как к примеру делать более менее нормальные логотипы, не имея опыта в дизайнте (не предлогать сервисы по соданию логотип, это не то) и как сделать такую вещь к примеру. Вот сайт http://promodern.ee/, там где размещен контент, там есть изгиб в верхнем левом углу, как например такое сделать подскажите. Может вообще линк дадите, где всякие такие темки для сайтов рассказывают как делать. Вы дизайнеры всяко что-то полезное можете подсказать.
LeoMilan вне форума   Ответить с цитированиемОтветить с цитированием

Старый 12.01.2013, 11:52 #2 (Ссылка)
Аватар для lukamal
Модератор
 
Регистрация: 30.08.2012
Сообщений: 797
Сказал(а) спасибо: 539
Поблагодарили 478 раз(а) в 279 сообщениях
Репутация: 539
lukamal lukamal вне форума
Модератор
Дополнительная информация
По умолчанию

Цитата:
Сообщение от LeoMilan Посмотреть сообщение
Вот сайт http://promodern.ee/, там где размещен контент, там есть изгиб в верхнем левом углу, как например такое сделать подскажите. Может вообще линк дадите, где всякие такие темки для сайтов рассказывают как делать. Вы дизайнеры всяко что-то полезное можете подсказать.
Если вас заинтересовал дизайн вы можете изучить структуру страницы сами.
В Firefox например это делается вот так



Вы увидите код всей страницы.

Код страницы
<html>
<head>
<title>Promodern OÜ</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<META NAME="DESCRIPTION" CONTENT="Atelje">
<META NAME="KEYWORDS" CONTENT="ateljee,moda,promodern,avatud ateljee,kunst,tellimine">
<META NAME="RESOURCE-TYPE" CONTENT="DOCUMENT">
<META NAME="Document-state" CONTENT="Dynamic">
<META NAME="revizit-after" CONTENT="1 day">
<META NAME="URL" CONTENT="http://www.promodern.ee">
<META NAME="AUTHOR" CONTENT="Maxim Zimarev">
<style>
.key_on { border-top: 1 solid #202020; }
</style>
</head>
<body bgcolor="#eedca2" marginheight="0" marginwidth="0" topmargin="0" bottommargin="0" leftmargin="0" rightmargin="0">
<form method="POST" target="_self" id="mainForm">
<table id="Table_01" border="0" cellpadding="0" cellspacing="0" align="center" background="images/background.gif">
<tr>
<td width="230" height="100" valign="top">
<table border="0" cellpadding="0" cellspacing="0">
<tr><td width="230" ><img src="images/logo.gif" width="230" height="100" alt="" border="0" /></td></tr>
<tr><td align="right" valign="top" height="110">
<table border="0" cellpadding="0" cellspacing="0">
<tr><td><img src="rus/images/k_about.gif" width="217" height="19" alt="" border="0" /></td></tr>
<tr><td style="padding: 3 0 0 0"><img src="rus/images/k_studio.gif" width="217" height="19" alt="" border="0" style="cursor: pointer" onClick="lnk2.value='';lnk.value='studio';mainForm .submit();"/></td></tr>
<tr><td style="padding: 3 0 0 0"><img src="rus/images/k_job.gif" width="217" height="19" alt="" border="0" style="cursor: pointer" onClick="lnk2.value='';lnk.value='job';mainForm.su bmit();" /></td></tr> <tr><td style="padding: 3 0 0 0"><img src="rus/images/k_contact.gif" width="217" height="19" alt="" border="0" style="cursor: pointer" onClick="lnk2.value='';lnk.value='contact';mainFor m.submit();"/></td></tr></td></tr>
</table>
<tr><td align="right"><table border="0" cellpadding="0" cellspacing="0">
<tr><td valign="top" height="75" valign="top">
<table border="0" cellpadding="5" cellspacing="0">
<tr><td><img src="rus/images/flag.gif" width="30" height="19" alt="" border="0" /></td></tr>
<tr><td><img src="est/images/flag.gif" width="30" height="19" alt="" border="0" style="cursor: pointer" onClick="lng.value='est';mainForm.submit();" /></td></tr>
<tr><td><img src="eng/images/flag.gif" width="30" height="19" alt="" border="0" style="cursor: pointer" onClick="lng.value='eng';mainForm.submit();" /></td></tr>
</table>
</td>
<td height="415"><img src="images/logo2.gif" width="180" height="415" alt="" border="0" /></td>
</tr>
</table>
</td></tr>
</table>
</td>
<td width="550" height="570" valign="top"/>
<table border="0" cellpadding="0" cellspacing="0">
<tr><td width="550" height="570" valign="top" background="images/book.gif" style="padding: 35 25 5 30"/>
<table border="0" cellpadding="0" cellspacing="0"><tr><td valign="top" width="265" style="padding: 0 10 0 0; text-align: justify; font-size: 14px;"><img src="rus/images/firma.gif" width="231" height="18" alt="" border="0"/><br><img src="images/underline.gif" width="231" height="14" alt="" /><br><font color="575757" style="tahoma">OÜ Promodern было основано весной 2003 года как семейное предприятие. Сейчас в фирме работает более 20 человек.<br><br>
В 2005 году фирма заняла первое место в устроенном департаментом предпрнимательства конкурсе "Sarav startija".
Благодаря помощи мэрии Таллинна, удалось существенно расширить и обновить парк машин. <br><br>
Основным видом деятельности является выполнение различных субподрядных работ. С 2007 года фирма выполняет также
индивидуальные заказы. <br><br>
Мы стремится идти в ногу со временем и быстро меняющимися потребностями рынка и вкусами наших клиентов,
постоянно внедряя в производство новые технологии и собственные KNOW-HOW! Огромное внимание уделяется качеству продукции.

</font><br><br><div style="cursor: pointer;font-size: 15px;text-decoration:underline;color: #0000FF;" onClick="lnk2.value='equipment';mainForm.submit(); ">наше оборудование</div></td><td width="214" valign="top"><div style="padding: 15 8 15 8;border: 1px solid #808080;background-color: #DDDDDD" ><table border="0" cellpadding="0" cellspacing="0" style="cursor: pointer;" onClick="lnk2.value='equipment';mainForm.submit(); "><tr><td><img src="images/equipment_main.gif" width="214" height="343" alt="" / border="0" title="наше оборудование"></td></tr></table></div></td></tr></table> </td></tr>
<tr><td>&nbsp;</td></tr>
</table>
</td>
</tr>
</table>
<input type="Hidden" id="lng" name="lng" value="rus">
<input type="Hidden" id="lnk" name="lnk" value="about">
<input type="Hidden" id="lnk2" name="lnk2" value="">
</form>
</body>
</html>


Загнутый уголок реализован при помощи подкладывания фонового рисунка в ячейку таблицы <td width="550" height="570" valign="top" background="images/book.gif" style="padding: 35 25 5 30"/>



Информацию по дизайну смотрите на сайте http://htmlbook.ru
lukamal вне форума   Ответить с цитированиемОтветить с цитированием
2 пользователя(ей) сказали cпасибо:
Veter (12.01.2013), Ночная странница (12.01.2013)
Старый 12.01.2013, 12:29 #3 (Ссылка)
Аватар для LeoMilan
Местный
 
Регистрация: 12.01.2013
Сообщений: 142
Сказал(а) спасибо: 31
Поблагодарили 10 раз(а) в 2 сообщениях
Репутация: 37
LeoMilan LeoMilan вне форума
Местный
Дополнительная информация
По умолчанию

Да это я вижу в фаитбаге, что картинка стоит. Вопрос, как ее сделать такую с уголком ? Ну понятн, что в графическом редакторе. Я пользуюсь Paint.NET. Вот как скажем там делать подобдное?
LeoMilan вне форума   Ответить с цитированиемОтветить с цитированием
Старый 12.01.2013, 12:36 #4 (Ссылка)
Аватар для lukamal
Модератор
 
Регистрация: 30.08.2012
Сообщений: 797
Сказал(а) спасибо: 539
Поблагодарили 478 раз(а) в 279 сообщениях
Репутация: 539
lukamal lukamal вне форума
Модератор
Дополнительная информация
По умолчанию

Цитата:
Сообщение от LeoMilan Посмотреть сообщение
Да это я вижу в фаитбаге, что картинка стоит. Вопрос, как ее сделать такую с уголком ? Ну понятн, что в графическом редакторе. Я пользуюсь Paint.NET. Вот как скажем там делать подобдное?

фотошоп
вам в этом поможет

смотрите, читайте, повторяйте, делайте своё.
lukamal вне форума   Ответить с цитированиемОтветить с цитированием
Старый 12.01.2013, 12:56 #5 (Ссылка)
Аватар для LeoMilan
Местный
 
Регистрация: 12.01.2013
Сообщений: 142
Сказал(а) спасибо: 31
Поблагодарили 10 раз(а) в 2 сообщениях
Репутация: 37
LeoMilan LeoMilan вне форума
Местный
Дополнительная информация
По умолчанию

А конкретно в Paint.NET как реализовать ? Вообще программист, который сайт делает, вы думаете он рисует всё это дело сам или тырит из инета картинки ?
LeoMilan вне форума   Ответить с цитированиемОтветить с цитированием
Старый 12.01.2013, 13:28 #6 (Ссылка)
Аватар для lukamal
Модератор
 
Регистрация: 30.08.2012
Сообщений: 797
Сказал(а) спасибо: 539
Поблагодарили 478 раз(а) в 279 сообщениях
Репутация: 539
lukamal lukamal вне форума
Модератор
Дополнительная информация
По умолчанию

Паинт или фотошоп разницы нет нужно уметь рисовать.
Программист обращается к тому кто умеет рисовать в фотошопе или другой программе.
Брать чужие картинки можно, но это уже не уникально.
lukamal вне форума   Ответить с цитированиемОтветить с цитированием
Старый 12.01.2013, 18:58 #7 (Ссылка)
Аватар для Veter
Администратор
 
Регистрация: 01.01.1970
Адрес: На wmboard
Моя смс: vBulletin 3.x.x, DLE, WordPress, XenForo
Сообщений: 9,175
Записей в дневнике: 17
Сказал(а) спасибо: 2,046
Поблагодарили 2,655 раз(а) в 1,922 сообщениях
Репутация: 2665
Veter Veter вне форума
Администратор
Дополнительная информация
По умолчанию

Цитата:
Сообщение от LeoMilan Посмотреть сообщение
Я пользуюсь Paint.NET. Вот как скажем там делать подобдное?
Как сделать в Paintе, я думаю вам никто не скажет...
Рассматривайте фотошоп, как графический редактор.

Цитата:
Сообщение от LeoMilan Посмотреть сообщение
Вообще программист, который сайт делает, вы думаете он рисует всё это дело сам или тырит из инета картинки ?
Кто-то делает все сам с нуля, кто-то берет картинки, но картинки из инета это НЕ значит, что дизайнер делал дизайн не сам, украл его. Найти картинку это 10% работы.
Причем картинки могут быть и из платных фотобанков.

Конкретно по загнутому уголку есть уроки опять таки фотошопа, а не пайнта. В сети даже можно найти заготовки по фотошопу с различными элементами.

Добавлено через 1 минуту
Цитата:
Сообщение от LeoMilan Посмотреть сообщение
Подскажите как к примеру делать более менее нормальные логотипы, не имея опыта в дизайнте
Никак... ну или бывает, что нет навыков дизайна, но есть вкус. Гармония. Тогда можно набросать лого на бумаге и скан отправить дизайнеру для воплощения его в графике.
Veter вне форума   Ответить с цитированиемОтветить с цитированием
Старый 28.01.2013, 12:43 #8 (Ссылка)
Новичок
 
Регистрация: 08.01.2013
Адрес: Уфа
Сообщений: 3
Сказал(а) спасибо: 0
Поблагодарили 2 раз(а) в 2 сообщениях
Репутация: 12
Manjuna Manjuna вне форума
Новичок
Дополнительная информация
По умолчанию

LeoMilan, Здравствуйте!
Не могла пройти мимо такой животрепещущей темы.
Если Вы хотите научиться рисовать уголки и прочую графику, я бы Вам посоветовала изучить саму суть рисования в фотошопе.
Введите в поисковике : "как рисовать в фотошоп", пройдите четыре-пять уроков и Вам станет ясно как все это устроено.
Вкратце я могу сказать, что уголки и подобное делается так - создается слой с маской и внутри этого слоя при помощи кисти и градиентов рисуются тени, блики. Маска нужна, чтобы были ровные края у изображения, кисть нужна, чтобы добиться реалистичности. Но чтобы этой реалистичности добиться, лучше разобраться как устроен тот же самый уголок.
Если Вы хотите понять веб-дизайн в целом, то я бы посоветовала перерисовать 4-5 сайтов, которые Вам нравятся. Так Вы интуитивно поймете как они устроены, как задается модульная сетка и т.п.
С логотипами уже посложнее, так как их по идее нужно сперва нарисовать в эскизном виде, а потом оцифровывать в векторе.Или сразу в векторе делать эскизы. Вам нужно будет изучить еще и Adobe Illustrator (ну или Корел), если хотите сразу все чисто делать.)

Начальные уроки Вы можете тут посмотреть : http://demiart.ru/. Все новички начинают с этого форума) Пройдите побольше уроков и вы поймете саму суть.
Желаю творческих узбеков и удачи!
Manjuna вне форума   Ответить с цитированиемОтветить с цитированием
Пользователь сказал cпасибо:
Старый 28.01.2013, 14:54 #9 (Ссылка)
Аватар для LeoMilan
Местный
 
Регистрация: 12.01.2013
Сообщений: 142
Сказал(а) спасибо: 31
Поблагодарили 10 раз(а) в 2 сообщениях
Репутация: 37
LeoMilan LeoMilan вне форума
Местный
Дополнительная информация
По умолчанию

Цитата:
Сообщение от Manjuna Посмотреть сообщение
По умолчанию
LeoMilan, Здравствуйте!
Не могла пройти мимо такой животрепещущей темы.
Если Вы хотите научиться рисовать уголки и прочую графику, я бы Вам посоветовала изучить саму суть рисования в фотошопе.
Введите в поисковике : "как рисовать в фотошоп", пройдите четыре-пять уроков и Вам станет ясно как все это устроено.
Вкратце я могу сказать, что уголки и подобное делается так - создается слой с маской и внутри этого слоя при помощи кисти и градиентов рисуются тени, блики. Маска нужна, чтобы были ровные края у изображения, кисть нужна, чтобы добиться реалистичности. Но чтобы этой реалистичности добиться, лучше разобраться как устроен тот же самый уголок.
Если Вы хотите понять веб-дизайн в целом, то я бы посоветовала перерисовать 4-5 сайтов, которые Вам нравятся. Так Вы интуитивно поймете как они устроены, как задается модульная сетка и т.п.
С логотипами уже посложнее, так как их по идее нужно сперва нарисовать в эскизном виде, а потом оцифровывать в векторе.Или сразу в векторе делать эскизы. Вам нужно будет изучить еще и Adobe Illustrator (ну или Корел), если хотите сразу все чисто делать.)

Начальные уроки Вы можете тут посмотреть : http://demiart.ru/. Все новички начинают с этого форума) Пройдите побольше уроков и вы поймете саму суть.
Желаю творческих узбеков и удачи!
Спасибо за ответ !
LeoMilan вне форума   Ответить с цитированиемОтветить с цитированием
Старый 12.11.2013, 17:40 #10 (Ссылка)
Аватар для ливер
Новичок
 
Регистрация: 12.11.2013
Моя смс: Drupal
Сообщений: 16
Сказал(а) спасибо: 0
Поблагодарили 0 раз(а) в 0 сообщениях
Репутация: 10
ливер ливер вне форума
Новичок
Дополнительная информация
По умолчанию

Нужно сначала получить какие-то знания и навыки, интернет в помощь
ливер вне форума   Ответить с цитированиемОтветить с цитированием
Ответ

Опции темы

Ваши права в разделе
Вы не можете создавать новые темы
Вы не можете отвечать в темах
Вы не можете прикреплять вложения
Вы не можете редактировать свои сообщения

BB коды Вкл.
Смайлы Вкл.
[IMG] код Вкл.
HTML код Выкл.
Trackbacks are Вкл.
Pingbacks are Вкл.
Refbacks are Вкл.


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как поменять дизайн сайта в ukoz andrkok Конструкторы сайтов 7 04.01.2014 05:57
Дизайн меню сайта - где лучше разместить? Елизавета Sadorozhnaya Вопросы по дизайну 10 02.01.2014 14:10
Сколько стоит дизайн сайта? veglivaya Web дизайн 5 24.04.2010 05:57
требуется создать дизайн сайта, сам сайт, раскрутить сайт. GDS_ Сайтостроение 15 08.04.2010 09:33
В какой программе сделать дизайн сайта Naska_Fantazy Web дизайн 6 07.04.2010 12:37


Текущее время: 12:13. Часовой пояс GMT +3.

Powered by vBulletin®
Copyright ©2000 - 2018, WMboard.
Перевод: zCarot
 

Форум вебмастеров

Здесь делают сайты, учатся на них зарабатывать. Ты новичёк, и ничего не понимаешь в создании сайтов и в интернет заработке? Не знаешь ответа на вопрос по сайтостроению? Мучают вопросы сео оптимизации?

Не беда, присоединяйся к сообществу вебмастеров, и зарабатывай вместе с нами!