Мета закинута
Автор не відписував в цілі 9 років 11 месяців 4 дня
Сверстать и развернуть личный сайт
Привет. Наконец-то оплатил свой хостинг и решил заняться разработкой стартовой страницы для личного сайта.
В наше время (время технологий) если ты не присутствуешь в соцсетях, то тебя просто нет, можно сказать. Но одно дело соцсети, а другое дело качественное распространение различной информации - собственных взглядов, с целью влияния на общество и поиска единомышленников. Социальные сети могут не иметь какого-нибудь функционала, или тот, кто есть в одной социальной сети может отсутствовать в другой. Потом, сфера моих интересов различна - будет неэффективно скидывать статьи на различные темы в одну стопку - более эффективно будет их разделить.
Также, я очень люблю технологии. И разработка своего сайта это отличный способ не просто знать про них, но и опробовать их в деле.
Конечная моя цель - разработка трех своих сайтов и одной стартовой страницы (её разработка и будет описана здесь). Три сайта на такие вот темы:
- Личный блог. Здесь будут мои личные бытовые наблюдения, мнения, отчеты о путешествиях и прочее касающееся лично меня и моей семьи.
- Профессиональный блог. Здесь будет описываться то, чем я занимаюсь профессионально. Я изучал всё сам, при этом много материала на английском языке. SharePoint, по которому в основном будет блог, это довольно сложная система, по которой очень мало специалистов. Я буду публиковать статьи о своих проектах, о полезных подходах и вещах. Может быть и что-то обучающее. Это поможет и мне быстро вспомнить алгоритмы тех или иных действий. Помимо SharePoint буду публиковать и просто веб-программирование, касающееся в основном JavaScript.
- Общество любителей думать. Научно-философский проект, в котором я буду выкладывать свои научные воззрения, философию, а также, если появятся единомышленники (пока их один человек кроме меня), и их мысли. Позже хотелось бы запустить и видеоблог этого общества. Если не понятно что это такое - основная мысль это переход от человека к сверхчеловеку, или Человеку (с большой буквы) и что надо для этого делать, попытки повлиять на вектора развития общества (в перспективе), увеличить инициативность и осознанность людей, ориентирование в потоке хлынувшей информации и так далее.
Стартовая страница будет отправной точкой для тех, кто меня не знает, но хотел бы узнать о моей деятельности. Она будет содержать ссылки на это всё. Я уже встречал похожий подход, но не помню где - если вы знаете подобные стартовые страницы, то будьте добры, скиньте мне ссылку.
Спасибо за внимание.
Критерій завершення
Начальная страница личного сайта работает
Особисті ресурси
Время, информация, навыки
Екологічність мети
1. Развитие собственных навыков
2. Изучение веб-технологий
3. Распространение информации в интернете
-
Разработать PSD-макет
Идея дизайна такая - стиль карты памяти (Mind map).
По центру экрана моя фотография. Сверху блок "Соцсети" от которого на лучах находятся логотипы различных соцсетей, в которых я зарегистрирован. Справа блок личного блога. Снизу блок "Общество любителей думать" (это будет научно-философский проект, вынашиваемый мной уже не один год), на лучах которого будут указаны различные интересы и темы. Слева блок профессионального сайта (связанного с моей работой - разработкой на SharePoint, веб-программированием, системным администрированием), опять же на лучах затрагиваемые там темы.
Стиль - рациональный минимализм. Плоский дизайн. Максимально приближенный к идее Material design. Цветовую схему буду менять в зависимости от настроения, рассмотреть варианты теплой и холодной схемы.
-
Установить Photoshop
-
Прочитать некоторые статьи, потренироваться
-
Разработать макет
-
-
Верстка из PSD-макета
Сайт будет без элементов прокрутки, максимально минималистичный. Это стартовая площадка к прочим моим проектам и соцсетям, дающая представление обо мне как о человеке с помощью карты памяти. Постараться сверстать сайт в Pixel-perfect. Подход к верстке вряд ли будет HTML5, поскольку на сайте не будет ни шапки, ни футера, ни навигации. Это будет эксперимент. Для начала сверстать сайт статичным, позже предусмотреть эффекты, мобильную версию, английскую версию (наверно, в других целях на Smartprogress их оформить). Ни php, ни других серверных технологий использоваться не будет - исключительно клиентский код. По сути это одна страница, с которой можно будет перейти уже на другие проекты, либо в соцсети. И ещё - всё таки предусмотреть одну анимацию, при нажатии на мою фотку в центре, чтобы открывалась краткая информация обо мне, которая не могла быть передана с помощью карты памяти (должно отсутствовать дублирование информации)
-
Определиться с архитектурой верстки
-
Собственно, сверстать сайт
-
Анимация при нажатии на центральный блок (JavaScript)
-
Щоденник мети
Решил сделать не адаптивную верстку, а обычную. Откажусь от material design. Теперь нужно сделать страницу в стиле нарисованной от руки карты памяти. И чтобы было красиво, стильно, креативно. Блин денег нет на цену слова (((
Игорь, спасибо! Классный совет. Если там есть то, что мне надо, то воспользуюсь
Привет. Как я и сказал, так как не сделал сайт до начала мая, с зарплаты закину 1000 рублей на цену слова. Видимо надо прибегнуть к этой мере. Ну а пока я сделал себе блог, т.к. это легко - Wordpress ставим, натягиваем тему, настраиваем, прикручиваем кнопки соц. сетей, комментарии, легкое SEO и готово. Всё сделал за 1 день, а теперь только пишу посты. Ну а с главным сайтом пока беда - воз и ныне там. Надеюсь цена слова поможет ))))
82 дня. Какой кошмар. Ну и пустослов же я... Проваливать цель не буду))) Надо сделать
Второй день занимаюсь версткой сайта. На Photoshop я плюнул и сразу занялся ей.
Сайт будет нестандартный - без шапки и футера. Сделал фон с помощью CSS - изображение в виде полосы сверху. Применил самые последние стандарты CSS - раньше я делал по-другому. Здесь мне наплевать на поддержку старых браузеров:
html {
background: url("b1.png") no-repeat top left fixed;
-webkit-background-size: contain;
-moz-background-size: contain;
-o-background-size: contain;
background-size: contain;
}
Основной лэйаут будет в виде карточки (Material Design - Card). По центру карточки наметил место под мою фотку. Зарезинил верстку с указанием минимальной ширины и высоты этого блока. Думаю потом указать и максимальные значения.
#main-container{
position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
background-color:white;
width:75%;
height:80%;
min-height:640px;
min-width:960px;
z-index:2;
}
тег position показывает как сделать позиционирование блока по центру экрана. Обычно этим пользуются для диалоговых окон на сайте.
Конечно всё ещё сильно поменяется. Предварительный вид можно смотреть по адресу golikov.pro (не удивляйтесь если что-то будет криво работать, т.к. в процессе практически)
Начал верстать сайт с применением библиотеки Materialize. Потихоньку, помаленьку.
Photoshop не очень быстро осваивается. Вообще хотел бы осваивать сразу Sketch, но он только на яблоке работает (((. В Интернете мало толковых тюториалов по верстке в фотошопе (подскажите если кто знает). Зато подумал над архитектурой верстки, изучил верстку от центра, position:absolute и прочие приколы. В работе попробовал svg графику в верстке, генерацию svg кодом JavaScript - на западе сейчас это модное направление.
В общем, снова сдвигаю сроки выполнения задания, что грустно и печально.
Фокус на цели есть, но времени на это дело нет. Планирую выделить сегодня час-два на разработку макета
С утра до вечера одной только работой занимаюсь, времени совсем нет на изучение фотошопа. Приглядел несколько интересных ресурсов в интернете для тех, кто интересуется. Позже систематизирую. Дедлайн подходит по макету PSD, надо на выходных прям по полдня на это потратить
Тренировка идет. Скачал шрифты и материалы по Material Design с сайта Google. Потренировался в разлиновке. У меня совсем иная ситуация и очень нестандартная - во всех уроках сайты с шапкой, футером, сайдбарами и так далее. А у меня от центра. Думаю сначала придумать просто стандартный сайт, а уже потом свой дизайн сделать. Интерфейс фотошопа довольно нагружен и непривычен, но потихоньку привыкаю и изучаю. Есть еще две недели на первый этап цели, надеюсь завершить раньше.
