Сверстать лендинг, +написать скрипт
ПСД шаблон лендинга во вложении, в теле лп должны быть:
-заголовки
-текст
-ссылка в тексте на index2.html, открывается в новой вкладке
-фото в тексте (равнение по центру текста)
-видео с ютуба в тексте отцентрировано
-список из 7 пунктов
-блок голосования в конце
-блок комментариев
-есть надобность в рандомизации цифр в зависимости от времени на компе юзера:
верхняя строка - посетителей за сегодня (0...6 часов - 60...200, 6...12 часов - 200...300, 12...18 часов - 300...500, 18...24 часа - 500...700)
верхняя строка - сейчас на сайте (0...6 часов - 10...20, 6...12 часов - 20...30, 12...18 часов - 30...50, 18...24 часа - 50...70)
верхняя строка - спасибо за сегодня (0...6 часов - 12...20, 6...12 часов - 20...40, 12...18 часов - 40...70, 18...24 часа - 70...110)
нижняя строка - комментариев за сегодня (0...6 часов - 30...100, 6...12 часов - 100...200, 12...18 часов - 200...300, 18...24 часа - 300...400)
Исходные страницы откуда взять основу:
-верх и тело до комментариев от http://personal-srory.ru/provocative-gel/
-нижняя шапка от http://personal-srory.ru/aquapel1/
-как выглядит поле комментов можно глянуть тут cackle.me/demo/comments
Вся фишка в скрипте комментариев:
Скрипт (иммитация присутствия других людей через добавление комментариев по определенному сценарию)
Будет файл с перечнем комментов и их свойствами (см ниже), в каком формате его сделать вопрос открытый, нужно наиболее оптимизированно, чтобы все быстро работало, и легко было его изменять. Нужно сделать скрипт который будет выводить на страницу эти комменты в соответствии с их свойствами. +юзер также может комментировать, его комментарии должны встраиваться в общую хронологию и структуру комментов только для этого юзера, т.е. у каждого юзера своя последовательность комментов. Всего на странице должно быть видно 25 комментов, т.е. суммарно и с файла и юзерских, не зависимо какого он уровня 0/1/2. Новые вверху, более поздние скатываются вниз. Если коммент внизу 25 по счету, то при появлении нового сверху (либо с файла либо юзерского) этот уходит с поля комментов. В тексте коммента может быть картинка (см шаблон), выравнивается по левому краю текста.
Правила работы скрипта
-стили комментариев записать в отдельный от стилей документа файл, т.е создать структуру таким образом, чтобы можно было его применять на любой странице
-комменты публикуются даже если вкладка не активна, т.е. если юзер перешел на другую
-юзер может также оставлять свои комментарии, они должны встраиваться в общую структуру
-первый комментарий выбирается случайным образом из файла с данными о всех запланированных комментариях; планируется последовательность из 200-300 комментов
-комменты появляются с промежутком 7-12 сек
-при нажатии на аву ничего не происходит
-попап сообщения слева внизу о добавлении нового коммента, когда это делает юзер это сообщение также работает, появляется на 4 сек вместе с появлением каждого коммента.
-войти через соцсети "вк/фб/ок" и рядом "анонимно", при нажатии на вк/фб/ок под ними выходит строчка-сообщение "вход заблокирован настройками приватности вашего аккаунта, вы можете комментировать анонимно" выделенная цветом (см. шаблон), визибл в течении 5 сек после последнего нажатия потом исчезает в течении 1 сек
-оценки комментарию (лайки и дизлайки) появляются только когда он спустится на второе место
-сами пальцы вверх/вниз подсвечиваются когда наводится курсор на коммент, в остальное время они инвизибл; если юзер нажмет на них - возле курсора появляется сообщение "для оценки нужно войти"
-при нажатии на кнопку "Ответить", под комментарием появляется поле ввода коммента (см шаблон), при нажатии повторно - поле исчезает
-кроссбраузерность, и кроссплатформенность
У коммента из базы есть ряд свойств:
1. прямой коммент (0 уровень), либо ответ (1 уровень), либо ответ на ответ (2 уровень);
2. имя;
3. город (либо его отсутствие у имитаций анонимных аккаунтов);
4. аватарка - путь к аве данного коммента прописывается в файле данных; размер авы 48х48 пикс для 0 уровня, и 36х36 пикс для 1 и 2 уровней; (img/avatar_m/, img/avatar_w/, img/anonim.jpg). файлы фото-аватарок будут иметь имена:
мужские - 1m.jpeg, 2m.jpeg, 3m.jpeg ... 200m.jpeg, женские - 1w.jpeg, 2w.jpeg, 3w.jpeg ... 200w.jpeg, размер 100х100 пикс.
5. поверх аватарки отображается иконка соц.сети, через которую якобы авторизовался данный комментирующий; всего их 7 - фэйсбук (fb.png), гугл+ (gp.png), одноклассники (ok.png), твитер (tw.png), вконтакте (vk.png), яндекс (ya.png), инстаграмм (ig.png); размер данных иконок на странице 16х16 на всех уровнях комментирования (0, 1 и 2); положение следующее - центр иконки совпадает с правым нижним углом аватарки; если комментирует юзер, то у него будет только аватарка анонима, иконок не будет;
6. количество лайков/дизлайков;
7. тело коммента, текст;
8. в некоторых после текста может быть картинка с выравниванием по левому краю (в папке img/screen/);
Например:
0
Владимир
(Минск)
img/avatar_m/14m.jpeg
img/ico/gp.png
positive=3 (или negative=2)
Комментарий номер раз, два, три. Всем привет, всем привет.
img/screen/img1.jpg
Applications 1
Current freelance projects in the category Web programming
Need software for sending messages on Telegram or Viber.
637 USD
There is a database of phone numbers for which it is necessary to send messages in Viber or Telegram (it doesn't matter where, the main thing is that the software works and does not crash). No prepayments, payment either step by step or based on results. We are a large… Python, Web programming ∙ 8 proposals |
Edit WordPress websites
25 USD
The template needs to be refined according to the design layouts in the Figma program. It needs to be done by tomorrow. We are looking for developers who are ready to take on such an urgent project. The budget will be discussed on an individual basis. Web programming, Interface design ∙ 4 proposals |
Diploma work programming
89 USD
The Diploma work on the topic: Automation of UI testing of web applications needs to be done. I attach the guidelines. Web programming, Tuition ∙ 1 proposal |
Layout of the main page of a bike shop
76 USD
Adaptive layout for the main page of a bike shop. Layout: https://www.figma.com/file/1uA2WXs1yK9avxiYIO5KOQ/Bicycle-Internet-Store?type=design&node-id=13-37&mode=design&t=kX20tUNsEixTYRSN-0 The layout should be pixel-perfect. Adaptation should work correctly on all screens.… HTML and CSS, Web programming ∙ 9 proposals |
Development of an online store wholesale trade b2b, turnkey
1529 USD
Looking for a high-level specialist to develop a full-fledged online store. The site should meet all the latest needs of search engines, be optimized, and user-friendly. The store is intended for wholesale trade in the B2B sector. Turnkey work: development and product filling as… Web programming, Online stores and e-commerce ∙ 10 proposals |