Небольшое пояснение к посту от Тани, идущей... Небольшое пояснение к посту от Тани, идущей....
Без заголовка - (1)Рамочка "Вот и лето" ...
Карамельный медовик с малиной - (0)Карамельный медовик с малиной карамельные коржи,белковый крем,сладость такого т...
Мультфильм «Переполох в Гималаях» онлайн - (0)Мультфильм «Переполох в Гималаях» онлайн В минувшие выходные у меня наконец-то нашлось время для ...
Смотрите лёгкий, забавный, ироничный фильм «Во всём виноват Рио - (0)Смотрите лёгкий, забавный, ироничный фильм «Во всём виноват Рио» Замечательная получилась комедия...
ОткрыткиПерерожденный каталог открыток на все случаи жизни
Онлайн-игра "Большая ферма"Дядя Джордж оставил тебе свою ферму, но, к сожалению, она не в очень хорошем состоянии. Но благодаря твоей деловой хватке и помощи соседей, друзей и родных ты в состоянии превратить захиревшее хозяйст
Я - фотографПлагин для публикации фотографий в дневнике пользователя. Минимальные системные требования: Internet Explorer 6, Fire Fox 1.5, Opera 9.5, Safari 3.1.1 со включенным JavaScript. Возможно это будет рабо
Всегда под рукойаналогов нет ^_^
Позволяет вставить в профиль панель с произвольным Html-кодом. Можно разместить там банеры, счетчики и прочее(и еще 71067 записям на сайте сопоставлена такая метка)
Другие метки пользователя ↓
актеры английский аудиокниги бродилки видео вязание генераторы грузинская кухня десерты дизайн животные закуски игрушки искусство кино клипарт клипарты коврики красота и здоровье мода мой сад музыка напитки печеное пинетки полезное для компа полезные советы прически проги рамки рецепты садовник салаты салфетки скатерти сладкое соусы супы схемки схемы сыры творчество тесто уроки рисования фоны фш цветы шитье это интересно юмор
Урок 6. Устанавливаем слайдер, дорабатываем сайт |
Урок 6. Устанавливаем слайдер, дорабатываем сайт. from rohviktor on Vimeo.
Как известно, Internet Explorer ниже 9-ой версии не поддерживает свойства CSS3. В данном уроке мы все-таки «заставим» Internet Explorer поддерживать эти свойства, чтобы сайт смотрелся одинаково во всех браузерах. Также в данном уроке мы установим слайдер на нашу страницу для прокрутки изображений.
Метки: сайты |
Урок5. Верстаем область основного контента |
Урок5. Верстаем область основного контента. from rohviktor on Vimeo.
В этом уроке мы сверстаем область основного контента, навигацию по рубрикам и «подвал» сайта. Чтобы уменьшить количество используемых картинок и не увеличивать вес страницы, при верстке будем использовать новые свойства css3. А также, чтобы уменьшить количество используемых классов, будем активно применять псевдо-классы.
Метки: сайты |
Урок 4. Продумываем разметку страницы и нарезаем макет |
Урок 4. Продумываем разметку страницы и нарезаем макет. from rohviktor on Vimeo.
В этом уроке мы продумаем разметку будущей html страницы, выделим основные блоки из которых она будет состоять. Вырежем из макета все необходимые для работы изображения. Сверстаем «шапку» сайта, меню и форму для поиска. Также установим логотип и слоган сайта.
Метки: сайты |
Урок 2. Шапка сайта. |
Метки: сайты |
Урок 1. Подготовка к работе, расстановка направляющих |
Урок 1. Подготовка к работе, расстановка направляющих. from rohviktor on Vimeo.
Метки: сайты |
Базовый видеокурс по созданию сайта с нуля |
| От кого: | WebForMyself и издательство Info-DVD.Ru <idvd.noreply@gmail.com> |
| Кому: | Людмила <kydinova-lyudmil@mail.ru> |
|
Здравствуйте, {{Name}}!
Первый урок →
|
Метки: сайты |
Создаем инновационный сайт-портфолио, применяя альтернативный UI/UX.Часть3 |
На случай, если вы что-то пропустили, вот окончательная разметка HTML:
001.<!DOCTYPE html>002.<head>003.<title>Your Name - Digital Portfolio</title>004.<link rel="stylesheet" href="css/master.css"/>005. 006.<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>007.</head>008. 009.<body>010.<div id="page">011.<div id="header">012. 013.<div class="inner">014.<div id="logo"><img src="img/icons/logo.png"/></div>015.<div id="social">016. 017.<a class="fb" href="http://www.facebook.com/" target="_blank" title="Find me on Facebook">Find me on Facebook</a>018.<a class="flickr" href="http://www.flickr.com/" target="_blank" title="View my Flickr Photostream">View my Flickr</a>019. 020.<a class="linkedin" href="http://www.linkedin.com/" target="_blank" title="Find me on LinkedIn">Find me on LinkedIn</a>021.</div>022. 023.<div id="nav">024.<a class="about" href="about" id="aboutBtn">About</a>025.<a class="photos" href="photos" id="photoBtn">Photography</a>026. 027.<a class="workActive" href="work" id="workBtn">Work</a>028.</div>029.</div>030. 031.</div>032. 033.<div id="horizon">034. 035.<div id="main">036. 037.<div class="glowBg" id="bg2"> </div>038. 039.<div id="glowTexture"> </div>040. 041.<div id="gallery"> 042. 043.<div class="inner">044. 045.<div class="col">046. 047.<div class="item" style="top: 200px">048.<img src="img/work/demo-02.jpg" alt="Title 1a"/>049.</div>050. 051.<div class="item" style="top: 710px">052.<img src="img/work/demo-02.jpg" alt="Title 1b" style="opacity: 0.3"/>053.</div>054. 055.<div class="item" style="top: 1220px">056.<img src="img/work/demo-02.jpg" alt="Title 1c" style="opacity: 0.3"/>057.</div>058. 059.</div> 060. 061.<div class="col" style="left: 660px">062.<div class="item" style="top: 200px">063.<img src="img/work/demo-03.jpg" alt="Title 1a" style="opacity: 0.3"/>064.</div>065. 066.<div class="item" style="top: 710px">067.<img src="img/work/demo-03.jpg" alt="Title 1b" style="opacity: 0.3"/>068.</div>069. 070.<div class="item" style="top: 1220px">071.<img src="img/work/demo-03.jpg" alt="Title 1c" style="opacity: 0.3"/>072.</div>073. 074.</div>075.</div>076. 077.<!-- End Step 6 -->078.</div>079.<div id="leftCol"> <!-- Text annotations -->080. 081.<a href="#" id="left" class="mover" style="display: none"></a>082. 083.<a href="#" id="right" class="mover" style="left: 895px; top: 240px;"></a>084.<a href="#" id="down" class="mover" style=" left: 555px; top: 490px;"></a>085. 086.<a href="#" id="up" class="mover" style="display: none"></a>087. 088.<div id="projectInfo">089. 090.<h1>Demo Project</h1>091.<p class="sub">WEBSITE 2011</p>092.<p class="body">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc non tellus eget neque tempor adipiscing. Etiam neque augue, tristique eget malesuada et, luctus sed felis. In dignissim lacus eu justo tempus ut tincidunt nisi dapibus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc non tellus eget neque tempor adipiscing.</p>093. 094.<p class="link"><a href="#">Link to project here</a></p>095.</div>096. 097.<div id="controls">098. 099.<div id="grid">100.<div class="line" style="height: 55px; opacity: 0.4;"> </div>101.<div class="line" style="height: 27px; opacity: 0.4;"> </div>102. 103.<div class="line" style="height: 55px; opacity: 0.4;"> </div>104.<div class="line" style="height: 41px; opacity: 0.4;"> </div>105. 106.<div class="line" style="height: 41px; opacity: 0.4;"> </div>107.<div class="line" style="height: 55px; opacity: 0.4;"> </div>108. 109.<div class="line" style="height: 27px; opacity: 0.4;"> </div>110.<div class="line" style="height: 41px; opacity: 0.4;"> </div>111. 112.<div class="line" style="height: 55px; opacity: 0.4;"> </div>113.<div class="line" style="height: 41px; opacity: 0.4;"> </div>114. 115.<div class="line" style="height: 27px; opacity: 0.4;"> </div>116.<div id="tracker" style="height: 14px;"> </div>117. 118.</div>119. 120.<div id="keys">121.<a href="#" class="kup">Up</a>122. 123.<a href="#" class="kdown">Down</a>124.<a href="#" class="kleft">Left</a>125. 126.<a href="#" class="kright">Right</a>127.</div>128. 129.</div>130. 131.</div>132. 133.<div id="glowShadow">134.<img src="img/bg/glow-shadow.png" />135.</div>136. 137.</div>138. 139.</div>140. 141.</div>142. 143.<script>144.var yShift = -190;145.arrange()146.function arrange() {147. 148.var winHeight = $(window).height();149. 150.if (winHeight > 760) {151.yShift = (((winHeight - 900)/2) - 110)152.newHeight = (winHeight - yShift)153.newHeight -=60154.$('#main').css('height', newHeight)155.}156. 157.if (yShift < -190) {158.yShift = -190;159.}160.$('#main').css('margin-top', yShift)161. 162.}163. 164.$(window).resize( function() {165.arrange()166.})167. 168.</script>169. 170.</body>171.</html>
Метки: I/UX.Часть3 сайты |
Одноклассники |
Метки: сайты |
Как создать бесплатный сайт самому |
Думаю для многих уже не секрет, что создать сайт можно самому и бесплатно – но лишь единицы знают, как сделать его качественным во всех отношениях. Хочется поделиться своим мнением и неким опытом, потому как в своё время потратил много времени на изучение данного вопроса.
Так как создать свой сайт бесплатно самому и что самое главное без каких-либо знаний!?
Уверен, большинство пользователей новичков уже пробовали свои силы в таких онлайн конструкторах сайтов, как Ucoz или Narod, но, по моему мнению, и думаю многие меня поддержат из-под конвейера данных сервисов в большей своей массе выходят лишь ресурсы с ужасной функциональностью и отталкивающим внешним видом, при появлении которых в браузере – их сразу же хочется закрыть! О каких-либо настройках для продвижения вообще молчу, никакой внутренней оптимизации и намеков на SEO. Главным плюсом является то, что как факт, все конструкторы сайтов автоматически размещают ваш сайт на своем бесплатном хостинге и вручают домен.
Следующий вариант для начинающих сайтостроителей это системы управления сайтом CMS, в которых также можно создать бесплатный сайт самому (ну конечно, если Вы найдете нормальный бесплатный хостинг, которых сейчас не так много в Рунете). Тестировал в своё время системы Joomla и Dupal.
С Джумлой (Joomla) парился очень долго, нормальной версии так и не нашел, а исправлять это огромное количество ошибок и багов в данной CMS без знания кода – нереально. Приходилось часами просиживать на форумах и задавать, как я сейчас понимаю, очень тупые вопросы опытным знатокам. Которые в свою очередь половину своего ответа пишут на непонятном языке с огромным обилием терминов и сленговых выражений (благо хоть русская поддержка у Joomla очень сильная, сайтов и форумов полно). Админка у Джумлы мне также не понравилась, для меня как для новичка она казалась дремучим лесом! Единственный плюс, который очень порадовал в Joomla это превеликое множество дополнений и модулей, а также шаблонов для данной системы, на любой вкус и цвет так сказать.
С Друпалом (Drupal) знаком поменьше, но как мне показалось более качественная CMS с нормальной админкой, никаких ошибок не появлялось, ну и настроек для продвижения побольше. Следующим сложным этапом было найти нормальный бесплатный хостинг - потратив неделю на поиски, забросил это неблагодарное дело и выбрал платный...
Ну а вообще советую всем потихоньку начинать учить код, ну или хотя бы DreamWeaver (кстати, у кого все-таки есть время и желание, советую разбираться по книге - Дж. Тарин Тауэрс "Macromedia DreamWeaver 8 для Windows и Macintoch"). Не так уже все и сложно там с кодом, хотя понимаю ваш соблазн, не разбираясь во всех премудростях данной кухни, сразу же сделать бесплатный сайт!
Некоторое время назад я все-таки нашел подборку отличных сервисов для новичков, благодаря которым можно самому создать неплохой качественный сайт, без знаний кода.
Онлайн сервисы для создания сайта
Создать бесплатный сайт - очень простой и удобный конструктор сайтов, позволяющий создать сайт бесплатно буквально за час, понравилась возможность прикреплять форум и магазин к сайту. Абсолютно все на русском языке, интерфейс понятен и не требует длительного изучения. Все шаблоны очень приличного вида, сайты в целом получаются внешне приятными!
Как сделать свой сайт - еще один бесплатный конструктор сайтов, благодаря которому получается сделать более менее качественный ресурс. Если хотя бы чуть-чуть знаешь html код - можно натянуть любой дизайн на конструктор. Также как и в первом сервисе есть можно подключить свое доменное имя 2 уровня.
Метки: сайты |
| Страницы: | 2 [1] |
