• Какими правилами пользуются буржуи при дизайне?

    Murmurianez
    @Murmurianez
    JavaScript Developer
    Правила везде одинаковые - вопрос в назначении проекта и профессионализме исполнителя. В рунете очень большой процент качественных сайтов среди утилитарных. В Европе дизайн сайтов - дно в основном, несмотря на развитый дизайн в целом.

    Заходя на какой-нибудь Behance среди действительно круто продуманных работ часто вижу именно работы из СНГ. Но у нас сильное отставание по типографике - мало качественных кириллических шрифтов. Также у нас мало крутых промосайтов.

    Изучайте сетки и работу с пространством, подбор цветовых палитр, типографику. Изучайте Photoshop и развивайте насмотренность. В вёрстку тоже полезно заглянуть - не знаю как сейчас, но раньше на западе действовало правило - сам нарисовал - сам сверстал. Это как минимум помогает понять как делать дизайн для реального мира. Чтобы делать действительно крутые сайты - нужно также развивать другие художественные навыки - уметь на бумаге нарисовать крутой шрифт или уметь накидать что-то в 3D.
    Ответ написан
  • SFTP: где лежат сайты на хостинге TimeWeb?

    taocs
    @taocs Автор вопроса
    WEB-разработчик
    Решение проблем оказалось довольно простым: при подключении к серверу необходимо указать "начальную папку", ориентируясь на следующий шаблон:

    /home/<первая буква вашего логина>/<ваш логин>/

    Перейдя по данному адресу, вы сразу попадаете на ту самую папку, в которой находятся все файлы ваших сайтов.

    Вот и всё решение проблемы) Желаю всем успешных разработок ; )
    Ответ написан
  • Как создать подменю в Bitrix?

    @vaajnur
    битриксоид
    в битрикс можно создать подменю, не совпадающее со структурой разделов, добавив
    $aMenuLinks = Array(
    	Array(
    		"пункт 1", 
    		"/link1/", 
    		Array("/link1/"), 
    		Array(
    			"FROM_IBLOCK" => 1,
    			"IS_PARENT" => 1,
    			"DEPTH_LEVEL" => 1
    		)
    	),
    	Array(
    		"подпункт 1", 
    		"/sublink1/", 
    		Array("/sublink1/"), 
    		Array(
    			"FROM_IBLOCK" => 1,
    			"IS_PARENT" => 0,
    			"DEPTH_LEVEL" => 2
    		)
    	),
    );


    где подпункт должен следовать за родит. пунктом и иметь соответ-щий уровень вложенности
    Ответ написан
  • Как запретить прямой доступ к файлу незалогиненым пользователям?

    BoneFletcher
    @BoneFletcher
    Для nginx — X-Accel-Redirect
    header('X-Accel-Redirect: ' . $file);
    header('Content-Type: application/octet-stream');
    header('Content-Disposition: attachment; filename=' . basename($file));
    exit;

    Для apache — XSendFile
    header('X-SendFile: ' . realpath($file));
    header('Content-Type: application/octet-stream');
    header('Content-Disposition: attachment; filename=' . basename($file));
    exit;

    habrahabr.ru/post/151795
    Ответ написан
  • Возможности Битрикса?

    Sanasol
    @Sanasol
    нельзя просто так взять и загуглить ошибку
    Или лучше искать разработчика.

    да.

    И в битрикс не суйтесь, вот когда надо будет магазин сделать, тогда еще можно подумать.
    Во всём остальном это только стоимость x2 и мучения по сравнению с практически любым другим решением.
    Ответ написан
  • Разница шрифтов на MAC и Windows?

    @vanyamba-electronics
    Он похоже как-то криво русифицирован. Используйте либо Arial для веб-совместимости, либо Helvetica - он почти неотличим от Open Sans.
    Ответ написан
  • Разница шрифтов на MAC и Windows?

    Nekto_Habr
    @Nekto_Habr
    Чат дизайнеров: https://t.me/figma_life
    Как заставить отображаться шрифты одинаково?

    Никак. Забей.
    Ответ написан
  • Как вызвать собственную функцию в jquery?

    BupycNet
    @BupycNet
    Основатель PushAll
    Поменяйте начало
    $(function (){
    на
    function fname(){
    а также
    }); на }
    А потом вызывайте в нужном месте
    fname();
    т.к. у вас там $(document).ready(function(){ то обработка произойдет после того как все JS будут подгружены.
    Удачи.
    Ответ написан
  • Как автоматизировать размещение контента на 2 сайтах?

    @RGBPlus
    Я думаю у вас подход не правильный.

    В зависимости от региона показывать нужные данные (шаблон, контакты и т.д.) - GeoLocation или Babel но тут другая история - почитайте что это такое!

    Ну или что то в этом духе двигаться!
    Ответ написан
  • Как автоматизировать размещение контента на 2 сайтах?

    Wolfnsex
    @Wolfnsex
    Если не хочешь быть первым - не вставай в очередь!
    Есть ли способ связать базу товаров для сайтов?
    В целом, способов довольно много, но я не думаю, что существует готовое решение уровня "Модуль Modx, "поставил и забыл".

    Выглядят они все примерно следующим образом:
    1. Пишите какой-то триггер на уровне самой CMS, либо на уровне БД, либо по CRON'у запускаете скрипт, который мониторит базу А
    2. По наступлению события (когда товар на сайте А добавился), либо когда CRON-скрипт заметил изменения - аналогичная операция вставки производится на сайте Б.

    Почему мне кажется, что готового модуля для этих целей Вы вряд ли найдете: Modx довольно гибкая система в плане управления контентом, но в то же время довольно кривая во многих других планах, в т.ч. в области работы с БД там целая "упаковка" не самых лучших решений. И, в виду своей гибкости и решения уровня "не лучшие" - написать готовый модуль для подобных задач - довольно спецефическая процедура. Гораздо проще написать модуль бекапа всей системы, чем нормально работающий модуль переноса одного товара (ну это просто как пример).
    Ответ написан
  • Почему не работает inputmask?

    PavelMonro
    @PavelMonro
    Потому что 2 раза подключен jquery? В Head и внизу где script.js
    Ответ написан
  • Как получить значение пользовательского поля типа файл?

    Anadi
    @Anadi
    Если ответ Вам помог мой, решением отметье его!
    А в $arResult поле UF_LOGO_MANUFACTURE вообще есть? Для начала вам нужно получить пользовательское поле. Например так:
    $arFilter = array(
    	'IBLOCK_ID' => $arResult['IBLOCK_ID'],
    	'ID' => $arResult['IBLOCK_SECTION_ID'],
    );
    $arSelect = array('ID','UF_*');
    $res = CIBlockSection::GetList(array(), $arFilter, false, $arSelect);
    if($ar_logos = $res->GetNext())
    	$arLogo = $ar_logos;

    Далее выводите как вам вздумается:
    <?if(!empty($arLogo['UF_LOGO_MANUFACTURE'])):{?>
    			<?foreach($arLogo['UF_LOGO_MANUFACTURE'] as $arLogoID):?>
    				if(empty($arLogoID)) break;
    
    				$arFile[$arLogoID] = CFile::GetFileArray($arLogoID);
    
    				// Ресайзим если надо
    				$arFileTmp = CFile::ResizeImageGet(
    					$arLogoID,
    					array("width" => 820, "height" => 523),
    					BX_RESIZE_IMAGE_PROPORTIONAL,
    					true, $arFilter
    				);
    
    				?>
    				<img src="<?=$arFileTmp["src"]?>">
    			<?endforeach;?>
    		<?}endif;?>
    Ответ написан
  • Книга о том как правильно должен работать программист?

    un1t
    @un1t
    Чед Фаулер "Программист фанатик"
    Джоэл Спольски "Джоэл о программировании"
    Роберт Мартин "Идеальный программист"
    Том ДеМарко, "Вальсируя с Медведями: управление рисками в проектах по разработке программного обеспечения"
    Том ДеМарко "Человеческий фактор. Успешные проекты и команды"
    Роберт Гласс "Факты и заблуждения профессионального программирования"
    Игорь Савчук "Отъявленный программист. Лайфхакинг из первых рук"
    Питер Сейбел "Кодеры за работой. Размышления о ремесле программиста"
    Хант Эндрю, Томас Дэвид "Программист прагматик"
    Ответ написан
  • Какие задачи нужно уметь выполнять на JS начинающему?

    copist
    @copist
    Empower people to give
    Какие задачи нужно уметь решать на чистом JS, перед тем как переходить к изучению библиотек и фреймворков?


    Кроме синтаксических конструкций, математических и логических выражений, нужно знать:
    • Область видимости переменных
    • Замыкания
    • Объектно-ориентированное программирование, в частности наследование через прототипы
    • Шаблон проектирования "модуль"
    • Операции над DOM
    • Понимание принципов событийно-ориентированного программирования
    Важно - нужно знать, откуда копипастить.
    Тебе нужно быть очень хорошо знакомым с одной-двумя-тремя популярными библиотеками на JavaScript. В идеале ты должен иметь представление о том, что определённый класс задач может быть решен с помощью определённых библиотек, хотя бы одной, но такие знания приходят с практикой. Вообще ты должен быть знаком с ними так близко, чтобы помнить, в какой части мануала по библиотеке можно найти описание форматов входных данных нужной тебе функции и какой будет результат, чтобы скопировать и вставить в свой код, а потом поправить, чтобы работало.

    Важно - инструменты программиста JavaScript
    У тебя должен быть удобный инструмент для разработки (IDE, Integrated Development Environment), чтобы он тебе подсвечивал код (syntax highlight) и подсказывал о синтаксических ошибках (syntax check), о формальных параметрах функций (type hinting), о стиле кодирования (code style), помогал писать код (live templates).
    Ты должен знать, как отлаживать скрипты в популярных браузерах (Firebug, Chrome Developer Tools и другое). Что такое точки останова, как управлять исполнением во время останова, как посмотреть и поменять содержимое переменных, как настроить останов по условию.

    Хотелось бы узнать что это за задачи(упомянутые вами 80%)


    Реальные задачи джунов:
    1. Возьми из сборника задач по javascript любой скрипт случайно и вслух расскажи, что он делает.
      Важно - читать и понимать чужой код намного важнее, чем писать свой. И на работе тебе это приддётся делать чаще, чем ты думаешь. Чтобы подключить к своему проекту чужую JS либу, нужно понимать что она делает, как она конфигурируется, как управлять её поведением. Скажу точно, что написать свой скрипт, который строит графики, намного сложнее, чем понять, как настраивается highcharts.

    2. Напиши скрипт на JS, который в заданном тексте удалит один или два символа, выбранных случайно
      1. Усложнение: удалять можно только буквы в словах, а знаки пунктуации и цифры удалять нельзя
      2. Усложнение: принять, что этот текст является программной на Javascript, удалить одну-две команды JS, но только если они не в строковых литерах (break как команду удалить можно, а в строке "break my heart" нельзя)
      3. Усложнение: воспользуйся этим скриптом и "попорти" код какого-нибудь другого скрипта на Javascript, а потом отладь, найди ошибку и восстанови работоспособность
      Важно - этим обычно все и занимаются - ищут баги. Только в реальной жизни они и без этого скрипта появляются. И не по одному, а прям пачками.

    3. На страницу HTML нужно встроить график курса доллара по отношению к рублю. Формат входного массива значений курса определи сам, исходя из своего скрипта для построения графиков.
      1. Усложнение: на одном графике должны быть два курса, по разным шкалам. Наприме, курс доллара к евро и курс юаня к рублю
      2. Усложнение: первоначально график вывести в детализации по месяцам, но чтобы можно было "приблизить" (drilldown) детализацию до дней
      3. Усложнение: первоначально график вывести текущем месяце, но чтобы можно было загрузить данные для предыдущего месяца без перезагрузки страницы (AJAX)

    4. При клике по картинкам, вставленным в текст HTML, показывать всплывающее окно для просмотра увеличенной картинки.
      1. Усложнение: в всплывающем окне сделать навигацию по картинкам, вперёд/назад и к нужной картинке
      2. Усложнение: в всплывающем окне вместо картинки показать видео-ролик с Youtube
      3. Усложнение: в всплывающем окне показать текст HTML

    5. По клику на кнопку "Click me" показать всплывающую форму.
      1. Усложнение: реализовать проверку данных на корректность перед отправкой формы (непустое значение, минимальное количество символов, максимальное количество символов, минимальное числовое значение, максимальное числовое значение)
      2. Усложнение: если в значении текстового поля встретилась гиперссылка, то считать её за 22 символа при любой длине этой ссылки (как в твитере)
      3. Усложнение: реализовать отправку формы на сервер через AJAX, без перезагрузки страницы
      4. Усложнение: саму форму в виде HTML загрузить с сервера через AJAX, в момент клика по кнопке "Click me", правила проверок данных должны как-нибудь "извлечься" из самой загруженной формы, например из аттрибутов полей ввода

    6. К форме ввода данных на поле ввода даты "навешать" всплывающий календарь для выбора даты.
      1. Усложнение: сделать форму календаря мультиязычной. Хотя бы через настройки на том же JavaScript
      2. Усложнение: сделать так, чтобы с помощью календаря можно было выбрать диапазон дат, чтобы она была привязана к двум полям формы "дата начала" и "дата окончания", и чтобы значение в поле "дата начала" обязательно была меньше чем в поле "дата окончания"
      3. Усложнение: сделать так, чтобы с помощью в календаре можно было видно визуально этот диапазон
      4. Усложнение: диапазон может быть открытым, но не пустым, то есть пользователь должен задать хотя бы дату начала или дату окончания.

    7. Сделать пред-просмотр веб-страницы HTML с разными темами. Тему страницы выбирать через селектор на javascript, а показывать в фрейме.
      1. Усложнение: сделать селектор "тип устройства", чтобы менять размер фрейма (например, "iPhone 5c 1136x640") и "чекбокс" для смены ориентации страницы "горизонтальная" или "вертикальная" (соответственно 1136x640 или 640x1136)
      2. Усложнение: в селекторе тем предусмотреть поиск тем по подстроке, и аналогично поиск устройств по части названия (авто-дополнение, auto-complete)
      3. Усложнение: тема страницы должна меняться без перезагрузки фрейма



    Задачи повышенной сложности, исходя из личного интереса
    1. Реализовать форму для многошагового мастера: форма должна состоять из нескольких страниц (шагов), пользователь может переключать страницы через какие-нибудь элементы управления "вперёд/назад" или "перейти на страницу".
      1. Усложнение: реализовать функциональную связь значений, когда некоторые данные зависят друг от друга (ввёл число в поле "количество" и в поле "сумма" значение пересчиталось)
      2. Усложение: доступность некоторых полей ввода должна зависеть от данных (например, если указал "есть личный самолёт", то значит можно ввести "марка самолёта")
      3. Усложение: видимость некоторых страниц должна зависеть от данных из предыдущих страниц (например, если указал "есть личный самолёт", значит появилась страница "ТТХ самолёта"; иначе страница должна скрыться)

    2. Реализовать однопользовательскую браузерную игру "змейка", "тетрис", "найди пару"
    3. Реализовать многопользовательскую браузерную игру "крестики-нолики", "морской бой" на два игрока в режиме "hot seat"
      1. Усложнение: два игрока на разных компьютерах, ходы передаются по websocket
      2. Усложнение: ограничение на ожидания окончания хода 15 секунд, по окончании ожидания автоматически делается случайный ход

    4. Реализовать todo-list. Пользователь вводит список, затем он превращается в строки с "чек-боксами". Когда "чекбокс" включен, строка зачёркивается.
      1. Усложнение: пользователь может переименовывать, удалять, добавлять строки
      2. Усложнение: список хранить в localStorage браузера, чтобы при перезагрузке страницы он восстанавливался
      3. Усложнение: пользователь может иметь несколько независимых списков todo

    5. Реализовать простой графический редактор. Пусть рисуется точка в месте, где пользователь кликнул.
      1. Усложнение: добавить переключатель режимов "точка"/"линия", в режиме "линия" рисуются линии между двумя последовательно кликнутыми точками
      2. Усложнение: можно менять толщину, цвет линий, размер точек
      3. Усложнение: последовательность кликов можно воспроизвести ещё раз с самого начала, равномерно или с реальной задержкой между кликами, с обычной скоростью или ускоренно
      4. Усложнение: можно выгрузить получившийся рисунок в формате PNG или SVG, причём SVG c анимацией воспроизведения



    Можно использовать любую существующую библиотеку.
    Например,
    для построения графиков www.highcharts.com
    для загрузки и передачи данных через AJAX: jquery.com + что-нибудь на сервере
    для всплывающих диалогов с картиками, видео и формами: fancyapps.com/fancybox и https://jqueryui.com/dialog/
    для валидации форм rickharrison.github.io/validate.js
    для календаря https://jqueryui.com/datepicker/
    для автодополнения https://jqueryui.com/autocomplete/
    для передачи данных между несколькими пользователями socket.io или обычный AJAX
    Ответ написан
  • Где узнать всё о семантике вёрстки?

    hvdd
    @hvdd
    Кратко о себе
    Давайте разберёмся
    3fb27f0eccd54d829cdc6271fd558024.jpg

    Самый важный и простой шаг — лечение дивянки использование html5 тегов для разметки страницы.

    Вот здесь Вадим Макеев расскажет Вам, как и почему стоит использовать html5 теги.
    А вот здесь Ричард Кларк расскажет Вам, как и почему не стоит использовать html5 теги.
    А потом ещё можете прочитать вот эту статью, чтобы окончательно запутаться и уйти на бэк-энд.

    Но если вам это интересно настолько, что вы понимаете, что между SEO и семантикой не очень-то много общего, то можете ещё почитать вот эти статьи.

    Кстати, обязательно читайте комментарии к статьям, они тоже очень полезны.

    P.S. После просмотра этих видео вы поймете, почему картинка под спойлером очень крутая.
    Ответ написан