Бесплатная программа для создания адаптивных HTML сайтов WebsitePad Freelancer

12
Bytexpert
На сайте с 28.10.2007
Offline
68
3166

Может кому пригодится для небольших сайтов. Выложил для тестирования свою новую программу для создания и управления html сайтами.

Скачать тестовую версию WebsitePad Freelancer: https://yadi.sk/d/pPV12rrwhMgyf

Выложил свежий билд на свой хостинг: websitepad.ru/WebsitePadFreelancer.zip. Там будет лежать всегда самый свежий билд.

Сайт может иметь произвольную блочную структуру, каждая страница строится из произвольного количества блоков. В программе используется компонентный подход, можно создавать собственные компоненты. Страница строится путём добавления компонентов и прописывания в них контента. В программе используется LESS компилятор для сборки файла стилей и каждому компоненту можно задать свой определённый стиль. Для адаптивности используется фреймворк Bootstrap.

В качестве примера возможностей - Как сменить тему сайта в программе.

Выберите в дереве проекта элемент Настройки/Темы/Стандартная - это текущая тема сайта. Нужно переместить её ниже, чтоб тема Заказная была первой. Для этого нажмём клавиши CTRL+Стрелка вниз, либо нажмём кнопку Переместить ниже на панели инструментов. После того как тема Заказная стала первой в списке тем, нажимаем Обновить - тема сайта изменена.

Бесплатная программа для создания и сопровождения html-сайтов : WebProject (http://bytexpert.ru/webproject/) Бесплатная программа для пинга сайтов: pingxpert.com (http://pingxpert.com/)
Thommy
На сайте с 06.05.2010
Offline
139
#1

Отлично, потестим! А какие-то ограничения накладывает бесплатность? Копирайты там и прочее?

Bytexpert
На сайте с 28.10.2007
Offline
68
#2
Thommy:
Отлично, потестим! А какие-то ограничения накладывает бесплатность? Копирайты там и прочее?

Нет никаких ограничений ни в программе ни в базовом шаблоне - всё бесплатно.

totamon
На сайте с 12.05.2007
Offline
437
#3

интересный проект, как раз есть нужда в паре сайтов страниц на 10...

Домены и хостинг https://8fn.ru/regru | Дедик от 3000р https://8fn.ru/73 | VPS в Москве https://8fn.ru/72 | Лучшие ВПС, ТП огонь, все страны! https://8fn.ru/inferno | ХОСТИНГ №1 РОССИИ https://8fn.ru/beget
WebJunior
На сайте с 11.06.2010
Offline
155
#4

Тулза для клепания кроссплатформенных говносайтов? Годится.

Мой сайт на этом хостинге - https://tuthost.ua/?from=2558 / Верстаю шаблоны (темы с отзывами: https://searchengines.guru/ru/forum/763758, https://searchengines.guru/ru/forum/600404 ).
Bytexpert
На сайте с 28.10.2007
Offline
68
#5
WebJunior:
Тулза для клепания кроссплатформенных говносайтов? Годится.

Немного пофилософствую. Кроссплатформенные обычно бывают приложения, а сайты они как бы изначально для всех платформ. Хотя задумка у меня такая была, прикрутить туда Cordov-у и получать на выходе упакованное мобильное приложение из набора html.

Вообще говоря, инструмент достаточно гибкий, и клепать можно что угодно. Хотя и основано всё на примитивном шаблонизаторе, но вместе с тем, что сборка привязана к древовидной структуре, можно делать забавные вещи. Взять компонент Галерея. Добавляем в элемент нужной страницы Галерею, а к ней добавляем стандартный элемент и устанавливаем у него нужное изображение, добавляем элемент-ссылку так же с изображением и добавляем элемент-страницу так же с изображением. В итоге получаем на странице галерею из 3-х изображений при клике на первом оно откроется в лайтбоксе, на втором перейдёт по заданной ссылке, а на третьем на страницу.

Или вот например, работа со стилями. CSS собирается LESS компилятором и благодаря этому стили можно "размазывать" по проекту. Вот нужно например, чтоб у одного из элементов галереи подписи выводились красным шрифтом по центру и был другой фон - легко: к нужному элементу галереи добавляем элемент-стиль и пишем там:

color: red;

background: #c6d9ff;

text-align: center;

Этот же подход можно использовать например для анимации элементов. Задаём основной элемент - фон - шапку вверху сайта, к нему подключаем элемент с изображением телефона и описываем что нужно подключить к нему стиль (при условии что мы не написали такой компонент, а написать компонент в программе очень легко). Далее добавляем к нему элемент стиля в котором пишем:

position: absolute;

left: 0;

top: 0;

width: 21.47%;

.animation(phone 4s ease-out infinite);

.keyframes(~'phone, 0%{transform: scale(1)} 2%{transform: scale(1.1)} 4%{transform: scale(1)} 6%{transform: scale(1.1)} 8%{transform: scale(1)} 10%{transform: scale(1.1)} 12%{transform: scale(1)}');

И получаем картинку в шапке привлекающую внимание.

Как всё это использовать, для клепания говносайтов или уникальных вещей я не знаю. Я делал инструмент исходя из своих потребностей. Просто делать небольшие сайты страниц на 10-20 на какой-то CMS которую нужно обновлять и следить чтоб не дай боже не поломали - головная боль.

А html есть html, он и быстрый и безопасный и в случае смены хостинга просто файлы переписать, а в случае этой программы просто адрес для ftp публикации сменить и опубликовать.

Xammer2000
На сайте с 10.08.2011
Offline
188
#6

Интересно буду посомотреть

SeVlad
На сайте с 03.11.2008
Offline
1609
#7
Bytexpert:
Выложил для тестирования свою новую программу для создания и управления html сайтами.

Я даже помудохался с идиотским ядиском и даже поставил на виртуалку эту.. поделку.

У меня создалось впечатление, что ты ничего не слышал о юзабилити и продуктивности работ. Главное меню слева, а дерево проекта - на противоположном крае экрана.. И не перемещаемое/флоатное.

А зачем софтина ломится в инет? Что сливаешь/закачиваешь? ;)

В "редакторе" (в большинстве случаев не нужном, но рабочем/занимающим пространство) можно мышой "прописать" всякую ересь (например в стилях вставить код ссылки) и тп. Ссылки в меню на "оф сайт" не рабочие. Документации - ноль. И многое другое.

Хороший пример как нельзя писать программы.

Но мб я где-то ошибаюсь.

Будем плясать от результата.

Сколько времени нужно что бы создать с нуля сайт на 10 стр из заранее подготовленного контента (в Ворде или ещё где - не важно. Его вставка в программу - копипастом) и отдельно лежащих картинок? Шаблон ну тоже пускай будет готовый, но с сайбаром (кроме главной) в котором ссылки на внутренние и внешние ресурсы + блоки рекламы.

Структура пусть такая:

- Главная (структурно такая же как в предустановках - несколько информативных блоков)

- Информация о проблеме. (блочный текст + графики)

- Продукция (общее описание продукции + весь список или выборочно неск шт)

--Продукт1 (текст + 3-4 картинки, желательно в лайтбоксе)

..

--Продукт5

- О нас (текст + 2-3 фото)

- Контакты (текст+форма+гуглокарта)

В контент (или хотя бы над/под ним) должны быть вставлены блоки контекстной рекламы (адсенс например).

А ещё будет лучше если запишешь видео как создать такую визитку. Народ будет иметь представление о всех необходимых телодвижениях и временных затратах.

Делаю хорошие сайты хорошим людям. Предпочтение коммерческим направлениям. Связь со мной через http://wp.me/P3YHjQ-3.
Bytexpert
На сайте с 28.10.2007
Offline
68
#8
SeVlad:
Я даже помудохался с идиотским ядиском и даже поставил на виртуалку эту.. поделку.

Спасибо за комментарий. А поясните чем так плох ЯДиск? Я мог бы закинуть архив на свой хост, но подумал, что ЯДиск удобнее.

SeVlad:
У меня создалось впечатление, что ты ничего не слышал о юзабилити и продуктивности работ. Главное меню слева, а дерево проекта - на противоположном крае экрана.. И не перемещаемое/флоатное.

Спорный момент. В этом же самом можно обвинить и Adobe, у них в продуктах панели для основной работы тоже справа. В моём случае в предыдущем проекте WebProject дерево проекта было слева. Но поработав, я понял, что мне, как правше, удобнее панель справа. Но Вы правы, я должен предоставить выбор, добавлю возможность размещения слева.

Есть ещё одна причина - этот вариант программы планировался изначально быть бесплатным и предназначен для разработчиков/фрилансеров, а не для конечных пользователей кому будет поручено наполнять сайт. Планируется ещё редакции программы где будет добавлен специальный режим редактирования с удобными для наполнения сайта командами, например - добавить новость, добавить документ/отчёт и т.п. Вот эта панель планировалась как раз слева. А две панели рядом в режиме разработки сайта - не очень юзабельно. Хотя в последнее время мы с партнёром немного пересмотрели дальнейшее развитие продукта и в новом варианте необходимость этой панели под большим вопросом. Поэтому я обязательно добавлю возможность размещения панели слева.

SeVlad:
А зачем софтина ломится в инет? Что сливаешь/закачиваешь? ;)

В правом верхнем углу будет баннер с сайта, где будут размещаться ссылки на новые статьи, шаблоны/темы и информация о новых версиях. Пока сайт не готов, но запрос баннера из программы идёт. Так же при старте выполняется попытка загрузить стартовый экран с сайта, но его пока нет, поэтому открывается диалог создания нового сайта из установленного с программой проекта Bootstrap.

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

SeVlad:
В "редакторе" (в большинстве случаев не нужном, но рабочем/занимающим пространство) можно мышой "прописать" всякую ересь (например в стилях вставить код ссылки) и тп.

"Редактор" имеется ввиду под деревом проекта? Это Свойства для выбранного элемента. Там действительно может быть "всякая ересь". Если имеется ввиду доступность команд для вставки ссылок и изображений - тут Вы правы, для Стилей это нужно заблокировать - сделаю.

SeVlad:
Ссылки в меню на "оф сайт" не рабочие. Документации - ноль. И многое другое. Хороший пример как нельзя писать программы.

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

SeVlad:
Будем плясать от результата.
Сколько времени нужно что бы создать с нуля сайт на 10 стр из заранее подготовленного контента (в Ворде или ещё где - не важно. Его вставка в программу - копипастом) и отдельно лежащих картинок? Шаблон ну тоже пускай будет готовый, но с сайбаром (кроме главной) в котором ссылки на внутренние и внешние ресурсы + блоки рекламы.

Структура пусть такая:
- Главная (структурно такая же как в предустановках - несколько информативных блоков)
- Информация о проблеме. (блочный текст + графики)
- Продукция (общее описание продукции + весь список или выборочно неск шт)
--Продукт1 (текст + 3-4 картинки, желательно в лайтбоксе)
..
--Продукт5
- О нас (текст + 2-3 фото)
- Контакты (текст+форма+гуглокарта)

В контент (или хотя бы над/под ним) должны быть вставлены блоки контекстной рекламы (адсенс например).

А ещё будет лучше если запишешь видео как создать такую визитку. Народ будет иметь представление о всех необходимых телодвижениях и временных затратах.

Вот за конкретику спасибо. Текущий шаблон содержит в себе часть элементов для такого сайта, но не все. Доработаю шаблон. Видео так же постараюсь записать.

Bytexpert
На сайте с 28.10.2007
Offline
68
#9

Добавил возможность размещения панели слева (кнопки в статус-баре в правом нижнем углу).

Убрал пока запрос на показ стартовой страницы с сайта.

Выложил свежий билд на свой хостинг: websitepad.ru/WebsitePadFreelancer.zip. Там будет лежать всегда самый свежий билд.

SeVlad
На сайте с 03.11.2008
Offline
1609
#10
Bytexpert:
А поясните чем так плох ЯДиск?

Потому что у него рассовые предрассудки - он не всем даёт скачать. Да и нафик надо 150 переходов, когда можно вложить прямую ссылку (что ты уже и сделал). Это, кстати, тоже подтверждает мои предположения о том, что ты не понимаешь в юзабилити.

Bytexpert:
Текущий шаблон содержит в себе часть элементов для такого сайта, но не все. Доработаю шаблон.

Те от шаблона зависит наполнение контентом?! оу... Нет, я понимаю оформрение стартовой. Но это у тебя уже есть. Я же старался привязаться к тому, что увидел.

Но ты так и не ответил на главный вопрос:

SeVlad:
Сколько времени нужно что бы создать с нуля сайт на 10 стр из заранее подготовленного контента (в Ворде или ещё где - не важно. Его вставка в программу - копипастом) и отдельно лежащих картинок?

Собсно видео нужно как раз для того, что бы увидеть сколько времени на это потратит "профессионал". Ну и заодно и будет как мануал для твоих "клиентов".

Bytexpert:
Выложил свежий билд на свой хостинг: websitepad.ru/WebsitePadFreelancer.zip. Там будет лежать всегда самый свежий билд

В стратпост добавить эту ссылку?

12

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий